/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme-child/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 2.0.0
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/* Add your custom styles here */


:root {
    overflow-x: hidden;
}

/* Background for the box */
.counter_box:hover {
    background: linear-gradient(180deg, #F4C430 32.19%, #C6990A 100%);
}

/* Gradient text for the counter */
.counter_box:hover .elementor-counter-number,
.counter_box:hover .elementor-counter-number-suffix {
    color: #fff;
}


.solar_icon_box .elementor-icon-box-content .elementor-icon-box-title {
    margin-top: 0px;
}

.solution_overview_img_box .elementor-motion-effects-container {
    border-radius: 24px;
}

.header_icon .elementor-icon-list-item {
    position: relative;
}

.header_icon .elementor-icon-list-text {
    position: absolute;
    top: 40px;
    left: 50%;
    transform: translateX(-50%);
    width: max-content;
    padding: 5px;
    border-radius: 8px;
    background: #000;
    color: #fff;
    text-align: center;

    opacity: 0;
    visibility: hidden;
    transition: all .3s ease;
    z-index: 99;
}

.header_icon .elementor-icon-list-text::before {
    content: "";
    position: absolute;
    top: -5px;
    left: 50%;
    transform: translateX(-50%);
    width: 16px;
    height: 8px;
    background: url('https://gorunsolar.creatoro.in/wp-content/uploads/2026/08/bottom-center.png') no-repeat center;
    background-size: contain;
}

/* Show only the hovered item's tooltip */
.header_icon .elementor-icon-list-item:hover .elementor-icon-list-text {
    opacity: 1;
    visibility: visible;
}


/*Testimonial slider*/

.custom-testimonial-wrapper {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 90px;
    max-width: 1320px;
    margin: 0 auto;
    padding: 40px 20px 70px;
}

/*==========================
 Left Section
==========================*/

.testimonial-left {
    width: 52%;
    position: relative;
}

#testimonialContent {
    padding-bottom: 20px;
}

.testimonial-main-image img {
    width: 100%;
    height: 500px;
    object-fit: cover;
    border-radius: 22px;
    display: block;
}

.testimonial-card {
    position: absolute;
    right: -35px;
    bottom: -30px;
    width: 380px;
    background: #fff;
    padding: 38px;
    border-radius: 18px;
    box-shadow: 0 18px 45px rgba(0,0,0,0.12);
    z-index: 5;
}

.quote-icon {
    display: block;
    font-size: 52px;
    line-height: 1;
    color: #FDB813;
    margin-bottom: 18px;
}

.testimonial-card p {
    font-size: 18px;
    line-height: 1.8;
    color: #24344D;
    margin-bottom: 22px;
}

.testimonial-card h4 {
    font-size: 24px;
    font-weight: 700;
    color: #132238;
    margin: 0 0 4px;
}

.testimonial-card span {
    font-size: 15px;
    color: #777;
}

/*==========================
 Right Section
==========================*/

.testimonial-right {
    width: 48%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.testimonialSwiper {
    width: 100%;
    max-width: 500px;
    height: 320px;
}

.testimonial-slide {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 120px;
    cursor: pointer;
    padding-left: 28px;
    border-left: 2px solid #FDB813;
    opacity: .45;
    transition: all .35s ease;
}

.swiper-slide-active {
    opacity: 1;
}

.stars {
    color: #FDB813;
    font-size: 20px;
    letter-spacing: 2px;
    margin-bottom: 12px;
}

.excerpt {
    font-size: 15px;
    line-height: 1.8;
    color: #666;
    margin-bottom: 10px;
}

.excerpt p {
    margin-bottom: 0px;  
}

.testimonial-slide h5 {
    font-size: 20px;
    font-weight: 700;
    color: #132238;
    margin: 0;
}

/*==========================
 Hover
==========================*/

.testimonial-slide:hover {
    opacity: 1;
}

.testimonial-slide:hover h5 {
    color: #000;
}

/*==========================
 Responsive
==========================*/

@media (max-width: 1024px) {

    .custom-testimonial-wrapper {
        gap: 50px;
    }

    .testimonial-card {
        width: 330px;
        right: -15px;
    }

}

@media (max-width: 991px) {

    .custom-testimonial-wrapper {
        flex-direction: column;
        gap: 50px;
        padding-bottom: 40px;
    }

    .testimonial-left,
    .testimonial-right {
        width: 100%;
    }

    .testimonial-main-image img {
        height: 420px;
    }

    .testimonial-card {
        position: relative;
        width: calc(100% - 40px);
        max-width: 420px;
        right: auto;
        bottom: auto;
        margin: -70px auto 0;
    }

    .testimonialSwiper {
        max-width: 100%;
        height: 300px;
    }

}

@media (max-width: 767px) {

    .testimonial-main-image img {
        height: 320px;
    }

    .testimonial-card {
        padding: 28px;
    }

    .testimonial-card p {
        font-size: 16px;
    }

    .testimonial-card h4 {
        font-size: 22px;
    }

    .testimonialSwiper {
        max-width: 100%;
        height: 400px;
    }

    .testimonial-slide {
        min-height: 110px;
        padding-left: 20px;
    }

    .excerpt {
        font-size: 14px;
    }

    .testimonial-slide h5 {
        font-size: 18px;
    }
    
    .project_slider .swiper, .project_slider .swiper-slide {
        padding-top: 20px;
    }
    
    .project_slider .swiper-slide-next .elementor-element-bd6f9b9{
        transform: translateY(0px);
    }

}


/* home page projects slider */

/* ==========================================
   Project Slider
========================================== */


/* Allow the slide to move outside the container */
.project_slider .swiper,
.project_slider .swiper-slide {
    padding-top: 40px;
}

/* Smooth transition */
.project_slider .swiper-slide {
    transition: transform 0.4s ease;
}

/* Lift the next slide */
.project_slider .swiper-slide-next {
    transform: translateY(-25px);
    z-index: 2;
}

.project_slider .swiper-slide .elementor-element-bd6f9b9{
    transition: transform .4s ease;
}

.project_slider .swiper-slide-next .elementor-element-bd6f9b9{
    transform: translateY(-20px);
}



/*home page continue slider*/

/* Continuous smooth movement */
.continue_slides .swiper-wrapper{
    transition-timing-function: linear !important;
}

.continue_slides .swiper-slide{
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}

.continue_slides img{
    display:block;
}


.solution_box_hover:hover .solution_box_title .elementor-heading-title,
.solution_box_hover:hover .solution_box_text p {
    color: #fff;
}

.e-n-accordion-item[open] > .e-n-accordion-item-title {
    border-radius: 24px 24px 0px 0px;
}

/* solution page table css start */

 .solution-table {
    width: 100%;
    font-family: Arial, Helvetica, sans-serif;
}

.solution-row {
    display: grid;
    grid-template-columns: 1.3fr 1.2fr 1.7fr 0.6fr;
    align-items: center;
    gap: 30px;

    min-height: 96px;
    padding: 18px 24px;
    margin-bottom: 18px;

    border: 1px solid #eee9e3;
    border-radius: 15px;
    background: #fff;

    box-sizing: border-box;
}

.solution-product {
    display: flex;
    align-items: center;
    gap: 18px;
}

.solution-icon {
    width: 48px;
    height: 48px;
    min-width: 48px;

    display: flex;
    align-items: center;
    justify-content: center;

    background: #f6f5f4;
    border-radius: 12px;
}

.solution-icon svg {
    width: 25px;
    height: 25px;

    stroke: #ffb000;
    fill: none;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.solution-info {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.solution-category {
    font-size: 12px;
    line-height: 1;
    font-weight: 600;
    letter-spacing: 1.2px;
    color: #555;
    text-transform: uppercase;
}

.solution-title {
    margin: 0;
    font-size: 18px;
    line-height: 1.2;
    font-weight: 600;
    color: #252525;
}

.solution-column {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.solution-label {
    font-size: 12px;
    line-height: 1;
    font-weight: 600;
    letter-spacing: 0.5px;
    color: #555;
}

.solution-value {
    font-size: 13px;
    line-height: 1.5;
    color: #292929;
    font-weight: 400;
}

.solution_tab .e-n-tabs-heading {
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    background: #484C4E;
    border-radius: 12px;
    padding: 5px 5px;
}

#rebate_tab_1 {
    font-family: "Geist", sans-serif !important;
    font-size: 20px !important;
    font-weight: 400 !important;
    font-style: normal !important;
    line-height: 100% !important;
    letter-spacing: 0 !important;
    color: #000000 !important;
    cursor: default !important;
    pointer-events: none !important;
}

/* Remove hover effect */
#rebate_tab_1:hover,
#rebate_tab_1:focus,
#rebate_tab_1:active {
    color: #000000 !important;
    background: inherit !important;
    box-shadow: none !important;
    transform: none !important;
    cursor: default !important;
}
 
/* Keep text inside the button normal */
#rebate_tab_1 .e-n-tab-title-text {
    color: #000000 !important;
    font-size: 20px !important;
    font-weight: 400 !important;
}

@media (max-width: 900px) {
    .solution-row {
        grid-template-columns: 1fr 1fr;
        gap: 20px;
    }

    .solution-product {
        grid-column: span 2;
    }
    
    .elementor.elementor .elementor-widget-n-tabs.e-n-tabs-mobile .e-n-tab-title[aria-selected=true] {
        margin-block-end: 0px !important;
    }
}

@media (max-width: 600px) {
    .solution-row {
        grid-template-columns: 1fr;
        gap: 18px;
        padding: 20px;
        margin-bottom: 15px;
    }

    .solution-product {
        grid-column: auto;
    }

    .solution-title {
        font-size: 17px;
    }

    .solution-column {
        padding-left: 66px;
    }
    
    .custom-process-wrapper {
        width: 100%;
        max-width: 760px;
        margin: 0 auto;
        position: relative;
        gap: 20px;
        display: flex;
        flex-direction: column;
    }
}

/*slution page table css end*/

.img_zoom {
    overflow: visible !important;
    transform-origin: center center;
    will-change: transform;
}
/* Elementor container width */
.elementor-element-721912b {
    width: 37% !important;
}

.feature-list {
    justify-content: space-between;
    display: flex;
    flex-direction: row;
}
 .feature-list ul {
    display: flex !important;
    flex-direction: row;
    justify-content: space-between !important;
    width: 100%;
}
.map-info-card {
    max-width:250px !important;
}
@media (max-width: 767px) {

    .map-info-card {
        position: relative !important;
        width: 100% !important;
        max-width: 100% !important;

        margin: 0 !important;
        box-sizing: border-box !important;

        background: #ffffff !important;

        /* Round all 4 corners */
        border-radius: 35px !important;

        padding: 30px 25px 40px 25px !important;

        left: 0 !important;
        right: 0 !important;
        top: auto !important;
        bottom: auto !important;
    }

}

.solar-solutions-map {
    border-radius:48 !important;
}
.rebate_tab_sec .e-n-tabs-heading {
    background-color: #F8F9FB !important;
}


        /* =========================================
           PROCESS SECTION
        ========================================= */

        .custom-process-section {
            width: 100%;
            background: #282A2B;
            padding: 28px 20px;
            box-sizing: border-box;
            overflow: hidden;
        }

        .custom-process-wrapper {
            width: 100%;
            max-width: 760px;
            margin: 0 auto;
            position: relative;
        }


        /* =========================================
           STEP ROW
        ========================================= */

        .process-step-row {
            width: 100%;
            height: 180px;
            position: relative;
            display: flex;
        }

        .step-left {
            justify-content: flex-start;
        }

        .step-right {
            justify-content: flex-end;
        }


        /* =========================================
           CARD
        ========================================= */

        .process-card {
            display: flex;
            flex-direction: column;
            justify-content: center;
            gap: 20px;
            width: 280px;
            min-height: 86px;
            padding: 10px 16px 11px;
            box-sizing: border-box;
            background: #37393a;
            border: 1px solid rgba(255,255,255,0.10);
            border-radius: 8px;
            box-shadow:
                0 4px 12px rgba(0,0,0,0.16);
            position: relative;
            z-index: 3;
            transition:
                transform 0.3s ease,
                background 0.3s ease;
        }

        .process-card:hover {
            transform: translateY(-3px);
            background: #3c3e3f;
        }


        /* =========================================
           STEP NUMBER
        ========================================= */

        .process-card-top {
            display: flex;
            align-items: baseline;
            justify-content: center;

            height: 27px;
            line-height: 1;
        }

        .process-step-label {
            font-family: Arial, sans-serif;
            font-size: 14px;
            font-weight: 600;
            color: #ffffff;
            margin-right: 4px;
            letter-spacing: 0.2px;
        }

        .process-step-number {
            font-family: Arial, sans-serif;
            font-size: 26px;
            line-height: 1;
            font-weight: 700;
            color: #ffffff;
        }


        /* =========================================
           CARD CONTENT
        ========================================= */

        .process-card-content {
            display: flex;
            align-items: flex-start;
            gap: 7px;
        }

        .process-icon {
            width: 28px;
            height: 28px;
            min-width: 28px;
            display: flex;
            align-items: center;
            justify-content: center;
            border-radius: 50%;
            background: #ffffff;
            color: #303233;
            font-size: 11px;
            font-weight: 700;
            margin-top: 2px;
        }

        .process-icon span {
            display: block;
            transform: translateY(-1px);
        }

        .process-text {
            flex: 1;
            min-width: 0;
        }

        .process-text h3 {
            margin: 0 0 2px;
            color: #F4B223;
            font-family: Arial, sans-serif;
            font-size: 14px;
            line-height: 1.15;
            font-weight: 500;
        }

        .process-text p {
            margin: 0;
            color: #D0D5DD;
            font-family: Arial, sans-serif;
            font-size: 12px;
            line-height: 1.35;
            font-weight: 400;
        }


        /* =========================================
           CONNECTOR
        ========================================= */

        .process-connector {
            position: absolute;
            width: 50%;
            height: 50px;

            top: 80px;

            z-index: 1;
            pointer-events: none;
        }

        .step-left .process-connector {
            left: 33%;
        }

        .step-right .process-connector {
            right: 33%;
        }

        .connector-horizontal {
            position: absolute;

            top: 0;
            width: 100%;
            height: 1px;

            background-image: linear-gradient(
                to right,
                rgba(255,255,255,0.35) 1px,
                transparent 1px
            );

            background-size: 4px 1px;
            background-repeat: repeat-x;
        }

        .connector-vertical {
            position: absolute;
            top: 0;
            width: 1px;
            height: 90px;
            background-image: linear-gradient(
                to bottom,
                rgba(255,255,255,0.35) 1px,
                transparent 1px
            );
            background-size: 1px 4px;
            background-repeat: repeat-y;
        }

        .step-left .connector-vertical {
            right: 0;
        }

        .step-right .connector-vertical {
            left: 0;
        }


        /* =========================================
           DESKTOP ALIGNMENT
        ========================================= */

        .step-left .process-connector {
            margin-left: 0;
        }

        .step-right .process-connector {
            margin-right: 0;
        }


        /* =========================================
           MOBILE
        ========================================= */

        @media (max-width: 767px) {

            .custom-process-section {
                padding: 25px 15px;
            }

            .custom-process-wrapper {
                max-width: 430px;
            }

            .process-step-row {
                height: 125px;
            }

            .process-card {
                width: 78%;
                min-height: 86px;
            }

            .step-left {
                justify-content: flex-start;
            }

            .step-right {
                justify-content: flex-end;
            }

            .process-connector {
                width: 22%;
            }

            .step-left .process-connector {
                left: 70%;
            }

            .step-right .process-connector {
                right: 70%;
            }

            .process-step-number {
                font-size: 22px;
            }

        }


        /* =========================================
           SMALL MOBILE
        ========================================= */

        @media (max-width: 480px) {

            .custom-process-section {
                padding: 25px 10px;
            }

            .process-step-row {
                height: 125px;
            }

            .process-card {
                width: 76%;
                padding: 9px 13px 10px;
            }

            .process-text h3 {
                font-size: 10px;
            }

            .process-text p {
                font-size: 6px;
            }

            .process-step-label {
                font-size: 7px;
            }

            .process-step-number {
                font-size: 21px;
            }

            .process-icon {
                width: 18px;
                height: 18px;
                min-width: 18px;
            }

        }
        
.rebate-box {
    position: relative;
}

/* Connector icon between boxes */
.rebate-box:not(:last-child)::after {
    content: "";
    position: absolute;

    width: 30px;
    height: 18px;

    top: 50%;
    right: -30px;

    transform: translateY(-50%);

    background-image: url("https://gorunsolar.creatoro.in/wp-content/uploads/2026/08/hathody.svg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;

    z-index: 10;
}
@media (max-width: 767px) {
    .rebate-box:not(:last-child)::after {
        display: none !important;
        content: none !important;
    }
}

.who-can-claim-list .elementor-icon-box-icon {
    margin-top: 8px !important;
}
.who_is_eligible_tab {
    position: relative;
}

/* Lines between boxes */
.who_is_eligible_tab:not(:last-child)::after {
    content: "";
    position: absolute;
    top: 28px;
    right: -20px;
    width: 20px;
    height: 2px;
    background-color: #FDB813;
    z-index: 5;
}

/* Small line after last box */
/*.who_is_eligible_tab:last-child::after {*/
/*    content: "";*/
/*    position: absolute;*/
/*    top: 28px;*/
/*    right: -10px;*/
/*    width: 10px;*/
/*    height: 2px;*/
/*    background-color: #FDB813;*/
/*    z-index: 5;*/
/*}*/

@media (max-width: 767px) {

    .who_is_eligible_tab::before,
    .who_is_eligible_tab::after {
        display: none !important;
        content: none !important;
    }

}
/* =========================================
   REBATE OUR PROCESS - COMPACT BOX
   ========================================= */

.rebate-our-process .elementor-icon-box-wrapper {
    position: relative !important;
    display: block !important;
    min-height: 110px !important;
    padding: 40px 40px 18px 40px !important;
    box-sizing: border-box !important;
}

/* Move 01 icon to top-right */
.rebate-our-process .elementor-icon-box-icon {
    position: absolute !important;
    top: 0px !important;
    right: 15px !important;
    margin: 0 !important;
    z-index: 5 !important;
}

/* Icon size */
.rebate-our-process .elementor-icon-box-icon .elementor-icon {
    width: 35px !important;
    height: 35px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* Content */
.rebate-our-process .elementor-icon-box-content {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Title */
.rebate-our-process .elementor-icon-box-title {
    margin: 0 0 3px 0 !important;
}

/* Description */
.rebate-our-process .elementor-icon-box-description {
    margin: 0 !important;
}


/* =========================================
   MOBILE
   ========================================= */

@media (max-width: 767px) {

    .rebate-our-process .elementor-icon-box-wrapper {
        min-height: 110px !important;
        padding: 38px 40px 15px 40px !important;
    }

    .rebate-our-process .elementor-icon-box-icon {
        top: 12px !important;
        right: 12px !important;
    }

    .rebate-our-process .elementor-icon-box-icon .elementor-icon {
        width: 26px !important;
        height: 26px !important;
    }
       .page .brs_slider_container.e-con.e-flex {
        height: 100% !important;
        --flex-wrap: none !important;
    }
   

}

/* Project Listing */
/* ==================================================
				   MAIN CONTAINER
				================================================== */

				.gorun-project-listing {
					width: 100%;
					max-width: 1280px;
					margin-left: auto;
					margin-right: auto;
					box-sizing: border-box;
				}


				.gorun-project-listing *,
				.gorun-project-listing *::before,
				.gorun-project-listing *::after {
					box-sizing: border-box;
				}


				/* ==================================================
				   FILTER BAR
				================================================== */

				.gorun-project-filters {
					display: flex;
					align-items: center;
					justify-content: space-between;
					gap: 16px;

					width: 100%;

					margin-bottom: 32px;
					padding: 8px;

					border: 1px solid #e8e1d4;
					border-radius: 40px;

					background: #faf8f2;
				}


				.gorun-category-filters {
					display: flex;
					align-items: center;
					gap: 5px;

					flex-wrap: wrap;
				}


				.gorun-filter-button {
					display: inline-flex;
					align-items: center;
					justify-content: center;
					min-height: 34px;
					padding: 7px 16px;
					border-radius: 30px;
					background: transparent;
					color: #333;
					font-family: inherit;
					font-size: 14px;
					font-weight: 500;
                    border: 1px solid #E5E7EB;
                    background: #ffffff;
					line-height: 1;
					cursor: pointer;
					transition:
						background-color .2s ease,
						color .2s ease,
						transform .2s ease;
				}


				.gorun-filter-button:hover {
				    background: #fdb900;
                    color: #111111;
				}


				.gorun-filter-button.active {
					background: #fdb900;
					color: #111111;
				}


				.gorun-filter-button:focus-visible,
				.gorun-load-more:focus-visible,
				.gorun-project-button:focus-visible {
					outline: 2px solid #111111;
					outline-offset: 3px;
				}


				/* ==================================================
				   SEARCH
				================================================== */

				.gorun-project-search {
					display: flex;
					align-items: center;

					width: 190px;
					min-width: 190px;
					height: 36px;

					padding: 0 13px;

					border: 1px solid #dcd6ca;
					border-radius: 30px;

					background: #ffffff;
				}


				.gorun-search-icon {
					display: inline-flex;

					margin-right: 7px;

					color: #777777;

					font-size: 17px;
					line-height: 1;
				}


				.gorun-search-input {
					width: 100%;
					height: 100%;

					padding: 0 !important;
					margin: 0 !important;

					border: 0 !important;
					outline: 0 !important;

					background: transparent !important;

					box-shadow: none !important;

					color: #222222;

					font-family: inherit;
					font-size: 11px;
				}


				.gorun-search-input::placeholder {
					color: #777777;
					opacity: 1;
				}


				/* ==================================================
				   PROJECT GRID
				================================================== */

				.gorun-project-grid {
					display: grid;

					grid-template-columns:
						repeat(3, minmax(0, 1fr));

					column-gap: 40px;
					row-gap: 38px;

					width: 100%;
				}


				/* ==================================================
				   CARD
				================================================== */

				.gorun-project-card {
					width: 100%;
					min-width: 0;
				}


				/* ==================================================
				   IMAGE
				================================================== */

				.gorun-project-image {
					position: relative;

					width: 100%;

					aspect-ratio: 1.55 / 1;

					overflow: hidden;

					border-radius: 12px;

					background: #eeeeee;
				}


				.gorun-project-image a {
					display: block;

					width: 100%;
					height: 100%;
				}


				.gorun-project-image img {
					display: block;

					width: 100%;
					height: 100%;

					object-fit: cover;

					transition:
						transform .45s ease;
				}


				.gorun-project-card:hover
				.gorun-project-image img {
					transform: scale(1.035);
				}


				.gorun-project-image-placeholder {
					width: 100%;
					height: 100%;

					background:
						linear-gradient(
							135deg,
							#e9e9e9 0%,
							#d7d7d7 100%
						);
				}


				/* ==================================================
				   CONTENT
				================================================== */

				.gorun-project-content {
					padding-top: 10px;
				}


				.gorun-project-category {
                    margin-top: 10px;
                    margin-bottom: 10px;
                    color: #7A5900;
                    font-size: 12px;
                    font-weight: 600;
                    line-height: 1.2;
                    letter-spacing: .12em;
                    text-transform: uppercase;
				}


				.gorun-project-title {
                    margin: 0 0 8px;
                    color: #1B1C1C;
                    font-size: 18px;
                    font-weight: 600;
                    line-height: 1.35;
				}


				.gorun-project-title a {
					color: inherit;

					text-decoration: none;
				}


				.gorun-project-title a:hover {
					color: #b78300;
				}


				/* ==================================================
				   EXCERPT
				================================================== */

				.gorun-project-excerpt {
                    min-height: 55px;
                    margin-bottom: 14px;
                    color: #696969;
                    font-size: 16px;
                    line-height: 24px;
				}


				.gorun-project-excerpt-empty {
					min-height: 55px;
				}


				/* ==================================================
				   META
				================================================== */

				.gorun-project-meta {
                    display: grid;
                    grid-template-columns: repeat(2, minmax(0, 1fr));
                    row-gap: 16px;
                    column-gap: 16px;
					margin-bottom: 20px;
				}


				.gorun-project-meta-item {
					display: flex;
					flex-direction: column;

					gap: 3px;

					min-width: 0;
				}


				.gorun-project-meta-label {
					color: #858585;

					font-size: 12px;
					font-weight: 400;

					line-height: 1.2;
				}


				.gorun-project-meta-value {
					overflow: hidden;

					color: #222222;

					font-size: 14px;
					font-weight: 500;

					line-height: 1.3;

					text-overflow: ellipsis;
					white-space: nowrap;
				}


				/* ==================================================
				   CASE STUDY BUTTON
				================================================== */

				.gorun-project-button {
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    width: 100% 354.885px;
                    min-height: 35px;
                    padding: 8px 12px;
                    gap: 10px;
                    border-radius: 5px;
                    background: #fdb900;
                    color: #111111;
                    font-family: inherit;
                    font-size: 12px;
                    font-weight: 600;
                    line-height: 1;
                    text-decoration: none;
                    transition: background-color .2s ease, transform .2s ease;
				}


				.gorun-project-button:hover {
					background: #e9a900;

					color: #111111;

					transform: translateY(-1px);
				}


				.gorun-project-button-icon {
					font-size: 11px;
					line-height: 1;
				}


				/* ==================================================
				   LOAD MORE
				================================================== */

				.gorun-load-more-wrapper {
					display: flex;
					align-items: center;
					justify-content: center;

					width: 100%;

					margin-top: 38px;
				}


				.gorun-load-more {
					display: inline-flex;
					align-items: center;
					justify-content: center;

					gap: 8px;

					min-height: 40px;

					padding: 9px 20px;

					border: 1px solid #f0b800;
					border-radius: 30px;

					background: #ffffff;

					color: #222222;

					font-family: inherit;
					font-size: 14px;
					font-weight: 500;

					cursor: pointer;

					transition:
						background-color .2s ease,
						color .2s ease,
						transform .2s ease;
				}


				.gorun-load-more:hover {
					background: #fdb900;

					color: #111111;

					transform: translateY(-1px);
				}


				.gorun-load-more-icon {
					font-size: 13px;
					line-height: 1;
				}


				/* ==================================================
				   LOADING
				================================================== */

				.gorun-project-loading {
					display: none;
					align-items: center;
					justify-content: center;

					gap: 9px;

					padding: 25px 10px;

					color: #777777;

					font-size: 11px;
				}


				.gorun-project-listing.is-loading
				.gorun-project-loading {
					display: flex;
				}


				.gorun-project-spinner {
					width: 16px;
					height: 16px;

					border: 2px solid #dedede;
					border-top-color: #fdb900;

					border-radius: 50%;

					animation:
						gorun-project-spin .7s linear infinite;
				}


				@keyframes gorun-project-spin {

					to {
						transform: rotate(360deg);
					}

				}


				/* ==================================================
				   EMPTY
				================================================== */

				.gorun-project-empty {
					display: none;

					width: 100%;

					padding: 60px 20px;

					color: #777777;

					font-size: 13px;

					text-align: center;
				}


				/* ==================================================
				   TABLET
				================================================== */

				@media (max-width: 900px) {

					.gorun-project-grid {
						grid-template-columns:
							repeat(2, minmax(0, 1fr));
					}

				}


				/* ==================================================
				   MOBILE
				================================================== */

				@media (max-width: 600px) {

					.gorun-project-filters {
						flex-direction: column;

						align-items: stretch;

						padding: 10px;

						border-radius: 15px;
					}


					.gorun-category-filters {
						justify-content: center;
					}


					.gorun-filter-button {
						padding-left: 13px;
						padding-right: 13px;
					}


					.gorun-project-search {
						width: 100%;
						min-width: 0;
					}


					.gorun-project-grid {
						grid-template-columns: 1fr;

						row-gap: 32px;
					}


					.gorun-project-image {
						aspect-ratio: 1.55 / 1;
					}

				}


				/* ==================================================
				   VERY SMALL MOBILE
				================================================== */

				@media (max-width: 380px) {

					.gorun-category-filters {
						justify-content: flex-start;
					}


					.gorun-filter-button {
						font-size: 10px;

						padding-left: 11px;
						padding-right: 11px;
					}

				}


/* ==========================================
   REBATE TABS
   ========================================== */

.rebate_tab_sec .e-n-tab-title {
    position: relative !important;
    padding-right: 55px !important;
}


/* ==========================================
   RIGHT ARROW - ALL TABS
   ========================================== */

.rebate_tab_sec .e-n-tab-title::after {
    content: "›";
    position: absolute !important;
    right: 22px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;

    font-size: 28px !important;
    font-weight: 300 !important;
    line-height: 1 !important;

    color: #C9CED6 !important;

    pointer-events: none !important;
}


/* ==========================================
   REBATE TABS
   ========================================== */

.rebate_tab_sec .e-n-tab-title {
    position: relative !important;
    padding-right: 55px !important;
}


/* ==========================================
   RIGHT ARROW - ALL REBATE TABS
   ========================================== */

.rebate_tab_sec .e-n-tab-title::after {
    content: "›";
    position: absolute !important;
    right: 22px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;

    font-size: 28px !important;
    font-weight: 300 !important;
    line-height: 1 !important;

    color: #C9CED6 !important;
    pointer-events: none !important;
}





/* ==========================================
   ACTIVE TAB ARROW
   ========================================== */

.rebate_tab_sec .e-n-tab-title[aria-selected="true"]::after {
    color: #FFC72C !important;
}


/* ==========================================
   ACTIVE TAB SVG ICON
   ========================================== */

.rebate_tab_sec .e-n-tab-title[aria-selected="true"] .e-n-tab-icon svg {
    color: #000000 !important;
}

.rebate_tab_sec .e-n-tab-title[aria-selected="true"] .e-n-tab-icon svg path {
    stroke: #000000 !important;
}

.rebate_tab_sec .e-n-tab-title[aria-selected="true"] .e-n-tab-icon svg path[fill] {
    fill: #000000 !important;
}

.rebate_tab_sec .e-n-tab-title[aria-selected="true"] .e-n-tab-icon {
    color: #000000 !important;
}
.rebate_tab_sec .e-n-tab-title[aria-selected="true"] .e-n-tab-title-text {
    font-weight: 700 !important;
}



/* ==========================================
   BLOG POST LISTING - [blog_listing]
   ========================================== */

.gorun-blog-listing {
    width: 100%;
    max-width: 1280px;
    margin-left: auto;
    margin-right: auto;
    box-sizing: border-box;
}

.gorun-blog-listing *,
.gorun-blog-listing *::before,
.gorun-blog-listing *::after {
    box-sizing: border-box;
}

.gorun-blog-icon {
    width: 16px;
    height: 16px;
    flex: 0 0 auto;
}


/* ==========================================
   FILTER BAR
   ========================================== */

.gorun-blog-filters {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;

    width: 100%;

    margin-bottom: 34px;
    padding: 8px;

    border: 1px solid #ECEBE6;
    border-radius: 40px;

    background: #ffffff;
}

.gorun-blog-filters-left {
    display: flex;
    align-items: center;
    gap: 4px;

    min-width: 0;
    flex-wrap: wrap;
}

.gorun-blog-filters-right {
    display: flex;
    align-items: center;

    flex: 0 0 auto;
}


/* ==========================================
   ALL BUTTON
   ========================================== */

.gorun-blog-all {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;

    min-height: 34px;
    padding: 7px 16px;

    border: 1px solid #E5E7EB;
    border-radius: 30px;

    background: #ffffff;

    color: #333333;

    font-family: inherit;
    font-size: 14px;
    font-weight: 500;
    line-height: 1;

    cursor: pointer;

    transition:
        background-color .2s ease,
        border-color .2s ease,
        color .2s ease;
}

.gorun-blog-all:hover {
    background: #F4F3EF;
    color: #111111;
}

.gorun-blog-all.active {
    border-color: #1B1C1C;
    background: #1B1C1C;
    color: #ffffff;
}


/* ==========================================
   INLINE TERM LIST
   ========================================== */

.gorun-blog-chips {
    display: flex;
    align-items: center;
    gap: 4px;

    min-width: 0;
    flex-wrap: wrap;
}

.gorun-blog-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 34px;
    padding: 7px 14px;

    border: 1px solid transparent;
    border-radius: 30px;

    background: transparent;

    color: #4B4B4B;

    font-family: inherit;
    font-size: 14px;
    font-weight: 500;
    line-height: 1;

    white-space: nowrap;
    cursor: pointer;

    transition:
        background-color .2s ease,
        border-color .2s ease,
        color .2s ease;
}

.gorun-blog-chip:hover {
    border-color: #E5E7EB;
    background: #F4F3EF;
    color: #111111;
}

.gorun-blog-chip.active {
    border-color: #1B1C1C;
    background: #1B1C1C;
    color: #ffffff;
}

.gorun-blog-chip:focus-visible {
    outline: 2px solid #111111;
    outline-offset: 3px;
}


/* ==========================================
   FILTER DROPDOWNS
   ========================================== */

.gorun-blog-dropdown {
    position: relative;

    flex: 0 0 auto;
}

.gorun-blog-dropdown-toggle {
    display: inline-flex;
    align-items: center;
    gap: 7px;

    min-height: 34px;
    padding: 7px 14px;

    border: 1px solid transparent;
    border-radius: 30px;

    background: transparent;

    color: #4B4B4B;

    font-family: inherit;
    font-size: 14px;
    font-weight: 500;
    line-height: 1;

    white-space: nowrap;
    cursor: pointer;

    transition:
        background-color .2s ease,
        border-color .2s ease,
        color .2s ease;
}

.gorun-blog-dropdown-toggle:hover {
    border-color: #E5E7EB;
    background: #F4F3EF;
    color: #111111;
}

.gorun-blog-dropdown.is-open .gorun-blog-dropdown-toggle {
    border-color: #E5E7EB;
    background: #F4F3EF;
    color: #111111;
}

.gorun-blog-dropdown.is-active .gorun-blog-dropdown-toggle {
    border-color: #FDB900;
    background: #FFF8E4;
    color: #111111;
}

.gorun-blog-caret {
    width: 13px;
    height: 13px;

    color: #9A9A9A;

    transition: transform .2s ease;
}

.gorun-blog-dropdown.is-open .gorun-blog-caret {
    transform: rotate(180deg);
}

.gorun-blog-dropdown-label {
    max-width: 150px;

    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}


/* ==========================================
   DROPDOWN MENU
   ========================================== */

.gorun-blog-dropdown-menu {
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    z-index: 20;

    display: none;
    flex-direction: column;

    min-width: 200px;
    max-height: 280px;

    padding: 6px;

    overflow-y: auto;

    border: 1px solid #ECEBE6;
    border-radius: 14px;

    background: #ffffff;

    box-shadow: 0 18px 40px rgba(17, 17, 17, .12);
}

.gorun-blog-filters-right .gorun-blog-dropdown-menu {
    left: auto;
    right: 0;
}

.gorun-blog-dropdown.is-open .gorun-blog-dropdown-menu {
    display: flex;
}

.gorun-blog-dropdown-option {
    display: block;

    width: 100%;

    padding: 9px 12px;

    border: 0;
    border-radius: 9px;

    background: transparent;

    color: #4B4B4B;

    font-family: inherit;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.3;

    text-align: left;
    cursor: pointer;

    transition:
        background-color .15s ease,
        color .15s ease;
}

.gorun-blog-dropdown-option:hover {
    background: #F4F3EF;
    color: #111111;
}

.gorun-blog-dropdown-option.is-selected {
    background: #FFF8E4;
    color: #111111;
    font-weight: 600;
}


/* ==========================================
   FOCUS STATES
   ========================================== */

.gorun-blog-all:focus-visible,
.gorun-blog-dropdown-toggle:focus-visible,
.gorun-blog-dropdown-option:focus-visible,
.gorun-blog-load-more:focus-visible,
.gorun-blog-read:focus-visible {
    outline: 2px solid #111111;
    outline-offset: 3px;
}


/* ==========================================
   GRID
   ========================================== */

.gorun-blog-grid {
    display: grid;

    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    column-gap: 30px;
    row-gap: 40px;

    width: 100%;
}


/* ==========================================
   CARD
   ========================================== */

.gorun-blog-card {
    display: flex;
    flex-direction: column;

    width: 100%;
    min-width: 0;
}


/* ==========================================
   CARD IMAGE
   ========================================== */

.gorun-blog-image {
    position: relative;

    width: 100%;

    aspect-ratio: 1.62 / 1;

    overflow: hidden;

    border-radius: 12px;

    background: #eeeeee;
}

.gorun-blog-image a {
    display: block;

    width: 100%;
    height: 100%;
}

.gorun-blog-image img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;

    transition: transform .45s ease;
}

.gorun-blog-card:hover .gorun-blog-image img {
    transform: scale(1.035);
}

.gorun-blog-image-placeholder {
    width: 100%;
    height: 100%;

    background:
        linear-gradient(
            135deg,
            #e9e9e9 0%,
            #d7d7d7 100%
        );
}

.gorun-blog-badge {
    position: absolute;
    top: 12px;
    left: 12px;

    display: inline-flex;
    align-items: center;

    max-width: calc(100% - 24px);

    padding: 5px 10px;

    overflow: hidden;

    border-radius: 6px;

    background: rgba(17, 17, 17, .72);

    color: #ffffff;

    font-size: 11px;
    font-weight: 500;
    line-height: 1.2;

    text-overflow: ellipsis;
    white-space: nowrap;

    backdrop-filter: blur(4px);
}


/* ==========================================
   CARD CONTENT
   ========================================== */

.gorun-blog-content {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;

    padding-top: 14px;
}

.gorun-blog-title {
    margin: 0 0 8px;

    color: #1B1C1C;

    font-size: 17px;
    font-weight: 600;
    line-height: 1.4;
}

.gorun-blog-title a {
    display: -webkit-box;

    overflow: hidden;

    color: inherit;

    text-decoration: none;

    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;

    transition: color .2s ease;
}

.gorun-blog-title a:hover {
    color: #B78300;
}


/* ==========================================
   CARD EXCERPT
   ========================================== */

.gorun-blog-excerpt {
    display: -webkit-box;

    min-height: 66px;
    margin-bottom: 16px;

    overflow: hidden;

    color: #696969;

    font-size: 14px;
    line-height: 22px;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

.gorun-blog-excerpt-empty {
    min-height: 66px;
}


/* ==========================================
   CARD FOOTER
   ========================================== */

.gorun-blog-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;

    margin-top: auto;
}

.gorun-blog-author {
    display: flex;
    align-items: center;
    gap: 9px;

    min-width: 0;
}

.gorun-blog-avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 30px;
    height: 30px;

    flex: 0 0 auto;

    overflow: hidden;

    border-radius: 50%;

    background: #F0EEE8;
}

.gorun-blog-avatar-img {
    display: block;

    width: 100%;
    height: 100%;

    border-radius: 50%;

    object-fit: cover;
}

.gorun-blog-avatar-initials {
    color: #7A5900;

    font-size: 11px;
    font-weight: 600;
    line-height: 1;
}

.gorun-blog-author-meta {
    display: flex;
    flex-direction: column;
    gap: 2px;

    min-width: 0;
}

.gorun-blog-author-name {
    overflow: hidden;

    color: #1B1C1C;

    font-size: 13px;
    font-weight: 600;
    line-height: 1.2;

    text-decoration: none;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.gorun-blog-author-name:hover {
    color: #B78300;
}

.gorun-blog-date {
    color: #8A8A8A;

    font-size: 11px;
    font-weight: 400;
    line-height: 1.2;
}

.gorun-blog-read {
    display: inline-flex;
    align-items: center;
    gap: 6px;

    flex: 0 0 auto;

    color: #E19B00;

    font-size: 13px;
    font-weight: 600;
    line-height: 1;

    text-decoration: none;

    transition:
        color .2s ease,
        gap .2s ease;
}

.gorun-blog-read:hover {
    gap: 9px;
    color: #B78300;
}

.gorun-blog-read-icon {
    width: 14px;
    height: 14px;
}


/* ==========================================
   LOAD MORE
   ========================================== */

.gorun-blog-load-more-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 100%;

    margin-top: 44px;
}

.gorun-blog-load-more {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;

    min-height: 42px;

    padding: 10px 24px;

    border: 1px solid #F0B800;
    border-radius: 30px;

    background: #ffffff;

    color: #222222;

    font-family: inherit;
    font-size: 14px;
    font-weight: 500;

    cursor: pointer;

    transition:
        background-color .2s ease,
        color .2s ease,
        transform .2s ease;
}

.gorun-blog-load-more:hover {
    background: #FDB900;
    color: #111111;
    transform: translateY(-1px);
}

.gorun-blog-load-more:disabled {
    opacity: .6;
    cursor: default;
    transform: none;
}


/* ==========================================
   LOADING
   ========================================== */

.gorun-blog-loading {
    display: none;
    align-items: center;
    justify-content: center;
    gap: 9px;

    padding: 25px 10px;

    color: #777777;

    font-size: 12px;
}

.gorun-blog-listing.is-loading .gorun-blog-loading {
    display: flex;
}

.gorun-blog-spinner {
    width: 16px;
    height: 16px;

    border: 2px solid #dedede;
    border-top-color: #FDB900;
    border-radius: 50%;

    animation: gorun-blog-spin .7s linear infinite;
}

@keyframes gorun-blog-spin {

    to {
        transform: rotate(360deg);
    }

}


/* ==========================================
   EMPTY
   ========================================== */

.gorun-blog-empty {
    display: none;

    width: 100%;

    padding: 60px 20px;

    color: #777777;

    font-size: 13px;

    text-align: center;
}


/* ==========================================
   TABLET
   ========================================== */

@media (max-width: 1024px) {

    .gorun-blog-filters {
        border-radius: 20px;
    }

    .gorun-blog-filters-left {
        flex-wrap: wrap;
    }

}

@media (max-width: 900px) {

    .gorun-blog-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));

        column-gap: 24px;
        row-gap: 34px;
    }

}


/* ==========================================
   MOBILE
   ========================================== */

@media (max-width: 600px) {

    .gorun-blog-filters {
        flex-direction: column;
        align-items: stretch;
        gap: 8px;

        padding: 10px;

        border-radius: 15px;
    }

    .gorun-blog-filters-left {
        justify-content: flex-start;
    }

    .gorun-blog-filters-right {
        justify-content: flex-start;
    }

    .gorun-blog-dropdown-menu,
    .gorun-blog-filters-right .gorun-blog-dropdown-menu {
        left: 0;
        right: auto;

        min-width: 100%;
    }

    .gorun-blog-grid {
        grid-template-columns: 1fr;

        row-gap: 32px;
    }

    .gorun-blog-title {
        font-size: 16px;
    }

}


/* ==========================================
   VERY SMALL MOBILE
   ========================================== */

@media (max-width: 380px) {

    .gorun-blog-all,
    .gorun-blog-chip,
    .gorun-blog-dropdown-toggle {
        font-size: 12px;

        padding-left: 12px;
        padding-right: 12px;
    }

    .gorun-blog-dropdown-label {
        max-width: 110px;
    }

}






/* ==========================================
   REBATE TABS - STICKY TAB TITLES (LEFT COLUMN)
   Titles stay pinned while the tab content
   scrolls, and stop at the end of the content.
   ========================================== */

.rebate_tab_sec {
    --rebate-sticky-top: 100px; /* header height + breathing room */
}

/* Leftover from the old JS implementation. */
.rebate_tab_sec .rebate-tabs-placeholder {
    display: none !important;
}

@media (min-width: 1025px) {

    /* Sticky needs a non-clipping scroll ancestor. */
    .rebate_tab_sec,
    .rebate_tab_sec .e-n-tabs,
    .rebate_tab_sec .e-n-tabs-content {
        overflow: visible !important;
    }

    /* The heading must not stretch to full height,
       otherwise it has no room to move. */
    .rebate_tab_sec .e-n-tabs {
        align-items: flex-start !important;
    }

    .rebate_tab_sec .e-n-tabs-heading {
        position: sticky !important;
        top: var(--rebate-sticky-top) !important;

        align-self: flex-start !important;

        /* Never taller than the viewport, or it
           can never fully pin. */
        max-height: calc(100vh - var(--rebate-sticky-top) - 20px);
        overflow-y: auto;

        z-index: 5;
    }

}


/* ==========================================
   REBATE PROCESS - VERTICAL PROGRESS BAR
   Centre line + a dot per step, filling with
   yellow as the user scrolls the section.
   ========================================== */

.rebate_process_bar {
    --process-track: #EFE3C6;   /* unfilled line   */
    --process-fill: #FDB813;    /* filled line     */
    --process-dot: 11px;        /* dot diameter    */
    --process-line: 2px;        /* line thickness  */
    --process-progress: 0px;    /* set by custom.js */

    position: relative !important;
}

/* The track: full-height line down the middle. */
.rebate_process_bar::before,
.rebate_process_bar::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 0;
    width: var(--process-line);
    margin-left: calc(var(--process-line) / -2);
    border-radius: var(--process-line);
    pointer-events: none;
}

.rebate_process_bar::before {
    bottom: 0;
    background: var(--process-track);
    z-index: 0;
}

/* The fill: height driven by scroll. */
.rebate_process_bar::after {
    height: var(--process-progress);
    background: var(--process-fill);
    z-index: 1;
    transition: height 0.15s linear;
}

/* One dot per step row, centred on that step. */
.rebate_process_bar > .e-con {
    position: relative !important;
}

.rebate_process_bar > .e-con::before {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;

    width: var(--process-dot);
    height: var(--process-dot);
    margin-left: calc(var(--process-dot) / -2);
    margin-top: calc(var(--process-dot) / -2);

    border-radius: 50%;
    background: #FFFFFF;
    border: var(--process-line) solid var(--process-track);
    box-sizing: border-box;

    z-index: 2;
    pointer-events: none;

    transition: border-color 0.25s ease,
                background-color 0.25s ease,
                transform 0.25s ease;
}

/* Dot the fill has already passed. */
.rebate_process_bar > .e-con.process-step-active::before {
    background: var(--process-fill);
    border-color: var(--process-fill);
    transform: scale(1.15);
}

/* Cards sit above the line. */
.rebate_process_bar .rebate-our-process {
    position: relative !important;
    z-index: 3 !important;
}


/* =========================================
   MOBILE - rows stack, so drop the line
   ========================================= */

@media (max-width: 767px) {

    .rebate_process_bar::before,
    .rebate_process_bar::after,
    .rebate_process_bar > .e-con::before {
        display: none !important;
    }

}


/* ==========================================
   REBATE TABS - MOBILE
   Elementor turns the widget into an accordion
   (title / content / title / content). Undo that
   and show the titles as one horizontally
   scrolling row with the content underneath.
   ========================================== */

@media (max-width: 767px) {

    /* Elementor sets display:contents on the heading and
       content wrappers so their children interleave into
       an accordion. Making them real boxes again splits
       them back into "all titles" + "all panels". */
    .rebate_tab_sec .e-n-tabs {
        display: flex !important;
        flex-direction: column !important;
        gap: 18px !important;
    }

    .rebate_tab_sec .e-n-tabs-heading {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        align-items: stretch !important;

        order: 0 !important;
        width: 100% !important;

        gap: 8px !important;
        padding: 8px !important;
        border-radius: 12px !important;

        overflow-x: auto !important;
        overflow-y: hidden !important;
        -webkit-overflow-scrolling: touch;

        scroll-snap-type: x proximity;

        /* No visible scrollbar. */
        scrollbar-width: none;
        -ms-overflow-style: none;
    }

    .rebate_tab_sec .e-n-tabs-heading::-webkit-scrollbar {
        display: none;
    }

    /* Chips: never shrink, never wrap. */
    .rebate_tab_sec .e-n-tab-title {
        flex: 0 0 auto !important;
        width: auto !important;

        white-space: nowrap !important;
        scroll-snap-align: start;

        padding: 12px 18px !important;
        border-radius: 10px !important;
    }

    /* The "›" arrow only makes sense in the vertical column. */
    .rebate_tab_sec .e-n-tab-title::after {
        display: none !important;
    }

    /* Panels below the chip row. */
    .rebate_tab_sec .e-n-tabs-content {
        display: block !important;
        order: 1 !important;
        width: 100% !important;
    }

    .rebate_tab_sec .e-n-tabs-content > .e-con:not(.e-active) {
        display: none !important;
    }

    .rebate_tab_sec .e-n-tabs-content > .e-con.e-active {
        display: flex !important;
        width: 100% !important;
    }

}


/* ==========================================
   SOLAR SLIDER - ARROW POSITION ONLY
   ========================================== */

.choose_best_solar_slider {
    position: relative !important;
}


/* Both Elementor arrow buttons */
.choose_best_solar_slider .elementor-swiper-button {
    position: absolute !important;

    top: auto !important;
    bottom: -75px !important;

    width: 40px !important;
    height: 40px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    border: 1px solid #D9D9D9 !important;
    border-radius: 50% !important;

    background: #FFFFFF !important;

    margin: 0 !important;
    transform: none !important;

    z-index: 20 !important;
}


/* Previous */
.choose_best_solar_slider .elementor-swiper-button-prev {
    left: 0 !important;
    right: auto !important;
}


/* Next */
.choose_best_solar_slider .elementor-swiper-button-next {
    left: 52px !important;
    right: auto !important;
}


/* ==========================================
   TABLET
   ========================================== */

@media (max-width: 1024px) {

    .choose_best_solar_slider .elementor-swiper-button {
        bottom: 0 !important;
    }

    .choose_best_solar_slider .elementor-swiper-button-prev {
        left: 0 !important;
    }

    .choose_best_solar_slider .elementor-swiper-button-next {
        left: 52px !important;
    }
}


/* ==========================================
   MOBILE
   ========================================== */

@media (max-width: 767px) {

    .choose_best_solar_slider .elementor-swiper-button {
        width: 36px !important;
        height: 36px !important;
        bottom: 0 !important;
    }

    .choose_best_solar_slider .elementor-swiper-button-prev {
        left: 0 !important;
    }

    .choose_best_solar_slider .elementor-swiper-button-next {
        left: 46px !important;
    }
}
/* ==========================================
   DHARA GO RUN SOLAR PROMISE - GUARANTEE LIST
   ========================================== */

.our_guarantee_solar_promise .elementor-icon-list-items {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    column-gap: 30px !important;
    row-gap: 30px !important;

    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}


/* Individual list item */
.our_guarantee_solar_promise .elementor-icon-list-item {
    display: flex !important;
    align-items: flex-start !important;

    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}


/* Icon */
.our_guarantee_solar_promise .elementor-icon-list-icon {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    flex: 0 0 auto !important;

    margin-right: 8px !important;
    margin-top: 2px !important;
}


/* Text */
.our_guarantee_solar_promise .elementor-icon-list-text {
    display: block !important;

    margin: 0 !important;
    padding: 0 !important;

    line-height: 1.35 !important;
}


/* ==========================================
   TABLET
   ========================================== */

@media (max-width: 1024px) {

    .our_guarantee_solar_promise .elementor-icon-list-items {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        column-gap: 20px !important;
        row-gap: 20px !important;
    }

}


/* ==========================================
   MOBILE
   ========================================== */

@media (max-width: 767px) {

    .our_guarantee_solar_promise .elementor-icon-list-items {
        grid-template-columns: 1fr !important;
        column-gap: 0 !important;
        row-gap: 16px !important;
    }

    .our_guarantee_solar_promise .elementor-icon-list-item {
        width: 100% !important;
    }

}

.why_choose_icon_box {
    background: rgb(255 255 255 / 3%);
    border: 1px solid #F4C4300D;
    border-radius: 20px;
    backdrop-filter: blur(16px) saturate(120%);
    -webkit-backdrop-filter: blur(16px) saturate(120%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.09), inset 0 1px 0 rgba(0, 0, 0, 0.18), 0 20px 20px rgba(0, 0, 0, 0.15);
}

.solar_packege_tab_div .active {
    background-image: url(/wp-content/uploads/2026/08/Rectangle-67.png) !important;
    background: no-repeat;
    background-color: #fff !important;
    border-left: 3px solid #F4B400 !important;
    border-radius: 0px;
}

.package_icon_box h3 span {
    font-size: 12px !important;
}

.package_icon_box p {
    font-size: 24px !important;
    font-weight: 700 !important;
}






/* ==========================================
   GORUN SOLAR - PRODUCT LISTING
   Shortcode: [product_listing]
   ========================================== */

.gorun-product-listing {
    --gp-gold: #FDB813;
    --gp-gold-deep: #E19B00;
    --gp-gold-dark: #B78300;
    --gp-ink: #1B1C1C;
    --gp-muted: #8A8A8A;
    --gp-line: #EFE3C6;
    --gp-soft: #F0EEE8;
    --gp-radius: 14px;

    position: relative;

    max-width: 1280px;
    margin: 0 auto;

    color: var(--gp-ink);

    font-family: inherit;
}

.gorun-product-listing *,
.gorun-product-listing *::before,
.gorun-product-listing *::after {
    box-sizing: border-box;
}

.gorun-product-listing button {
    font-family: inherit;
}

.gorun-product-notice {
    padding: 18px;

    border: 1px solid #EFE3C6;
    border-radius: 12px;

    background: #FDF7E8;
}


/* ==========================================
   HEADER
   ========================================== */

.gorun-product-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;

    margin-bottom: 22px;
}

.gorun-product-eyebrow {
    display: block;
    margin-bottom: 6px;
    letter-spacing: .02em;
    font-family: "Inter", Sans-serif;
    font-size: 14px;
    font-weight: 600;
    line-height: 30px;
    color: #7A5900;
    background-color: #FDF4D9;
    padding: 0px 5px 0px 5px;
    border-radius: 16px 16px 16px 16px;
    text-align: center;
    width: 50%;
}

.gorun-product-heading {
    margin: 0;

    color: var(--gp-ink);

    font-size: 30px;
    font-weight: 700;
    line-height: 1.2;
}

.gorun-product-view-all {
    flex: 0 0 auto;

    color: var(--gp-muted);

    font-size: 13px;
    font-weight: 500;

    text-decoration: none;

    transition: color .2s ease;
}

.gorun-product-view-all:hover {
    color: var(--gp-gold-dark);
}


/* ==========================================
   CATEGORY NAVIGATION
   ========================================== */

.gorun-product-nav {
    position: relative;

    margin-bottom: 26px;
    padding: 16px;

    border: 1px solid var(--gp-line);
    border-radius: 18px;

    background: #FFFFFF;
}

.gorun-product-nav-track {
    display: grid;
    grid-template-columns: repeat(8, minmax(0, 1fr));
    gap: 12px;
}

.gorun-product-nav-item {
    min-width: 0;
}

.gorun-product-nav-button {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;

    width: 100%;
    min-width: 0;

    /*
       The tile is stretched to the tallest in the row by its
       wrapper, but the button inside it was only ever as tall as
       its own text - so a category that wrapped onto two lines
       drew a taller box than one that did not.

       Filling the wrapper puts every border on the same line,
       whatever the label does. `min-height` stays as the floor
       for a row where nothing wraps.
    */
    height: 100%;
    min-height: 96px;

    padding: 14px 8px;

    border: 1px solid var(--gp-line);
    border-radius: 12px;

    background: #FFFFFF;
    color: var(--gp-ink);

    font-size: 13px;
    font-weight: 600;
    line-height: 1.25;

    text-align: center;

    cursor: pointer;

    transition:
        background .2s ease,
        border-color .2s ease,
        color .2s ease,
        box-shadow .2s ease;
}

.gorun-product-nav-button:hover {
    border-color: var(--gp-gold);

    box-shadow: 0 6px 18px rgba(253, 184, 19, .16);
}

.gorun-product-nav-button.is-active {
    border-color: var(--gp-gold-deep);

    background: linear-gradient(180deg, #F5B821 0%, #DDA000 100%);
    color: #FFFFFF;
}

.gorun-product-nav-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 30px;
    height: 30px;

    color: var(--gp-gold-dark);

    transition: color .2s ease;
}

.gorun-product-nav-button.is-active .gorun-product-nav-icon {
    color: #FFFFFF;
}

.gorun-product-nav-icon-svg {
    width: 100%;
    height: 100%;
}

.gorun-product-nav-icon-img {
    max-width: 100%;
    max-height: 100%;

    object-fit: contain;
}

.gorun-product-nav-label {
    display: block;

    /*
       The button is a column flex container with `align-items:
       center`, which sizes each child to its own content instead
       of to the button. That is what let a long label sit wider
       than the tile and spill out both sides.

       Stretching this one child pins it to the button's width,
       so the text has a real edge to wrap against. Only the
       label is stretched - the icon above keeps the centring it
       already had. `max-width` on its own did not fix this: the
       label was never being asked to fit in the first place.
    */
    align-self: stretch;

    max-width: 100%;
    min-width: 0;

    /*
       `anywhere` rather than `break-word`: it also shrinks the
       min-content width, so a single long word cannot hold the
       label open. `break-word` sits in front as the fallback.
    */
    overflow-wrap: break-word;
    overflow-wrap: anywhere;
}


/* ------------------------------------------
   MEGA PANEL
   ------------------------------------------ */

.gorun-product-nav-panel {
    position: absolute;
    top: 100%;
    left: -1px;
    right: -1px;
    z-index: 40;

    margin-top: 0;
    padding: 0 16px;

    visibility: hidden;
    opacity: 0;

    overflow: hidden;

    border: 1px solid var(--gp-line);
    border-top: 0;
    border-radius: 0 0 18px 18px;

    background: #FFFFFF;
    box-shadow: 0 22px 40px rgba(27, 28, 28, .10);

    transform: translateY(-6px);

    transition:
        opacity .18s ease,
        transform .18s ease,
        visibility .18s ease;
}

.gorun-product-nav-item.has-panel:hover .gorun-product-nav-panel,
.gorun-product-nav-item.has-panel:focus-within .gorun-product-nav-panel,
.gorun-product-nav-item.is-open .gorun-product-nav-panel {
    visibility: visible;
    opacity: 1;

    transform: translateY(0);
}

.gorun-product-nav-panel-inner {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 28px 40px;

    padding: 26px 4px 30px;

    border-top: 1px solid var(--gp-line);
}

.gorun-product-nav-column {
    min-width: 0;
}

.gorun-product-nav-column-title {
    display: block;

    margin-bottom: 14px;
    padding: 0;

    border: 0;

    background: none;
    color: var(--gp-gold-dark);

    font-size: 12px;
    font-weight: 700;
    line-height: 1.2;

    letter-spacing: .08em;
    text-align: left;
    text-transform: uppercase;

    cursor: pointer;
}

.gorun-product-nav-column-title:hover {
    color: var(--gp-gold-deep);
}

.gorun-product-nav-list {
    display: flex;
    flex-direction: column;
    gap: 10px;

    margin: 0;
    padding: 0;

    list-style: none;
}

.gorun-product-nav-list li {
    margin: 0;
}

.gorun-product-nav-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;

    padding: 0;

    border: 0;

    background: none;
    color: #4A4A4A;

    font-size: 14px;
    font-weight: 500;
    line-height: 1.3;

    text-align: left;

    cursor: pointer;

    transition: color .18s ease;
}

.gorun-product-nav-link:hover,
.gorun-product-nav-link.is-active {
    color: var(--gp-gold-dark);
}

.gorun-product-nav-tag {
    padding: 2px 7px;

    border-radius: 4px;

    background: var(--gp-soft);
    color: var(--gp-muted);

    font-size: 9px;
    font-weight: 700;
    line-height: 1.4;

    letter-spacing: .06em;
    text-transform: uppercase;
}


/* ==========================================
   LAYOUT
   ========================================== */

.gorun-product-layout {
    display: grid;
    grid-template-columns: 268px minmax(0, 1fr);
    gap: 26px;

    align-items: start;
}

.gorun-product-main {
    min-width: 0;
}


/* ==========================================
   SIDEBAR
   ========================================== */

.gorun-product-sidebar {
    padding: 20px;

    border: 1px solid var(--gp-line);
    border-radius: 18px;

    background: #FFFFFF;
}

.gorun-product-sidebar-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;

    padding-bottom: 14px;

    border-bottom: 1px solid var(--gp-line);
}

.gorun-product-sidebar-title {
    margin: 0;

    color: var(--gp-ink);

    font-size: 15px;
    font-weight: 700;
    line-height: 1.2;
}

.gorun-product-clear {
    padding: 0;

    border: 0;

    background: none;
    color: var(--gp-muted);

    font-size: 12px;
    font-weight: 500;

    cursor: pointer;

    transition: color .18s ease;
}

.gorun-product-clear:hover {
    color: var(--gp-gold-dark);
}


/* ------------------------------------------
   GROUPS
   ------------------------------------------ */

.gorun-product-group {
    border-bottom: 1px solid var(--gp-line);
}

/*
   A category group is hidden while a different category is
   active in the top navigation. Attribute groups - price,
   power output, property type, hybrid, meter phase - never
   carry this class, so they stay on screen throughout.
*/
.gorun-product-group.is-hidden {
    display: none;
}


/* ------------------------------------------
   PRODUCT CATEGORY COLLAPSIBLE
   ------------------------------------------

   With no category picked up top, every category group is
   folded inside one "Product Category" row so the sidebar
   opens short. Pick a category and the wrapper flattens -
   its own heading goes, and the single group left inside is
   dressed to look like any other top level group. */

.gorun-product-category-wrap > .gorun-product-group-body {
    padding-bottom: 6px;
}

.gorun-product-group.is-nested {
    padding-left: 12px;
}

.gorun-product-group.is-nested:last-child {
    border-bottom: 0;
}

/* A rung below the filter headings, so the nesting reads. */
.gorun-product-group.is-nested > .gorun-product-group-toggle {
    padding: 12px 0;

    font-weight: 500;
}

.gorun-product-category-wrap.is-flat > .gorun-product-group-toggle {
    display: none;
}

/* The group inside now draws the dividing line. */
.gorun-product-category-wrap.is-flat {
    border-bottom: 0;
}

.gorun-product-category-wrap.is-flat > .gorun-product-group-body {
    padding-bottom: 0;
}

.gorun-product-category-wrap.is-flat .gorun-product-group.is-nested {
    padding-left: 0;

    border-bottom: 1px solid var(--gp-line);
}

.gorun-product-category-wrap.is-flat .gorun-product-group.is-nested > .gorun-product-group-toggle {
    padding: 16px 0;

    font-weight: 600;
}


.gorun-product-group-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;

    width: 100%;
    padding: 16px 0;

    border: 0;

    background: none;
    color: var(--gp-ink);

    font-size: 13px;
    font-weight: 600;
    line-height: 1.2;

    text-align: left;

    cursor: pointer;
}

.gorun-product-chevron {
    width: 16px;
    height: 16px;

    flex: 0 0 auto;

    color: var(--gp-muted);

    transition: transform .2s ease;
}

.gorun-product-group:not(.is-open) .gorun-product-chevron {
    transform: rotate(-90deg);
}

.gorun-product-group-body {
    padding-bottom: 18px;
}

.gorun-product-group:not(.is-open) .gorun-product-group-body {
    display: none;
}


/* ------------------------------------------
   PRICE SLIDER
   ------------------------------------------ */

.gorun-price-slider {
    position: relative;

    height: 26px;
    margin-bottom: 14px;
}

.gorun-price-track {
    position: absolute;
    top: 35%;
    left: 0;
    right: 0;

    height: 4px;

    border-radius: 4px;

    background: var(--gp-line);

    transform: translateY(-50%);
}

.gorun-price-fill {
    position: absolute;
    top: 0;
    bottom: 0;

    border-radius: 4px;

    background: var(--gp-gold);
}

.gorun-price-range {
    position: absolute;
    top: 0;
    left: 0;

    width: 100%;
    height: 26px;
    margin: 0;

    -webkit-appearance: none;
    appearance: none;

    background: none;

    pointer-events: none;
}

/* The max handle sits above the min handle. When the two meet,
   custom.js lifts the min handle instead, otherwise it would be
   buried and impossible to drag back down. */
.gorun-price-range-min {
    z-index: 2;
}

.gorun-price-range-max {
    z-index: 3;
}

.gorun-price-range::-webkit-slider-runnable-track {
    height: 26px;

    background: none;
}

.gorun-price-range::-moz-range-track {
    height: 26px;

    background: none;
}

.gorun-price-range::-webkit-slider-thumb {
    width: 18px;
    height: 18px;

    -webkit-appearance: none;
    appearance: none;

    border: 3px solid var(--gp-gold);
    border-radius: 50%;

    background: #FFFFFF;
    box-shadow: 0 1px 5px rgba(27, 28, 28, .22);

    cursor: grab;

    pointer-events: auto;
}

.gorun-price-range::-moz-range-thumb {
    width: 18px;
    height: 18px;

    border: 3px solid var(--gp-gold);
    border-radius: 50%;

    background: #FFFFFF;
    box-shadow: 0 1px 5px rgba(27, 28, 28, .22);

    cursor: grab;

    pointer-events: auto;
}

.gorun-price-range:active::-webkit-slider-thumb {
    cursor: grabbing;
}

.gorun-price-inputs {
    display: flex;
    align-items: center;
    gap: 8px;
}

.gorun-price-input {
    display: flex;
    align-items: center;
    gap: 2px;

    flex: 1 1 0;
    min-width: 0;

    padding: 8px 10px;

    border: 1px solid var(--gp-line);
    border-radius: 8px;

    background: #FFFFFF;
}

.gorun-price-input:focus-within {
    border-color: var(--gp-gold);
}

.gorun-price-symbol {
    color: var(--gp-muted);

    font-size: 12px;
    font-weight: 500;
}

.gorun-price-number {
    width: 100%;
    min-width: 0;
    padding: 0;

    border: 0;

    background: none;
    color: var(--gp-ink);

    font-size: 12px;
    font-weight: 600;

    -moz-appearance: textfield;
}

.gorun-price-inputs .gorun-price-number {
    padding: .1rem .5rem !important;
    border: none !important;
}

.gorun-price-number:focus {
    outline: none !important;
}

.gorun-product-listing button:focus-visible, .gorun-product-listing a:focus-visible, .gorun-product-listing select:focus-visible, .gorun-product-listing input:focus-visible {
    outline: none !important;
}

.gorun-price-number::-webkit-outer-spin-button,
.gorun-price-number::-webkit-inner-spin-button {
    margin: 0;

    -webkit-appearance: none;
}

.gorun-price-dash {
    flex: 0 0 auto;

    color: var(--gp-muted);

    font-size: 12px;
}


/* ------------------------------------------
   CHECKBOXES
   ------------------------------------------ */

.gorun-product-options {
    display: flex;
    flex-direction: column;
    gap: 12px;

    margin: 0;
    padding: 0;

    list-style: none;
}

.gorun-product-options li {
    margin: 0;
}

.gorun-product-option {
    display: flex;
    align-items: center;
    gap: 10px;

    cursor: pointer;
}

.gorun-product-checkbox {
    position: absolute;

    width: 1px;
    height: 1px;

    opacity: 0;

    pointer-events: none;
}

.gorun-product-checkmark {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 17px;
    height: 17px;

    flex: 0 0 auto;

    border: 1px solid #D8D2C4;
    border-radius: 4px;

    background: #FFFFFF;
    color: #FFFFFF;

    transition:
        background .16s ease,
        border-color .16s ease;
}

.gorun-product-checkmark svg {
    width: 11px;
    height: 11px;

    opacity: 0;

    transition: opacity .16s ease;
}

.gorun-product-checkbox:checked + .gorun-product-checkmark {
    border-color: var(--gp-gold-deep);

    background: var(--gp-gold);
}

.gorun-product-checkbox:checked + .gorun-product-checkmark svg {
    opacity: 1;
}

.gorun-product-checkbox:focus-visible + .gorun-product-checkmark {
    outline: 2px solid var(--gp-gold-deep);
    outline-offset: 2px;
}

.gorun-product-option-label {
    color: #4A4A4A;

    font-size: 13px;
    font-weight: 500;
    line-height: 1.3;
}

.gorun-product-checkbox:checked ~ .gorun-product-option-label {
    color: var(--gp-ink);
    font-weight: 600;
}


/* ------------------------------------------
   SIDEBAR BUTTONS
   ------------------------------------------ */

.gorun-product-sidebar-actions {
    display: flex;
    flex-direction: column;
    gap: 10px;

    padding-top: 18px;
}

.gorun-product-apply {
    padding: 12px 16px;

    border: 0;
    border-radius: 9px;

    background: var(--gp-gold);
    color: var(--gp-ink);

    font-size: 13px;
    font-weight: 700;

    cursor: pointer;

    transition: background .2s ease;
}

.gorun-product-apply:hover {
    background: var(--gp-gold-deep);
}

.gorun-product-reset {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;

    padding: 11px 16px;

    border: 1px solid var(--gp-line);
    border-radius: 9px;

    background: #FFFFFF;
    color: #4A4A4A;

    font-size: 13px;
    font-weight: 600;

    cursor: pointer;

    transition:
        border-color .2s ease,
        color .2s ease;
}

.gorun-product-reset:hover {
    border-color: var(--gp-gold);
    color: var(--gp-gold-dark);
}

.gorun-product-reset svg {
    width: 14px;
    height: 14px;
}


/* ==========================================
   TOOLBAR
   ========================================== */

.gorun-product-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;

    margin-bottom: 18px;
}

.gorun-product-count {
    color: var(--gp-muted);

    font-size: 13px;
    font-weight: 500;
}

.gorun-product-toolbar-right {
    display: flex;
    align-items: center;
    gap: 14px;
}

.gorun-product-views {
    display: inline-flex;
    gap: 6px;
}

.gorun-product-view {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 34px;
    height: 34px;

    padding: 0;

    border: 1px solid var(--gp-line);
    border-radius: 8px;

    background: #FFFFFF;
    color: var(--gp-muted);

    cursor: pointer;

    transition:
        background .18s ease,
        border-color .18s ease,
        color .18s ease;
}

.gorun-product-view:hover {
    border-color: var(--gp-gold);
    color: var(--gp-gold-dark);
}

.gorun-product-view.is-active {
    border-color: var(--gp-gold-deep);

    background: var(--gp-gold);
    color: var(--gp-ink);
}

.gorun-product-view svg {
    width: 16px;
    height: 16px;
}

.gorun-product-per-page {
    display: inline-flex;
    align-items: center;
    gap: 8px;

    color: var(--gp-muted);

    font-size: 13px;
    font-weight: 500;
}

.gorun-product-per-page-select {
    min-width: 62px;
    height: 34px;
    padding: 0 26px 0 10px;

    -webkit-appearance: none;
    appearance: none;

    border: 1px solid var(--gp-line);
    border-radius: 8px;

    background-color: #FFFFFF;
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238A8A8A' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9.5l6 6 6-6'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 8px center;
    background-size: 13px 13px;

    color: var(--gp-ink);

    font-size: 13px;
    font-weight: 600;

    cursor: pointer;
}


/* ==========================================
   RESULTS
   ========================================== */

.gorun-product-results {
    position: relative;

    min-height: 160px;
}

.gorun-product-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
}

.gorun-product-empty {
    padding: 48px 20px;

    border: 1px dashed var(--gp-line);
    border-radius: 14px;

    color: var(--gp-muted);

    font-size: 14px;

    text-align: center;
}

.gorun-product-empty[hidden] {
    display: none;
}


/* ------------------------------------------
   LOADING
   ------------------------------------------ */

.gorun-product-loading {
    position: absolute;
    inset: 0;
    z-index: 5;

    display: none;
    align-items: flex-start;
    justify-content: center;
    gap: 10px;

    padding-top: 90px;

    background: rgba(255, 255, 255, .78);

    color: var(--gp-muted);

    font-size: 13px;
}

.gorun-product-listing.is-loading .gorun-product-loading {
    display: flex;
}

.gorun-product-listing.is-loading .gorun-product-grid {
    opacity: .45;
}

.gorun-product-spinner {
    width: 18px;
    height: 18px;

    border: 2px solid var(--gp-line);
    border-top-color: var(--gp-gold);
    border-radius: 50%;

    animation: gorun-product-spin .7s linear infinite;
}

@keyframes gorun-product-spin {
    to {
        transform: rotate(360deg);
    }
}


/* ==========================================
   PRODUCT CARD
   ========================================== */

.gorun-product-card {
    display: flex;
    flex-direction: column;

    overflow: hidden;

    border: 1px solid var(--gp-line);
    border-radius: var(--gp-radius);

    background: #FFFFFF;

    transition:
        border-color .22s ease,
        box-shadow .22s ease,
        transform .22s ease;
}

.gorun-product-card:hover {
    border-color: var(--gp-gold);

    box-shadow: 0 14px 30px rgba(27, 28, 28, .09);

    transform: translateY(-3px);
}

.gorun-product-media {
    position: relative;
}

.gorun-product-image {
    display: block;

    aspect-ratio: 3 / 2;

    overflow: hidden;

    background: var(--gp-soft);
}

.gorun-product-image img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;

    transition: transform .35s ease;
}

.gorun-product-card:hover .gorun-product-image img {
    transform: scale(1.04);
}

.gorun-product-badge {
    position: absolute;
    top: 14px;
    left: 14px;

    padding: 7px 14px;

    border-radius: 8px;

    background: #FFFFFF;
    box-shadow: 0 2px 8px rgba(27, 28, 28, .12);

    color: #7A5900;

    font-size: 12px;
    font-weight: 600;
    line-height: 1.3;

    letter-spacing: .01em;
}

.gorun-product-actions {
    position: absolute;
    right: 14px;
    bottom: 14px;

    display: flex;
    gap: 10px;
}

.gorun-product-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 38px;
    height: 38px;

    padding: 0;

    border: 0;
    border-radius: 50%;

    background: #FFFFFF;
    box-shadow: 0 2px 8px rgba(27, 28, 28, .16);

    color: var(--gp-ink);

    cursor: pointer;

    transition:
        background .2s ease,
        color .2s ease,
        transform .2s ease;
}

.gorun-product-action:hover {
    background: var(--gp-gold);

    transform: translateY(-2px);
}

.gorun-product-action svg {
    width: 17px;
    height: 17px;
}

/* WooCommerce toggles these while its AJAX request is running. */
.gorun-product-cart.loading {
    opacity: .55;

    pointer-events: none;
}

.gorun-product-cart.added {
    background: var(--gp-gold);
}

/* WooCommerce appends a "View cart" link after a successful add. */
.gorun-product-actions .added_to_cart {
    display: none;
}

.gorun-product-wishlist.is-active {
    background: var(--gp-gold);
}

.gorun-product-wishlist.is-active svg {
    fill: currentColor;
}

.gorun-product-body {
    display: flex;
    flex-direction: column;
    gap: 8px;

    flex: 1 1 auto;

    padding: 18px 20px 22px;
}

.gorun-product-brand {
    color: var(--gp-muted);

    font-size: 12px;
    font-weight: 500;
    line-height: 1.2;

    letter-spacing: .1em;
    text-transform: uppercase;
}

.gorun-product-title {
    margin: 0;

    font-size: 16px;
    font-weight: 500;
    line-height: 1.45;
}

.gorun-product-title a {
    color: #3F4654;

    text-decoration: none;

    transition: color .18s ease;
}

.gorun-product-title a:hover {
    color: var(--gp-gold-dark);
}

.gorun-product-sku {
    margin-top: 4px;

    color: var(--gp-muted);

    font-size: 13px;
    font-weight: 400;
    line-height: 1.3;
}

.gorun-product-sku-label {
    color: #3F4654;

    font-weight: 700;
}

.gorun-product-price {
    display: flex;
    align-items: baseline;
    gap: 8px;

    flex-wrap: wrap;

    margin-top: 2px;

    color: #E0A200;

    font-size: 18px;
    font-weight: 700;
    line-height: 1.2;
}

.gorun-product-price del {
    color: var(--gp-muted);

    font-size: 12px;
    font-weight: 500;

    text-decoration: line-through;
}

.gorun-product-price ins {
    background: none;
    color: #E0A200;

    text-decoration: none;
}

/* The " - Inc GST" tail comes from WooCommerce's own price
   display suffix, set under WooCommerce > Settings > Tax. */
.gorun-product-price .woocommerce-price-suffix {
    color: #F2B843;

    font-size: 15px;
    font-weight: 400;
}

.gorun-product-price .woocommerce-Price-currencySymbol {
    font-weight: 700;
}

.gorun-product-buy {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    margin-top: 14px;
    padding: 13px 28px;

    align-self: flex-start;

    border-radius: 8px;

    background: var(--gp-gold);
    color: var(--gp-ink);

    font-size: 14px;
    font-weight: 700;
    line-height: 1.2;

    text-decoration: none;

    transition:
        background .2s ease,
        color .2s ease;
}

.gorun-product-buy:hover {
    background: var(--gp-gold-deep);
    color: var(--gp-ink);
}


/* ------------------------------------------
   LIST VIEW
   ------------------------------------------ */

.gorun-product-listing.is-list .gorun-product-grid {
    grid-template-columns: minmax(0, 1fr);
}

.gorun-product-listing.is-list .gorun-product-card {
    flex-direction: row;
}

.gorun-product-listing.is-list .gorun-product-card:hover {
    transform: none;
}

.gorun-product-listing.is-list .gorun-product-media {
    width: 240px;

    flex: 0 0 240px;
}

.gorun-product-listing.is-list .gorun-product-image {
    aspect-ratio: 1 / 1;
}

.gorun-product-listing.is-list .gorun-product-body {
    justify-content: center;

    padding: 20px 22px;
}


/* ==========================================
   PAGINATION
   ========================================== */

.gorun-product-pagination-wrapper:empty {
    display: none;
}

.gorun-product-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;

    flex-wrap: wrap;

    margin-top: 30px;
}

.gorun-product-page {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-width: 34px;
    height: 34px;

    padding: 0 9px;

    border: 1px solid var(--gp-line);
    border-radius: 8px;

    background: #FFFFFF;
    color: #4A4A4A;

    font-size: 13px;
    font-weight: 600;

    cursor: pointer;

    transition:
        background .18s ease,
        border-color .18s ease,
        color .18s ease;
}

.gorun-product-page:hover:not(:disabled) {
    border-color: var(--gp-gold);
    color: var(--gp-gold-dark);
}

.gorun-product-page.is-active {
    border-color: var(--gp-gold-deep);

    background: var(--gp-gold);
    color: var(--gp-ink);
}

.gorun-product-page:disabled {
    opacity: .4;

    cursor: not-allowed;
}

.gorun-product-page svg {
    width: 15px;
    height: 15px;
}

.gorun-product-page-gap {
    padding: 0 2px;

    color: var(--gp-muted);
}


/* ==========================================
   FOCUS
   ========================================== */

.gorun-product-listing button:focus-visible,
.gorun-product-listing a:focus-visible,
.gorun-product-listing select:focus-visible,
.gorun-product-listing input:focus-visible {
    outline: 2px solid var(--gp-gold-deep);
    outline-offset: 2px;
}


/* ==========================================
   MOBILE FILTER DRAWER TRIGGER
   ========================================== */

.gorun-product-filter-trigger {
    display: none;
    align-items: center;
    justify-content: center;
    gap: 8px;

    width: 100%;
    padding: 12px 16px;

    border: 1px solid var(--gp-line);
    border-radius: 9px;

    background: #FFFFFF;
    color: var(--gp-ink);

    font-size: 13px;
    font-weight: 600;

    cursor: pointer;
}

.gorun-product-filter-trigger svg {
    width: 16px;
    height: 16px;
}

.gorun-product-sidebar-backdrop {
    position: fixed;
    inset: 0;
    z-index: 998;

    display: none;

    background: rgba(27, 28, 28, .45);
}


/* ==========================================
   RESPONSIVE
   ========================================== */

@media (max-width: 1200px) {

    .gorun-product-nav-track {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .gorun-product-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

}

@media (max-width: 1024px) {

    .gorun-product-layout {
        grid-template-columns: minmax(0, 1fr);
    }

    .gorun-product-filter-trigger {
        display: flex;
    }

    /* The sidebar becomes an off canvas drawer. */
    .gorun-product-sidebar {
        position: fixed;
        top: 0;
        bottom: 0;
        left: 0;
        z-index: 999;

        width: min(320px, 86vw);

        overflow-y: auto;

        border: 0;
        border-radius: 0;

        transform: translateX(-100%);

        transition: transform .28s ease;
    }

    .gorun-product-listing.filters-open .gorun-product-sidebar {
        transform: translateX(0);
    }

    .gorun-product-listing.filters-open .gorun-product-sidebar-backdrop {
        display: block;
    }

    .gorun-product-heading {
        font-size: 24px;
    }

    /* Hover panels do not exist on touch, so the script opens
       them on tap instead - see custom.js. */
    .gorun-product-nav-panel-inner {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

}

@media (max-width: 782px) {

    .gorun-product-nav {
        padding: 12px;
    }

    .gorun-product-nav-track {
        display: flex;

        overflow-x: auto;

        /* Room under the buttons for the scrollbar to sit in. */
        padding-bottom: 10px;

        scroll-snap-type: x proximity;

        -webkit-overflow-scrolling: touch;

        /* Firefox. */
        scrollbar-width: thin;
        scrollbar-color: var(--gp-gold-deep) var(--gp-soft);
    }

    /*
       The bar used to be hidden outright, which left nothing at
       all to say the row carried on past the edge.
    */
    .gorun-product-nav-track::-webkit-scrollbar {
        height: 6px;
    }

    .gorun-product-nav-track::-webkit-scrollbar-track {
        border-radius: 999px;

        background: var(--gp-soft);
    }

    .gorun-product-nav-track::-webkit-scrollbar-thumb {
        border-radius: 999px;

        background: var(--gp-gold-deep);
    }

    .gorun-product-nav-item {
        /*
           Sized as a fraction of the track rather than at a fixed
           width, so the fourth category is always cut exactly in
           half at the right hand edge instead of landing flush
           against it - a half shown button is the plainest sign
           that the row carries on.

           3.5 buttons across: three whole ones and the half that
           gives it away. The 36px is the three gaps sitting in
           front of that half.

           One fraction covers the whole range on purpose. A
           second, smaller count lower down would make the
           buttons jump wider as the screen got narrower, which
           reads as a bug.
        */
        flex: 0 0 calc((100% - 36px) / 3.5);

        scroll-snap-align: start;
    }

    .gorun-product-nav-button {
        min-height: 88px;
    }

    .gorun-product-nav-panel {
        position: static;

        margin: 12px -12px -12px;
        padding: 0 12px;

        visibility: visible;
        opacity: 1;

        border: 0;
        border-radius: 0;

        box-shadow: none;

        transform: none;
    }

    /* Collapsed until the tile is tapped. */
    .gorun-product-nav-item:not(.is-open) .gorun-product-nav-panel {
        display: none;
    }

    .gorun-product-nav-panel-inner {
        grid-template-columns: minmax(0, 1fr);
        gap: 20px;

        padding: 18px 0;
    }

    .gorun-product-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }

    .gorun-product-toolbar {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }

    .gorun-product-toolbar-right {
        width: 100%;

        justify-content: space-between;
    }

    .gorun-product-listing.is-list .gorun-product-card {
        flex-direction: column;
    }

    .gorun-product-listing.is-list .gorun-product-media {
        width: auto;

        flex: 0 0 auto;
    }

}

@media (max-width: 560px) {

    .gorun-product-grid {
        grid-template-columns: minmax(0, 1fr);
    }

}

@media (prefers-reduced-motion: reduce) {

    .gorun-product-listing *,
    .gorun-product-listing *::before,
    .gorun-product-listing *::after {
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
    }

}

/* WooCommerce prints the old price first; the design leads with
   the current one. */
.gorun-product-price ins {
    order: 1;
}

.gorun-product-price del {
    order: 2;
}


/* ==========================================
   THEME BUTTON OVERRIDE
   ==========================================

   Elementor's global button styling is applied to every <button>
   on the page, which includes the plain icon and text buttons in
   this listing - that is where the accent colour was coming from
   on the active category tile and on filter headings.

   Every button inside the listing is stripped back here, and the
   handful that are meant to carry a background have it declared
   again below. The kit wins on specificity from a stylesheet
   loaded after this one, so !important is the only lever that
   holds; it is confined to this block. */

.gorun-product-listing button {
    background: transparent !important;
    background-image: none !important;

    color: inherit !important;

    box-shadow: none !important;
    text-shadow: none !important;

    text-transform: none !important;
    letter-spacing: normal !important;
}


/* ------------------------------------------
   CATEGORY NAVIGATION
   ------------------------------------------ */

.gorun-product-listing .gorun-product-nav-button {
    background: #FFFFFF !important;
    color: var(--gp-ink) !important;

    /*
       The kit sets a button font size too, and at the tile
       widths used on a phone that was enough to push a two word
       label out past both edges. Declared again here for the
       same reason the colours are - this is the block that wins.
    */
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.25 !important;
}

/*
   The smaller size for the scrolling row. It has to sit after
   the rule above rather than up with the other mobile styles:
   the two match on specificity and both carry !important, so
   whichever comes last in the file wins - and up there, this
   one lost.
*/
@media (max-width: 782px) {

    .gorun-product-listing .gorun-product-nav-button {
        font-size: 12px !important;
    }

}

/*
   Nothing the kit does may stop the label wrapping. Placed here,
   after everything else that touches these tiles, so ordering
   cannot undo it.
*/
.gorun-product-listing .gorun-product-nav-label {
    align-self: stretch !important;

    max-width: 100% !important;

    white-space: normal !important;
    overflow-wrap: anywhere !important;

    /*
       Sized on the label itself, not left to be inherited from
       the button. If anything sets a size directly on this span
       the button's own declaration never reaches it, and the
       text goes back to outgrowing the tile.
    */
    font-size: 13px !important;
    line-height: 1.25 !important;
}

@media (max-width: 782px) {

    .gorun-product-listing .gorun-product-nav-label {
        font-size: 12px !important;
    }

}

.gorun-product-listing .gorun-product-nav-button:hover {
    border-color: var(--gp-gold);

    box-shadow: 0 6px 18px rgba(253, 184, 19, .16) !important;
}

.gorun-product-listing .gorun-product-nav-button.is-active {
    border-color: var(--gp-gold-deep);

    background: linear-gradient(180deg, #F5B821 0%, #DDA000 100%) !important;
    color: #FFFFFF !important;
}

.gorun-product-listing .gorun-product-nav-column-title {
    color: var(--gp-gold-dark) !important;
}

.gorun-product-listing .gorun-product-nav-column-title:hover {
    color: var(--gp-gold-deep) !important;
}

.gorun-product-listing .gorun-product-nav-link {
    color: #4A4A4A !important;
}

.gorun-product-listing .gorun-product-nav-link:hover,
.gorun-product-listing .gorun-product-nav-link.is-active {
    color: var(--gp-gold-dark) !important;
}


/* ------------------------------------------
   SIDEBAR
   ------------------------------------------ */

.gorun-product-listing .gorun-product-clear {
    color: var(--gp-muted) !important;
}

.gorun-product-listing .gorun-product-clear:hover {
    color: var(--gp-gold-dark) !important;
}

.gorun-product-listing .gorun-product-group-toggle {
    color: var(--gp-ink) !important;
}

.gorun-product-listing .gorun-product-group-toggle:hover {
    color: var(--gp-gold-dark) !important;
}

.gorun-product-listing .gorun-product-apply {
    background: var(--gp-gold) !important;
    color: var(--gp-ink) !important;
}

.gorun-product-listing .gorun-product-apply:hover {
    background: var(--gp-gold-deep) !important;
}

.gorun-product-listing .gorun-product-reset,
.gorun-product-listing .gorun-product-filter-trigger {
    background: #FFFFFF !important;
    color: #4A4A4A !important;
}

.gorun-product-listing .gorun-product-reset:hover {
    border-color: var(--gp-gold);
    color: var(--gp-gold-dark) !important;
}


/* ------------------------------------------
   TOOLBAR AND PAGINATION
   ------------------------------------------ */

.gorun-product-listing .gorun-product-view {
    background: #FFFFFF !important;
    color: var(--gp-muted) !important;
}

.gorun-product-listing .gorun-product-view:hover {
    border-color: var(--gp-gold);
    color: var(--gp-gold-dark) !important;
}

.gorun-product-listing .gorun-product-view.is-active {
    border-color: var(--gp-gold-deep);

    background: var(--gp-gold) !important;
    color: var(--gp-ink) !important;
}

.gorun-product-listing .gorun-product-page {
    background: #FFFFFF !important;
    color: #4A4A4A !important;
}

.gorun-product-listing .gorun-product-page:hover:not(:disabled) {
    border-color: var(--gp-gold);
    color: var(--gp-gold-dark) !important;
}

.gorun-product-listing .gorun-product-page.is-active {
    border-color: var(--gp-gold-deep);

    background: var(--gp-gold) !important;
    color: var(--gp-ink) !important;
}


/* ------------------------------------------
   CARD ICONS
   ------------------------------------------ */

.gorun-product-listing .gorun-product-action {
    background: #FFFFFF !important;
    color: var(--gp-ink) !important;

    box-shadow: 0 2px 8px rgba(27, 28, 28, .16) !important;
}

.gorun-product-listing .gorun-product-action:hover,
.gorun-product-listing .gorun-product-cart.added,
.gorun-product-listing .gorun-product-wishlist.is-active {
    background: var(--gp-gold) !important;
    color: var(--gp-ink) !important;
}

.gorun-product-listing .gorun-product-buy {
    background: var(--gp-gold) !important;
    color: var(--gp-ink) !important;
}

.gorun-product-listing .gorun-product-buy:hover {
    background: var(--gp-gold-deep) !important;
    color: var(--gp-ink) !important;
}


/* ==========================================================
   GORUN SOLAR - WISHLIST
   ==========================================================

   The saved items view rendered by [wishlist], plus the
   My Account shell it sits inside.

   Same token names the product listing uses, redeclared here
   so the shortcode is not tied to being inside a listing.
   ========================================================== */

.gorun-wl {
    --gp-gold: #FDB813;
    --gp-gold-deep: #E19B00;
    --gp-gold-dark: #B78300;
    --gp-gold-wash: #FFF8E7;
    --gp-ink: #1B1C1C;
    --gp-muted: #8A8A8A;
    --gp-line: #EFE3C6;
    --gp-line-cool: #E8E8E6;
    --gp-soft: #F0EEE8;
    --gp-radius: 14px;

    max-width: 1080px;
    margin: 0 auto;

    color: var(--gp-ink);

    font-family: inherit;
}

.gorun-wl *,
.gorun-wl *::before,
.gorun-wl *::after {
    box-sizing: border-box;
}

.gorun-wl button {
    font: inherit;
    color: inherit;
}


/* ==========================================
   HEAD
   ========================================== */

.gorun-wl-head {
    margin-bottom: 22px;
}

.gorun-wl-heading {
    margin: 0 0 6px;

    color: var(--gp-ink);

    font-size: 26px;
    font-weight: 700;
    line-height: 1.25;

    letter-spacing: -.01em;
}

.gorun-wl-subheading {
    max-width: 620px;
    margin: 0;

    color: var(--gp-muted);

    font-size: 14px;
    line-height: 1.6;
}


/* ==========================================
   TOOLBAR
   ========================================== */

.gorun-wl-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;

    margin-bottom: 18px;
}

.gorun-wl-search {
    position: relative;

    display: flex;
    align-items: center;

    flex: 0 1 260px;
}

.gorun-wl-search svg {
    position: absolute;
    left: 14px;

    width: 15px;
    height: 15px;

    color: var(--gp-muted);

    pointer-events: none;
}

.gorun-wl-search-input {
    width: 100%;

    padding: 10px 16px 10px 38px;

    border: 1px solid var(--gp-line-cool);
    border-radius: 999px;

    background: #FFFFFF;

    color: var(--gp-ink);

    font-size: 13px;
    line-height: 1.4;
}

.gorun-wl-search-input::placeholder {
    color: var(--gp-muted);
}

.gorun-wl-search-input:focus {
    outline: none;

    border-color: var(--gp-gold);

    box-shadow: 0 0 0 3px rgba(253, 184, 19, .18);
}

/* Sort and Filter share one shape. */
.gorun-wl-tool {
    display: inline-flex;
    align-items: center;
    gap: 7px;

    padding: 10px 18px;

    border: 1px solid var(--gp-line-cool);
    border-radius: 999px;

    background: #FFFFFF;

    font-size: 13px;
    font-weight: 500;

    cursor: pointer;

    transition:
        border-color .2s ease,
        background .2s ease;
}

.gorun-wl-tool:hover {
    border-color: var(--gp-gold);

    background: var(--gp-gold-wash);
}

.gorun-wl-tool svg {
    width: 14px;
    height: 14px;
}

.gorun-wl-sort {
    position: relative;
}

.gorun-wl-sort-menu {
    position: absolute;
    z-index: 5;
    top: calc(100% + 6px);
    left: 0;

    min-width: 190px;
    margin: 0;
    padding: 6px;

    list-style: none;

    border: 1px solid var(--gp-line-cool);
    border-radius: 12px;

    background: #FFFFFF;
    box-shadow: 0 14px 32px rgba(27, 28, 28, .12);
}

.gorun-wl-sort-menu button {
    display: block;

    width: 100%;

    padding: 9px 12px;

    border: 0;
    border-radius: 8px;

    background: none;

    color: var(--gp-ink);

    font-size: 13px;
    text-align: left;

    cursor: pointer;
}

.gorun-wl-sort-menu button:hover {
    background: var(--gp-soft);
}

.gorun-wl-sort-menu button.is-active {
    background: var(--gp-gold-wash);

    color: var(--gp-gold-dark);
    font-weight: 600;
}


/* ==========================================
   CATEGORY CHIPS
   ========================================== */

.gorun-wl-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;

    margin-bottom: 22px;
}

.gorun-wl-chips.is-hidden {
    display: none;
}

.gorun-wl-chip {
    padding: 8px 18px;

    border: 1px solid var(--gp-line-cool);
    border-radius: 999px;

    background: #FFFFFF;

    color: var(--gp-ink);

    font-size: 12.5px;
    font-weight: 500;
    line-height: 1.3;

    cursor: pointer;

    transition:
        background .2s ease,
        border-color .2s ease,
        color .2s ease;
}

.gorun-wl-chip:hover {
    border-color: var(--gp-gold);
}

.gorun-wl-chip.is-active {
    border-color: var(--gp-gold);

    background: var(--gp-gold);

    color: var(--gp-ink);
    font-weight: 600;
}


/* ==========================================
   SAVED ROW
   ========================================== */

.gorun-wl-list {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.gorun-wl-item {
    display: grid;
    grid-template-columns: 210px minmax(0, 1fr) 210px;
    gap: 22px;

    padding: 16px;

    border: 1px solid var(--gp-line);
    border-radius: var(--gp-radius);

    background: #FFFFFF;

    transition:
        border-color .22s ease,
        box-shadow .22s ease,
        opacity .2s ease,
        transform .2s ease;
}

.gorun-wl-item:hover {
    border-color: var(--gp-gold);

    box-shadow: 0 14px 30px rgba(27, 28, 28, .08);
}

/* Held for the length of the removal animation. */
.gorun-wl-item.is-leaving {
    opacity: 0;

    transform: translateX(-14px);
}


/* MEDIA */

.gorun-wl-item-media {
    position: relative;
}

.gorun-wl-thumb {
    display: block;

    aspect-ratio: 4 / 3;

    overflow: hidden;

    border-radius: 10px;

    background: var(--gp-soft);
}

.gorun-wl-thumb-img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;
}

/* The gold tick that marks the row as saved. */
.gorun-wl-saved-mark {
    position: absolute;
    z-index: 2;
    top: -7px;
    left: -7px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 26px;
    height: 26px;

    border-radius: 50%;

    background: var(--gp-gold);
    box-shadow: 0 2px 8px rgba(27, 28, 28, .18);

    color: var(--gp-ink);
}

.gorun-wl-saved-mark svg {
    width: 13px;
    height: 13px;
}

.gorun-wl-item-cat {
    position: absolute;
    bottom: 10px;
    left: 10px;

    padding: 5px 10px;

    border-radius: 6px;

    background: rgba(27, 28, 28, .72);

    color: #FFFFFF;

    font-size: 10px;
    font-weight: 600;
    line-height: 1.2;

    letter-spacing: .08em;
    text-transform: uppercase;
}


/* HEART */

.gorun-wl-heart {
    position: absolute;
    top: 10px;
    right: 10px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 32px;
    height: 32px;

    padding: 0;

    border: 0;
    border-radius: 50%;

    background: #FFFFFF;
    box-shadow: 0 2px 8px rgba(27, 28, 28, .16);

    color: var(--gp-ink);

    cursor: pointer;

    transition:
        background .2s ease,
        color .2s ease,
        transform .2s ease;
}

.gorun-wl-heart:hover {
    transform: scale(1.08);
}

.gorun-wl-heart svg {
    width: 15px;
    height: 15px;
}

.gorun-wl-heart.is-active {
    color: #E23744;
}

.gorun-wl-heart.is-active svg {
    fill: currentColor;
}


/* INFO */

.gorun-wl-item-info {
    display: flex;
    flex-direction: column;
    gap: 9px;

    padding-top: 4px;
}

.gorun-wl-compat {
    display: inline-flex;
    align-items: center;
    gap: 6px;

    align-self: flex-start;

    padding: 5px 11px;

    border-radius: 999px;

    background: #EAF3FB;

    color: #2A6FA8;

    font-size: 11px;
    font-weight: 500;
    line-height: 1.3;
}

.gorun-wl-compat svg {
    width: 12px;
    height: 12px;
}

.gorun-wl-item-title {
    margin: 0;

    font-size: 19px;
    font-weight: 700;
    line-height: 1.3;

    letter-spacing: -.01em;
}

.gorun-wl-item-title a {
    color: var(--gp-ink);

    text-decoration: none;
}

.gorun-wl-item-title a:hover {
    color: var(--gp-gold-dark);
}

.gorun-wl-item-excerpt {
    margin: 0;

    color: var(--gp-muted);

    font-size: 13px;
    line-height: 1.6;
}

.gorun-wl-specs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px 16px;

    margin: 4px 0 0;
    padding: 0;

    list-style: none;
}

.gorun-wl-spec {
    display: flex;
    align-items: center;
    gap: 7px;

    color: #5C5C5C;

    font-size: 11.5px;
    line-height: 1.4;
}

.gorun-wl-spec svg {
    flex: 0 0 auto;

    width: 13px;
    height: 13px;

    color: var(--gp-gold-deep);
}


/* BUY */

.gorun-wl-item-buy {
    display: flex;
    flex-direction: column;

    padding-top: 4px;
}

.gorun-wl-price-label {
    color: var(--gp-muted);

    font-size: 11px;
    font-weight: 500;
    line-height: 1.3;
}

.gorun-wl-price {
    margin-top: 2px;

    color: var(--gp-ink);

    font-size: 25px;
    font-weight: 700;
    line-height: 1.2;

    letter-spacing: -.02em;
}

/* Sale prices come out of get_price_html() as del + ins. */
.gorun-wl-price del {
    margin-right: 6px;

    color: var(--gp-muted);

    font-size: 15px;
    font-weight: 500;
}

.gorun-wl-price ins {
    text-decoration: none;
}

.gorun-wl-price-note {
    margin-top: 4px;

    color: var(--gp-muted);

    font-size: 11px;
    line-height: 1.4;
}


/* BUTTONS */

.gorun-wl-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 100%;

    padding: 11px 16px;

    border: 1px solid transparent;
    border-radius: 8px;

    font-size: 13px;
    font-weight: 600;
    line-height: 1.3;

    text-align: center;
    text-decoration: none;

    cursor: pointer;

    transition:
        background .2s ease,
        border-color .2s ease,
        color .2s ease,
        transform .2s ease;
}

.gorun-wl-btn-primary {
    border-color: var(--gp-gold);

    background: var(--gp-gold);

    color: var(--gp-ink);
}

.gorun-wl-btn-primary:hover {
    border-color: var(--gp-gold-deep);

    background: var(--gp-gold-deep);

    color: var(--gp-ink);

    transform: translateY(-1px);
}

.gorun-wl-btn-ghost {
    border-color: var(--gp-line-cool);

    background: #FFFFFF;

    color: var(--gp-ink);
}

.gorun-wl-btn-ghost:hover {
    border-color: var(--gp-gold);

    background: var(--gp-gold-wash);

    color: var(--gp-ink);
}

/* Checkout leads, so it takes the space above the outline. */
.gorun-wl-item-buy .gorun-wl-btn-primary {
    margin-top: auto;
}

.gorun-wl-item-buy .gorun-wl-btn-ghost {
    margin-top: 8px;
}


/* TOOLS */

.gorun-wl-item-tools {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;

    margin-top: 12px;
    padding-top: 10px;

    border-top: 1px solid var(--gp-line-cool);
}

.gorun-wl-remove {
    display: inline-flex;
    align-items: center;
    gap: 5px;

    padding: 0;

    border: 0;

    background: none;

    color: var(--gp-muted);

    font-size: 11.5px;

    cursor: pointer;

    transition: color .2s ease;
}

.gorun-wl-remove:hover {
    color: #C6303B;
}

.gorun-wl-remove:disabled {
    opacity: .5;

    cursor: default;
}

.gorun-wl-remove svg {
    width: 13px;
    height: 13px;
}

.gorun-wl-item-tools-right {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.gorun-wl-share,
.gorun-wl-open {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 26px;
    height: 26px;

    padding: 0;

    border: 0;
    border-radius: 6px;

    background: none;

    color: var(--gp-muted);

    cursor: pointer;

    transition:
        background .2s ease,
        color .2s ease;
}

.gorun-wl-share:hover,
.gorun-wl-open:hover {
    background: var(--gp-soft);

    color: var(--gp-ink);
}

.gorun-wl-share svg,
.gorun-wl-open svg {
    width: 14px;
    height: 14px;
}


/* ==========================================
   BULK ADD AND FEEDBACK
   ========================================== */

.gorun-wl-no-match {
    margin: 24px 0 0;

    color: var(--gp-muted);

    font-size: 14px;
    text-align: center;
}

.gorun-wl-bulk {
    display: flex;
    justify-content: center;

    margin-top: 22px;
}

.gorun-wl-add-all {
    display: inline-flex;
    align-items: center;
    gap: 8px;

    padding: 11px 30px;

    border: 1px solid var(--gp-line-cool);
    border-radius: 8px;

    background: #FFFFFF;

    color: var(--gp-ink);

    font-size: 13px;
    font-weight: 600;

    cursor: pointer;

    transition:
        border-color .2s ease,
        background .2s ease;
}

.gorun-wl-add-all:hover:not(:disabled) {
    border-color: var(--gp-gold);

    background: var(--gp-gold-wash);
}

.gorun-wl-add-all:disabled {
    opacity: .55;

    cursor: default;
}

.gorun-wl-add-all svg {
    width: 15px;
    height: 15px;
}

.gorun-wl-feedback {
    margin: 12px 0 0;

    color: var(--gp-gold-dark);

    font-size: 13px;
    text-align: center;
}

.gorun-wl-feedback:not(.is-visible) {
    display: none;
}

.gorun-wl-feedback.is-error {
    color: #C6303B;
}


/* ==========================================
   NOTHING SAVED YET
   ========================================== */

.gorun-wl-empty {
    display: flex;
    flex-direction: column;
    align-items: center;

    padding: 56px 24px;

    border: 1px dashed var(--gp-line);
    border-radius: var(--gp-radius);

    background: #FFFFFF;

    text-align: center;
}

.gorun-wl-empty-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 56px;
    height: 56px;

    margin-bottom: 16px;

    border-radius: 50%;

    background: var(--gp-gold-wash);

    color: var(--gp-gold-deep);
}

.gorun-wl-empty-icon svg {
    width: 26px;
    height: 26px;
}

.gorun-wl-empty-text {
    max-width: 380px;
    margin: 0 0 20px;

    color: var(--gp-muted);

    font-size: 14px;
    line-height: 1.6;
}

.gorun-wl-empty-btn {
    width: auto;

    padding: 12px 30px;
}


/* ==========================================
   RECOMMENDED
   ========================================== */

.gorun-wl-reco {
    margin-top: 46px;
    padding-top: 32px;

    border-top: 1px solid var(--gp-line-cool);
}

.gorun-wl-reco-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;

    margin-bottom: 20px;
}

.gorun-wl-reco-heading {
    margin: 0 0 4px;

    font-size: 19px;
    font-weight: 700;
    line-height: 1.3;
}

.gorun-wl-reco-text {
    margin: 0;

    color: var(--gp-muted);

    font-size: 13px;
    line-height: 1.5;
}

.gorun-wl-reco-nav {
    display: flex;
    gap: 8px;

    flex: 0 0 auto;
}

.gorun-wl-reco-arrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 32px;
    height: 32px;

    padding: 0;

    border: 1px solid var(--gp-line-cool);
    border-radius: 50%;

    background: #FFFFFF;

    color: var(--gp-ink);

    cursor: pointer;

    transition:
        border-color .2s ease,
        background .2s ease,
        opacity .2s ease;
}

.gorun-wl-reco-arrow:hover:not(:disabled) {
    border-color: var(--gp-gold);

    background: var(--gp-gold-wash);
}

.gorun-wl-reco-arrow:disabled {
    opacity: .35;

    cursor: default;
}

.gorun-wl-reco-arrow svg {
    width: 15px;
    height: 15px;
}

.gorun-wl-reco-track {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: calc((100% - 40px) / 3);
    gap: 20px;

    overflow-x: auto;

    scroll-snap-type: x mandatory;

    /* The scrollbar would sit under the cards. */
    scrollbar-width: none;
}

.gorun-wl-reco-track::-webkit-scrollbar {
    display: none;
}

.gorun-wl-reco-card {
    display: flex;
    flex-direction: column;

    overflow: hidden;

    border: 1px solid var(--gp-line-cool);
    border-radius: 12px;

    background: #FFFFFF;

    scroll-snap-align: start;

    transition:
        border-color .22s ease,
        box-shadow .22s ease;
}

.gorun-wl-reco-card:hover {
    border-color: var(--gp-gold);

    box-shadow: 0 10px 24px rgba(27, 28, 28, .08);
}

.gorun-wl-reco-media {
    position: relative;
}

.gorun-wl-reco-thumb {
    display: block;

    aspect-ratio: 16 / 10;

    overflow: hidden;

    background: var(--gp-soft);
}

.gorun-wl-reco-img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;
}

.gorun-wl-reco-body {
    display: flex;
    flex-direction: column;
    gap: 5px;

    flex: 1 1 auto;

    padding: 14px 16px 16px;
}

.gorun-wl-reco-cat {
    color: var(--gp-muted);

    font-size: 10px;
    font-weight: 500;
    line-height: 1.2;

    letter-spacing: .1em;
    text-transform: uppercase;
}

.gorun-wl-reco-title {
    margin: 0;

    font-size: 14px;
    font-weight: 600;
    line-height: 1.4;
}

.gorun-wl-reco-title a {
    color: var(--gp-ink);

    text-decoration: none;
}

.gorun-wl-reco-title a:hover {
    color: var(--gp-gold-dark);
}

.gorun-wl-reco-price {
    color: var(--gp-ink);

    font-size: 15px;
    font-weight: 700;
    line-height: 1.3;
}

.gorun-wl-reco-price del {
    margin-right: 5px;

    color: var(--gp-muted);

    font-size: 12px;
    font-weight: 500;
}

.gorun-wl-reco-price ins {
    text-decoration: none;
}

.gorun-wl-reco-btn {
    margin-top: 10px;

    padding: 8px 14px;

    border-color: var(--gp-gold);

    color: var(--gp-gold-dark);

    font-size: 12px;
}


/* ==========================================
   RESPONSIVE
   ========================================== */

@media (max-width: 1024px) {

    .gorun-wl-item {
        grid-template-columns: 180px minmax(0, 1fr) 190px;
        gap: 16px;
    }

    .gorun-wl-reco-track {
        grid-auto-columns: calc((100% - 20px) / 2);
    }

}

@media (max-width: 860px) {

    .gorun-wl-item {
        grid-template-columns: 160px minmax(0, 1fr);
    }

    /* The price column drops below both, full width. */
    .gorun-wl-item-buy {
        grid-column: 1 / -1;

        padding-top: 14px;

        border-top: 1px solid var(--gp-line-cool);
    }

    .gorun-wl-item-buy .gorun-wl-btn-primary {
        margin-top: 12px;
    }

    .gorun-wl-price {
        font-size: 22px;
    }

}

@media (max-width: 600px) {

    .gorun-wl-item {
        grid-template-columns: minmax(0, 1fr);
    }

    .gorun-wl-thumb {
        aspect-ratio: 16 / 10;
    }

    .gorun-wl-specs {
        grid-template-columns: minmax(0, 1fr);
    }

    .gorun-wl-search {
        flex: 1 1 100%;
    }

    .gorun-wl-reco-track {
        grid-auto-columns: 78%;
    }

    .gorun-wl-heading {
        font-size: 22px;
    }

}


/* ==========================================================
   MY ACCOUNT SHELL
   ==========================================================

   WooCommerce renders the account page as a navigation list
   plus a content block. This turns that pair into the sidebar
   and panel the wishlist was designed to sit in.
   ========================================================== */

.woocommerce-account .woocommerce {
    --gp-gold: #FDB813;
    --gp-gold-wash: #FFF8E7;
    --gp-gold-dark: #B78300;
    --gp-ink: #1B1C1C;
    --gp-muted: #8A8A8A;
    --gp-line-cool: #E8E8E6;

    display: grid;
    grid-template-columns: 232px minmax(0, 1fr);
    column-gap: 30px;
    row-gap: 0;
    align-items: start;

    max-width: 1340px;
    margin: 0 auto;
    padding: 40px 20px 64px;
}

.woocommerce-account .woocommerce *,
.woocommerce-account .woocommerce *::before,
.woocommerce-account .woocommerce *::after {
    box-sizing: border-box;
}

/*
 * WooCommerce opens the account markup with a notices wrapper
 * that is empty far more often than not, and a plugin is free
 * to add wrappers of its own. Anything that is not the sidebar
 * or the panel is given the full width and left in row 1, and
 * the two columns are placed by hand into row 2 - so an extra
 * child can never shunt the layout sideways again.
 */
.woocommerce-account .woocommerce > * {
    grid-column: 1 / -1;
}

.woocommerce-account .woocommerce > .woocommerce-notices-wrapper {
    margin: 0 0 20px;
}

/* No notice to show - do not reserve a row for it. */
.woocommerce-account .woocommerce > .woocommerce-notices-wrapper:empty {
    display: none;
}

.woocommerce-account .woocommerce > .gorun-account-nav,
.woocommerce-account .woocommerce > .woocommerce-MyAccount-navigation {
    grid-row: 2;
    grid-column: 1;
}

.woocommerce-account .woocommerce > .woocommerce-MyAccount-content {
    grid-row: 2;
    grid-column: 2;
}

/* The login screen has no navigation, so it should not be caged. */
.woocommerce-account:not(.logged-in) .woocommerce {
    display: block;

    max-width: 560px;
}


/* SIDEBAR */

/*
 * The card lives on the wrapper so the label sits inside it.
 * The nav itself is left plain - and still carries the card
 * on its own if the wrapper is ever not there.
 */
.woocommerce-account .gorun-account-nav {
    position: sticky;
    top: 24px;

    padding: 16px 12px;

    border: 1px solid var(--gp-line-cool);
    border-radius: 14px;

    background: #FFFFFF;
    box-shadow: 0 8px 24px rgba(27, 28, 28, .05);
}

.woocommerce-account .woocommerce-MyAccount-navigation {
    position: sticky;
    top: 24px;

    width: auto;
    float: none;

    padding: 16px 12px;

    border: 1px solid var(--gp-line-cool);
    border-radius: 14px;

    background: #FFFFFF;
    box-shadow: 0 8px 24px rgba(27, 28, 28, .05);
}

/* Inside the wrapper the nav is just a list. */
.woocommerce-account .gorun-account-nav .woocommerce-MyAccount-navigation {
    position: static;

    padding: 0;

    border: 0;
    border-radius: 0;

    background: none;
    box-shadow: none;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul {
    margin: 0;
    padding: 0;

    list-style: none;
}

.woocommerce-account .woocommerce-MyAccount-navigation li {
    margin: 0 0 2px;
}

.woocommerce-account .woocommerce-MyAccount-navigation li a {
    display: block;

    padding: 11px 14px;

    border-radius: 10px;

    color: #55575A;

    font-size: 13.5px;
    font-weight: 500;
    line-height: 1.4;

    text-decoration: none;

    transition:
        background .2s ease,
        color .2s ease;
}

.woocommerce-account .woocommerce-MyAccount-navigation li a:hover {
    background: #F6F6F4;

    color: var(--gp-ink);
}

.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a {
    background: var(--gp-gold-wash);

    color: var(--gp-gold-dark);
    font-weight: 600;
}


/* PANEL */

.woocommerce-account .woocommerce-MyAccount-content {
    width: auto;
    float: none;

    padding: 28px 30px 34px;

    border: 1px solid var(--gp-line-cool);
    border-radius: 14px;

    background: #FFFFFF;
    box-shadow: 0 8px 24px rgba(27, 28, 28, .05);
}

/* The shortcode brings its own width, the panel already caps it. */
.woocommerce-account .woocommerce-MyAccount-content .gorun-wl {
    max-width: none;
}

@media (max-width: 900px) {

    .woocommerce-account .woocommerce {
        grid-template-columns: minmax(0, 1fr);
        row-gap: 18px;

        padding: 24px 16px 48px;
    }

    /*
     * One column, so the hand placement above has to go -
     * `grid-column: 2` would invent a second column.
     */
    .woocommerce-account .woocommerce > .gorun-account-nav,
    .woocommerce-account .woocommerce > .woocommerce-MyAccount-navigation,
    .woocommerce-account .woocommerce > .woocommerce-MyAccount-content {
        grid-row: auto;
        grid-column: 1 / -1;
    }

    .woocommerce-account .gorun-account-nav,
    .woocommerce-account .woocommerce-MyAccount-navigation {
        position: static;
    }

    .woocommerce-account .woocommerce-MyAccount-navigation ul {
        display: flex;
        flex-wrap: wrap;
        gap: 6px;
    }

    .woocommerce-account .woocommerce-MyAccount-navigation li {
        margin: 0;
    }

    .woocommerce-account .woocommerce-MyAccount-content {
        padding: 22px 18px 26px;
    }

}

/*
 * The filters hide rows with the `hidden` attribute, and the
 * UA rule behind it loses to the row's own `display: grid`.
 */
.gorun-wl [hidden] {
    display: none;
}


/* ==========================================
   ACCOUNT SIDEBAR - LABEL AND ICONS
   ==========================================

   The icons are masks rather than background
   images, so each one inherits its link colour
   and turns gold along with the label beside it.

   Every selector below carries the full nav
   prefix - the shared rule that sets the
   fallback icon would otherwise outweigh the
   per endpoint ones and flatten them all to a
   circle.
   ========================================== */

.gorun-account-nav-label {
    display: block;

    margin: 4px 0 12px;
    padding: 0 14px;

    color: #1B1C1C;

    font-size: 15px;
    font-weight: 700;
    line-height: 1.3;
}

.woocommerce-account .woocommerce-MyAccount-navigation li a {
    display: flex;
    align-items: center;
    gap: 10px;
}

.woocommerce-account .woocommerce-MyAccount-navigation li a::before {
    content: "";

    flex: 0 0 auto;

    width: 17px;
    height: 17px;

    background-color: currentColor;

    -webkit-mask-position: center;
            mask-position: center;

    -webkit-mask-repeat: no-repeat;
            mask-repeat: no-repeat;

    -webkit-mask-size: 100% 100%;
            mask-size: 100% 100%;

    opacity: .72;

    /* Fallback, for any endpoint a plugin adds. */
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7'%3E%3Ccircle cx='12' cy='12' r='7'/%3E%3C/svg%3E");
            mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7'%3E%3Ccircle cx='12' cy='12' r='7'/%3E%3C/svg%3E");
}

.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a::before {
    opacity: 1;
}

/* DASHBOARD */
.woocommerce-account .woocommerce-MyAccount-navigation li.woocommerce-MyAccount-navigation-link--dashboard a::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linejoin='round'%3E%3Crect x='4' y='4' width='6.5' height='6.5' rx='1.4'/%3E%3Crect x='13.5' y='4' width='6.5' height='6.5' rx='1.4'/%3E%3Crect x='4' y='13.5' width='6.5' height='6.5' rx='1.4'/%3E%3Crect x='13.5' y='13.5' width='6.5' height='6.5' rx='1.4'/%3E%3C/svg%3E");
            mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linejoin='round'%3E%3Crect x='4' y='4' width='6.5' height='6.5' rx='1.4'/%3E%3Crect x='13.5' y='4' width='6.5' height='6.5' rx='1.4'/%3E%3Crect x='4' y='13.5' width='6.5' height='6.5' rx='1.4'/%3E%3Crect x='13.5' y='13.5' width='6.5' height='6.5' rx='1.4'/%3E%3C/svg%3E");
}

/* ORDERS */
.woocommerce-account .woocommerce-MyAccount-navigation li.woocommerce-MyAccount-navigation-link--orders a::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5.5 7.5h13l-1 11.5a1.6 1.6 0 01-1.6 1.4H8.1a1.6 1.6 0 01-1.6-1.4z'/%3E%3Cpath d='M9 7.5V6a3 3 0 016 0v1.5'/%3E%3C/svg%3E");
            mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5.5 7.5h13l-1 11.5a1.6 1.6 0 01-1.6 1.4H8.1a1.6 1.6 0 01-1.6-1.4z'/%3E%3Cpath d='M9 7.5V6a3 3 0 016 0v1.5'/%3E%3C/svg%3E");
}

/* WISHLIST */
.woocommerce-account .woocommerce-MyAccount-navigation li.woocommerce-MyAccount-navigation-link--wishlist a::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.3 5.9a4.7 4.7 0 00-6.7 0L12 7.5l-1.6-1.6a4.7 4.7 0 00-6.7 6.7l1.6 1.6L12 20.9l6.7-6.7 1.6-1.6a4.7 4.7 0 000-6.7z'/%3E%3C/svg%3E");
            mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.3 5.9a4.7 4.7 0 00-6.7 0L12 7.5l-1.6-1.6a4.7 4.7 0 00-6.7 6.7l1.6 1.6L12 20.9l6.7-6.7 1.6-1.6a4.7 4.7 0 000-6.7z'/%3E%3C/svg%3E");
}

/* DOWNLOADS */
.woocommerce-account .woocommerce-MyAccount-navigation li.woocommerce-MyAccount-navigation-link--downloads a::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4v10M8 10.5l4 4 4-4M5 19.5h14'/%3E%3C/svg%3E");
            mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4v10M8 10.5l4 4 4-4M5 19.5h14'/%3E%3C/svg%3E");
}

/* ADDRESSES */
.woocommerce-account .woocommerce-MyAccount-navigation li.woocommerce-MyAccount-navigation-link--edit-address a::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s6.8-5.4 6.8-10.8a6.8 6.8 0 10-13.6 0C5.2 15.6 12 21 12 21z'/%3E%3Ccircle cx='12' cy='10' r='2.4'/%3E%3C/svg%3E");
            mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s6.8-5.4 6.8-10.8a6.8 6.8 0 10-13.6 0C5.2 15.6 12 21 12 21z'/%3E%3Ccircle cx='12' cy='10' r='2.4'/%3E%3C/svg%3E");
}

/* PAYMENT METHODS */
.woocommerce-account .woocommerce-MyAccount-navigation li.woocommerce-MyAccount-navigation-link--payment-methods a::before {
    -webkit-mask-image: url("https://gorunsolar.com.au/wp-content/uploads/2026/09/ant-design_dollar-outlined.svg");
            mask-image: url("https://gorunsolar.com.au/wp-content/uploads/2026/09/ant-design_dollar-outlined.svg");
}

/* ACCOUNT DETAILS */
.woocommerce-account .woocommerce-MyAccount-navigation li.woocommerce-MyAccount-navigation-link--edit-account a::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8.4' r='3.8'/%3E%3Cpath d='M4.8 20a7.2 7.2 0 0114.4 0'/%3E%3C/svg%3E");
            mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8.4' r='3.8'/%3E%3Cpath d='M4.8 20a7.2 7.2 0 0114.4 0'/%3E%3C/svg%3E");
}

/* LOG OUT */
.woocommerce-account .woocommerce-MyAccount-navigation li.woocommerce-MyAccount-navigation-link--customer-logout a::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14.5 4.5h4a1.5 1.5 0 011.5 1.5v12a1.5 1.5 0 01-1.5 1.5h-4'/%3E%3Cpath d='M9.5 8L5.5 12l4 4M5.5 12h9'/%3E%3C/svg%3E");
            mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14.5 4.5h4a1.5 1.5 0 011.5 1.5v12a1.5 1.5 0 01-1.5 1.5h-4'/%3E%3Cpath d='M9.5 8L5.5 12l4 4M5.5 12h9'/%3E%3C/svg%3E");
}

@media (max-width: 900px) {

    .gorun-account-nav-label {
        display: none;
    }

}


/* ==========================================================
   GORUN SOLAR - ACCOUNT DASHBOARD
   ==========================================================

   Sits inside the account panel, so it brings cards and
   spacing but no page frame of its own.
   ========================================================== */

.gorun-dash {
    --gp-gold: #FDB813;
    --gp-gold-deep: #E19B00;
    --gp-gold-dark: #B78300;
    --gp-gold-wash: #FFF8E7;
    --gp-ink: #1B1C1C;
    --gp-muted: #8A8A8A;
    --gp-line-cool: #E8E8E6;
    --gp-soft: #F5F5F3;

    display: flex;
    flex-direction: column;
    gap: 18px;

    color: var(--gp-ink);
}

.gorun-dash *,
.gorun-dash *::before,
.gorun-dash *::after {
    box-sizing: border-box;
}


/* ==========================================
   GREETING
   ========================================== */

.gorun-dash-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
}

.gorun-dash-title {
    margin: 0 0 4px;

    font-size: 24px;
    font-weight: 700;
    line-height: 1.25;

    letter-spacing: -.015em;
}

.gorun-dash-sub {
    margin: 0;

    color: var(--gp-muted);

    font-size: 13.5px;
    line-height: 1.5;
}

.gorun-dash-head-tools {
    display: flex;
    align-items: center;
    gap: 8px;

    flex: 0 0 auto;
}

.gorun-dash-icon-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 34px;
    height: 34px;

    border: 1px solid var(--gp-line-cool);
    border-radius: 50%;

    background: #FFFFFF;

    color: var(--gp-muted);

    transition:
        border-color .2s ease,
        color .2s ease;
}

.gorun-dash-icon-btn:hover {
    border-color: var(--gp-gold);

    color: var(--gp-ink);
}

.gorun-dash-icon-btn svg {
    width: 16px;
    height: 16px;
}

.gorun-dash-avatar {
    display: block;

    width: 34px;
    height: 34px;

    overflow: hidden;

    border-radius: 50%;

    background: var(--gp-soft);
}

.gorun-dash-avatar img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;
}


/* ==========================================
   CARDS
   ========================================== */

.gorun-dash-row {
    display: grid;
    gap: 18px;
}

.gorun-dash-row-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

/* The wishlist strip leads, the offer sits beside it. */
.gorun-dash-row-wish {
    grid-template-columns: minmax(0, 1.65fr) minmax(0, 1fr);
}

.gorun-dash-card {
    display: flex;
    flex-direction: column;

    padding: 20px 22px 22px;

    border: 1px solid var(--gp-line-cool);
    border-radius: 12px;

    background: #FFFFFF;
}

.gorun-dash-card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;

    margin-bottom: 14px;
}

.gorun-dash-card-title {
    display: flex;
    align-items: center;
    gap: 8px;

    margin: 0;

    font-size: 15px;
    font-weight: 700;
    line-height: 1.3;
}

.gorun-dash-card-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 26px;
    height: 26px;

    border-radius: 7px;

    background: var(--gp-gold-wash);

    color: var(--gp-gold-dark);
}

.gorun-dash-card-icon svg {
    width: 14px;
    height: 14px;
}

.gorun-dash-count {
    color: var(--gp-muted);

    font-size: 12px;
    font-weight: 400;
}

.gorun-dash-pill {
    display: inline-flex;
    align-items: center;
    gap: 5px;

    flex: 0 0 auto;

    padding: 4px 10px;

    border-radius: 999px;

    background: var(--gp-soft);

    color: #5C5C5C;

    font-size: 10.5px;
    font-weight: 500;
    line-height: 1.3;
}

.gorun-dash-pill svg {
    width: 11px;
    height: 11px;

    color: var(--gp-gold-deep);
}

/* The gold text link with the arrow. */
.gorun-dash-link {
    display: inline-flex;
    align-items: center;
    gap: 5px;

    flex: 0 0 auto;

    color: var(--gp-gold-dark);

    font-size: 12.5px;
    font-weight: 600;
    line-height: 1.3;

    text-decoration: none;

    transition: gap .2s ease;
}

.gorun-dash-link:hover {
    gap: 9px;

    color: var(--gp-gold-deep);
}

.gorun-dash-empty {
    margin: 0;

    color: var(--gp-muted);

    font-size: 13px;
    line-height: 1.6;
}


/* ACCOUNT INFORMATION */

.gorun-dash-name {
    margin: 0 0 10px;

    font-size: 14.5px;
    font-weight: 600;
    line-height: 1.3;
}

.gorun-dash-facts {
    margin: 0 0 16px;
    padding: 0;

    list-style: none;

    display: flex;
    flex-direction: column;
    gap: 8px;
}

.gorun-dash-facts li {
    display: flex;
    align-items: center;
    gap: 9px;

    color: #5C5C5C;

    font-size: 13px;
    line-height: 1.4;

    /* An address can be longer than the card is wide. */
    overflow-wrap: anywhere;
}

.gorun-dash-facts svg {
    flex: 0 0 auto;

    width: 15px;
    height: 15px;

    color: var(--gp-muted);
}

/*
 * Pushes the link to the foot however tall the card grows.
 *
 * Direct children only - the links inside a card header and
 * inside an order row are also last in their own parent, and
 * would be dragged out of line by this.
 */
.gorun-dash-card > .gorun-dash-link:last-child {
    margin-top: auto;
    padding-top: 4px;

    align-self: flex-start;
}


/* SAVED ADDRESS */

.gorun-dash-address {
    margin: 0 0 16px;

    color: #5C5C5C;

    font-size: 13px;
    font-style: normal;
    line-height: 1.7;
}


/* ==========================================
   RECENT ORDERS
   ========================================== */

.gorun-dash-order-list {
    display: flex;
    flex-direction: column;

    margin: 0;
    padding: 0;

    list-style: none;
}

.gorun-dash-order {
    display: grid;
    grid-template-columns:
        minmax(96px, auto)
        minmax(0, 1fr)
        auto
        auto
        auto;
    gap: 14px;
    align-items: center;

    padding: 12px 0;

    border-top: 1px solid var(--gp-line-cool);
}

.gorun-dash-order:first-child {
    border-top: 0;

    padding-top: 0;
}

.gorun-dash-order-meta {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.gorun-dash-order-number {
    font-size: 12.5px;
    font-weight: 600;
    line-height: 1.3;
}

.gorun-dash-order-date {
    color: var(--gp-muted);

    font-size: 11px;
    line-height: 1.3;
}

.gorun-dash-order-summary {
    color: #5C5C5C;

    font-size: 13px;
    line-height: 1.4;
}

.gorun-dash-order-total {
    font-size: 13.5px;
    font-weight: 700;
    line-height: 1.3;

    text-align: right;

    white-space: nowrap;
}

.gorun-dash-status {
    display: inline-flex;
    align-items: center;

    padding: 4px 11px;

    border-radius: 999px;

    font-size: 10.5px;
    font-weight: 600;
    line-height: 1.4;

    white-space: nowrap;
}

.gorun-dash-status.is-good {
    background: #E8F6EC;

    color: #1E7B3C;
}

.gorun-dash-status.is-busy {
    background: var(--gp-gold-wash);

    color: #8A6100;
}

.gorun-dash-status.is-idle {
    background: var(--gp-soft);

    color: #6B6B6B;
}

.gorun-dash-status.is-bad {
    background: #FCEAEA;

    color: #B3261E;
}


/* ==========================================
   WISHLIST STRIP
   ========================================== */

.gorun-dash-wish-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.gorun-dash-wish-card {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.gorun-dash-wish-media {
    position: relative;

    overflow: hidden;

    border-radius: 10px;

    background: var(--gp-soft);
}

.gorun-dash-wish-media > a {
    display: block;

    aspect-ratio: 4 / 3;
}

.gorun-dash-wish-img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;
}

/* The heart reuses the wishlist button, at a smaller size. */
.gorun-dash-wish-media .gorun-wl-heart {
    top: 7px;
    right: 7px;

    width: 26px;
    height: 26px;
}

.gorun-dash-wish-media .gorun-wl-heart svg {
    width: 13px;
    height: 13px;
}

.gorun-dash-wish-title {
    margin: 0;

    font-size: 12.5px;
    font-weight: 600;
    line-height: 1.4;
}

.gorun-dash-wish-title a {
    color: var(--gp-ink);

    text-decoration: none;
}

.gorun-dash-wish-title a:hover {
    color: var(--gp-gold-dark);
}

.gorun-dash-wish-price {
    color: var(--gp-ink);

    font-size: 13px;
    font-weight: 700;
    line-height: 1.3;
}

.gorun-dash-wish-price del {
    margin-right: 4px;

    color: var(--gp-muted);

    font-size: 11px;
    font-weight: 500;
}

.gorun-dash-wish-price ins {
    text-decoration: none;
}


/* ==========================================
   OFFER
   ========================================== */

.gorun-dash-offer {
    display: flex;
    flex-direction: column;

    padding: 20px 22px 22px;

    border-radius: 12px;

    background:
        linear-gradient(
            152deg,
            #FFC942 0%,
            var(--gp-gold) 46%,
            var(--gp-gold-deep) 100%
        );

    color: var(--gp-ink);
}

.gorun-dash-offer-eyebrow {
    margin-bottom: 8px;

    font-size: 10px;
    font-weight: 700;
    line-height: 1.2;

    letter-spacing: .12em;
    text-transform: uppercase;

    opacity: .72;
}

.gorun-dash-offer-title {
    margin: 0 0 8px;

    font-size: 17px;
    font-weight: 700;
    line-height: 1.32;

    letter-spacing: -.01em;
}

.gorun-dash-offer-text {
    margin: 0 0 18px;

    font-size: 12.5px;
    line-height: 1.6;

    opacity: .82;
}

.gorun-dash-offer-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;

    margin-top: auto;
    align-self: flex-start;

    padding: 9px 18px;

    border-radius: 8px;

    background: #FFFFFF;

    color: var(--gp-ink);

    font-size: 12.5px;
    font-weight: 600;
    line-height: 1.3;

    text-decoration: none;

    transition:
        gap .2s ease,
        transform .2s ease;
}

.gorun-dash-offer-btn:hover {
    gap: 10px;

    color: var(--gp-ink);

    transform: translateY(-1px);
}


/* ==========================================
   RESPONSIVE
   ========================================== */

@media (max-width: 1024px) {

    .gorun-dash-row-wish {
        grid-template-columns: minmax(0, 1fr);
    }

}

@media (max-width: 780px) {

    .gorun-dash-row-2 {
        grid-template-columns: minmax(0, 1fr);
    }

    /*
     * Five columns will not fit - the order becomes two lines,
     * with the status and total kept together on the second.
     */
    .gorun-dash-order {
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 6px 12px;
    }

    .gorun-dash-order-summary {
        grid-column: 1 / -1;

        order: 3;
    }

    .gorun-dash-status {
        justify-self: end;

        order: 2;
    }

    .gorun-dash-order-total {
        order: 4;

        text-align: left;
    }

    .gorun-dash-order-link {
        justify-self: end;

        order: 5;
    }

}

@media (max-width: 560px) {

    .gorun-dash-head {
        flex-direction: column;
    }

    .gorun-dash-title {
        font-size: 20px;
    }

    .gorun-dash-wish-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

}


/* ==========================================================
   GORUN SOLAR - ACCOUNT ORDERS
   ========================================================== */

.gorun-orders {
    --gp-gold: #FDB813;
    --gp-gold-deep: #E19B00;
    --gp-gold-dark: #B78300;
    --gp-gold-wash: #FFF8E7;
    --gp-ink: #1B1C1C;
    --gp-muted: #8A8A8A;
    --gp-line-cool: #E8E8E6;
    --gp-soft: #F5F5F3;

    color: var(--gp-ink);
}

.gorun-orders *,
.gorun-orders *::before,
.gorun-orders *::after {
    box-sizing: border-box;
}


/* ==========================================
   TOOLBAR
   ========================================== */

.gorun-orders-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;

    margin-bottom: 14px;
}

.gorun-orders-search {
    position: relative;

    display: flex;
    align-items: center;

    flex: 1 1 260px;
}

.gorun-orders-search svg {
    position: absolute;
    left: 14px;

    width: 15px;
    height: 15px;

    color: var(--gp-muted);

    pointer-events: none;
}

.gorun-orders-search-input {
    width: 100%;

    padding: 10px 16px 10px 38px;

    border: 1px solid var(--gp-line-cool);
    border-radius: 999px;

    background: #FFFFFF;

    color: var(--gp-ink);

    font-size: 13px;
    line-height: 1.4;
}

.gorun-orders-search-input:focus {
    outline: none;

    border-color: var(--gp-gold);

    box-shadow: 0 0 0 3px rgba(253, 184, 19, .18);
}

.gorun-orders-sort {
    display: inline-flex;
    align-items: center;
    gap: 6px;

    flex: 0 0 auto;

    color: var(--gp-muted);

    font-size: 12.5px;
}

.gorun-orders-sort-select {
    padding: 9px 30px 9px 12px;

    border: 1px solid var(--gp-line-cool);
    border-radius: 8px;

    background: #FFFFFF;

    color: var(--gp-ink);

    font-size: 12.5px;
    font-weight: 500;

    cursor: pointer;
}


/* ==========================================
   STATUS CHIPS
   ========================================== */

.gorun-orders-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;

    margin-bottom: 18px;
}

.gorun-orders-chip {
    padding: 7px 16px;

    border: 1px solid var(--gp-line-cool);
    border-radius: 999px;

    background: #FFFFFF;

    color: var(--gp-ink);

    font-size: 12px;
    font-weight: 500;
    line-height: 1.3;

    cursor: pointer;

    transition:
        background .2s ease,
        border-color .2s ease;
}

.gorun-orders-chip:hover {
    border-color: var(--gp-gold);
}

.gorun-orders-chip.is-active {
    border-color: var(--gp-gold);

    background: var(--gp-gold);

    font-weight: 600;
}


/* ==========================================
   ORDER CARD
   ========================================== */

.gorun-orders-list {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.gorun-orders-card {
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr) auto;
    gap: 16px;

    padding: 18px 20px;

    border: 1px solid var(--gp-line-cool);
    border-radius: 12px;

    background: #FFFFFF;

    transition:
        border-color .22s ease,
        box-shadow .22s ease;
}

.gorun-orders-card:hover {
    border-color: var(--gp-gold);

    box-shadow: 0 12px 26px rgba(27, 28, 28, .07);
}

.gorun-orders-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 46px;
    height: 46px;

    border-radius: 10px;

    background: var(--gp-gold-wash);

    color: var(--gp-gold-deep);
}

.gorun-orders-icon svg {
    width: 20px;
    height: 20px;
}

.gorun-orders-body {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 5px;

    min-width: 0;
}

.gorun-orders-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;

    color: var(--gp-muted);

    font-size: 11px;
    line-height: 1.3;
}

.gorun-orders-number {
    font-weight: 600;

    letter-spacing: .02em;
}

.gorun-orders-title {
    margin: 0;

    font-size: 15px;
    font-weight: 700;
    line-height: 1.35;
}

.gorun-orders-title a {
    color: var(--gp-ink);

    text-decoration: none;
}

.gorun-orders-title a:hover {
    color: var(--gp-gold-dark);
}

.gorun-orders-summary {
    margin: 0;

    color: var(--gp-muted);

    font-size: 12.5px;
    line-height: 1.5;
}

.gorun-orders-status {
    display: inline-flex;
    align-items: center;
    gap: 6px;

    margin-top: 3px;
    padding: 4px 11px;

    border-radius: 999px;

    font-size: 10.5px;
    font-weight: 600;
    line-height: 1.4;
}

.gorun-orders-status-dot {
    width: 5px;
    height: 5px;

    border-radius: 50%;

    background: currentColor;
}

.gorun-orders-status.is-good {
    background: #E8F6EC;

    color: #1E7B3C;
}

.gorun-orders-status.is-busy {
    background: var(--gp-gold-wash);

    color: #8A6100;
}

.gorun-orders-status.is-idle {
    background: var(--gp-soft);

    color: #6B6B6B;
}

.gorun-orders-status.is-bad {
    background: #FCEAEA;

    color: #B3261E;
}


/* BUY COLUMN */

.gorun-orders-buy {
    display: flex;
    flex-direction: column;
    align-items: stretch;

    min-width: 150px;

    text-align: right;
}

.gorun-orders-total {
    font-size: 20px;
    font-weight: 700;
    line-height: 1.2;

    letter-spacing: -.015em;
}

.gorun-orders-note {
    margin-top: 2px;

    color: var(--gp-muted);

    font-size: 10.5px;
    line-height: 1.4;
}

.gorun-orders-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    padding: 9px 18px;

    border: 1px solid transparent;
    border-radius: 8px;

    font-size: 12.5px;
    font-weight: 600;
    line-height: 1.3;

    text-align: center;
    text-decoration: none;

    cursor: pointer;

    transition:
        background .2s ease,
        border-color .2s ease,
        transform .2s ease;
}

.gorun-orders-btn-primary {
    border-color: var(--gp-gold);

    background: var(--gp-gold);

    color: var(--gp-ink);
}

.gorun-orders-btn-primary:hover {
    border-color: var(--gp-gold-deep);

    background: var(--gp-gold-deep);

    color: var(--gp-ink);

    transform: translateY(-1px);
}

.gorun-orders-btn-ghost {
    border-color: var(--gp-line-cool);

    background: #FFFFFF;

    color: var(--gp-ink);
}

.gorun-orders-btn-ghost:hover {
    border-color: var(--gp-gold);

    background: var(--gp-gold-wash);

    color: var(--gp-ink);
}

.gorun-orders-buy .gorun-orders-btn-primary {
    margin-top: 10px;
}

.gorun-orders-invoice {
    margin-top: 7px;

    color: var(--gp-muted);

    font-size: 11.5px;
    font-weight: 500;

    text-decoration: none;
}

.gorun-orders-invoice:hover {
    color: var(--gp-ink);

    text-decoration: underline;
}


/* ==========================================
   PAGINATION, EMPTY AND NO MATCH
   ========================================== */

.gorun-orders-no-match {
    margin: 22px 0 0;

    color: var(--gp-muted);

    font-size: 14px;
    text-align: center;
}

.gorun-orders-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;

    margin-top: 22px;
}

.gorun-orders-page {
    padding: 8px 16px;

    border: 1px solid var(--gp-line-cool);
    border-radius: 8px;

    color: var(--gp-ink);

    font-size: 12.5px;
    font-weight: 600;

    text-decoration: none;
}

.gorun-orders-page:hover {
    border-color: var(--gp-gold);

    background: var(--gp-gold-wash);

    color: var(--gp-ink);
}

.gorun-orders-page-of {
    color: var(--gp-muted);

    font-size: 12.5px;
}

.gorun-orders-empty {
    display: flex;
    flex-direction: column;
    align-items: center;

    padding: 52px 24px;

    border: 1px dashed var(--gp-line-cool);
    border-radius: 12px;

    text-align: center;
}

.gorun-orders-empty-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 54px;
    height: 54px;

    margin-bottom: 14px;

    border-radius: 50%;

    background: var(--gp-gold-wash);

    color: var(--gp-gold-deep);
}

.gorun-orders-empty-icon svg {
    width: 25px;
    height: 25px;
}

.gorun-orders-empty-text {
    max-width: 380px;
    margin: 0 0 18px;

    color: var(--gp-muted);

    font-size: 13.5px;
    line-height: 1.6;
}


/* ==========================================
   MANAGE YOUR ORDERS
   ========================================== */

.gorun-orders-manage {
    margin-top: 34px;
    padding-top: 28px;

    border-top: 1px solid var(--gp-line-cool);
}

.gorun-orders-manage-title {
    margin: 0 0 4px;

    font-size: 16px;
    font-weight: 700;
    line-height: 1.3;
}

.gorun-orders-manage-text {
    margin: 0 0 18px;

    color: var(--gp-muted);

    font-size: 13px;
    line-height: 1.5;
}

.gorun-orders-manage-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.gorun-orders-action {
    display: flex;
    flex-direction: column;
    align-items: flex-start;

    padding: 18px 20px 20px;

    border: 1px solid var(--gp-line-cool);
    border-radius: 12px;

    background: #FFFFFF;
}

.gorun-orders-action-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 34px;
    height: 34px;

    margin-bottom: 12px;

    border-radius: 9px;

    background: var(--gp-gold-wash);

    color: var(--gp-gold-deep);
}

.gorun-orders-action-icon svg {
    width: 16px;
    height: 16px;
}

.gorun-orders-action-title {
    margin: 0 0 5px;

    font-size: 13.5px;
    font-weight: 700;
    line-height: 1.3;
}

.gorun-orders-action-text {
    margin: 0 0 16px;

    color: var(--gp-muted);

    font-size: 12px;
    line-height: 1.55;
}

/* Keeps every button on the same line however long the copy. */
.gorun-orders-action .gorun-orders-btn {
    margin-top: auto;
}


/* ==========================================
   RESPONSIVE
   ========================================== */

@media (max-width: 860px) {

    .gorun-orders-manage-grid {
        grid-template-columns: minmax(0, 1fr);
    }

}

@media (max-width: 680px) {

    .gorun-orders-card {
        grid-template-columns: 46px minmax(0, 1fr);
    }

    /* The price drops under both and lines up left. */
    .gorun-orders-buy {
        grid-column: 1 / -1;

        align-items: flex-start;

        padding-top: 12px;

        border-top: 1px solid var(--gp-line-cool);

        text-align: left;
    }

    .gorun-orders-buy .gorun-orders-btn-primary {
        align-self: stretch;
    }

    .gorun-orders-sort {
        flex: 1 1 100%;
    }

    .gorun-orders-sort-select {
        flex: 1 1 auto;
    }

}


/* ==========================================================
   GORUN SOLAR - ACCOUNT PROFILE
   ========================================================== */

.gorun-profile {
    --gp-gold: #FDB813;
    --gp-gold-deep: #E19B00;
    --gp-gold-dark: #B78300;
    --gp-gold-wash: #FFF8E7;
    --gp-ink: #1B1C1C;
    --gp-muted: #8A8A8A;
    --gp-line-cool: #E8E8E6;
    --gp-soft: #F5F5F3;
    --gp-danger: #C6303B;

    display: flex;
    flex-direction: column;
    gap: 18px;

    color: var(--gp-ink);
}

.gorun-profile *,
.gorun-profile *::before,
.gorun-profile *::after {
    box-sizing: border-box;
}


/* ==========================================
   HEAD
   ========================================== */

.gorun-profile-heading {
    margin: 0 0 5px;

    font-size: 22px;
    font-weight: 700;
    line-height: 1.25;

    letter-spacing: -.015em;
}

.gorun-profile-sub {
    margin: 0;

    color: var(--gp-muted);

    font-size: 13.5px;
    line-height: 1.55;
}


/* ==========================================
   CARDS
   ========================================== */

.gorun-profile-card {
    padding: 22px 24px 24px;

    border: 1px solid var(--gp-line-cool);
    border-radius: 12px;

    background: #FFFFFF;
}

.gorun-profile-card-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
}

.gorun-profile-card-title {
    margin: 0 0 4px;

    font-size: 15.5px;
    font-weight: 700;
    line-height: 1.3;
}

.gorun-profile-card-text {
    margin: 0 0 18px;

    color: var(--gp-muted);

    font-size: 12.5px;
    line-height: 1.55;
}

.gorun-profile-empty {
    margin: 0;

    color: var(--gp-muted);

    font-size: 13px;
}


/* ==========================================
   IDENTITY
   ========================================== */

.gorun-profile-identity {
    display: flex;
    align-items: center;
    gap: 14px;
}

.gorun-profile-avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    flex: 0 0 auto;

    width: 46px;
    height: 46px;

    border-radius: 50%;

    background: var(--gp-gold);

    color: var(--gp-ink);

    font-size: 15px;
    font-weight: 700;

    letter-spacing: .02em;
}

.gorun-profile-identity-body {
    flex: 1 1 auto;

    min-width: 0;
}

.gorun-profile-name {
    margin: 0 0 3px;

    font-size: 15px;
    font-weight: 700;
    line-height: 1.3;
}

.gorun-profile-since {
    color: var(--gp-muted);

    font-size: 12px;
    line-height: 1.3;
}

.gorun-profile-photo-btn {
    display: none;
    flex: 0 0 auto;

    padding: 8px 16px;

    border: 1px solid var(--gp-line-cool);
    border-radius: 8px;

    color: var(--gp-ink);

    font-size: 12.5px;
    font-weight: 600;

    text-decoration: none;

    transition:
        border-color .2s ease,
        background .2s ease;
}

.gorun-profile-photo-btn:hover {
    border-color: var(--gp-gold);

    background: var(--gp-gold-wash);

    color: var(--gp-ink);
}


/* ==========================================
   FIELDS
   ========================================== */

.gorun-field-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px 16px;
}

.gorun-field.is-wide {
    grid-column: 1 / -1;
}

.gorun-field {
    display: flex;
    flex-direction: column;
    gap: 6px;

    min-width: 0;
}

.gorun-field-label {
    color: #5C5C5C;

    font-size: 12px;
    font-weight: 500;
    line-height: 1.3;
}

.gorun-field-input {
    width: 100%;

    padding: 10px 14px;

    border: 1px solid var(--gp-line-cool);
    border-radius: 8px;

    background: #FFFFFF;

    color: var(--gp-ink);

    font-family: inherit;
    font-size: 13px;
    line-height: 1.4;
}

.gorun-field-input:focus {
    outline: none;

    border-color: var(--gp-gold);

    box-shadow: 0 0 0 3px rgba(253, 184, 19, .18);
}

.gorun-field-input::placeholder {
    color: #B4B4B0;
}

select.gorun-field-input {
    cursor: pointer;
}

.gorun-field-hint {
    color: var(--gp-muted);

    font-size: 11px;
    line-height: 1.45;
}


/* ==========================================
   FORM ACTIONS
   ========================================== */

.gorun-profile-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;

    margin-top: 18px;
}

.gorun-profile-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    padding: 10px 22px;

    border: 1px solid transparent;
    border-radius: 8px;

    font-family: inherit;
    font-size: 12.5px;
    font-weight: 600;
    line-height: 1.3;

    text-decoration: none;

    cursor: pointer;

    transition:
        background .2s ease,
        border-color .2s ease,
        color .2s ease,
        transform .2s ease;
}

.gorun-profile-btn-primary {
    border-color: var(--gp-gold);

    background: var(--gp-gold);

    color: var(--gp-ink);
}

.gorun-profile-btn-primary:hover {
    border-color: var(--gp-gold-deep);

    background: var(--gp-gold-deep);

    transform: translateY(-1px);
}

.gorun-profile-btn-ghost {
    border-color: var(--gp-line-cool);

    background: #FFFFFF;

    color: #5C5C5C;
}

.gorun-profile-btn-ghost:hover {
    border-color: var(--gp-muted);

    color: var(--gp-ink);
}


/* ==========================================
   PAYMENT METHODS
   ========================================== */

.gorun-profile-add {
    flex: 0 0 auto;

    color: var(--gp-gold-dark);

    font-size: 12.5px;
    font-weight: 600;

    text-decoration: none;
}

.gorun-profile-add:hover {
    color: var(--gp-gold-deep);
}

.gorun-profile-cards {
    display: flex;
    flex-direction: column;

    margin: 0;
    padding: 0;

    list-style: none;
}

.gorun-profile-card-row {
    display: flex;
    align-items: center;
    gap: 14px;

    padding: 14px 0;

    border-top: 1px solid var(--gp-line-cool);
}

.gorun-profile-card-row:first-child {
    border-top: 0;

    padding-top: 0;
}

.gorun-profile-card-brand {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    flex: 0 0 auto;

    width: 44px;
    height: 30px;

    border: 1px solid var(--gp-line-cool);
    border-radius: 6px;

    background: var(--gp-soft);

    font-size: 9.5px;
    font-weight: 700;

    letter-spacing: .04em;
}

.gorun-profile-card-info {
    display: flex;
    flex-direction: column;
    gap: 2px;

    flex: 1 1 auto;

    min-width: 0;
}

.gorun-profile-card-number {
    font-size: 13px;
    font-weight: 600;
    line-height: 1.3;
}

.gorun-profile-card-meta {
    color: var(--gp-muted);

    font-size: 11px;
    line-height: 1.3;
}

.gorun-profile-remove {
    flex: 0 0 auto;

    color: var(--gp-danger);

    font-size: 12px;
    font-weight: 500;

    text-decoration: none;
}

.gorun-profile-remove:hover {
    color: var(--gp-danger);

    text-decoration: underline;
}


/* ==========================================
   DELETE ACCOUNT
   ========================================== */

.gorun-profile-danger {
    border-color: #F2D4D6;
    display: none;
}

.gorun-profile-danger-title {
    color: var(--gp-danger);
}

.gorun-profile-danger-note {
    margin: 0 0 14px;

    color: var(--gp-muted);

    font-size: 11.5px;
    line-height: 1.55;
}

.gorun-profile-delete-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}

.gorun-profile-delete-input {
    flex: 0 1 240px;
}

.gorun-profile-btn-danger {
    flex: 0 0 auto;

    border-color: var(--gp-danger);

    background: #FFFFFF;

    color: var(--gp-danger);
}

.gorun-profile-btn-danger:hover {
    background: var(--gp-danger);

    color: #FFFFFF;
}


/* ==========================================
   RESPONSIVE
   ========================================== */

@media (max-width: 600px) {

    .gorun-field-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .gorun-profile-identity {
        flex-wrap: wrap;
    }

    .gorun-profile-actions {
        justify-content: stretch;
    }

    .gorun-profile-actions .gorun-profile-btn {
        flex: 1 1 auto;
    }

    .gorun-profile-delete-input {
        flex: 1 1 100%;
    }

}

/*
 * The order filters hide cards with the `hidden` attribute,
 * which the card's own `display: grid` would otherwise win.
 */
.gorun-orders [hidden] {
    display: none;
}

.your_solar_learning_journey .elementor-icon-box-wrapper {
    position: relative !important;
    /*min-height: 130px !important;*/
    padding: 12px 15px !important;
    /*background: #363738 !important;*/
    /*border-radius: 16p-7 !important;*/
}

.your_solar_learning_journey .elementor-icon-box-icon {
    position: absolute !important;
    top: -7px !important;
    left: 3px !important;
    margin: 0 !important;
    /*height:2em !important;*/
}


.your_solar_learning_journey .elementor-icon-box-title {
    margin: 30px 0 8px !important;
    /*color: #FDB813 !important;*/
    text-align: center !important;
}

.your_solar_learning_journey .elementor-icon-box-description {
    text-align: center !important;
    color: #fff !important;
}

/* Connector line */
.your_solar_learning_journey .elementor-element:not(:last-child)::after {
    content: "" !important;
    position: absolute !important;
    top: 25px !important;
    right: -10px !important;
    width: 20px !important;
    /*background: #FDB813 !important;*/
}

/* Mobile */
@media (max-width: 767px) {
    .your_solar_learning_journey .elementor-element::after {
        display: none !important;
    }
}

.resources_how_to_choose {
    position: relative !important;
}

.resources_how_to_choose:hover::after {
    content: "";
    position: absolute;
    bottom: 30px;
    left: 10px;
    right: 10px;
    height: 2px;
    background: #FFC72C;
}


/* =========================================
    Our Solar Product Range PRODUCT CAROUSEL ARROWS
   ========================================= */

.Slider_product_range {
    position: relative !important;
}

/* Previous Arrow */
.Slider_product_range .elementor-swiper-button-prev {
    position: absolute !important;
    top: 28px !important;
    left: auto !important;
    right: 80px !important;
    transform: none !important;
    z-index: 10 !important;
}

/* Next Arrow */
.Slider_product_range .elementor-swiper-button-next {
    position: absolute !important;
    top: 28px !important;
    right: 15px !important;
    transform: none !important;
    z-index: 10 !important;
}   

/* =========================================
   YOUR ENERGY NEEDS - HOVER
   ========================================= */


.your_energy_needs {
    transition: all 0.3s ease;
}


/* ICON */
.your_energy_needs:hover .your_energy_needs_icons svg,
.your_energy_needs:hover .your_energy_needs_icons svg path,
.your_energy_needs:hover .your_energy_needs_icons svg rect,
.your_energy_needs:hover .your_energy_needs_icons svg circle,
.your_energy_needs:hover .your_energy_needs_icons svg polygon,
.your_energy_needs:hover .your_energy_needs_icons svg polyline,
.your_energy_needs:hover .your_energy_needs_icons svg line {
    fill: #FDB813 !important;
    stroke: #FDB813 !important;
}


/* MIDDLE SVG / IMAGE */
.your_energy_needs:hover .your_energy_needs_image,
.your_energy_needs:hover .your_energy_needs_image svg {
    color: #FDB813 !important;
    /*fill: #FDB813 !important;*/
    fill: none !important;
    stroke: #FDB813 !important;
}


/* EXTERNAL SVG IMAGE */
.your_energy_needs:hover .your_energy_needs_icons img,
.your_energy_needs:hover .your_energy_needs_image img {
    filter: brightness(0) saturate(100%)
            invert(73%)
            sepia(97%)
            saturate(1100%)
            hue-rotate(359deg)
            brightness(103%)
            contrast(102%);
}


/* BUTTON */
.your_energy_needs:hover .your_energy_needs_button .elementor-button {
    background-color: #FDB813 !important;
    border-color: #FDB813 !important;
    /*color: #ffffff !important;*/
}




/* BUTTON ICON */
.your_energy_needs:hover .your_energy_needs_button .elementor-button-icon,
.your_energy_needs:hover .your_energy_needs_button .elementor-button-icon svg {
    color: #ffffff !important;
    fill: #ffffff !important;
    stroke: #ffffff !important;
}




/* ==========================================
   GORUN SOLAR - CART
   Shortcode: [gorun_cart]
   ========================================== */

.gorun-cart {
    --gp-gold: #FDB813;
    --gp-gold-deep: #E19B00;
    --gp-gold-dark: #B78300;
    --gp-ink: #1B1C1C;
    --gp-slate: #3F4654;
    --gp-muted: #8A8A8A;
    --gp-line: #EFE3C6;
    --gp-soft: #F0EEE8;

    position: relative;

    max-width: 1280px;
    margin: 0 auto;

    color: var(--gp-ink);

    font-family: inherit;
}

.gorun-cart *,
.gorun-cart *::before,
.gorun-cart *::after {
    box-sizing: border-box;
}

.gorun-cart button {
    font-family: inherit;
}


/* ==========================================
   HEADER
   ========================================== */

.gorun-cart-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;

    margin-bottom: 22px;
}

.gorun-cart-eyebrow {
    display: block;

    margin-bottom: 6px;

    color: var(--gp-gold-deep);

    font-size: 13px;
    font-weight: 700;
    line-height: 1.2;

    letter-spacing: .02em;
}

.gorun-cart-heading {
    margin: 0;

    color: var(--gp-ink);

    font-size: 30px;
    font-weight: 700;
    line-height: 1.2;
}

.gorun-cart-count {
    flex: 0 0 auto;

    padding: 7px 14px;

    border-radius: 8px;

    background: var(--gp-soft);
    color: #6B5A32;

    font-size: 13px;
    font-weight: 600;
}


/* ==========================================
   NOTICES
   ========================================== */

.gorun-cart-notices:empty {
    display: none;
}

.gorun-cart-notices {
    margin-bottom: 18px;
}

.gorun-cart-notices .woocommerce-message,
.gorun-cart-notices .woocommerce-info,
.gorun-cart-notices .woocommerce-error,
.gorun-cart-notices ul {
    margin: 0 0 10px;
    padding: 13px 42px;

    border: 1px solid var(--gp-line);
    border-left: 3px solid var(--gp-gold);
    border-radius: 10px;

    background: #FDF9EF;

    color: var(--gp-slate);

    font-size: 13px;

    list-style: none;
}

.gorun-cart-notices .woocommerce-error {
    border-left-color: #C0392B;

    background: #FDF1F0;

    color: #8E2E23;
}

/* WooCommerce puts a "View cart" link in its own notices, which
   is noise on the page the link points at. */
.gorun-cart-notices .button {
    display: none;
}


/* ==========================================
   LAYOUT
   ========================================== */

.gorun-cart-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 360px;
    gap: 26px;

    align-items: start;
}

.gorun-cart-main {
    min-width: 0;
}


/* ==========================================
   LINE ITEMS
   ========================================== */

.gorun-cart-items {
    padding: 0 22px;

    border: 1px solid var(--gp-line);
    border-radius: 18px;

    background: #FFFFFF;
}

.gorun-cart-item {
    display: grid;
    grid-template-columns: 92px minmax(0, 1fr) auto auto 34px;
    gap: 18px;

    align-items: center;

    padding: 20px 0;

    border-bottom: 1px solid var(--gp-line);
}

.gorun-cart-item:last-child {
    border-bottom: 0;
}


/* ------------------------------------------
   THUMBNAIL
   ------------------------------------------ */

.gorun-cart-thumb {
    width: 92px;
    height: 92px;

    overflow: hidden;

    border: 1px solid var(--gp-line);
    border-radius: 12px;

    background: var(--gp-soft);
}

.gorun-cart-thumb a,
.gorun-cart-thumb img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;
}


/* ------------------------------------------
   DETAILS
   ------------------------------------------ */

.gorun-cart-info {
    display: flex;
    flex-direction: column;
    gap: 5px;

    min-width: 0;
}

.gorun-cart-brand {
    color: var(--gp-muted);

    font-size: 11px;
    font-weight: 500;
    line-height: 1.2;

    letter-spacing: .1em;
    text-transform: uppercase;
}

.gorun-cart-name {
    margin: 0;

    font-size: 15px;
    font-weight: 600;
    line-height: 1.4;
}

.gorun-cart-name a {
    color: var(--gp-slate);

    text-decoration: none;

    transition: color .18s ease;
}

.gorun-cart-name a:hover {
    color: var(--gp-gold-dark);
}

.gorun-cart-sku {
    color: var(--gp-muted);

    font-size: 12px;
    line-height: 1.3;
}

.gorun-cart-sku-label {
    color: var(--gp-slate);

    font-weight: 700;
}

.gorun-cart-item-meta,
.gorun-cart-item-meta p,
.gorun-cart-item-meta dl {
    margin: 0;

    color: var(--gp-muted);

    font-size: 12px;
    line-height: 1.45;
}

.gorun-cart-item-meta dt {
    display: inline;

    font-weight: 600;
}

.gorun-cart-item-meta dd {
    display: inline;

    margin: 0 8px 0 4px;
}

.gorun-cart-stock.is-out {
    color: #C0392B;

    font-size: 12px;
    font-weight: 600;
}


/* ------------------------------------------
   QUANTITY
   ------------------------------------------ */

.gorun-cart-qty {
    display: inline-flex;
    align-items: center;

    overflow: hidden;

    border: 1px solid var(--gp-line);
    border-radius: 9px;

    background: #FFFFFF;
}

.gorun-cart-step {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 34px;
    height: 38px;

    padding: 0;

    border: 0;

    background: none;
    color: var(--gp-slate);

    cursor: pointer;

    transition:
        background .18s ease,
        color .18s ease;
}

.gorun-cart-step:hover {
    background: var(--gp-soft);
    color: var(--gp-gold-dark);
}

.gorun-cart-step svg {
    width: 14px;
    height: 14px;
}

.gorun-cart-qty-input {
    width: 42px;
    height: 38px;
    padding: 0;

    border: 0;
    border-left: 1px solid var(--gp-line);
    border-right: 1px solid var(--gp-line);

    background: none;
    color: var(--gp-ink);

    font-size: 14px;
    font-weight: 600;

    text-align: center;

    -moz-appearance: textfield;
}

.gorun-cart-qty-input:focus {
    outline: none;

    background: #FFFCF3;
}

.gorun-cart-qty-input::-webkit-outer-spin-button,
.gorun-cart-qty-input::-webkit-inner-spin-button {
    margin: 0;

    -webkit-appearance: none;
}

.gorun-cart-qty-fixed {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 44px;
    height: 38px;

    color: var(--gp-ink);

    font-size: 14px;
    font-weight: 600;
}


/* ------------------------------------------
   LINE TOTAL
   ------------------------------------------ */

.gorun-cart-line {
    display: flex;
    flex-direction: column;
    gap: 3px;

    min-width: 92px;

    text-align: right;
}

.gorun-cart-line-total {
    color: #E0A200;

    font-size: 16px;
    font-weight: 700;
    line-height: 1.2;
}

.gorun-cart-line-total del {
    display: none;
}

.gorun-cart-unit {
    color: var(--gp-muted);

    font-size: 11px;
    line-height: 1.3;
}


/* ------------------------------------------
   REMOVE
   ------------------------------------------ */

.gorun-cart-remove {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 34px;
    height: 34px;

    padding: 0;

    border: 1px solid transparent;
    border-radius: 9px;

    background: none;
    color: var(--gp-muted);

    cursor: pointer;

    transition:
        background .18s ease,
        border-color .18s ease,
        color .18s ease;
}

.gorun-cart-remove:hover {
    border-color: #F0C8C3;

    background: #FDF1F0;
    color: #C0392B;
}

.gorun-cart-remove svg {
    width: 16px;
    height: 16px;
}


/* ------------------------------------------
   CONTINUE SHOPPING
   ------------------------------------------ */

.gorun-cart-continue {
    display: inline-flex;
    align-items: center;
    gap: 8px;

    margin-top: 20px;

    color: var(--gp-slate);

    font-size: 13px;
    font-weight: 600;

    text-decoration: none;

    transition:
        gap .2s ease,
        color .2s ease;
}

.gorun-cart-continue:hover {
    gap: 12px;
    color: var(--gp-gold-dark);
}

.gorun-cart-continue svg {
    width: 15px;
    height: 15px;
}


/* ==========================================
   ORDER SUMMARY
   ========================================== */

.gorun-cart-aside {
    position: sticky;
    top: 100px;
}

.gorun-cart-summary {
    padding: 24px;

    border: 1px solid var(--gp-line);
    border-radius: 18px;

    background: #FFFFFF;
}

.gorun-cart-summary-title {
    margin: 0 0 18px;

    color: var(--gp-ink);

    font-size: 17px;
    font-weight: 700;
    line-height: 1.2;
}

.gorun-cart-rows {
    display: flex;
    flex-direction: column;
    gap: 13px;

    padding-bottom: 18px;

    border-bottom: 1px solid var(--gp-line);
}

.gorun-cart-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;

    color: var(--gp-muted);

    font-size: 16px;
    font-weight: 500;
}

.gorun-cart-row-value {
    color: var(--gp-slate);

    font-size: 14px;
    font-weight: 600;

    text-align: right;
}

.gorun-cart-row-note {
    color: var(--gp-muted);

    font-size: 12px;
    font-weight: 400;
}

.gorun-cart-row.is-discount .gorun-cart-row-value {
    color: #1F8A4C;
}

.gorun-cart-coupon-tag {
    display: inline-flex;
    align-items: center;
    gap: 6px;

    padding: 4px 6px 4px 10px;

    border-radius: 6px;

    background: var(--gp-soft);
    color: #6B5A32;

    font-size: 11px;
    font-weight: 700;

    letter-spacing: .04em;
    text-transform: uppercase;
}

.gorun-cart-coupon-remove {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 16px;
    height: 16px;

    padding: 0;

    border: 0;
    border-radius: 50%;

    background: none;
    color: #6B5A32;

    cursor: pointer;

    transition: color .18s ease;
}

.gorun-cart-coupon-remove:hover {
    color: #C0392B;
}

.gorun-cart-coupon-remove svg {
    width: 10px;
    height: 10px;
}


/* ------------------------------------------
   TOTAL
   ------------------------------------------ */

.gorun-cart-total {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 14px;

    padding: 18px 0;

    color: var(--gp-ink);

    font-size: 15px;
    font-weight: 700;
}

.gorun-cart-total-value {
    color: #E0A200;

    font-size: 22px;
    font-weight: 700;
    line-height: 1.1;
}

.gorun-cart-total-value small {
    display: block;

    margin-top: 3px;

    color: var(--gp-muted);

    font-size: 11px;
    font-weight: 400;
}


/* ------------------------------------------
   GST / SHIPPING NOTE (cart + checkout)
   ------------------------------------------ */

.gorun-price-notes {
    margin: 0;
}

/* Checkout: the note sits in its own row of the review table */
.gorun-checkout .woocommerce-checkout-review-order-table tfoot tr.gorun-price-notes-row td {
    width: 100%;
    padding: 0;

    text-align: left;
}

.gorun-checkout .woocommerce-checkout-review-order-table tfoot tr.gorun-price-notes-row .gorun-price-note {
    font-size: 12px;
}

/* Same type as the Subtotal row label (.gorun-cart-row) */
.gorun-price-note {
    margin: 0 0 6px;

    color: #8A8A8A;

    font-family: inherit;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.4;
    letter-spacing: normal;
}

.gorun-price-note:last-child {
    margin-bottom: 0;
}


/* ------------------------------------------
   COUPON
   ------------------------------------------ */

.gorun-cart-coupon {
    display: flex;
    gap: 8px;

    margin-bottom: 16px;
}

.gorun-cart-coupon-input {
    flex: 1 1 auto;
    min-width: 0;

    height: 42px;
    padding: 0 13px;

    border: 1px solid var(--gp-line);
    border-radius: 9px;

    background: #FFFFFF;
    color: var(--gp-ink);

    font-size: 13px;
}

.gorun-cart-coupon-input:focus {
    border-color: var(--gp-gold);

    outline: none;
}

.gorun-cart-coupon-apply {
    flex: 0 0 auto;

    height: 42px;
    padding: 0 18px;

    border: 1px solid var(--gp-line);
    border-radius: 9px;

    background: #FFFFFF;
    color: var(--gp-slate);

    font-size: 13px;
    font-weight: 700;

    cursor: pointer;

    transition:
        border-color .18s ease,
        color .18s ease;
}

.gorun-cart-coupon-apply:hover {
    border-color: var(--gp-gold);
    color: var(--gp-gold-dark);
}


/* ------------------------------------------
   CHECKOUT
   ------------------------------------------ */

.gorun-cart-checkout {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 9px;

    width: 100%;
    padding: 15px 20px;

    border-radius: 10px;

    background: var(--gp-gold);
    color: var(--gp-ink);

    font-size: 15px;
    font-weight: 700;
    line-height: 1.2;

    text-decoration: none;

    transition:
        background .2s ease,
        gap .2s ease;
}

.gorun-cart-checkout:hover {
    gap: 13px;

    background: var(--gp-gold-deep);
    color: var(--gp-ink);
}

.gorun-cart-checkout svg {
    width: 17px;
    height: 17px;
}

.gorun-cart-secure {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;

    margin: 14px 0 0;

    color: var(--gp-muted);

    font-size: 12px;
}

.gorun-cart-secure svg {
    width: 14px;
    height: 14px;
}


/* ==========================================
   EMPTY STATE
   ========================================== */

.gorun-cart-empty {
    display: none;
    flex-direction: column;
    align-items: center;

    padding: 70px 24px 76px;

    border: 1px solid var(--gp-line);
    border-radius: 18px;

    background: #FFFFFF;

    text-align: center;
}

.gorun-cart.is-empty .gorun-cart-empty {
    display: flex;
}

.gorun-cart.is-empty .gorun-cart-layout {
    display: none;
}

.gorun-cart-empty-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 74px;
    height: 74px;

    margin-bottom: 20px;

    border-radius: 50%;

    background: var(--gp-soft);
    color: var(--gp-gold-dark);
}

.gorun-cart-empty-icon svg {
    width: 32px;
    height: 32px;
}

.gorun-cart-empty-title {
    margin: 0 0 8px;

    color: var(--gp-ink);

    font-size: 20px;
    font-weight: 700;
}

.gorun-cart-empty-text {
    max-width: 380px;
    margin: 0 0 24px;

    color: var(--gp-muted);

    font-size: 14px;
    line-height: 1.6;
}

.gorun-cart-empty-button {
    padding: 13px 30px;

    border-radius: 9px;

    background: var(--gp-gold);
    color: var(--gp-ink);

    font-size: 14px;
    font-weight: 700;

    text-decoration: none;

    transition: background .2s ease;
}

.gorun-cart-empty-button:hover {
    background: var(--gp-gold-deep);
    color: var(--gp-ink);
}


/* ==========================================
   LOADING
   ========================================== */

.gorun-cart-loading {
    position: absolute;
    inset: 0;
    z-index: 5;

    display: none;
    align-items: flex-start;
    justify-content: center;

    padding-top: 180px;

    border-radius: 18px;

    background: rgba(255, 255, 255, .6);
}

.gorun-cart.is-busy .gorun-cart-loading {
    display: flex;
}

.gorun-cart.is-busy .gorun-cart-layout {
    pointer-events: none;
}

.gorun-cart-spinner {
    width: 22px;
    height: 22px;

    border: 2px solid var(--gp-line);
    border-top-color: var(--gp-gold);
    border-radius: 50%;

    animation: gorun-cart-spin .7s linear infinite;
}

@keyframes gorun-cart-spin {
    to {
        transform: rotate(360deg);
    }
}


/* ==========================================
   FOCUS
   ========================================== */

.gorun-cart button:focus-visible,
.gorun-cart a:focus-visible,
.gorun-cart input:focus-visible {
    outline: 2px solid var(--gp-gold-deep);
    outline-offset: 2px;
}


/* ==========================================
   RESPONSIVE
   ========================================== */

@media (max-width: 1024px) {

    .gorun-cart-layout {
        grid-template-columns: minmax(0, 1fr);
    }

    .gorun-cart-aside {
        position: static;
    }

}

@media (max-width: 720px) {

    .gorun-cart-heading {
        font-size: 24px;
    }

    .gorun-cart-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }

    .gorun-cart-items {
        padding: 0 16px;
    }

    /* The row folds into thumbnail + details, with the controls
       on a line of their own underneath. */
    .gorun-cart-item {
        grid-template-columns: 74px minmax(0, 1fr) 34px;
        grid-template-areas:
            "thumb info remove"
            "qty   line line";
        gap: 14px;
    }

    .gorun-cart-thumb {
        grid-area: thumb;

        width: 74px;
        height: 74px;
    }

    .gorun-cart-info {
        grid-area: info;
    }

    .gorun-cart-remove {
        grid-area: remove;

        align-self: start;
    }

    .gorun-cart-qty {
        grid-area: qty;

        justify-self: start;
    }

    .gorun-cart-line {
        grid-area: line;

        align-self: center;
    }

    .gorun-product-eyebrow {
        width: 100%;
    }

}

@media (prefers-reduced-motion: reduce) {

    .gorun-cart *,
    .gorun-cart *::before,
    .gorun-cart *::after {
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
    }

}


/* ==========================================
   THEME BUTTON OVERRIDE
   ==========================================

   Same problem as the product listing: Elementor's global button
   styling reaches every <button> here too. Everything is
   stripped back and the intended styling restated. */

.gorun-cart button {
    background: transparent !important;
    background-image: none !important;

    color: inherit !important;

    box-shadow: none !important;
    text-shadow: none !important;

    text-transform: none !important;
    letter-spacing: normal !important;
}

.gorun-cart .gorun-cart-step {
    color: var(--gp-slate) !important;
}

.gorun-cart .gorun-cart-step:hover {
    background: var(--gp-soft) !important;
    color: var(--gp-gold-dark) !important;
}

.gorun-cart .gorun-cart-remove {
    color: var(--gp-muted) !important;
}

.gorun-cart .gorun-cart-remove:hover {
    border-color: #F0C8C3;

    background: #FDF1F0 !important;
    color: #C0392B !important;
}

.gorun-cart .gorun-cart-coupon-apply {
    background: #FFFFFF !important;
    color: var(--gp-slate) !important;
}

.gorun-cart .gorun-cart-coupon-apply:hover {
    border-color: var(--gp-gold);
    color: var(--gp-gold-dark) !important;
}

.gorun-cart .gorun-cart-coupon-remove {
    color: #6B5A32 !important;
}

.gorun-cart .gorun-cart-coupon-remove:hover {
    color: #C0392B !important;
}

.gorun-cart .gorun-cart-checkout,
.gorun-cart .gorun-cart-empty-button {
    background: var(--gp-gold) !important;
    color: var(--gp-ink) !important;
}

.gorun-cart .gorun-cart-checkout:hover,
.gorun-cart .gorun-cart-empty-button:hover {
    background: var(--gp-gold-deep) !important;
    color: var(--gp-ink) !important;
}


/* ==========================================
   CART - SUMMARY LINE ITEMS
   ========================================== */

.gorun-cart-summary-items {
    display: flex;
    flex-direction: column;
    gap: 12px;

    padding-bottom: 16px;
    margin-bottom: 16px;

    border-bottom: 1px solid var(--gp-line);
}

.gorun-cart-summary-item {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.gorun-cart-summary-text {
    display: flex;
    flex-direction: column;
    gap: 3px;

    min-width: 0;
}

.gorun-cart-summary-name {
    color: var(--gp-slate);

    font-size: 13px;
    font-weight: 600;
    line-height: 1.35;
}

.gorun-cart-summary-qty {
    color: var(--gp-muted);

    font-size: 12px;
    line-height: 1.3;
}

.gorun-cart-summary-price {
    flex: 0 0 auto;

    color: var(--gp-slate);

    font-size: 13px;
    font-weight: 700;

    text-align: right;

    white-space: nowrap;
}


/* ==========================================
   CART - THEME INPUT OVERRIDE
   ==========================================

   Elementor styles every form field on the page, which stretched
   the quantity field to full width and gave it its own border on
   top of the one wrapping the stepper. Same treatment as the
   buttons: strip it back and restate what these fields need. */

.gorun-cart input[type="text"],
.gorun-cart input[type="number"] {
    box-shadow: none !important;

    text-transform: none !important;
    letter-spacing: normal !important;
}

.gorun-cart .gorun-cart-qty {
    flex: 0 0 auto;

    width: auto !important;
}

.gorun-cart .gorun-cart-qty-input {
    width: 54px !important;
    min-width: 0 !important;
    max-width: 54px !important;
    height: 38px !important;
    min-height: 0 !important;

    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;
    border-left: 1px solid var(--gp-line) !important;
    border-right: 1px solid var(--gp-line) !important;
    border-radius: 0 !important;

    background: none !important;
    color: var(--gp-ink) !important;

    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 38px !important;

    text-align: center !important;
}

.gorun-cart .gorun-cart-step {
    width: 34px !important;
    height: 38px !important;
    min-height: 0 !important;

    flex: 0 0 auto;

    padding: 0 !important;

    border: 0 !important;
    border-radius: 0 !important;
}

.gorun-cart .gorun-cart-coupon-input {
    height: 42px !important;
    min-height: 0 !important;

    margin: 0 !important;
    padding: 0 13px !important;

    border: 1px solid var(--gp-line) !important;
    border-radius: 9px !important;

    background: #FFFFFF !important;
    color: var(--gp-ink) !important;

    font-size: 13px !important;
    font-weight: 400 !important;
}

.gorun-cart .gorun-cart-coupon-apply {
    height: 42px !important;
    min-height: 0 !important;

    padding: 0 18px !important;

    border: 1px solid var(--gp-line) !important;
    border-radius: 9px !important;
}


/* ==========================================
   GORUN SOLAR - CHECKOUT
   Shortcodes: [gorun_checkout] [gorun_recommended]
   ========================================== */

.gorun-checkout {
    --gp-gold: #FDB813;
    --gp-gold-deep: #E19B00;
    --gp-gold-dark: #B78300;
    --gp-ink: #1B1C1C;
    --gp-slate: #3F4654;
    --gp-muted: #8A8A8A;
    --gp-line: #EFE3C6;
    --gp-field: #E3E3E3;
    --gp-cream: #FFFBF0;

    max-width: 1180px;
    margin: 0 auto;

    color: var(--gp-ink);

    font-family: inherit;
}

.gorun-checkout *,
.gorun-checkout *::before,
.gorun-checkout *::after {
    box-sizing: border-box;
}


/* ==========================================
   THE TWO COLUMN CARD
   ========================================== */

.gorun-checkout-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 380px;

    overflow: hidden;

    border: 1px solid var(--gp-line);
    border-radius: 16px;

    background: #FFFFFF;
}

.gorun-checkout-main {
    min-width: 0;

    padding: 32px 34px 28px;
}

.gorun-checkout-aside {
    min-width: 0;

    padding: 32px 28px 28px;

    border-left: 1px solid var(--gp-line);

    background: var(--gp-cream);
}

.gorun-checkout-title {
    margin: 0 0 26px;

    color: var(--gp-ink);

    font-size: 19px;
    font-weight: 700;
    line-height: 1.2;
}


/* ==========================================
   SECTIONS
   ========================================== */

.gorun-co-section {
    margin-bottom: 28px;
}

.gorun-co-legend {
    margin: 0 0 12px;

    color: var(--gp-ink);

    font-size: 14px;
    font-weight: 700;
    line-height: 1.2;
}

.gorun-co-hint {
    margin: -6px 0 12px;

    color: var(--gp-muted);

    font-size: 12px;
    line-height: 1.4;
}


/* ==========================================
   FIELDS
   ========================================== */

.gorun-co-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 10px;
}

.gorun-checkout .gorun-co-field {
    margin: 0;
    padding: 0;

    grid-column: span 6;
}

.gorun-checkout .gorun-co-half {
    grid-column: span 3;
}

.gorun-checkout .gorun-co-third {
    grid-column: span 2;
}

/* The design shows placeholder-only inputs. The label stays in
   the markup for screen readers - a placeholder is not an
   accessible name. */
.gorun-checkout .gorun-co-field > label:not(.checkbox) {
    position: absolute;

    width: 1px;
    height: 1px;

    overflow: hidden;

    clip: rect(0 0 0 0);
    clip-path: inset(50%);

    white-space: nowrap;
}

.gorun-checkout .gorun-co-field .woocommerce-input-wrapper {
    display: block;

    width: 100%;
}

.gorun-checkout .gorun-co-field input[type="text"],
.gorun-checkout .gorun-co-field input[type="email"],
.gorun-checkout .gorun-co-field input[type="tel"],
.gorun-checkout .gorun-co-field input[type="password"],
.gorun-checkout .gorun-co-field input[type="number"],
.gorun-checkout .gorun-co-field select,
.gorun-checkout .gorun-co-field textarea,
.gorun-checkout .gorun-co-field .select2-container .select2-selection--single {
    width: 100% !important;
    height: 44px !important;
    min-height: 44px !important;

    margin: 0 !important;
    padding: 0 13px !important;

    border: 1px solid var(--gp-field) !important;
    border-radius: 7px !important;

    background-color: #FFFFFF !important;
    color: var(--gp-ink) !important;

    box-shadow: none !important;

    font-size: 13px !important;
    font-weight: 400 !important;
    line-height: 42px !important;

    text-transform: none !important;
    letter-spacing: normal !important;
}

.gorun-checkout .gorun-co-field textarea {
    height: 88px !important;
    min-height: 88px !important;

    padding: 11px 13px !important;

    line-height: 1.5 !important;

    resize: vertical;
}

.gorun-checkout .gorun-co-field input::placeholder,
.gorun-checkout .gorun-co-field textarea::placeholder {
    color: #A9A9A9;

    opacity: 1;
}

.gorun-checkout .gorun-co-field input:focus,
.gorun-checkout .gorun-co-field select:focus,
.gorun-checkout .gorun-co-field textarea:focus {
    border-color: var(--gp-gold) !important;

    outline: none;
}

/* Native select needs its own arrow back once the theme's is
   stripped. */
.gorun-checkout .gorun-co-field select {
    -webkit-appearance: none;
    appearance: none;

    padding-right: 32px !important;

    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238A8A8A' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9.5l6 6 6-6'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 11px center !important;
    background-size: 14px 14px !important;
}

/* Select2, which WooCommerce uses for country and state. */
.gorun-checkout .select2-container .select2-selection--single .select2-selection__rendered {
    padding: 0 !important;

    color: var(--gp-ink);

    line-height: 42px !important;
}

.gorun-checkout .select2-container .select2-selection--single .select2-selection__arrow {
    height: 42px !important;
    right: 8px !important;
}

.gorun-checkout .gorun-co-field abbr.required {
    display: none;
}


/* ------------------------------------------
   CHECKBOX AND RADIO
   ------------------------------------------ */

.gorun-co-check {
    display: flex;
    align-items: center;
    gap: 9px;

    margin-top: 11px;

    color: var(--gp-slate);

    font-size: 12.5px;

    cursor: pointer;
}

.gorun-co-check input {
    position: absolute;

    width: 1px;
    height: 1px;

    opacity: 0;

    pointer-events: none;
}

.gorun-co-check-box {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 16px;
    height: 16px;

    flex: 0 0 auto;

    border: 1px solid #D2D2D2;
    border-radius: 4px;

    background: #FFFFFF;
    color: #FFFFFF;
}

.gorun-co-check-box svg {
    width: 10px;
    height: 10px;

    opacity: 0;
}

.gorun-co-check input:checked + .gorun-co-check-box {
    border-color: var(--gp-gold-deep);

    background: var(--gp-gold);
}

.gorun-co-check input:checked + .gorun-co-check-box svg {
    opacity: 1;
}


/* ------------------------------------------
   CHOICE LISTS - BILLING AND SHIPPING METHOD
   ------------------------------------------ */

.gorun-co-choices,
.gorun-checkout .gorun-co-shipping-slot ul {
    margin: 0;
    padding: 0;

    overflow: hidden;

    border: 1px solid var(--gp-field);
    border-radius: 8px;

    list-style: none;
}

.gorun-co-choice,
.gorun-checkout .gorun-co-shipping-slot li {
    display: flex;
    align-items: center;
    gap: 10px;

    margin: 0;
    padding: 13px 15px;

    border-bottom: 1px solid var(--gp-field);

    color: var(--gp-slate);

    font-size: 13px;

    cursor: pointer;
}

.gorun-co-choice:last-child,
.gorun-checkout .gorun-co-shipping-slot li:last-child {
    border-bottom: 0;
}

.gorun-co-radio {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 16px;
    height: 16px;

    flex: 0 0 auto;

    border: 1px solid #D2D2D2;
    border-radius: 50%;

    background: #FFFFFF;
}

.gorun-co-radio::after {
    content: "";

    width: 8px;
    height: 8px;

    border-radius: 50%;

    background: transparent;
}

.gorun-co-choice input:checked + .gorun-co-radio {
    border-color: var(--gp-gold-deep);
}

.gorun-co-choice input:checked + .gorun-co-radio::after {
    background: var(--gp-gold);
}


/* WooCommerce's own shipping radios, moved here by custom.js.
   They keep their native input so it is styled in place rather
   than replaced. */
.gorun-checkout .gorun-co-shipping-slot input[type="radio"] {
    width: 15px;
    height: 15px;

    flex: 0 0 auto;

    margin: 0;

    accent-color: var(--gp-gold-deep);
}

.gorun-checkout .gorun-co-shipping-slot label {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;

    width: 100%;
    margin: 0;

    color: var(--gp-slate);

    font-size: 13px;
    font-weight: 500;

    cursor: pointer;
}

.gorun-checkout .gorun-co-shipping-slot label .woocommerce-Price-amount {
    color: var(--gp-ink);

    font-weight: 700;
}

.gorun-checkout .gorun-co-shipping-slot p {
    margin: 10px 0 0;

    color: var(--gp-muted);

    font-size: 12px;
}

/* Only one method: WooCommerce prints plain text instead of a
   radio list, so it gets the box on its own. */
.gorun-checkout .gorun-co-shipping-slot > p:only-child {
    margin: 0;
    padding: 13px 15px;

    border: 1px solid var(--gp-field);
    border-radius: 8px;

    color: var(--gp-slate);
    font-size: 13px;
}


/* Billing fields stay in the DOM when hidden so WooCommerce can
   still read them - they are mirrored from the shipping fields
   while "same as shipping" is selected. */
.gorun-co-billing-fields {
    margin-top: 12px;
}

.gorun-checkout.has-billing-choice:not(.billing-separate) .gorun-co-billing-fields {
    position: absolute;

    width: 1px;
    height: 1px;

    overflow: hidden;

    clip: rect(0 0 0 0);
    clip-path: inset(50%);
}

.gorun-co-ship-flag {
    position: absolute;

    width: 1px;
    height: 1px;

    opacity: 0;

    pointer-events: none;
}


/* ==========================================
   PAYMENT
   ========================================== */

.gorun-co-payment {
    margin-bottom: 20px;
}

.gorun-checkout #payment {
    padding: 0;

    border-radius: 0;

    background: transparent;
}

.gorun-checkout #payment ul.payment_methods {
    margin: 0 0 16px;
    padding: 0;

    overflow: hidden;

    border: 1px solid var(--gp-field);
    border-bottom: 1px solid var(--gp-field);
    border-radius: 8px;

    list-style: none;
}

.gorun-checkout #payment ul.payment_methods li {
    margin: 0;
    padding: 13px 15px;

    border-bottom: 1px solid var(--gp-field);

    list-style: none;
}

.gorun-checkout #payment ul.payment_methods li:last-child {
    border-bottom: 0;
}

.gorun-checkout #payment ul.payment_methods label {
    display: inline-flex;
    align-items: center;
    gap: 9px;

    margin: 0;

    color: var(--gp-slate);

    font-size: 13px;
    font-weight: 500;
}

.gorun-checkout #payment ul.payment_methods input[type="radio"] {
    width: 15px;
    height: 15px;

    margin: 0;

    accent-color: var(--gp-gold-deep);
}

.gorun-checkout #payment .payment_box {
    margin: 10px 0 0;
    padding: 12px 14px;

    border-radius: 7px;

    background: #FAF8F3;

    color: var(--gp-muted);

    font-size: 12.5px;
    line-height: 1.55;
}

.gorun-checkout #payment .payment_box::before {
    display: none;
}

.gorun-checkout .woocommerce-terms-and-conditions-wrapper {
    margin-bottom: 16px;

    color: var(--gp-muted);

    font-size: 12px;
    line-height: 1.55;
}

.gorun-checkout .form-row.place-order {
    display: flex !important;
    justify-content: flex-end;
    flex-direction: column !important;
    margin: 0;
    padding: 0;
}

.gorun-checkout #place_order {
    width: auto;
    min-width: 128px;
    padding: 12px 30px !important;

    border: 0 !important;
    border-radius: 8px !important;

    background: var(--gp-gold) !important;
    color: var(--gp-ink) !important;

    box-shadow: none !important;

    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;

    text-transform: none !important;
    letter-spacing: normal !important;

    cursor: pointer;

    transition: background .2s ease;
}

.gorun-checkout #place_order:hover {
    background: var(--gp-gold-deep) !important;
}


/* ==========================================
   POLICIES
   ========================================== */

.gorun-co-policies {
    display: flex;
    gap: 20px;

    flex-wrap: wrap;

    padding-top: 18px;

    border-top: 1px solid var(--gp-field);
}

.gorun-co-policies a {
    color: var(--gp-muted);

    font-size: 11.5px;

    text-decoration: none;
}

.gorun-co-policies a:hover {
    color: var(--gp-gold-dark);

    text-decoration: underline;
}


/* ==========================================
   ORDER SUMMARY
   ========================================== */

.gorun-co-summary-title {
    margin: 0 0 2px;

    color: var(--gp-ink);

    font-size: 16px;
    font-weight: 700;
}

.gorun-co-summary-subtitle {
    margin: 0 0 18px;

    color: var(--gp-muted);

    font-size: 11.5px;
}


/* The review table is WooCommerce's, regenerated by AJAX on
   every address change. It is laid out here rather than
   replaced, so a refresh cannot undo the design. */

.gorun-checkout .woocommerce-checkout-review-order-table,
.gorun-checkout .woocommerce-checkout-review-order-table thead,
.gorun-checkout .woocommerce-checkout-review-order-table tbody,
.gorun-checkout .woocommerce-checkout-review-order-table tfoot,
.gorun-checkout .woocommerce-checkout-review-order-table tr,
.gorun-checkout .woocommerce-checkout-review-order-table th,
.gorun-checkout .woocommerce-checkout-review-order-table td {
    display: block;

    width: auto;
    margin: 0;
    padding: 0;

    border: 0;

    background: none;
}

.gorun-checkout .woocommerce-checkout-review-order-table thead {
    display: none;
}

.gorun-checkout .woocommerce-checkout-review-order-table tbody {
    display: flex;
    flex-direction: column;
    gap: 14px;

    padding-bottom: 16px;
}

.gorun-checkout .woocommerce-checkout-review-order-table tr.cart_item {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.gorun-checkout .woocommerce-checkout-review-order-table td.product-name {
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr);
    grid-template-areas:
        "thumb name"
        "thumb qty";
    gap: 6px 11px;

    flex: 1 1 auto;

    align-items: center;
    align-content: center;
}

.gorun-co-thumb {
    grid-area: thumb;

    width: 46px;
    height: 46px;

    overflow: hidden;

    border: 1px solid var(--gp-line);
    border-radius: 8px;

    background: #FFFFFF;
}

.gorun-co-thumb img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;
}

.gorun-co-name {
    grid-area: name;

    color: var(--gp-slate);

    font-size: 12px;
    font-weight: 500;
    line-height: 1.35;
}

.gorun-checkout .woocommerce-checkout-review-order-table td.product-name dl.variation {
    grid-column: 2;

    margin: 0;

    color: var(--gp-muted);

    font-size: 11px;
}

.gorun-checkout .woocommerce-checkout-review-order-table td.product-total {
    flex: 0 0 auto;

    align-self: center;

    color: var(--gp-gold-deep);

    font-size: 12.5px;
    font-weight: 700;

    text-align: right;
    white-space: nowrap;
}


/* ------------------------------------------
   QUANTITY PILL
   ------------------------------------------ */

.gorun-co-qty {
    grid-area: qty;

    display: inline-flex;
    align-items: center;
    gap: 2px;

    justify-self: start;

    overflow: hidden;

    border-radius: 6px;

    background: var(--gp-gold);
}

.gorun-co-qty.is-fixed {
    padding: 0 10px;

    color: var(--gp-ink);

    font-size: 11px;
    font-weight: 700;
    line-height: 24px;
}

.gorun-checkout .gorun-co-step {
    width: 22px;
    height: 24px;
    min-height: 0;

    padding: 0 !important;

    border: 0 !important;
    border-radius: 0 !important;

    background: transparent !important;
    color: var(--gp-ink) !important;

    box-shadow: none !important;

    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 1 !important;

    cursor: pointer;

    transition: background .15s ease;
}

.gorun-checkout .gorun-co-step:hover {
    background: rgba(255, 255, 255, .45) !important;
}

.gorun-co-qty-value {
    min-width: 16px;

    color: var(--gp-ink);

    font-size: 11.5px;
    font-weight: 700;
    line-height: 24px;

    text-align: center;
}


/* ------------------------------------------
   TOTALS
   ------------------------------------------ */

.gorun-checkout .woocommerce-checkout-review-order-table tfoot {
    display: flex;
    flex-direction: column;
    gap: 9px;

    padding-top: 16px;

    border-top: 1px solid var(--gp-line);
}

.gorun-checkout .woocommerce-checkout-review-order-table tfoot tr {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
}

.gorun-checkout .woocommerce-checkout-review-order-table tfoot th {
    color: var(--gp-muted);

    font-size: 14px;
    font-weight: 500;

    text-align: left;
}

.gorun-checkout .woocommerce-checkout-review-order-table tfoot td {
    color: var(--gp-slate);

    font-size: 12.5px;
    font-weight: 600;

    text-align: right;
}

/* Shipping lives in the left column - custom.js moves the
   radios out and this hides what is left behind. */
.gorun-checkout .woocommerce-checkout-review-order-table tfoot tr.woocommerce-shipping-totals {
    display: none;
}

.gorun-checkout .woocommerce-checkout-review-order-table tfoot tr.order-total {
    align-items: center;

    margin-top: 4px;
    padding-top: 12px;

    border-top: 1px solid var(--gp-line);
}

.gorun-checkout .woocommerce-checkout-review-order-table tfoot tr.order-total th {
    color: var(--gp-gold-deep);

    font-size: 14px;
    font-weight: 700;
}

.gorun-checkout .woocommerce-checkout-review-order-table tfoot tr.order-total td {
    color: var(--gp-gold-deep);

    font-size: 21px;
    font-weight: 700;
}

.gorun-checkout .woocommerce-checkout-review-order-table tfoot tr.order-total small {
    display: inline;

    color: var(--gp-muted);

    font-size: 11px;
    font-weight: 400;
}


/* ------------------------------------------
   PROMO CODE
   ------------------------------------------ */

.gorun-co-promo {
    display: flex;
    gap: 8px;

    margin: 18px 0 0;
}

.gorun-checkout .gorun-co-promo-input {
    flex: 1 1 auto;
    min-width: 0;

    height: 40px !important;
    min-height: 0 !important;

    margin: 0 !important;
    padding: 0 12px !important;

    border: 1px solid var(--gp-field) !important;
    border-radius: 7px !important;

    background: #FFFFFF !important;
    color: var(--gp-ink) !important;

    box-shadow: none !important;

    font-size: 12.5px !important;
    font-weight: 400 !important;
}

.gorun-checkout .gorun-co-promo-input:focus {
    border-color: var(--gp-gold) !important;

    outline: none;
}

.gorun-checkout .gorun-co-promo-apply {
    flex: 0 0 auto;

    height: 40px;
    min-height: 0;
    padding: 0 20px !important;

    border: 0 !important;
    border-radius: 7px !important;

    background: var(--gp-gold) !important;
    color: var(--gp-ink) !important;

    box-shadow: none !important;

    font-size: 13px !important;
    font-weight: 700 !important;

    text-transform: none !important;
    letter-spacing: normal !important;

    cursor: pointer;

    transition: background .2s ease;
}

.gorun-checkout .gorun-co-promo-apply:hover {
    background: var(--gp-gold-deep) !important;
}


/* ==========================================
   BUSY
   ========================================== */

.gorun-checkout.is-busy .gorun-checkout-aside {
    opacity: .55;

    pointer-events: none;
}


/* ==========================================
   NOTICES
   ========================================== */

.gorun-checkout .woocommerce-error,
.gorun-checkout .woocommerce-message,
.gorun-checkout .woocommerce-info,
.gorun-checkout .woocommerce-NoticeGroup ul {
    margin: 0 0 16px;
    padding: 13px 42px;

    border: 1px solid var(--gp-line);
    border-left: 3px solid var(--gp-gold);
    border-radius: 10px;

    background: #FDF9EF;

    color: var(--gp-slate);

    font-size: 13px;

    list-style: none;
}

.gorun-checkout .woocommerce-error {
    border-left-color: #C0392B;

    background: #FDF1F0;

    color: #8E2E23;
}


/* ==========================================
   YOU MAY ALSO LIKE
   ========================================== */

.gorun-recommended {
    max-width: 1180px;
    margin: 46px auto 0;
}

.gorun-recommended-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;

    margin-bottom: 20px;
}

.gorun-recommended-heading {
    margin: 0 0 4px;

    color: #1B1C1C;

    font-size: 22px;
    font-weight: 700;
    line-height: 1.2;
}

.gorun-recommended-sub {
    margin: 0;

    color: #8A8A8A;

    font-size: 13px;
}

.gorun-recommended-all {
    display: inline-flex;
    align-items: center;
    gap: 7px;

    flex: 0 0 auto;

    color: #E19B00;

    font-size: 13px;
    font-weight: 600;

    text-decoration: none;

    transition: gap .2s ease;
}

.gorun-recommended-all:hover {
    gap: 11px;
    color: #B78300;
}

.gorun-recommended-all svg {
    width: 15px;
    height: 15px;
}

/* Reuses the listing's card, so it only needs the column count.
   The wrapper carries .gorun-product-listing for the card
   styles, but none of the listing chrome is present. */
.gorun-recommended .gorun-product-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}


/* ==========================================
   RESPONSIVE
   ========================================== */

@media (max-width: 1024px) {

    .gorun-checkout-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .gorun-checkout-aside {
        border-left: 0;
        border-top: 1px solid var(--gp-line);
    }

    .gorun-recommended .gorun-product-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

}

@media (max-width: 640px) {

    .gorun-checkout-main,
    .gorun-checkout-aside {
        padding: 24px 18px;
    }

    .gorun-checkout .gorun-co-third,
    .gorun-checkout .gorun-co-half {
        grid-column: span 6;
    }

    .gorun-checkout .form-row.place-order {
        justify-content: stretch;
    }

    .gorun-checkout #place_order {
        width: 100%;
    }

    .gorun-recommended-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }

    .gorun-recommended .gorun-product-grid {
        grid-template-columns: minmax(0, 1fr);
    }

}


/* ==========================================
   CHECKOUT - RADIO BUTTONS
   ==========================================

   One treatment for every radio in the form: the billing address
   choice, the shipping methods WooCommerce renders, and the
   payment gateways.

   The dot is drawn with a radial-gradient rather than an ::after,
   because pseudo-elements on a replaced element like <input> are
   not something every browser agrees to render. */

.gorun-checkout input[type="radio"] {
    -webkit-appearance: none !important;
    appearance: none !important;

    width: 16px !important;
    height: 16px !important;
    min-width: 16px !important;
    min-height: 16px !important;

    flex: 0 0 auto;

    margin: 0 !important;
    padding: 0 !important;

    border: 1px solid #D2D2D2 !important;
    border-radius: 50% !important;

    background-color: #FFFFFF !important;
    background-image: none !important;

    box-shadow: none !important;

    cursor: pointer;

    transition: border-color .18s ease;
}

.gorun-checkout input[type="radio"]:hover {
    border-color: var(--gp-gold) !important;
}

.gorun-checkout input[type="radio"]:checked {
    border-color: var(--gp-gold-deep) !important;

    background-image: radial-gradient(circle at center, var(--gp-gold) 4px, transparent 4.5px) !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
}

.gorun-checkout input[type="radio"]:focus-visible {
    outline: 2px solid var(--gp-gold-deep);
    outline-offset: 2px;
}

/* The rows these sit in become clickable targets rather than just
   the 16px control. */
.gorun-checkout .gorun-co-shipping-slot li,
.gorun-checkout #payment ul.payment_methods > li {
    cursor: pointer;
}


/* ==========================================
   CHECKOUT - CONTAINMENT
   ==========================================

   These sections carry absolutely positioned children - the
   visually hidden field labels, and the billing fields while
   "same as shipping" is selected. Without a positioned ancestor
   those resolve against the page itself, so the containing block
   is pinned here rather than left to chance. */

.gorun-checkout,
.gorun-recommended {
    position: relative;

    width: 100%;
}

.gorun-checkout-main,
.gorun-checkout-aside {
    min-width: 0;
}

/* =========================================
   SOLAR PANELS ACCORDION
   Keep existing icon + add extra arrow
   ========================================= */

.accordian_solar_panels .e-n-accordion-item-title {
    position: relative !important;
    padding-right: 55px !important;
}


/* =========================================
   KEEP EXISTING ELEMENTOR ICON
   ========================================= */

/* DO NOT hide .e-n-accordion-item-title-icon */


/* =========================================
   CLOSED - DOWN ARROW
   ========================================= */

.accordian_solar_panels .e-n-accordion-item-title::after {
    content: "" !important;

    position: absolute !important;
    right: 16px !important;
    top: 50% !important;

    width: 18px !important;
    height: 18px !important;

    background-image: url("/wp-content/uploads/2026/08/Icon-18-1.svg") !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: contain !important;

    transform: translateY(-50%) !important;

    transition: all 0.25s ease !important;
}


/* =========================================
   OPEN - UP ARROW
   ========================================= */

.accordian_solar_panels
.e-n-accordion-item[open]
.e-n-accordion-item-title::after {
    background-image: url("/wp-content/uploads/2026/08/Icon_transform.svg") !important;
    transform: translateY(-50%) !important;
}


/* ==========================================
   GORUN SOLAR - LOGIN / REGISTER
   woocommerce/myaccount/form-login.php
   ========================================== */

.gorun-login {
    --gp-gold: #F5B800;
    --gp-gold-deep: #E0A800;
    --gp-gold-dark: #B78300;
    --gp-ink: #1B1C1C;
    --gp-slate: #3F4654;
    --gp-text: #444444;
    --gp-muted: #6F6F6F;
    --gp-field: #D9D9D9;
    display: grid;
    grid-template-columns: minmax(0, 440px) minmax(0, 1fr);
    align-items: center;
    gap: 60px;
    padding: 40px max(24px, calc((100% - 1100px) / 2));
    overflow: hidden;
    background: linear-gradient(
        180deg,
        #FFFFFF 0%,
        #FFFFFF 50%,
        #FFF7E0 80%,
        #FFEFC4 100%
    );
    color: var(--gp-ink);
    font-family: inherit;
}

.gorun-login *,
.gorun-login *::before,
.gorun-login *::after {
    box-sizing: border-box;
}

/* WooCommerce wraps this template in .woocommerce, which many
   themes give a max-width and padding. The panel is meant to run
   edge to edge. */
.woocommerce-account:not(.logged-in) .woocommerce {
    max-width: none;
    padding: 0;
}

.woocommerce-privacy-policy-text p {
    font-size: 12px;
}


/* ==========================================
   IMAGE PANEL
   ========================================== */

.gorun-login-hero {
    align-self: stretch;
    min-height: 735px;
    border-radius: 20px;

    /* Fallback for when no hero image is set. */
    background-color: #F5D98A;
    background-image: linear-gradient(160deg, #FCE9B0 0%, #F2B632 100%);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}


/* ==========================================
   FORM PANEL
   ========================================== */

.gorun-login-panel {
    display: flex;
    align-items: center;
    justify-content: center;

    padding: 0;

    background: none;
}

.gorun-login-card {
    width: 100%;
    max-width: 440px;
    padding: 30px 40px 60px;
    border: 1px solid #F1EEE6;
    border-radius: 28px;
    background: #FFFFFF;
    box-shadow: 0 10px 40px rgba(27, 28, 28, .05);
}


/* ------------------------------------------
   TABS
   ------------------------------------------ */

.gorun-login-tabs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));

    margin-bottom: 30px;
    padding: 0;

    border-bottom: 1px solid #E6E6E6;
}

.gorun-login .gorun-login-tab {
    height: 46px;
    margin: 0 0 -1px;
    padding: 0 12px !important;

    border: 0 !important;
    border-bottom: 2px solid transparent !important;
    border-radius: 0 !important;

    background: transparent !important;
    color: var(--gp-text) !important;

    box-shadow: none !important;

    font-family: inherit;
    font-size: 14px !important;
    font-weight: 500 !important;
    line-height: 1 !important;

    text-transform: none !important;
    letter-spacing: normal !important;

    cursor: pointer;

    transition:
        background .18s ease,
        color .18s ease,
        border-color .18s ease;
}

.gorun-login .gorun-login-tab:hover {
    color: var(--gp-ink) !important;
}

.gorun-login .gorun-login-tab[aria-selected="true"] {
    border-bottom-color: var(--gp-gold) !important;

    color: var(--gp-ink) !important;

    font-weight: 600 !important;
}


/* ------------------------------------------
   PANES
   ------------------------------------------ */

.gorun-login-pane {
    display: none;
}

.gorun-login-pane.is-active {
    display: flex;
    flex-direction: column;
}

/* Registration turned off leaves one pane and no tabs, so it
   shows regardless. */
.gorun-login.is-login-only .gorun-login-pane {
    display: block;
}

.gorun-login-title {
    margin: 0 0 14px;

    color: var(--gp-ink);

    font-size: 24px;
    font-weight: 700;
    line-height: 1.2;
}

.gorun-login-sub {
    margin: 0 0 22px;

    color: var(--gp-text);

    font-size: 16px;
    line-height: 1.5;
}


/* ------------------------------------------
   FIELDS
   ------------------------------------------ */

.gorun-login-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.gorun-login .gorun-login-row {
    margin: 0 0 16px;
    padding: 0;
}

.gorun-login .gorun-login-grid .gorun-login-row {
    margin-bottom: 16px;
}

.gorun-login .gorun-login-input {
    display: block;

    width: 100% !important;
    height: 56px !important;
    min-height: 56px !important;

    margin: 0 !important;
    padding: 0 15px !important;

    border: 1px solid var(--gp-field) !important;
    border-radius: 6px !important;

    background-color: #FFFFFF !important;
    color: var(--gp-ink) !important;

    box-shadow: none !important;

    font-family: inherit;
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 54px !important;

    text-transform: none !important;
    letter-spacing: normal !important;

    transition: border-color .18s ease;
}

.gorun-login .gorun-login-input::placeholder {
    color: var(--gp-text);

    opacity: 1;
}

.gorun-login .gorun-login-input:focus {
    border-color: var(--gp-gold) !important;

    outline: none;
}


/* Password field with its reveal button. */
.gorun-login-secret {
    position: relative;

    display: block;
}

.gorun-login-secret .gorun-login-input {
    padding-right: 52px !important;
}

.gorun-login .gorun-login-eye {
    position: absolute;
    top: 50%;
    right: 10px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 34px;
    height: 34px;
    min-height: 0;

    padding: 0 !important;

    border: 0 !important;
    border-radius: 6px !important;

    background: none !important;
    color: var(--gp-ink) !important;

    box-shadow: none !important;

    transform: translateY(-50%);

    cursor: pointer;

    transition: color .18s ease;
}

.gorun-login .gorun-login-eye:hover {
    color: var(--gp-slate) !important;
}

.gorun-login-eye svg {
    width: 22px;
    height: 22px;
}

/* Crossed eye while the password is hidden, plain eye once it
   is shown. */
.gorun-login-eye .gorun-eye-slash {
    opacity: 1;
}

.gorun-login-eye.is-revealed .gorun-eye-slash {
    opacity: 0;
}

/* WooCommerce's script wraps every password field in
   span.password-input and adds its own eye button, which lands
   on top of ours - two icons drawn over each other. Ours stays;
   theirs goes, and the wrapper just fills the row. */
.gorun-login .show-password-input {
    display: none !important;
}

.gorun-login .gorun-login-secret .password-input {
    display: block;

    width: 100%;
}


/* ------------------------------------------
   CHECKBOXES
   ------------------------------------------ */

.gorun-login-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;

    margin: 0 0 30px;
}

.gorun-login-check {
    display: flex;
    align-items: center;
    gap: 10px;

    margin: 0;

    color: var(--gp-ink);

    font-size: 13px;
    font-weight: 500;
    line-height: 1.45;

    cursor: pointer;
}

.gorun-login-check input {
    position: absolute;

    width: 1px;
    height: 1px;

    opacity: 0;

    pointer-events: none;
}

.gorun-login-check-box {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 18px;
    height: 18px;

    flex: 0 0 auto;

    border: 1px solid #CFCFCF;
    border-radius: 50%;

    background: #FFFFFF;
    color: #FFFFFF;

    transition:
        background .16s ease,
        border-color .16s ease;
}

.gorun-login-check-box svg {
    width: 10px;
    height: 10px;

    opacity: 0;

    transition: opacity .16s ease;
}

.gorun-login-check input:checked + .gorun-login-check-box {
    border-color: var(--gp-gold-deep);

    background: var(--gp-gold);
}

.gorun-login-check input:checked + .gorun-login-check-box svg {
    opacity: 1;
}

.gorun-login-check input:focus-visible + .gorun-login-check-box {
    outline: 2px solid var(--gp-gold-deep);
    outline-offset: 2px;
}

.gorun-login-forgot {
    flex: 0 0 auto;

    color: var(--gp-gold);

    font-size: 12.5px;
    font-weight: 600;

    text-decoration: none;
}

.gorun-login-forgot:hover {
    color: var(--gp-gold-deep);

    text-decoration: underline;
}

.gorun-login-terms {
    align-items: flex-start;

    margin: 0 0 24px;

    color: var(--gp-text);

    font-weight: 400;
}

.gorun-login-terms .gorun-login-check-box {
    margin-top: 1px;
}

.gorun-login-terms a {
    color: var(--gp-gold-deep);

    font-weight: 600;

    text-decoration: none;
}

.gorun-login-terms a:hover {
    text-decoration: underline;
}


/* ------------------------------------------
   SUBMIT
   ------------------------------------------ */

.gorun-login .gorun-login-submit {
    display: block;

    width: 100%;
    height: 48px;
    min-height: 0;

    margin: 0;
    padding: 0 20px !important;

    border: 0 !important;
    border-radius: 6px !important;

    background: var(--gp-gold) !important;
    color: var(--gp-ink) !important;

    box-shadow: none !important;

    font-family: inherit;
    font-size: 15px !important;
    font-weight: 600 !important;
    line-height: 48px !important;

    text-transform: none !important;
    letter-spacing: normal !important;

    cursor: pointer;

    transition: background .2s ease;
}

.gorun-login .gorun-login-submit:hover {
    background: var(--gp-gold-deep) !important;
}


/* ------------------------------------------
   SOCIAL
   ------------------------------------------ */

.gorun-login-divider {
    position: relative;

    margin: 24px 0 16px;

    text-align: center;
}

.gorun-login-divider::before {
    content: "";

    position: absolute;
    top: 50%;
    left: 0;
    right: 0;

    height: 1px;

    background: #ECECEC;
}

.gorun-login-divider span {
    position: relative;

    padding: 0 12px;

    background: #FFFFFF;
    color: var(--gp-muted);

    font-size: 12px;
}

.gorun-login-social {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.gorun-login-social-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;

    height: 46px;

    border: 1px solid var(--gp-field);
    border-radius: 6px;

    background: #FFFFFF;
    color: var(--gp-slate);

    font-size: 14px;
    font-weight: 600;

    text-decoration: none;

    transition: border-color .18s ease;
}

.gorun-login-social-button:hover {
    border-color: #BDBDBD;
    color: var(--gp-slate);
}


/* ------------------------------------------
   TRUST STRIP
   ------------------------------------------ */

.gorun-login-trust {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px 28px;

    flex-wrap: wrap;

    margin: 46px 0 0;
    padding: 32px 0 0;

    border-top: 1px solid #ECE6D6;

    list-style: none;
}

.gorun-login-trust li {
    display: inline-flex;
    align-items: center;
    gap: 7px;

    margin: 0;

    color: var(--gp-text);

    font-size: 12.5px;
}

.gorun-login-trust svg {
    width: 13px;
    height: 13px;

    flex: 0 0 auto;
}


/* ==========================================
   PASSWORD SCREENS
   form-lost-password.php, lost-password-confirmation.php,
   form-reset-password.php
   ========================================== */

.gorun-login .lost_reset_password {
    margin: 0;
    padding: 0;

    border: 0;
}

.gorun-login-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 52px;
    height: 52px;

    margin: 10px 0 22px;

    border-radius: 50%;

    background: #FFF4D6;
    color: var(--gp-gold-deep);
}

.gorun-login-badge svg {
    width: 24px;
    height: 24px;
}

.is-password-screen .gorun-login-sub {
    margin-bottom: 26px;
}

.is-password-screen .gorun-login-submit {
    margin-top: 8px;
}

/* The confirmation screen's button is a link. */
.gorun-login .gorun-login-submit-link {
    text-align: center;
    text-decoration: none !important;
}

.gorun-login-back {
    display: flex;
    width: fit-content;
    align-items: center;
    justify-content: center;
    gap: 8px;

    margin: 22px auto 0;

    color: var(--gp-text);

    font-size: 14px;
    font-weight: 500;

    text-decoration: none;

    transition: color .18s ease;
}

.gorun-login-back:hover {
    color: var(--gp-gold-deep);
}

.gorun-login-back svg {
    width: 16px;
    height: 16px;
}

/* WooCommerce's strength meter under the new password. */
.gorun-login .woocommerce-password-strength {
    margin: -6px 0 12px;
    padding: 8px 12px;

    border-radius: 6px;

    font-size: 12.5px;
    font-weight: 500;
    text-align: left;
}

.gorun-login .woocommerce-password-hint {
    display: block;

    margin: 0 0 14px;

    color: var(--gp-muted);

    font-size: 12px;
    line-height: 1.5;
}


/* ==========================================
   WOOCOMMERCE NOTICES
   ========================================== */

.woocommerce-account:not(.logged-in) .woocommerce-error,
.woocommerce-account:not(.logged-in) .woocommerce-message,
.woocommerce-account:not(.logged-in) .woocommerce-info {
    position: relative;
    box-sizing: border-box;

    width: 100%;
    margin: 0 0 16px;
    padding: 14px 20px 14px 48px;

    border: 1px solid #EFE3C6;
    border-left: 3px solid #FDB813;
    border-radius: 10px;

    background: #FDF9EF;

    color: #3F4654;

    font-size: 13px;

    list-style: none;
}

.woocommerce-account:not(.logged-in) .woocommerce-error {
    border-left-color: #C0392B;

    background: #FDF1F0;

    color: #8E2E23;
}

/* WooCommerce places its icon at left: 1.5em, which lands on the
   text once the padding above replaces its own. */
.woocommerce-account:not(.logged-in) .woocommerce-error::before,
.woocommerce-account:not(.logged-in) .woocommerce-message::before,
.woocommerce-account:not(.logged-in) .woocommerce-info::before {
    top: 15px;
    left: 18px;
}


/* ==========================================
   FOCUS
   ========================================== */

.gorun-login button:focus-visible,
.gorun-login a:focus-visible,
.gorun-login input:focus-visible {
    outline: 2px solid var(--gp-gold-deep);
    outline-offset: 2px;
}


/* ==========================================
   RESPONSIVE
   ========================================== */

@media (max-width: 980px) {

    .gorun-login {
        grid-template-columns: minmax(0, 1fr);
        gap: 24px;

        padding: 24px 20px 48px;
    }

    /* The photograph becomes a banner above the form rather
       than disappearing, so the page keeps its identity on a
       phone. */
    .gorun-login-hero {
        order: -1;

        min-height: 260px;
    }

    .gorun-login-card {
        max-width: 520px;
    }

}

@media (max-width: 560px) {

    .gorun-login-hero {
        min-height: 200px;

        border-radius: 16px;
    }

    .gorun-login-card {
        padding: 22px 20px 36px;

        border-radius: 20px;
    }

    .gorun-login-title {
        font-size: 22px;
    }

    .gorun-login-sub {
        font-size: 15px;
    }

    .gorun-login-grid {
        grid-template-columns: minmax(0, 1fr);
        gap: 0;
    }

    .gorun-login-trust {
        gap: 12px 20px;

        margin-top: 36px;
        padding-top: 24px;
    }

}

@media (prefers-reduced-motion: reduce) {

    .gorun-login *,
    .gorun-login *::before,
    .gorun-login *::after {
        transition-duration: .01ms !important;
    }

}


/* ==========================================
   GORUN SOLAR - PRODUCT DETAIL PAGE
   [gorun_product_detail]
   ========================================== */

.gorun-pd {
    --gp-gold: #FDB813;
    --gp-gold-deep: #E19B00;
    --gp-gold-dark: #B78300;
    --gp-ink: #1B1C1C;
    --gp-slate: #3F4654;
    --gp-muted: #8A8A8A;
    --gp-line: #EFE3C6;
    --gp-field: #E6E6E6;
    --gp-soft: #F7F7F8;

    font-family: inherit;
}

.gorun-pd *,
.gorun-pd *::before,
.gorun-pd *::after {
    box-sizing: border-box;
}


/* ==========================================
   DETAIL
   ========================================== */

.gorun-pd {
    max-width: 1240px;
    margin: 0 auto;
    padding: 54px 28px 0;

    color: var(--gp-ink);
}

.gorun-pd-grid {
    display: grid;
    grid-template-columns: minmax(0, 460px) minmax(0, 1fr);
    gap: 44px;

    align-items: start;
}


/* ------------------------------------------
   GALLERY
   ------------------------------------------ */

.gorun-pd-gallery {
    min-width: 0;
}

.gorun-pd-stage {
    aspect-ratio: 4 / 3;

    overflow: hidden;

    border-radius: 14px;

    background: var(--gp-soft);
}

.gorun-pd-stage-img,
.gorun-pd-stage img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;
}

.gorun-pd-thumbs {
    display: flex;
    gap: 10px;

    margin-top: 12px;

    overflow-x: auto;

    -webkit-overflow-scrolling: touch;
}

.gorun-pd-thumbs::-webkit-scrollbar {
    height: 0;
}

.gorun-pd .gorun-pd-thumb {
    width: 68px;
    height: 56px;

    flex: 0 0 auto;

    padding: 0 !important;

    overflow: hidden;

    border: 2px solid transparent !important;
    border-radius: 9px !important;

    background: var(--gp-soft) !important;

    box-shadow: none !important;

    cursor: pointer;

    transition: border-color .18s ease;
}

.gorun-pd .gorun-pd-thumb:hover {
    border-color: var(--gp-line) !important;
}

.gorun-pd .gorun-pd-thumb.is-active {
    border-color: var(--gp-gold) !important;
}

.gorun-pd-thumb img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;
}


/* ------------------------------------------
   BUY BOX
   ------------------------------------------ */

.gorun-pd-info {
    min-width: 0;
}

.gorun-pd-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;

    margin-bottom: 10px;
}

.gorun-pd-badge {
    display: inline-flex;
    align-items: center;
    gap: 7px;

    padding: 5px 12px;

    border-radius: 6px;

    background: #FFF6E0;
    color: var(--gp-gold-dark);

    font-size: 10.5px;
    font-weight: 700;
    line-height: 1.4;

    letter-spacing: .09em;
    text-transform: uppercase;
}

.gorun-pd-badge::before {
    content: "";

    width: 5px;
    height: 5px;

    border-radius: 50%;

    background: var(--gp-gold);
}

.gorun-pd .gorun-pd-wishlist {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 36px;
    height: 36px;
    min-height: 0;

    flex: 0 0 auto;

    padding: 0 !important;

    border: 1px solid var(--gp-field) !important;
    border-radius: 50% !important;

    background: #FFFFFF !important;
    color: var(--gp-muted) !important;

    box-shadow: none !important;

    cursor: pointer;

    transition:
        border-color .18s ease,
        color .18s ease;
}

.gorun-pd .gorun-pd-wishlist:hover {
    border-color: var(--gp-gold) !important;
    color: var(--gp-gold-dark) !important;
}

.gorun-pd .gorun-pd-wishlist.is-active {
    border-color: var(--gp-gold) !important;

    background: var(--gp-gold) !important;
    color: var(--gp-ink) !important;
}

.gorun-pd-wishlist.is-active svg {
    fill: currentColor;
}

.gorun-pd-wishlist svg {
    width: 17px;
    height: 17px;
}

.gorun-pd-title {
    margin: 0 0 10px;

    color: var(--gp-ink);

    font-size: 27px;
    font-weight: 700;
    line-height: 1.25;
}

.gorun-pd-summary {
    margin-bottom: 18px;

    color: var(--gp-muted);

    font-size: 13px;
    line-height: 1.7;
}

.gorun-pd-summary p {
    margin: 0 0 8px;
}

.gorun-pd-summary p:last-child {
    margin-bottom: 0;
}


/* ------------------------------------------
   PRICE
   ------------------------------------------ */

.gorun-pd-price-row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;

    margin-bottom: 18px;
}

.gorun-pd-price {
    color: var(--gp-ink);

    font-size: 26px;
    font-weight: 700;
    line-height: 1.15;
}

.gorun-pd-price del {
    margin-right: 8px;

    color: var(--gp-muted);

    font-size: 16px;
    font-weight: 500;
}

.gorun-pd-price ins {
    background: none;
    color: var(--gp-ink);

    text-decoration: none;
}

.gorun-pd-price .woocommerce-price-suffix {
    color: var(--gp-muted);

    font-size: 12px;
    font-weight: 400;
}

.gorun-pd-price-note {
    display: block;

    margin-top: 3px;

    color: var(--gp-muted);

    font-size: 11.5px;
}

.gorun-pd-stock {
    display: inline-flex;
    align-items: center;
    gap: 6px;

    flex: 0 0 auto;

    padding: 6px 12px;

    border-radius: 6px;

    background: #E8F7EE;
    color: #1F8A4C;

    font-size: 11.5px;
    font-weight: 600;
    white-space: nowrap;
}

.gorun-pd-stock.is-out {
    background: #FDF1F0;
    color: #C0392B;
}

.gorun-pd-stock svg {
    width: 12px;
    height: 12px;
}


/* ------------------------------------------
   META BOXES
   ------------------------------------------ */

.gorun-pd-meta {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;

    margin-bottom: 12px;
}

.gorun-pd-meta-box {
    display: flex;
    flex-direction: column;
    gap: 4px;

    padding: 12px 15px;

    border: 1px solid var(--gp-field);
    border-radius: 9px;

    background: #FFFFFF;
}

.gorun-pd-meta-box.is-wide {
    margin-bottom: 12px;
}

.gorun-pd-meta-label {
    color: var(--gp-muted);

    font-size: 9.5px;
    font-weight: 700;
    line-height: 1.3;

    letter-spacing: .1em;
    text-transform: uppercase;
}

.gorun-pd-meta-value {
    color: var(--gp-slate);

    font-size: 13px;
    font-weight: 500;
    line-height: 1.4;

    word-break: break-word;
}


/* ------------------------------------------
   COMPATIBLE WITH
   ------------------------------------------ */

.gorun-pd-compat {
    margin-bottom: 20px;
    padding: 14px 15px;

    border: 1px solid var(--gp-field);
    border-radius: 9px;

    background: var(--gp-soft);
}

.gorun-pd-compat-list {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 9px 14px;

    margin: 10px 0 0;
    padding: 0;

    list-style: none;
}

.gorun-pd-compat-list li {
    display: flex;
    align-items: center;
    gap: 7px;

    margin: 0;

    color: var(--gp-slate);

    font-size: 12px;
    line-height: 1.35;
}

.gorun-pd-compat-list svg {
    width: 12px;
    height: 12px;

    flex: 0 0 auto;

    color: #1F8A4C;
}


/* ------------------------------------------
   ACTIONS
   ------------------------------------------ */

.gorun-pd-actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 12px;
}

.gorun-pd .gorun-pd-cart {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    height: 48px;

    padding: 0 24px !important;

    border: 0 !important;
    border-radius: 9px !important;

    background: var(--gp-gold) !important;
    color: var(--gp-ink) !important;

    box-shadow: none !important;

    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 48px !important;

    text-decoration: none;
    text-transform: none !important;
    letter-spacing: normal !important;

    transition: background .2s ease;
}

.gorun-pd .gorun-pd-cart:hover {
    background: var(--gp-gold-deep) !important;
}

.gorun-pd .gorun-pd-cart.loading {
    opacity: .6;

    pointer-events: none;
}

/* WooCommerce drops a "View cart" link in after an AJAX add. */
.gorun-pd-actions .added_to_cart {
    display: none;
}

.gorun-pd .gorun-pd-datasheet {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;

    height: 48px;

    padding: 0 22px;

    border: 1px solid var(--gp-field);
    border-radius: 9px;

    background: #FFFFFF;
    color: var(--gp-slate);

    font-size: 13.5px;
    font-weight: 600;

    text-decoration: none;

    transition:
        border-color .2s ease,
        color .2s ease;
}

.gorun-pd .gorun-pd-datasheet:hover {
    border-color: var(--gp-gold);
    color: var(--gp-gold-dark);
}

.gorun-pd-datasheet svg {
    width: 16px;
    height: 16px;
}

.gorun-pd-datasheet small {
    color: var(--gp-muted);

    font-size: 11px;
    font-weight: 400;
}

/* The fallback path: WooCommerce's own form for variable,
   external or out of stock products. */
.gorun-pd-wc-form {
    grid-column: 1 / -1;
}

.gorun-pd-wc-form .button {
    border-radius: 9px !important;

    background: var(--gp-gold) !important;
    color: var(--gp-ink) !important;
}


/* ==========================================
   SPEC STRIP
   ========================================== */

.gorun-pd-specs {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;

    margin-top: 40px;
}

.gorun-pd-spec {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 7px;

    padding: 18px 12px;

    border: 1px solid var(--gp-field);
    border-radius: 11px;

    background: #FFFFFF;

    text-align: center;
}

.gorun-pd-spec:hover{
    border-color: var(--gp-gold);
    box-shadow: 0 6px 18px rgba(253, 184, 19, .16) !important;
}

.gorun-pd-spec-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 26px;
    height: 26px;

    color: var(--gp-muted);
}

.gorun-pd-spec-icon svg {
    width: 100%;
    height: 100%;
}

.gorun-pd-spec-value {
    color: var(--gp-ink);

    font-size: 14px;
    font-weight: 700;
    line-height: 1.3;

    word-break: break-word;
}

.gorun-pd-spec-label {
    color: var(--gp-muted);

    font-size: 10.5px;
    line-height: 1.35;
}


/* ==========================================
   RESPONSIVE
   ========================================== */

@media (max-width: 1080px) {

    .gorun-pd-specs {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

}

@media (max-width: 1024px) and (min-width: 767px) {
    .gorun-login {
        grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
        gap: 28px;
        padding: 32px 24px;
    }

    .gorun-login-hero {
        order: 0;
        min-height: 100%;
    }

    .gorun-login-card {
        padding: 26px 26px 40px;
    }
}

@media (max-width: 900px) {

    .gorun-pd-grid {
        grid-template-columns: minmax(0, 1fr);
        gap: 30px;
    }

}

@media (max-width: 620px) {

    .gorun-pd {
        padding: 34px 18px 0;
    }

    .gorun-pd-meta,
    .gorun-pd-actions {
        grid-template-columns: minmax(0, 1fr);
    }

    .gorun-pd-compat-list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .gorun-pd-specs {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .gorun-pd-title {
        font-size: 22px;
    }

    .gorun-pd-price-row {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }

}


/* ==========================================
   GORUN SOLAR - PRODUCT TABS
   [gorun_product_tabs]
   ========================================== */

.gorun-pt {
    --gp-gold: #FDB813;
    --gp-gold-deep: #E19B00;
    --gp-gold-dark: #B78300;
    --gp-ink: #1B1C1C;
    --gp-slate: #3F4654;
    --gp-muted: #8A8A8A;
    --gp-field: #E6E6E6;
    --gp-soft: #F7F7F8;

    max-width: 1240px;
    margin: 0 auto;
    padding: 46px 28px 0;

    color: var(--gp-ink);

    font-family: inherit;
}

.gorun-pt *,
.gorun-pt *::before,
.gorun-pt *::after {
    box-sizing: border-box;
}


/* ==========================================
   TABS
   ========================================== */

.gorun-pt-tabs {
    display: inline-flex;
    gap: 6px;

    margin-bottom: 60px;
    padding: 5px;

    border: 1px solid var(--gp-field);
    border-radius: 10px;

    background: #FFFFFF;
}

.gorun-pt .gorun-pt-tab {
    padding: 9px 26px !important;

    border: 0 !important;
    border-radius: 7px !important;

    background: transparent !important;
    color: var(--gp-muted) !important;

    box-shadow: none !important;

    font-family: inherit;
    font-size: 16px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;

    text-transform: none !important;
    letter-spacing: normal !important;

    cursor: pointer;

    transition:
        background .18s ease,
        color .18s ease;
}

.gorun-pt .gorun-pt-tab:hover {
    color: var(--gp-slate) !important;
}

.gorun-pt .gorun-pt-tab.is-active {
    background: var(--gp-gold) !important;
    color: var(--gp-ink) !important;
}


/* ==========================================
   PANES
   ========================================== */

.gorun-pt-pane {
    display: none;
}

.gorun-pt-pane.is-active {
    display: block;
}

.gorun-pt-block {
    margin-bottom: 60px;
}

.gorun-pt-block:last-child {
    margin-bottom: 0;
}

.gorun-pt-eyebrow {
    display: inline-block;

    margin-bottom: 16px;
    padding: 5px 13px;

    border-radius: 6px;

    background: #FDF4D9;
    color: #7A5900;

    font-size: 16px;
    font-weight: 600;
    line-height: 1.4;
}

.gorun-pt-heading {
    margin: 0 0 18px;

    color: var(--gp-ink);

    font-size: 20px;
    font-weight: 700;
    line-height: 1.3;
}


/* ==========================================
   RICH TEXT
   ========================================== */

.gorun-pt-rich {
    color: var(--gp-muted);

    font-size: 14px;
    line-height: 1.85;
}

.gorun-pt-rich h1,
.gorun-pt-rich h2,
.gorun-pt-rich h3,
.gorun-pt-rich h4 {
    margin: 0 0 14px;

    color: var(--gp-ink);

    font-weight: 700;
    line-height: 1.3;
}

.gorun-pt-rich h2 {
    font-size: 20px;
}

.gorun-pt-rich h3 {
    font-size: 17px;
}

.gorun-pt-rich p {
    margin: 0 0 16px;
}

.gorun-pt-rich p:last-child {
    margin-bottom: 0;
}

.gorun-pt-rich ul,
.gorun-pt-rich ol {
    margin: 0 0 16px;
    padding-left: 20px;
}

.gorun-pt-rich li {
    margin-bottom: 6px;
}

.gorun-pt-rich a {
    color: var(--gp-gold-dark);
}


/* ------------------------------------------
   SPECIFICATION TABLE
   ------------------------------------------ */

.gorun-pt-rich table {
    width: 100%;

    margin: 16px 0 0;

    border: 1px solid #E6E6E9;
    border-radius: 10px;

    /* `separate`, not `collapse`: a collapsed table ignores
       border-radius entirely, so the rounded corners have to go
       on the four corner cells instead. */
    border-collapse: separate;
    border-spacing: 0;

    background: #FFFFFF;
}

.gorun-pt-rich table th,
.gorun-pt-rich table td {
    /* The theme sets its own table padding and the surrounding
       prose runs at line-height 1.85, which together made these
       rows about half as tall again as they should be. */
    padding: 11px 16px !important;

    border: 0;
    border-bottom: 1px solid #EDEDEF;

    color: inherit;

    font-size: 12.5px !important;
    line-height: 1.45 !important;

    text-align: left;
    vertical-align: middle;
}

/* Fixes where the values start, so they line up down the column
   whatever length the labels happen to be. */
.gorun-pt-rich table th:first-child,
.gorun-pt-rich table td:first-child {
    width: 42%;
}

.gorun-pt-rich table tr:last-child th,
.gorun-pt-rich table tr:last-child td {
    border-bottom: 0;
}


/* Header row - a real <thead>, or a first row built from <th>
   when the editor did not write one. */
.gorun-pt-rich table > thead > tr > th,
.gorun-pt-rich table > tbody:first-child > tr:first-child > th {
    background: #F2F2F4;
    color: var(--gp-slate);

    font-size: 12px !important;
    font-weight: 700;

    letter-spacing: .1em;
    text-transform: uppercase;
}


/* Even rows, so the first row below the header stays white and
   the two do not read as one grey block. */
.gorun-pt-rich table > tbody > tr:nth-child(even) {
    background: #FAFAFB;
}

.gorun-pt-rich table > tbody > tr > td:first-child {
    color: var(--gp-muted);

    font-weight: 400;
}

.gorun-pt-rich table > tbody > tr > td:last-child {
    color: var(--gp-ink);

    font-weight: 600;
}


/* Corner rounding, cell by cell. `tbody:first-child` only
   matches when no thead precedes it, so a table with a header
   and one without both round correctly. */
.gorun-pt-rich table > thead > tr:first-child > *:first-child,
.gorun-pt-rich table > tbody:first-child > tr:first-child > *:first-child {
    border-top-left-radius: 9px;
}

.gorun-pt-rich table > thead > tr:first-child > *:last-child,
.gorun-pt-rich table > tbody:first-child > tr:first-child > *:last-child {
    border-top-right-radius: 9px;
}

.gorun-pt-rich table > tbody:last-child > tr:last-child > *:first-child,
.gorun-pt-rich table > tfoot:last-child > tr:last-child > *:first-child {
    border-bottom-left-radius: 9px;
}

.gorun-pt-rich table > tbody:last-child > tr:last-child > *:last-child,
.gorun-pt-rich table > tfoot:last-child > tr:last-child > *:last-child {
    border-bottom-right-radius: 9px;
}


/* A wide table scrolls inside its own box rather than pushing
   the page sideways. */
.gorun-pt-tech {
    overflow-x: auto;
}


/* ==========================================
   READ MORE
   ========================================== */

.gorun-pt-collapse {
    position: relative;

    overflow: hidden;

    transition: max-height .32s ease;
}

/* Only clamped once the script has measured the content and
   found there is something worth hiding - without JS the whole
   description stays readable. */
.gorun-pt-collapse.is-clamped {
    max-height: 190px;
}

.gorun-pt-collapse.is-clamped::after {
    content: "";

    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;

    height: 68px;

    background: linear-gradient(
        180deg,
        rgba(255, 255, 255, 0) 0%,
        #FFFFFF 88%
    );

    pointer-events: none;
}

.gorun-pt .gorun-pt-more {
    display: none;
    align-items: center;
    gap: 6px;

    margin-top: 12px;
    padding: 0 !important;

    border: 0 !important;
    border-radius: 0 !important;

    background: none !important;
    color: var(--gp-gold-deep) !important;

    box-shadow: none !important;

    font-family: inherit;
    font-size: 12.5px !important;
    font-weight: 600 !important;

    text-transform: none !important;
    letter-spacing: normal !important;

    cursor: pointer;
}

.gorun-pt .gorun-pt-more.is-available {
    display: inline-flex;
}

.gorun-pt .gorun-pt-more:hover {
    color: var(--gp-gold-dark) !important;
}

.gorun-pt-more svg {
    width: 13px;
    height: 13px;

    transition: transform .22s ease;
}

.gorun-pt-more[aria-expanded="true"] svg {
    transform: rotate(180deg);
}


/* ==========================================
   COMPATIBILITY
   ========================================== */

.gorun-pt-compat {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.gorun-pt-compat-card {
    padding: 16px 18px 18px;

    border: 1px solid var(--gp-field);
    border-radius: 11px;

    background: #FFFFFF;
}

.gorun-pt-compat-title {
    display: block;

    margin-bottom: 12px;

    color: var(--gp-muted);

    font-size: 12px;
    font-weight: 700;
    line-height: 1.3;

    letter-spacing: .11em;
    text-transform: uppercase;
}

.gorun-pt-compat-list {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin: 0;
    padding: 0;
    list-style: none;
}

.gorun-pt-compat-list li {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin: 0;
    padding: 6px 12px;
    border: 1px solid #DCEEE3;
    border-radius: 6px;
    background: #F7F7F6;
    color: var(--gp-slate);
    font-size: 12px;
    line-height: 1.35;
}

.gorun-pt-compat-list svg {
    width: 11px;
    height: 11px;
    flex: 0 0 auto;
    color: #1F8A4C;
}


/* ==========================================
   DOCUMENTS
   ========================================== */

.gorun-pt-docs {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.gorun-pt-doc {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 14px;
    padding: 16px;
    border: 1px solid var(--gp-field);
    border-radius: 11px;
    background: #FFFFFF;
    transition:
        border-color .18s ease,
        box-shadow .18s ease;
}

.gorun-pt-doc:hover {
    border-color: var(--gp-gold);
    box-shadow: 0 8px 22px rgba(27, 28, 28, .06);
}

.gorun-pt-doc-head {
    display: flex;
    align-items: flex-start;
    gap: 11px;
}

.gorun-pt-doc-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 34px;
    height: 34px;

    flex: 0 0 auto;

    border-radius: 8px;

    background: #FFF6E0;
    color: var(--gp-gold-dark);
}

.gorun-pt-doc-icon svg {
    width: 17px;
    height: 17px;
}

.gorun-pt-doc-text {
    display: flex;
    flex-direction: column;
    gap: 3px;

    min-width: 0;
}

.gorun-pt-doc-text strong {
    color: #111110;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.35;
}

.gorun-pt-doc-text span {
    color: #535862;
    font-size: 12px;
    line-height: 1.45;
}

.gorun-pt-doc-foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.gorun-pt-doc-meta {
    color: var(--gp-muted);

    font-size: 10.5px;
    font-weight: 500;
}

.gorun-pt-doc-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;

    color: var(--gp-slate);

    font-size: 12px;
    font-weight: 600;

    text-decoration: none;

    transition: color .18s ease;
}

.gorun-pt-doc-link:hover {
    color: var(--gp-gold-dark);
}

.gorun-pt-doc-link svg {
    width: 13px;
    height: 13px;
}


/* ==========================================
   REVIEWS
   ========================================== */

.gorun-pt-reviews #reviews {
    margin: 0;
}

.gorun-pt-reviews .comment-reply-title {
    display: block;

    margin-bottom: 12px;

    color: var(--gp-ink);

    font-size: 16px;
    font-weight: 700;
}

.gorun-pt-reviews .commentlist {
    margin: 0 0 26px;
    padding: 0;

    list-style: none;
}

.gorun-pt-reviews .commentlist li {
    margin: 0 0 12px;
    padding: 16px 18px;

    border: 1px solid var(--gp-field);
    border-radius: 11px;

    background: #FFFFFF;

    list-style: none;
}

.gorun-pt-reviews .comment-form input[type="text"],
.gorun-pt-reviews .comment-form input[type="email"],
.gorun-pt-reviews .comment-form textarea {
    width: 100%;

    padding: 11px 13px;

    border: 1px solid var(--gp-field);
    border-radius: 8px;

    background: #FFFFFF;

    font-size: 13px;
}

.gorun-pt-reviews .comment-form textarea {
    min-height: 110px;
}

.gorun-pt-reviews .comment-form .submit {
    padding: 12px 26px !important;

    border: 0 !important;
    border-radius: 8px !important;

    background: var(--gp-gold) !important;
    color: var(--gp-ink) !important;

    font-size: 13px !important;
    font-weight: 700 !important;

    text-transform: none !important;

    cursor: pointer;
}

.gorun-pt-reviews .comment-form .submit:hover {
    background: var(--gp-gold-deep) !important;
}


/* ==========================================
   RESPONSIVE
   ========================================== */

@media (max-width: 980px) {

    .gorun-pt-docs {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

}

@media (max-width: 720px) {

    .gorun-pt {
        padding: 32px 18px 0;
    }

    .gorun-pt-compat,
    .gorun-pt-docs {
        grid-template-columns: minmax(0, 1fr);
    }

    .gorun-pt-tabs {
        display: flex;
        width: 100%;
    }

    .gorun-pt .gorun-pt-tab {
        flex: 1 1 0;

        padding: 9px 12px !important;
    }

}

@media (prefers-reduced-motion: reduce) {

    .gorun-pt-collapse,
    .gorun-pt-more svg {
        transition-duration: .01ms !important;
    }

}


/* ==========================================
   GORUN SOLAR - RELATED PRODUCTS SLIDER
   [gorun_related_products]
   ========================================== */

.gorun-rp {
    --gp-gold: #FDB813;
    --gp-gold-deep: #E19B00;
    --gp-gold-dark: #B78300;
    --gp-ink: #1B1C1C;
    --gp-slate: #3F4654;
    --gp-muted: #8A8A8A;
    --gp-field: #E6E6E9;

    --gp-gap: 16px;
    --gp-per-view: 4;

    max-width: 1240px;
    margin: 0 auto;
    padding: 52px 28px;

    color: var(--gp-ink);

    font-family: inherit;
}

.gorun-rp *,
.gorun-rp *::before,
.gorun-rp *::after {
    box-sizing: border-box;
}


/* ==========================================
   HEADER
   ========================================== */

.gorun-rp-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;

    margin-bottom: 20px;
}

.gorun-rp-eyebrow {
    display: inline-block;
    margin-bottom: 16px;
    padding: 5px 13px;
    border-radius: 6px;
    background: #FDF4D9;
    color: #7A5900;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.4;
}

.gorun-rp-heading {
    margin: 0 0 4px;

    color: var(--gp-ink);

    font-size: 22px;
    font-weight: 700;
    line-height: 1.25;
}

.gorun-rp-sub {
    margin: 0;

    color: var(--gp-muted);

    font-size: 12.5px;
}

.gorun-rp-nav {
    display: flex;
    gap: 8px;

    flex: 0 0 auto;
}

.gorun-rp .gorun-rp-arrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 34px;
    height: 34px;
    min-height: 0;

    padding: 0 !important;

    border: 1px solid var(--gp-field) !important;
    border-radius: 50% !important;

    background: #FFFFFF !important;
    color: var(--gp-muted) !important;

    box-shadow: none !important;

    cursor: pointer;

    transition:
        border-color .18s ease,
        color .18s ease,
        opacity .18s ease;
}

.gorun-rp .gorun-rp-arrow:hover:not(:disabled) {
    border-color: var(--gp-gold) !important;
    color: var(--gp-gold-dark) !important;
}

.gorun-rp .gorun-rp-arrow:disabled {
    opacity: .38;

    cursor: default;
}

.gorun-rp-arrow svg {
    width: 15px;
    height: 15px;
}


/* ==========================================
   TRACK
   ==========================================

   A scroll container rather than a transform based carousel:
   it keeps native touch momentum and keyboard scrolling, and
   the arrows only have to nudge scrollLeft. */

.gorun-rp-track {
    display: flex;
    gap: var(--gp-gap);

    overflow-x: auto;

    scroll-behavior: smooth;
    scroll-snap-type: x mandatory;

    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}

.gorun-rp-track::-webkit-scrollbar {
    display: none;
}

.gorun-rp-card {
    display: flex;
    flex-direction: column;

    /* Whole cards, whatever the container width. */
    flex: 0 0 calc(
        ( 100% - ( var(--gp-per-view) - 1 ) * var(--gp-gap) )
        / var(--gp-per-view)
    );

    scroll-snap-align: start;

    overflow: hidden;

    border: 1px solid var(--gp-field);
    border-radius: 12px;

    background: #FFFFFF;

    transition:
        border-color .2s ease,
        box-shadow .2s ease;
}

.gorun-rp-card:hover {
    border-color: var(--gp-gold);

    box-shadow: 0 10px 26px rgba(27, 28, 28, .07);
}


/* ------------------------------------------
   MEDIA
   ------------------------------------------ */

.gorun-rp-media {
    position: relative;

    display: block;

    aspect-ratio: 4 / 3;

    overflow: hidden;

    background: #F2F2F4;
}

.gorun-rp-media img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;

    transition: transform .35s ease;
}

.gorun-rp-card:hover .gorun-rp-media img {
    transform: scale(1.04);
}

.gorun-rp-badge {
    position: absolute;
    top: 12px;
    left: 12px;

    padding: 5px 12px;

    border-radius: 20px;

    background: #FFFFFF;
    box-shadow: 0 2px 8px rgba(27, 28, 28, .14);

    color: var(--gp-ink);

    font-size: 11px;
    font-weight: 600;
    line-height: 1.4;
}


/* ------------------------------------------
   BODY
   ------------------------------------------ */

.gorun-rp-body {
    display: flex;
    flex-direction: column;
    gap: 7px;

    flex: 1 1 auto;

    padding: 14px 16px 16px;
}

.gorun-rp-title {
    margin: 0;

    font-size: 14.5px;
    font-weight: 600;
    line-height: 1.35;
}

.gorun-rp-title a {
    color: var(--gp-ink);

    text-decoration: none;

    transition: color .18s ease;
}

.gorun-rp-title a:hover {
    color: var(--gp-gold-dark);
}

.gorun-rp-specs {
    margin: 0;

    color: var(--gp-muted);

    font-size: 11px;
    line-height: 1.55;

    letter-spacing: .01em;
}

.gorun-rp-foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;

    /* Pinned to the bottom so the price and button line up
       across cards whose titles run to different lengths. */
    margin-top: auto;
    padding-top: 12px;
}

.gorun-rp-price {
    color: var(--gp-ink);

    font-size: 15px;
    font-weight: 700;
    line-height: 1.2;

    white-space: nowrap;
}

.gorun-rp-price del {
    margin-right: 5px;

    color: var(--gp-muted);

    font-size: 12px;
    font-weight: 500;
}

.gorun-rp-price ins {
    background: none;
    color: var(--gp-ink);

    text-decoration: none;
}

.gorun-rp-price .woocommerce-price-suffix {
    display: none;
}

.gorun-rp-more {
    display: inline-flex;
    align-items: center;
    gap: 5px;

    flex: 0 0 auto;

    padding: 7px 13px;

    border: 1px solid var(--gp-field);
    border-radius: 20px;

    background: #FFFFFF;
    color: var(--gp-slate);

    font-size: 11.5px;
    font-weight: 600;
    line-height: 1.2;

    text-decoration: none;
    white-space: nowrap;

    transition:
        border-color .18s ease,
        color .18s ease,
        gap .18s ease;
}

.gorun-rp-more:hover {
    border-color: var(--gp-gold);
    color: var(--gp-gold-dark);

    gap: 8px;
}

.gorun-rp-more svg {
    width: 12px;
    height: 12px;
}


/* ==========================================
   RESPONSIVE
   ========================================== */

@media (max-width: 1080px) {

    .gorun-rp {
        --gp-per-view: 3;
    }

}

@media (max-width: 820px) {

    .gorun-rp {
        --gp-per-view: 2;
    }

}

@media (max-width: 560px) {

    .gorun-rp {
        --gp-per-view: 1;

        padding: 36px 18px;
    }

    .gorun-rp-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 14px;
    }

}

@media (prefers-reduced-motion: reduce) {

    .gorun-rp-track {
        scroll-behavior: auto;
    }

    .gorun-rp-media img,
    .gorun-rp-card,
    .gorun-rp-more {
        transition-duration: .01ms !important;
    }

}


.gorun-rp.is-static .gorun-rp-nav {
    display: none;
}


/* =========================================================================
   Resource detail: table of contents
   ========================================================================= */

.res_detail_tab_title_div .elementor-button {
    transition: background-color .25s ease, color .25s ease,
        border-color .25s ease;
}

/*
 * Elementor writes a rule per widget carrying both the page id and the
 * element id, which outweighs anything written here on specificity alone --
 * hence the importants.
 *
 * The script marks the widget wrapper and the link inside it, so either
 * selector on its own would do; both are here so the styling holds whichever
 * way the button markup is nested.
 */
.res_detail_tab_title_div .elementor-button.active,
.res_detail_tab_title_div .active > .elementor-button {
    background-color: #FDB813 !important;
    color: #1F2937 !important;
    border-color: #FDB813 !important;
}


/* =========================================================================
   Blog detail: table of contents
   =========================================================================

   The list itself is built by custom.js out of the post's own H2s, into
   whatever container carries .blog_detail_toc. Nothing here needs changing
   when a post gains or loses a section.
   ========================================================================= */

/*
 * A post with no headings gets no list. Elementor containers carry their
 * own display, which outranks the browser's rule for [hidden].
 */
.blog_detail_toc[hidden] {
    display: none !important;
}

.blog_toc {
    padding: 20px;
    border: 1px solid #E5E7EB;
    border-radius: 14px;
    background: #FFFFFF;
}

.blog_toc__caption {
    margin: 0 0 12px;
    color: #6B7280;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.blog_toc__list {
    max-height: min(58vh, 520px);
    margin: 0;
    padding: 0;
    overflow-y: auto;
    list-style: none;

    /* Reaching the end of the list must not carry on into the page. */
    overscroll-behavior: contain;

    /* A long post gives the box its own scrollbar; keep it out of the way. */
    scrollbar-width: thin;
    scrollbar-color: #E5E7EB transparent;
}

.blog_toc__list::-webkit-scrollbar {
    width: 6px;
}

.blog_toc__list::-webkit-scrollbar-thumb {
    border-radius: 3px;
    background: #E5E7EB;
}

.blog_toc__item {
    margin: 0;
}

.blog_toc__link {
    display: block;
    padding: 9px 12px;
    border-left: 2px solid #E5E7EB;
    color: #4B5563;
    font-size: 14px;
    line-height: 1.45;
    text-decoration: none;
    transition: color .2s ease, border-color .2s ease,
        background-color .2s ease;
}

.blog_toc__link:hover,
.blog_toc__link:focus-visible {
    border-left-color: #D1D5DB;
    color: #1F2937;
}

/*
 * The section being read. Set by the scroll spy, and by a click on the
 * entry itself.
 */
.blog_toc__item.is-current > .blog_toc__link {
    border-left-color: #FDB813;
    background: rgba( 253, 184, 19, .10 );
    color: #1F2937;
    font-weight: 600;
}

/*
 * The sidebar travels with the page rather than pinning to the top, so
 * that a list plus the advice card taller than the screen can still be
 * read all the way down. custom.js drives the offset; a stretched flex
 * item has nothing to stick to, hence the align-self.
 */
@media ( min-width: 1025px ) {

    .blog_detail_sidebar_inner {
        align-self: flex-start;
    }

}


/* =========================================================================
   Blog detail: article
   ========================================================================= */

.blog_detail_content {
    --blog-ink: #1F2937;
    --blog-body: #4B5563;
    --blog-rule: #E5E7EB;
    --blog-accent: #FDB813;

    color: var( --blog-body );
    font-size: 16px;
    line-height: 1.75;
}

.blog_detail_content > *:first-child {
    margin-top: 0;
}

.blog_detail_content h2,
.blog_detail_content h3,
.blog_detail_content h4 {
    color: var( --blog-ink );
    font-weight: 700;
    line-height: 1.25;

    /*
     * A safety net for anchor links the script does not handle -- one
     * pasted straight into the address bar, or followed from search
     * results -- so the heading does not land under the sticky header.
     */
    scroll-margin-top: calc( var( --anchor-scroll-offset, 90px ) + 40px );
}

.blog_detail_content h2 {
    margin: 56px 0 16px;
    padding: 8px 10px;
    background: linear-gradient(270deg, rgba(255, 255, 255, 0.2) 0%, rgba(244, 196, 48, 0.2) 100%);
    border-left: 5px solid #F4B400;
    font-size: clamp( 24px, 2.2vw, 32px );
}

.blog_detail_content h3 {
    margin: 34px 0 10px;
    font-size: clamp( 18px, 1.4vw, 20px );
}

.blog_detail_content h4 {
    margin: 26px 0 8px;
    font-size: 17px;
}

.blog_detail_content p {
    margin: 0 0 20px;
}

.blog_detail_content ul,
.blog_detail_content ol {
    margin: 0 0 20px;
    padding-left: 22px;
}

.blog_detail_content li {
    margin-bottom: 8px;
}

.blog_detail_content ul li::marker {
    color: var( --blog-accent );
}

.blog_detail_content ol li::marker {
    color: var( --blog-ink );
    font-weight: 700;
}

/*
 * Links read as links without shouting: the brand yellow has nowhere near
 * enough contrast against white to carry the text itself, so it goes on
 * the underline and the words stay dark.
 */
.blog_detail_content a:not( .elementor-button ) {
    color: var( --blog-ink );
    text-decoration: underline;
    text-decoration-color: var( --blog-accent );
    text-decoration-thickness: 2px;
    text-underline-offset: 3px;
}

.blog_detail_content a:not( .elementor-button ):hover {
    color: #B45309;
}

.blog_detail_content img {
    height: auto;
    max-width: 100%;
    border-radius: 12px;
}

.blog_detail_content figure {
    margin: 28px 0;
}

.blog_detail_content figcaption {
    margin-top: 10px;
    color: #6B7280;
    font-size: 13px;
    line-height: 1.5;
}

.blog_detail_content blockquote {
    margin: 28px 0;
    padding: 4px 0 4px 20px;
    border-left: 3px solid var( --blog-accent );
    color: var( --blog-ink );
    font-size: 18px;
    font-style: normal;
}

.blog_detail_content blockquote p:last-child {
    margin-bottom: 0;
}

.blog_detail_content hr {
    height: 1px;
    margin: 40px 0;
    border: 0;
    background: var( --blog-rule );
}

.blog_detail_content table {
    width: 100%;
    margin: 28px 0;
    border-collapse: collapse;
    font-size: 15px;
}

.blog_detail_content th,
.blog_detail_content td {
    padding: 14px 16px;
    border: 1px solid var( --blog-rule );
    text-align: left;
    vertical-align: top;
}

.blog_detail_content thead th {
    background: #F9FAFB;
    color: var( --blog-ink );
    font-weight: 700;
}

/*
 * A comparison table is wider than a phone. Scrolling the table beats
 * squeezing the columns until the words break one letter to a line.
 */
@media ( max-width: 767px ) {

    .blog_detail_content table {
        display: block;
        overflow-x: auto;
    }

    .blog_detail_content h2 {
        margin-top: 40px;
    }
    
    .res_detail_tab_title_div {
        flex-flow: row;
        overflow-x: scroll;
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        align-items: stretch !important;
        order: 0 !important;
        width: 100% !important;
        gap: 8px !important;
        padding: 8px !important;
        border-radius: 12px !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        -webkit-overflow-scrolling: touch;
        scroll-snap-type: x proximity;
        scrollbar-width: none;
    }
    
    .res_detail_tab_title_btn {
        flex: 0 0 auto !important;
        width: auto !important;
        white-space: nowrap !important;
        scroll-snap-align: start;
        padding: 12px 18px !important;
        border-radius: 10px !important;
    }

}

.included-text {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: #FDB813;
    font-size: 14px;
    margin-top: 8px;
}
 
.included-icon {
    width: 13px;
    height: 13px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #FDB813;
    color: #fff;
    border-radius: 50%;
    font-size: 9px;
    font-weight: 700;
}

/* =========================================
   SOLAR PROCESS CONNECTING LINES
   DESKTOP ONLY
   ========================================= */

@media (min-width: 1025px) {

    .resources_solar_process {
        position: relative !important;
    }

    /* Line between each Icon Box */
    .resources_solar_process:not(:last-child)::after {
        content: "";
        position: absolute !important;

        left: 26px !important;
        top: calc(100% - 2px) !important;

        width: 2px !important;
        height: 14px !important;

        background-color: #1F293714 !important;

        z-index: 1 !important;
    }

}


/* ==========================================================
   GORUN SOLAR - COMPONENTS LIST MEGA MENU
   ==========================================================

   The panel opened by the header item that carries the class
   `components_list`. Markup is printed at wp_footer and is
   fixed positioned by custom.js, so it sits above the header
   instead of inside it.

   Same token names the product listing uses, redeclared here
   so the panel is not tied to being inside a listing.
   ========================================================== */

.gorun-components-menu {
    --gp-gold: #FDB813;
    --gp-gold-deep: #E19B00;
    --gp-gold-dark: #B78300;
    --gp-ink: #1B1C1C;
    --gp-muted: #8A8A8A;
    position: fixed;
    top: 80px !important;
    left: 51%;
    z-index: 99990;
    width: min(940px, calc(100vw - 32px));
    transform: translateX(-50%) translateY(-10px);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    color: var(--gp-ink);
    transition:
        opacity .2s ease,
        transform .2s ease,
        visibility .2s;
}

.gorun-components-menu *,
.gorun-components-menu *::before,
.gorun-components-menu *::after {
    box-sizing: border-box;
}

.gorun-components-menu.is-open {
    transform: translateX(-50%) translateY(0);

    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.gorun-components-card {
    background: #FFFFFF;
    border-radius: 18px;

    box-shadow:
        0 24px 64px rgba(27, 28, 28, .13),
        0 2px 8px rgba(27, 28, 28, .06);

    overflow: hidden;
}

/* The rail beside the brand columns. The grid lives here rather
   than on the card so the drawer's bar and account footer can
   stack above and below it without becoming grid columns. */
.gorun-components-body {
    display: grid;
    grid-template-columns: 252px minmax(0, 1fr);
}

/* Drawer furniture. Printed on every screen, shown only once
   the layout collapses - see the drawer block at the end. */
.gorun-components-bar,
.gorun-components-account,
.gorun-components-back,
.gorun-components-cat-next,
.gorun-components-view-all {
    display: none;
}


/* ------------------------------------------
   CATEGORY RAIL
   ------------------------------------------ */

.gorun-components-side {
    padding: 24px 16px 26px;

    border-right: 1px solid #EDEDF1;
}

.gorun-components-side-label {
    margin: 0 0 14px 12px;

    color: var(--gp-muted);

    font-size: 11px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: .09em;
    text-transform: uppercase;
}

.gorun-components-cats {
    display: flex;
    flex-direction: column;
    gap: 2px;

    margin: 0;
    padding: 0;

    list-style: none;
}

.gorun-components-cats li {
    margin: 0;
}

.gorun-components-cat {
    position: relative;

    display: flex;
    align-items: center;
    gap: 12px;

    padding: 11px 12px;

    border-radius: 10px;

    color: #4C525B;

    font-size: 14.5px;
    font-weight: 500;
    line-height: 1.2;
    text-decoration: none;

    transition:
        background .15s ease,
        color .15s ease;
}

.gorun-components-cat:hover,
.gorun-components-cat:focus-visible {
    background: #F6F6F8;
    color: var(--gp-ink);

    text-decoration: none;
}

.gorun-components-cat.is-active {
    background: rgba(253, 184, 19, .10);
    color: var(--gp-ink);

    font-weight: 600;
}

/* The gold marker on the active row. */
.gorun-components-cat.is-active::before {
    content: "";

    position: absolute;
    left: 0;
    top: 9px;
    bottom: 9px;

    width: 3px;

    border-radius: 0 3px 3px 0;
    background: var(--gp-gold);
}

/* Sizes the icon the product navigation renders - its svg and
   its uploaded thumbnail both fill whatever box they land in. */
.gorun-components-cat-icon {
    flex: 0 0 auto;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 20px;
    height: 20px;

    color: #9AA0A8;

    transition: color .15s ease;
}

.gorun-components-cat:hover .gorun-components-cat-icon {
    color: #6D737C;
}

.gorun-components-cat.is-active .gorun-components-cat-icon,
.gorun-components-cat.is-active:hover .gorun-components-cat-icon {
    color: var(--gp-gold-dark);
}


/* ------------------------------------------
   BRAND COLUMNS
   ------------------------------------------ */

.gorun-components-content {
    padding: 26px 32px 24px;

    min-height: 340px;
}

.gorun-components-pane {
    display: none;
}

.gorun-components-pane.is-active {
    display: block;

    animation: gorun-components-fade .22s ease both;
}

@keyframes gorun-components-fade {

    from {
        opacity: 0;
        transform: translateY(4px);
    }

    to {
        opacity: 1;
        transform: none;
    }

}

.gorun-components-pane-head {
    display: flex;
    align-items: center;
    gap: 10px;

    margin-bottom: 24px;
}

.gorun-components-pane-title {
    margin: 0;

    color: var(--gp-ink);

    font-size: 21px;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -.01em;
}

.gorun-components-badge {
    display: inline-block;

    padding: 4px 9px;

    border-radius: 999px;
    background: #F0F0F3;
    color: #6B7079;

    font-size: 11px;
    font-weight: 600;
    line-height: 1.3;

    white-space: nowrap;
}

/* Multi column, not a grid: the brands are meant to read down
   each column and then across, the way the design lays them
   out, and the column count does the balancing itself. */
.gorun-components-brands {
    margin: 0;
    padding: 0 0 22px;

    list-style: none;

    /* Grid, not CSS columns - columns balance by height, so a
       short list (4 brands) filled only two of the three. */
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    column-gap: 30px;
    align-items: start;

    border-bottom: 1px solid #EDEDF1;
}

.gorun-components-brands li {
    margin: 0 0 15px;
    padding: 2px 10px;
    border-radius: 6px;
}

.gorun-components-brands li:hover {
    background-color: #FFC72C1A;
}

.gorun-components-brands a {
    display: inline-block;

    color: #5D636C;

    font-size: 14px;
    line-height: 1.3;
    text-decoration: none;

    transition: color .15s ease;
}

.gorun-components-brands a:hover,
.gorun-components-brands a:focus-visible {
    color: var(--gp-ink);

    text-decoration: none;
}

.gorun-components-empty {
    margin: 0;
    padding-bottom: 22px;

    border-bottom: 1px solid #EDEDF1;

    color: var(--gp-muted);

    font-size: 14px;
}

/* The trigger is usually a "#" link, which browsers give a text
   caret rather than a pointer. */
.components_list > a,
a.components_list {
    cursor: pointer;
}

/* Dropdown chevron, added to the trigger by custom.js because
   the header item is a plain menu link with no children for
   Elementor to draw an arrow from. Inline-block rather than
   flex so the anchor's own layout is left alone.

   The box keeps Font Awesome's 320:512 ratio, so the solid
   caret scales into it instead of being letterboxed. */
.gorun-components-caret {
    display: inline-block;

    width: 10px;
    height: 16px;
    margin-left: 6px;

    vertical-align: middle;

    color: currentColor;
    opacity: .7;

    transition: transform .2s ease;
}

.gorun-components-caret svg {
    display: block;

    width: 100%;
    height: 100%;
}

/* aria-expanded sits on the trigger, which is the list item on
   some headers and the link itself on others - the descendant
   match covers both. */
.components_list[aria-expanded="true"] .gorun-components-caret {
    transform: rotate(180deg);

    opacity: 1;
}

/* Submenu caret for the header menu - any top-level item that has
   children gets the same Font Awesome caret as the Components
   item, and it flips while the submenu is open.

   The header widget's Submenu Indicator is set to none, so the
   caret is drawn on the link's ::after from the SVG path as a
   mask (it takes the link colour). Elementor already uses that
   pseudo-element for its hover pointer - absolute, accent
   coloured, hidden when not hovered - with more specific
   selectors, hence the !important on everything it touches. */
.elementor-location-header .elementor-nav-menu--main .elementor-nav-menu > li.menu-item-has-children > a .sub-arrow {
    display: none !important;
}

.elementor-location-header .elementor-nav-menu--main .elementor-nav-menu > li.menu-item-has-children > a.elementor-item::after {
    content: "" !important;

    position: static !important;
    display: inline-block !important;
    flex-shrink: 0;

    width: 10px !important;
    height: 16px !important;
    margin-left: 6px;

    vertical-align: middle;

    background-color: currentColor !important;
    border: 0 !important;
    opacity: .7 !important;

    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M31.3 192h257.3c17.8 0 26.7 21.5 14.1 34.1L174.1 354.8c-7.8 7.8-20.5 7.8-28.3 0L17.2 226.1C4.6 213.5 13.5 192 31.3 192z'/%3E%3C/svg%3E") no-repeat center / contain;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M31.3 192h257.3c17.8 0 26.7 21.5 14.1 34.1L174.1 354.8c-7.8 7.8-20.5 7.8-28.3 0L17.2 226.1C4.6 213.5 13.5 192 31.3 192z'/%3E%3C/svg%3E") no-repeat center / contain;

    transform: none !important;
    transition: transform .2s ease, opacity .2s ease !important;
}

.elementor-location-header .elementor-nav-menu--main .elementor-nav-menu > li.menu-item-has-children:hover > a.elementor-item::after,
.elementor-location-header .elementor-nav-menu--main .elementor-nav-menu > li.menu-item-has-children:focus-within > a.elementor-item::after,
.elementor-location-header .elementor-nav-menu--main .elementor-nav-menu > li.menu-item-has-children > a.elementor-item.highlighted::after {
    transform: rotate(180deg) !important;

    opacity: 1 !important;
}

@media (max-width: 1440px) {
    .gorun-components-menu {
        top: 100px !important;
    }
}

/* On desktop the panel scrolls away with the page like the
   header's other submenus, instead of staying pinned to the
   window. The top above is still where it sits under the
   header - custom.js adds the scroll offset on open. */
@media (min-width: 1025px) {
    .gorun-components-menu {
        position: absolute;
    }
}

/* ------------------------------------------
   DRAWER - TABLET AND MOBILE
   ------------------------------------------

   Under 1024px there is no hover to open with and no room to
   stand two columns side by side, so the same markup is
   restacked into a drawer: the categories are the first screen,
   the brands slide over them as the second, and the back button
   steps out of it.

   The card becomes a flex column - a fixed bar, a body that
   takes up the slack and scrolls, and the account buttons
   pinned underneath. */

@media (max-width: 1024px) {

    /* The page must not scroll under an open drawer. The script
       stops Lenis alongside this - overflow on its own does not
       hold a smooth scroller. Scoped to the media query so the
       lock cannot outlive the drawer on a rotate to desktop. */
    html.gorun-components-locked,
    html.gorun-components-locked body {
        overflow: hidden;
    }


    .gorun-components-menu {
        top: 0;
        right: 0;
        bottom: 0;
        left: auto;

        width: min(420px, calc(100vw - 32px));
        max-height: none;

        transform: translateX(100%);
    }

    .gorun-components-menu.is-open {
        transform: none;
    }

    /* Scrim. A pseudo element rather than a node, so it is not
       an event target of its own - a tap on it lands on the
       wrapper, which is what the script closes on. */
    .gorun-components-menu::before {
        content: "";

        position: fixed;
        inset: 0;
        z-index: -1;

        background: rgba(27, 28, 28, .45);

        opacity: 0;

        transition: opacity .28s ease;
    }

    .gorun-components-menu.is-open::before {
        opacity: 1;
    }

    .gorun-components-card {
        display: flex;
        flex-direction: column;

        height: 100%;

        border-radius: 0;

        box-shadow: -18px 0 40px rgba(27, 28, 28, .18);
    }


    /* --- bar --- */

    .gorun-components-bar {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 16px;

        flex: 0 0 auto;

        padding: 14px 10px 14px 20px;

        border-bottom: 1px solid #ECECEC;
    }

    .gorun-components-logo {
        display: inline-flex;
        align-items: center;

        min-width: 0;

        max-width: 190px;

        color: var(--gp-ink);

        font-size: 17px;
        font-weight: 700;
        line-height: 1.2;
    }

    /* The script swaps in the header's own mark on first open;
       the_custom_logo() is only what stands there until then.
       Either way the link and the image are re-capped so a wide
       logo cannot push the close button off the bar. */
    .gorun-components-logo a,
    .gorun-components-logo .custom-logo-link {
        display: inline-flex;
        align-items: center;

        max-width: 170px;
    }

    .gorun-components-logo img,
    .gorun-components-logo .custom-logo {
        display: block;

        width: auto;
        height: auto;
        max-width: 100%;
        max-height: 34px;

        object-fit: contain;
    }

    /* An inline SVG has no intrinsic size to fall back on -
       without a height it lays out at the CSS default 150px. */
    .gorun-components-logo svg {
        display: block;

        width: auto;
        height: 34px;
        max-width: 100%;
    }

    .gorun-components-close {
        display: inline-flex;
        align-items: center;
        justify-content: center;

        flex: 0 0 auto;

        width: 42px;
        height: 42px;
        padding: 0;

        border: 0;
        border-radius: 50%;
        background: none;
        color: var(--gp-ink);

        cursor: pointer;
    }

    .gorun-components-close svg {
        width: 22px;
        height: 22px;
    }

    .gorun-components-close:active {
        background: #F4F4F4;
    }


    /* --- screen one: categories --- */

    .gorun-components-body {
        position: relative;

        display: block;
        flex: 1 1 auto;

        min-height: 0;

        overflow: hidden;
    }

    .gorun-components-side {
        height: 100%;
        padding: 0 0 20px;

        border-right: 0;

        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }

    .gorun-components-side-label {
        margin: 18px 20px 8px;
    }

    .gorun-components-cats {
        display: block;
    }

    .gorun-components-cat {
        gap: 14px;

        padding: 17px 20px;

        border-radius: 0;
        border-bottom: 1px solid #F1F1F1;

        font-size: 16px;
        font-weight: 600;
    }

    /* The row last drilled into is still the selected tab, but
       nothing on this screen is "current" any more - showing it
       as such reads as a filter that cannot be cleared. */
    .gorun-components-cat.is-active {
        background: none;
    }

    .gorun-components-cat.is-active::before {
        display: none;
    }

    .gorun-components-cat .gorun-components-cat-icon,
    .gorun-components-cat.is-active .gorun-components-cat-icon {
        color: var(--gp-gold-dark);
    }

    .gorun-components-cat-text {
        flex: 1 1 auto;

        min-width: 0;
    }

    .gorun-components-cat-next {
        display: inline-flex;
        flex: 0 0 auto;

        width: 18px;
        height: 18px;

        color: #B5B5B5;
    }

    .gorun-components-cat-next svg {
        width: 100%;
        height: 100%;
    }


    /* --- screen two: brands --- */

    .gorun-components-content {
        position: absolute;
        inset: 0;

        padding: 0 0 20px;

        min-height: 0;

        background: #FFFFFF;

        overflow-y: auto;
        -webkit-overflow-scrolling: touch;

        transform: translateX(100%);
        visibility: hidden;

        transition:
            transform .28s ease,
            visibility .28s;
    }

    .gorun-components-menu.is-level-2 .gorun-components-content {
        transform: none;
        visibility: visible;
    }

    .gorun-components-pane-head {
        gap: 8px;

        margin-bottom: 0;
        padding: 12px 20px;

        border-bottom: 1px solid #F1F1F1;
    }

    .gorun-components-back {
        display: inline-flex;
        align-items: center;
        justify-content: center;

        flex: 0 0 auto;

        width: 34px;
        height: 34px;
        margin-left: -9px;
        padding: 0;

        border: 0;
        background: none;
        color: var(--gp-ink);

        cursor: pointer;
    }

    .gorun-components-back svg {
        width: 20px;
        height: 20px;
    }

    .gorun-components-pane-title {
        font-size: 17px;
    }

    .gorun-components-brands {
        padding: 0;

        grid-template-columns: minmax(0, 1fr);
        column-gap: 0;

        border-bottom: 0;
    }

    .gorun-components-brands li {
        margin: 0;

        border-bottom: 1px solid #F1F1F1;
    }

    .gorun-components-brands a {
        display: block;

        padding: 16px 20px;

        color: #3F444B;

        font-size: 15px;
        font-weight: 500;
    }

    .gorun-components-empty {
        padding: 20px;

        border-bottom: 0;
    }

    /* Drilling in took the place of the tap that would have
       opened the category, so it is given its own way out. */
    .gorun-components-view-all {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 10px;

        padding: 16px 20px;

        color: var(--gp-gold-dark);

        font-size: 14.5px;
        font-weight: 700;
        text-decoration: none;
    }

    .gorun-components-view-all svg {
        flex: 0 0 auto;

        width: 16px;
        height: 16px;
    }


    /* --- account --- */

    .gorun-components-account {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;

        flex: 0 0 auto;

        padding: 14px 18px;
        padding-bottom: calc(14px + env(safe-area-inset-bottom, 0px));

        border-top: 1px solid #ECECEC;
        background: #FFFFFF;
    }

    .gorun-components-account-link {
        display: flex;
        align-items: center;
        justify-content: center;

        min-height: 46px;
        padding: 0 14px;

        border-radius: 999px;

        font-size: 14.5px;
        font-weight: 700;
        text-decoration: none;

        transition:
            background .18s ease,
            border-color .18s ease;
    }

    .gorun-components-account-link.is-ghost {
        border: 1.5px solid #DCDCDC;
        color: var(--gp-ink);
    }

    .gorun-components-account-link.is-ghost:active {
        border-color: var(--gp-gold);
    }

    .gorun-components-account-link.is-solid {
        background: var(--gp-gold);
        color: #1B1C1C;
    }

    .gorun-components-account-link.is-solid:active {
        background: var(--gp-gold-deep);
    }

}


/* ==========================================================
   GORUN SOLAR - MOBILE MENU DRAWER
   ==========================================================

   The whole header menu as an off canvas drawer. One screen
   per branch, printed flat and stacked here: the current screen
   sits at rest, the ones it came out of are parked to the left,
   everything else waits off the right edge.

   Only ever seen under 1024px - above that the header shows its
   own menu and the drawer is not rendered at all.

   Same token names the product listing uses, redeclared here so
   the drawer stands on its own.
   ========================================================== */

.gorun-drawer {
    display: none;
}

@media (max-width: 1024px) {

    /* Elementor's own dropdown is replaced by this, so it must
       not open underneath it when the hamburger is tapped. */
    .elementor-location-header .elementor-nav-menu--dropdown,
    .elementor-location-header .elementor-nav-menu__container.elementor-nav-menu--dropdown {
        display: none !important;
    }

    /* The page must not scroll behind an open drawer. The
       script stops Lenis alongside this - overflow on its own
       does not hold a smooth scroller. */
    html.gorun-drawer-locked,
    html.gorun-drawer-locked body {
        overflow: hidden;
    }

    .gorun-drawer {
        --gp-gold: #FDB813;
        --gp-gold-deep: #E19B00;
        --gp-gold-dark: #B78300;
        --gp-ink: #1B1C1C;
        --gp-muted: #8A8A8A;

        display: block;

        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        z-index: 99991;

        width: min(420px, calc(100vw - 32px));

        color: var(--gp-ink);

        transform: translateX(100%);

        visibility: hidden;

        transition:
            transform .3s ease,
            visibility .3s;
    }

    .gorun-drawer *,
    .gorun-drawer *::before,
    .gorun-drawer *::after {
        box-sizing: border-box;
    }

    .gorun-drawer.is-open {
        transform: none;
        visibility: visible;
    }

    /* Scrim. A pseudo element rather than a node, so it is not
       an event target of its own - a tap on it lands on the
       wrapper, which is what the script closes on. */
    .gorun-drawer::before {
        content: "";

        position: fixed;
        inset: 0;
        z-index: -1;

        background: rgba(27, 28, 28, .45);

        opacity: 0;

        transition: opacity .3s ease;
    }

    .gorun-drawer.is-open::before {
        opacity: 1;
    }

    .gorun-drawer-card {
        display: flex;
        flex-direction: column;

        height: 100%;

        background: #FFFFFF;

        box-shadow: -18px 0 40px rgba(27, 28, 28, .18);
    }


    /* ------------------------------------------
       BAR
       ------------------------------------------ */

    .gorun-drawer-bar {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 16px;

        flex: 0 0 auto;

        padding: 14px 10px 14px 20px;

        border-bottom: 1px solid #ECECEC;
    }

    .gorun-drawer-logo {
        display: inline-flex;
        align-items: center;

        min-width: 0;

        max-width: 190px;

        font-size: 17px;
        font-weight: 700;
        line-height: 1.2;
    }

    /* The script swaps in the header's own mark on first open;
       the_custom_logo() is only what stands there until then.
       Either way the link and the image are re-capped so a wide
       logo cannot push the close button off the bar. */
    .gorun-drawer-logo a,
    .gorun-drawer-logo .custom-logo-link {
        display: inline-flex;
        align-items: center;

        max-width: 170px;
    }

    .gorun-drawer-logo img,
    .gorun-drawer-logo .custom-logo {
        display: block;

        width: auto;
        height: auto;
        max-width: 100%;
        max-height: 36px;

        object-fit: contain;
    }

    /* An inline SVG has no intrinsic size to fall back on -
       without a height it lays out at the CSS default 150px. */
    .gorun-drawer-logo svg {
        display: block;

        width: auto;
        height: 36px;
        max-width: 100%;
    }

    .gorun-drawer-close {
        display: inline-flex;
        align-items: center;
        justify-content: center;

        flex: 0 0 auto;

        width: 42px;
        height: 42px;
        padding: 0;

        border: 0;
        border-radius: 50%;
        background: none;
        color: var(--gp-ink);

        font-family: inherit;

        cursor: pointer;
    }

    .gorun-drawer-close svg {
        width: 22px;
        height: 22px;
    }

    .gorun-drawer-close:active {
        background: #F4F4F4;
    }


    /* ------------------------------------------
       SCREENS
       ------------------------------------------ */

    .gorun-drawer-body {
        position: relative;

        flex: 1 1 auto;

        min-height: 0;

        overflow: hidden;
    }

    .gorun-drawer-screen {
        position: absolute;
        inset: 0;

        background: #FFFFFF;

        overflow-y: auto;
        -webkit-overflow-scrolling: touch;

        transform: translateX(100%);
        visibility: hidden;

        transition:
            transform .28s ease,
            opacity .28s ease,
            visibility .28s;
    }

    .gorun-drawer-screen.is-current {
        transform: none;
        visibility: visible;
    }

    /* Screens already stepped through. Parked short of the left
       edge so stepping back reads as coming forward again
       rather than sliding in from nowhere. */
    .gorun-drawer-screen.is-behind {
        transform: translateX(-22%);

        opacity: 0;
        visibility: hidden;
    }

    .gorun-drawer-head {
        position: sticky;
        top: 0;
        z-index: 1;

        display: flex;
        align-items: center;
        gap: 6px;

        padding: 12px 20px;

        border-bottom: 1px solid #F1F1F1;
        background: #FFFFFF;
    }

    .gorun-drawer-back {
        display: inline-flex;
        align-items: center;
        justify-content: center;

        flex: 0 0 auto;

        width: 34px;
        height: 34px;
        margin-left: -9px;
        padding: 0;

        border: 0;
        background: none;
        color: var(--gp-ink);

        font-family: inherit;

        cursor: pointer;
    }

    .gorun-drawer-back svg {
        width: 20px;
        height: 20px;
    }

    .gorun-drawer-head-title {
        min-width: 0;

        font-size: 17px;
        font-weight: 700;
        line-height: 1.2;
    }


    /* ------------------------------------------
       ROWS
       ------------------------------------------ */

    .gorun-drawer-list {
        margin: 0;
        padding: 0 0 20px;

        list-style: none;
    }

    .gorun-drawer-list li {
        margin: 0;
    }

    .gorun-drawer-row {
        display: flex;
        align-items: center;
        gap: 14px;

        width: 100%;
        padding: 17px 20px;

        border: 0;
        border-bottom: 1px solid #F1F1F1;
        border-radius: 0;
        background: none;
        color: var(--gp-ink);

        font-family: inherit;
        font-size: 16px;
        font-weight: 600;
        line-height: 1.25;
        text-align: left;
        text-decoration: none;

        cursor: pointer;

        transition: background .15s ease;
    }

    .gorun-drawer-row:active {
        background: #F7F7F8;
    }

    .gorun-drawer-row:hover,
    .gorun-drawer-row:focus-visible {
        color: var(--gp-ink);

        text-decoration: none;
    }

    .gorun-drawer-row-icon {
        display: inline-flex;
        align-items: center;
        justify-content: center;

        flex: 0 0 auto;

        width: 20px;
        height: 20px;

        color: var(--gp-gold-dark);
    }

    .gorun-drawer-row-icon svg,
    .gorun-drawer-row-icon img {
        width: 100%;
        height: 100%;

        object-fit: contain;
    }

    .gorun-drawer-row-text {
        flex: 1 1 auto;

        min-width: 0;
    }

    .gorun-drawer-row-next {
        display: inline-flex;

        flex: 0 0 auto;

        width: 18px;
        height: 18px;

        color: #B5B5B5;
    }

    .gorun-drawer-row-next svg {
        width: 100%;
        height: 100%;
    }

    /* Drilling in takes the place of the tap that would have
       opened the parent, so its own page is given a way out. */
    .gorun-drawer-row.is-all {
        color: var(--gp-gold-dark);

        font-size: 14.5px;
        font-weight: 700;
    }

    .gorun-drawer-row.is-all .gorun-drawer-row-next {
        color: var(--gp-gold-dark);

        width: 16px;
        height: 16px;
    }


    /* ------------------------------------------
       ACCOUNT
       ------------------------------------------ */

    .gorun-drawer-account {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;

        flex: 0 0 auto;

        padding: 14px 18px;
        padding-bottom: calc(14px + env(safe-area-inset-bottom, 0px));

        border-top: 1px solid #ECECEC;
        background: #FFFFFF;
    }

    .gorun-drawer-account-link {
        display: flex;
        align-items: center;
        justify-content: center;

        min-height: 46px;
        padding: 0 14px;

        border-radius: 999px;

        font-size: 14.5px;
        font-weight: 700;
        text-decoration: none;

        transition:
            background .18s ease,
            border-color .18s ease;
    }

    .gorun-drawer-account-link.is-ghost {
        border: 1.5px solid #DCDCDC;
        color: var(--gp-ink);
    }

    .gorun-drawer-account-link.is-ghost:active {
        border-color: var(--gp-gold);
    }

    .gorun-drawer-account-link.is-solid {
        background: var(--gp-gold);
        color: #1B1C1C;
    }

    .gorun-drawer-account-link.is-solid:active {
        background: var(--gp-gold-deep);
    }

}


/* ==========================================================
   GORUN SOLAR - POST FAQ
   ==========================================================

   The accordion printed by [gorun_faq]. Cards only - no page
   background, no section padding and no heading, because the
   section around it is built in Elementor.

   The panel animates on an explicit height set by the script,
   so an answer of any length opens at its own pace instead of
   racing a guessed max-height. Nothing collapses until the
   script adds .is-ready, so a failed script leaves the answers
   open rather than unreachable.

   Same token names the rest of the theme uses, redeclared here
   so the block stands on its own wherever it is dropped.
   ========================================================== */

.gorun-faq {
    --gp-gold: #FDB813;
    --gp-ink: #10182F;
    --gp-faq-card: #FFFFFF;
    --gp-faq-line: #ECEEF1;
    --gp-faq-body: #6B7280;
    --gp-faq-radius: 14px;
    --gp-faq-gap: 12px;
    --gp-faq-pad-x: 24px;
    --gp-faq-pad-y: 20px;

    display: flex;
    flex-direction: column;
    gap: var(--gp-faq-gap);

    width: 100%;
}

.gorun-faq *,
.gorun-faq *::before,
.gorun-faq *::after {
    box-sizing: border-box;
}


/* ----------------------------------------------------------
   CARD
   ---------------------------------------------------------- */

.gorun-faq .gorun-faq-item {
    background: var(--gp-faq-card);
    border: 1.5px solid var(--gp-faq-line);
    border-radius: var(--gp-faq-radius);

    transition:
        border-color .2s ease,
        box-shadow .2s ease;
}

.gorun-faq .gorun-faq-item:hover {
    border-color: #DDE1E7;
}

.gorun-faq .gorun-faq-item.is-open {
    border-color: var(--gp-gold);
    box-shadow: 0 2px 14px rgba(16, 24, 47, .06);
}


/* ----------------------------------------------------------
   QUESTION
   ----------------------------------------------------------

   The heading carries no styling of its own - the button is the
   whole row, so the entire card top is the hit area. */

.gorun-faq .gorun-faq-head {
    margin: 0;
    padding: 0;

    font-size: inherit;
    font-weight: inherit;
    line-height: inherit;
}

.gorun-faq .gorun-faq-q {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;

    width: 100%;
    margin: 0;
    padding: var(--gp-faq-pad-y) var(--gp-faq-pad-x);

    background: none;
    border: 0;
    border-radius: var(--gp-faq-radius);

    font: inherit;
    text-align: left;
    color: var(--gp-ink);

    cursor: pointer;
    -webkit-appearance: none;
    appearance: none;
}

.gorun-faq .gorun-faq-q:focus-visible {
    outline: 2px solid var(--gp-gold);
    outline-offset: -2px;
}

.gorun-faq .gorun-faq-label {
    flex: 1 1 auto;

    font-size: 15.5px;
    font-weight: 600;
    line-height: 1.45;
    letter-spacing: -.005em;
}


/* ----------------------------------------------------------
   TOGGLE
   ----------------------------------------------------------

   One circle holding two bars. Closed it is a filled dark plus,
   open it is an outlined light cross - the vertical bar simply
   turns and the horizontal one follows it. */

.gorun-faq .gorun-faq-toggle {
    position: relative;

    flex: 0 0 auto;

    width: 26px;
    height: 26px;

    background: var(--gp-ink);
    border: 1.5px solid var(--gp-ink);
    border-radius: 50%;

    transition:
        background .2s ease,
        border-color .2s ease,
        transform .25s ease;
}

.gorun-faq .gorun-faq-toggle::before,
.gorun-faq .gorun-faq-toggle::after {
    content: "";

    position: absolute;
    top: 50%;
    left: 50%;

    width: 10px;
    height: 1.5px;

    background: #FFFFFF;
    border-radius: 2px;

    transform: translate(-50%, -50%);

    transition:
        background .2s ease,
        transform .25s ease;
}

.gorun-faq .gorun-faq-toggle::after {
    transform: translate(-50%, -50%) rotate(90deg);
}

.gorun-faq .gorun-faq-q:hover .gorun-faq-toggle {
    transform: scale(1.06);
}

.gorun-faq .gorun-faq-item.is-open .gorun-faq-toggle {
    background: #FFFFFF;
    border-color: #DDE1E7;
}

.gorun-faq .gorun-faq-item.is-open .gorun-faq-toggle::before,
.gorun-faq .gorun-faq-item.is-open .gorun-faq-toggle::after {
    background: var(--gp-ink);
}

.gorun-faq .gorun-faq-item.is-open .gorun-faq-toggle::before {
    transform: translate(-50%, -50%) rotate(45deg);
}

.gorun-faq .gorun-faq-item.is-open .gorun-faq-toggle::after {
    transform: translate(-50%, -50%) rotate(-45deg);
}


/* ----------------------------------------------------------
   ANSWER
   ---------------------------------------------------------- */

/* Panels collapse only once the script has claimed the block.
   With no JS every answer stays open and readable, which is
   also what the FAQPage schema in the head describes. */
.gorun-faq.is-ready .gorun-faq-panel {
    height: 0;
    overflow: hidden;

    /* visibility, not display, so the closed answer leaves the
       tab order and the screen reader without costing the
       height animation - it flips only once the collapse has
       finished. */
    visibility: hidden;

    transition:
        height .28s ease,
        visibility 0s linear .28s;
}

.gorun-faq.is-ready .gorun-faq-item.is-open .gorun-faq-panel {
    height: auto;
    visibility: visible;

    transition:
        height .28s ease,
        visibility 0s linear 0s;
}

.gorun-faq .gorun-faq-answer {
    padding: 0 var(--gp-faq-pad-x) var(--gp-faq-pad-y);

    /* The toggle's width and the gap beside it, so the answer
       does not run under the button. */
    padding-right: calc( var(--gp-faq-pad-x) + 26px + 18px );

    color: var(--gp-faq-body);
    font-size: 14px;
    line-height: 1.7;
}

.gorun-faq .gorun-faq-answer > :first-child {
    margin-top: 0;
}

.gorun-faq .gorun-faq-answer > :last-child {
    margin-bottom: 0;
}

.gorun-faq .gorun-faq-answer p {
    margin: 0 0 .8em;
}

.gorun-faq .gorun-faq-answer a {
    color: inherit;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.gorun-faq .gorun-faq-answer a:hover {
    color: var(--gp-ink);
}

.gorun-faq .gorun-faq-answer ul,
.gorun-faq .gorun-faq-answer ol {
    margin: 0 0 .8em;
    padding-left: 1.2em;
}


/* ----------------------------------------------------------
   SMALL SCREENS
   ---------------------------------------------------------- */

@media (max-width: 600px) {

    .gorun-faq {
        --gp-faq-pad-x: 18px;
        --gp-faq-pad-y: 16px;
        --gp-faq-gap: 10px;
    }

    .gorun-faq .gorun-faq-label {
        font-size: 15px;
    }

    .gorun-faq .gorun-faq-q {
        gap: 12px;
    }

    .gorun-faq .gorun-faq-answer {
        padding-right: var(--gp-faq-pad-x);
    }

}


@media (prefers-reduced-motion: reduce) {

    .gorun-faq .gorun-faq-item,
    .gorun-faq.is-ready .gorun-faq-panel,
    .gorun-faq.is-ready .gorun-faq-item.is-open .gorun-faq-panel,
    .gorun-faq .gorun-faq-toggle,
    .gorun-faq .gorun-faq-toggle::before,
    .gorun-faq .gorun-faq-toggle::after {
        transition: none;
    }

}


/* ==========================================================
   GORUN SOLAR - ELEMENTOR POPUP SCROLLING
   ==========================================================

   The half of the popup scroll fix that is not about Lenis
   (that part is data-lenis-prevent, stamped on in custom.js).

   Elementor sizes a popup from its own Height setting. On
   "Fit to Content" the modal is free to grow past the bottom
   of the screen with nothing scrolling: the page behind it is
   locked by prevent_scroll and the modal itself has no cap to
   scroll against. Capping the shell and letting the message
   pane take the overflow is what gives the wheel something to
   move.

   Only bites when the content is genuinely taller than the
   screen - a short popup is left exactly where Elementor put
   it.
   ========================================================== */

.elementor-popup-modal .dialog-widget-content {
    display: flex;
    flex-direction: column;

    /* dvh so the mobile URL bar collapsing does not leave the
       bottom of the popup parked under it. vh first for the
       browsers that do not know dvh. */
    max-height: calc(100vh - 40px);
    max-height: calc(100dvh - 40px);
}


.elementor-popup-modal .dialog-message {
    /* Elementor's own max-height is per popup and can be well
       past the viewport; the shell above is the real cap now. */
    max-height: none;

    overflow-y: auto;

    /* Reaching the end of the form must not start dragging
       whatever is behind the popup. */
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
}


/* The close button is positioned against the shell, not the
   scrolling pane, so it stays put while the form moves. */
.elementor-popup-modal .dialog-close-button {
    z-index: 2;
}


/* ----------------------------------------------------------
   The scrollbar itself.

   The default is the OS one: a wide grey channel with arrow
   buttons, painted hard against the popup's rounded corner.
   Same treatment the blog contents box gets - thin, no track,
   rounded thumb - so it reads as part of the popup instead of
   part of the browser.

   Firefox and current Chrome take scrollbar-width/-color;
   older WebKit needs the ::-webkit- rules underneath. Both are
   declared, and whichever the browser understands wins.
   ---------------------------------------------------------- */

.elementor-popup-modal .dialog-message {
    scrollbar-width: thin;

    /* Transparent track is what drops the grey channel. */
    scrollbar-color: #D8D8D5 transparent;
}


.elementor-popup-modal .dialog-message::-webkit-scrollbar {
    width: 6px;
}


.elementor-popup-modal .dialog-message::-webkit-scrollbar-track {
    background: transparent;
}


.elementor-popup-modal .dialog-message::-webkit-scrollbar-thumb {
    border-radius: 3px;
    background: #D8D8D5;
}


.elementor-popup-modal .dialog-message::-webkit-scrollbar-thumb:hover {
    background: var(--gp-muted, #8A8A8A);
}


/*.testimonial_section .testimonials_vedio .elementor-wrapper {*/
/*    height: 100%; !important;*/
/*    aspect-ratio: auto !important;*/
/*}*/

/*.direction_map .place-details-compact-container {*/
/*    display: none !important;*/
/*}*/


/* =========================================
   SERVICE AREA - RESPONSIVE LIST
   ========================================= */

.service_area_section .elementor-icon-list-items {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    column-gap: 20px !important;
    row-gap: 8px !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}


/* Each item */
/*.service_area_section .elementor-icon-list-item {*/
/*    display: flex !important;*/
/*    align-items: center !important;*/
/*    width: 100% !important;*/
/*    margin: 0 !important;*/
/*    padding: 0 !important;*/
/*}*/


/* Icon */
/*.service_area_section .elementor-icon-list-icon {*/
/*    display: flex !important;*/
/*    align-items: center !important;*/
/*    justify-content: center !important;*/
/*    flex-shrink: 0 !important;*/
/*    margin-right: 10px !important;*/
/*}*/


/* Text */
/*.service_area_section .elementor-icon-list-text {*/
/*    white-space: nowrap !important;*/
/*}*/


/* =========================================
   TABLET
   ========================================= */

/*@media (max-width: 1024px) {*/

/*    .service_area_section .elementor-icon-list-items {*/
/*        grid-template-columns: repeat(3, 1fr) !important;*/
/*        column-gap: 20px !important;*/
/*        row-gap: 10px !important;*/
/*    }*/

/*}*/


/* Service Area - 3 Columns */
.service_area_section .elementor-icon-list-items {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    column-gap: 25px !important;
    row-gap: 12px !important;
}

.service_area_section .elementor-icon-list-item {
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

/*.service_area_section .elementor-icon-list-icon {*/
/*    display: flex !important;*/
/*    align-items: center !important;*/
/*    justify-content: center !important;*/
/*    flex-shrink: 0 !important;*/
/*    margin-right: 10px !important;*/
/*}*/


.service_area_section .elementor-inline-item {
    display: flex !important;
    flex-direction: row;
    /* align-content: flex-start; */
    align-items: flex-start;
}


.service_area_section .elementor-icon-list-icon {
  margin-top : 0px;
}

.service_area_section .elementor-icon-list-text {
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: unset !important;
}


/* Mobile */
@media (max-width: 770px) {
    .service_area_section .elementor-icon-list-items {
        grid-template-columns: repeat(1, 1fr) !important;
        column-gap: 15px !important;
        row-gap: 12px !important;
    }
}


/* Small Mobile */
@media (max-width: 480px) {
    .service_area_section .elementor-icon-list-items {
        grid-template-columns: 1fr !important;
    }
}


/* =========================================
   MOBILE
   ========================================= */

@media (max-width: 767px) {

    .service_area_section .elementor-icon-list-items {
        grid-template-columns: repeat(1, 1fr) !important;
        column-gap: 15px !important;
        row-gap: 10px !important;
    }

    .service_area_section .elementor-icon-list-text {
        white-space: normal !important;
    }

    .service_area_section .elementor-icon-list-icon {
        margin-right: 7px !important;
    }

}


@media (max-width: 320px) {
    h1, h2 {
        font-size: 22px !important;
        line-height: 32px !important;
    }
}



/* Map wrapper */
.map_hotspot_wrapper {
    position: relative;
}

/* Hotspot */
.map_hotspot {
    position: absolute;
    width: 22px;
    height: 22px;
    background: #02010100;
    border-radius: 50%;
    cursor: pointer;
    z-index: 10;
    transition: all 0.3s ease;
}

/* Hotspot hover */
.map_hotspot:hover {
    transform: scale(1.2);
}

/* Hide all location content */
.map_location_content {
    display: none;
}

/* Show active location */
.map_location_content.active {
    display: flex;
}
.brs_slider_container {
	height: 100% !important;
    --flex-wrap: none !important;
}

.swiper-slide .brs_slides {
	height: 100% !important;
}

.swiper-slide .brs_slides .brs_slider_wrap_container {
	height: 100% !important;
}


/*.Technical_Specifications {*/
/*    max-height: 0 !important;*/
/*    overflow: hidden !important;*/
/*    opacity: 0;*/
/*    visibility: hidden;*/
/*    transition: max-height 0.6s ease, opacity 0.4s ease, visibility 0.6s ease;*/
/*}*/

/*.Technical_Specifications.is-open {*/
/*    max-height: 1000px !important;*/
/*    opacity: 1;*/
/*    visibility: visible;*/
/*}*/

/*.view_Technical_Specifications .elementor-button-icon {*/
/*    transition: transform 0.3s ease;*/
/*}*/

/*.view_Technical_Specifications.is-open .elementor-button-icon {*/
/*    transform: rotate(180deg);*/
/*}*/


.Technical_Specifications {
    max-height: 0 !important;
    overflow: hidden !important;
    opacity: 0;
    visibility: hidden;
    transition: max-height 0.9s ease, opacity 0.6s ease, visibility 0.9s ease;
}

.Technical_Specifications.is-open {
    max-height: 1000px !important;
    opacity: 1;
    visibility: visible;
}

.view_Technical_Specifications .elementor-button-icon {
    transition: transform 0.3s ease;
}

.view_Technical_Specifications.is-open .elementor-button-icon {
    transform: rotate(180deg);
}

.res_detail_tab_title_btn a {
    text-align: left;
}

.my-account-container {
    background: linear-gradient(135deg, #F8F9FA 0%, #E7E8E9 100%);
}





/* ============================================================
   OFFLINE PRODUCTS - GET A QUOTE POPUP
   ============================================================ */

.gorun-quote-btn {
    cursor: pointer;
    text-align: center;
}

html.gorun-quote-open,
html.gorun-quote-open body {
    overflow: hidden;
}

.gorun-quote-modal {
    position: fixed;
    inset: 0;
    z-index: 99999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
}

.gorun-quote-modal[hidden] {
    display: none;
}

.gorun-quote-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.6);
}

.gorun-quote-dialog {
    position: relative;
    width: 100%;
    max-width: 720px;
    max-height: calc(100vh - 32px);
    overflow-y: auto;
    background: #fff;
    border-radius: 12px;
    padding: 40px 24px 24px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.25);
    outline: none;
}

.gorun-quote-close {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: #f2f2f2;
    color: #111;
    cursor: pointer;
}

.gorun-quote-close:hover {
    background: #F4C430;
}

.gorun-quote-close svg {
    width: 18px;
    height: 18px;
}

.gorun-quote-product {
    margin: 0 0 16px;
    font-weight: 600;
}

.gorun-quote-product[hidden] {
    display: none;
}

/*
 * Elementor popup "Prevent Page Scrolling" sets max-height:100vh on
 * <body>. Because :root has overflow-x:hidden, <html> is the scroller,
 * so that shrinks the page and jumps it to the top. Lock <html>
 * instead so the page stays where it was while the popup is open.
 */
body.dialog-prevent-scroll {
    max-height: none;
    overflow: visible;
}

html:has(body.dialog-prevent-scroll) {
    overflow: hidden;
}

.your_energy_needs_icons .elementor-icon-box-title {
    margin-top: 0px;
}

.component_why_choose_gorun .elementor-icon-box-title {
    margin-top: 0px; 
}

.iti__selected-country-primary {
    display: none !important;
}

.iti__selected-country {
    border-right: 1px solid #cfcfcf !important;
    padding-right: 10px !important;
}

.iti--allow-dropdown input.iti__tel-input, .iti--allow-dropdown input.iti__tel-input[type=tel], .iti--allow-dropdown input.iti__tel-input[type=text] {
    padding-left: 46px !important;
}


/* ===== Get a Quote Popup – form layout & error message fix ===== */

/* Stop the other column (Interest) from being pushed down when an error shows */
.get_a_quote_popup_wrap .get_a_quote_popup .elementor-form-fields-wrapper {
    align-items: flex-start !important;
}

.get_a_quote_popup_wrap .get_a_quote_popup .elementor-form-fields-wrapper > .elementor-field-group {
    align-items: flex-start !important;
    align-content: flex-start !important;
    align-self: flex-start !important;
}

/* Phone field wrapper full width + red border on error */
.get_a_quote_popup_wrap .get_a_quote_popup .elementor-field-type-tel .iti {
    width: 100% !important;
}

.get_a_quote_popup_wrap .get_a_quote_popup .elementor-field-type-tel .iti.elementor-error input {
    border-color: #e5484d !important;
}

/* Error message – small & clean */
.get_a_quote_popup_wrap .get_a_quote_popup .elementor-field-group .elementor-message,
.get_a_quote_popup_wrap .get_a_quote_popup .elementor-field-group .elementor-message-danger,
.get_a_quote_popup_wrap .get_a_quote_popup .elementor-field-group .elementor-help-inline,
.get_a_quote_popup_wrap .get_a_quote_popup .elementor-field-group [role="alert"],
.get_a_quote_popup_wrap .get_a_quote_popup .elementor-field-group [class*="error-msg"],
.get_a_quote_popup_wrap .get_a_quote_popup .elementor-field-group [class*="cfefp"][class*="error"],
.get_a_quote_popup_wrap .get_a_quote_popup .elementor-field-type-tel > span {
    display: block !important;
    width: 100% !important;
    margin: 5px 0 0 !important;
    padding: 0 0 0 2px !important;
    font-size: 12px !important;
    line-height: 1.35 !important;
    font-weight: 400 !important;
    color: #e5484d !important;
    background: none !important;
    border: 0 !important;
}

/* Hide the big ✕ icon */
.get_a_quote_popup_wrap .get_a_quote_popup .elementor-field-group .elementor-message:before,
.get_a_quote_popup_wrap .get_a_quote_popup .elementor-field-group .elementor-message-danger:before {
    display: none !important;
}


/* ==========================================================
   GORUN SOLAR - ORDER RECEIVED (THANK YOU) PAGE
   ==========================================================

   Printed by [gorun_checkout] on the order-received endpoint -
   see gorun_thankyou_render() in functions.php.
   ========================================================== */

.gorun-ty {
    --gp-gold: #F4B400;
    --gp-gold-deep: #E0A200;
    --gp-ink: #1B1C1C;
    --gp-slate: #3F4654;
    --gp-muted: #6B7280;
    --gp-line: #E5E7EB;

    display: flex;
    flex-direction: column;
    gap: 20px;

    max-width: 1080px;
    margin: 0 auto;
    padding: 60px 16px;

    color: var(--gp-ink);

    font-family: inherit;
}

.gorun-ty *,
.gorun-ty *::before,
.gorun-ty *::after {
    box-sizing: border-box;
}

.gorun-ty p {
    margin: 0;
}


/* HEADER */

.gorun-ty-head {
    display: flex;
    align-items: center;
    gap: 16px;

    margin-bottom: 20px;
}

.gorun-ty-check {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;

    width: 48px;
    height: 48px;

    border: 1px solid var(--gp-line);
    border-radius: 50%;

    color: var(--gp-muted);
}

.gorun-ty-check svg {
    width: 20px;
    height: 20px;
}

.gorun-ty-number {
    font-size: 18px;
    font-weight: 600;
    line-height: 1.3;
}

.gorun-ty-thanks {
    color: var(--gp-slate);

    font-size: 18px;
    line-height: 1.3;
}


/* CARDS */

.gorun-ty-card {
    padding: 28px 24px;

    border: 1px solid var(--gp-line);
    border-radius: 4px;

    background: #FFFFFF;
}

.gorun-ty-card-title {
    margin: 0 0 14px;

    color: var(--gp-ink);

    font-size: 20px;
    font-weight: 600;
    line-height: 1.3;
}

.gorun-ty-text {
    color: var(--gp-slate);

    font-size: 15px;
    line-height: 1.6;
}

.gorun-ty-card .gorun-ty-button {
    margin-top: 18px;
}

/* Bank transfer details and other gateway output */
.gorun-ty-extra h2 {
    margin: 0 0 12px;

    font-size: 18px;
    font-weight: 600;
}

.gorun-ty-extra ul {
    margin: 0;
    padding-left: 18px;

    color: var(--gp-slate);

    font-size: 14px;
    line-height: 1.7;
}


/* INFORMATION */

.gorun-ty-info {
    display: grid;
    grid-template-columns: 1.7fr 1fr;
    gap: 24px 32px;

    margin-top: 10px;
}

.gorun-ty-details {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 26px 24px;

    align-content: start;
}

.gorun-ty-block h4,
.gorun-ty-items h4 {
    margin: 0 0 10px;

    color: var(--gp-slate);

    font-size: 14px;
    font-weight: 700;
    line-height: 1.3;
}

.gorun-ty-block p {
    color: var(--gp-ink);

    font-size: 14px;
    line-height: 1.55;
}

.gorun-ty-item {
    margin-bottom: 18px;
}

.gorun-ty-item:last-child {
    margin-bottom: 0;
}

.gorun-ty-item-name {
    color: var(--gp-slate);

    font-size: 16px;
    line-height: 1.4;
}

.gorun-ty-item-meta {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;

    margin-top: 4px;

    color: var(--gp-muted);

    font-size: 12px;
}

.gorun-ty-item-price {
    color: var(--gp-gold-deep);

    font-size: 15px;
    font-weight: 500;
}


/* TOTAL */

.gorun-ty-total {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;

    margin-top: 28px;
    padding-top: 18px;

    border-top: 1px solid var(--gp-line);
}

.gorun-ty-total-label {
    margin-bottom: 6px !important;

    color: var(--gp-slate);

    font-size: 18px;
    font-weight: 700;
}

.gorun-ty-total-value {
    color: var(--gp-gold-deep);

    font-size: 34px;
    font-weight: 700;
    line-height: 1.1;
    white-space: nowrap;
}

.gorun-ty-total-value small {
    margin-right: 4px;

    font-size: 12px;
    font-weight: 500;
}


/* BUTTON */

.gorun-ty-actions {
    display: flex;
    justify-content: flex-end;
}

.gorun-ty-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 50px;
    padding: 0 38px;

    border-radius: 6px;

    background: var(--gp-gold);
    color: #1B1C1C;

    font-size: 16px;
    font-weight: 700;
    text-decoration: none;

    transition: background .18s ease;
}

.gorun-ty-button:hover,
.gorun-ty-button:focus {
    background: var(--gp-gold-deep);
    color: #1B1C1C;
}


/* MOBILE */

@media (max-width: 860px) {

    .gorun-ty-info {
        grid-template-columns: 1fr;
    }
    .footer_form .elementor-column.elementor-sm-80 {
        width: 40%;
    }

    .swiper-slide .brs_slides .brs_slider_wrap_container {
        height: 100% !important;
        flex-wrap: nowrap !important;
    }

}

@media (max-width: 560px) {

    .gorun-ty {
        padding: 40px 16px;
    }

    .gorun-ty-details {
        grid-template-columns: 1fr;
    }

    .gorun-ty-total {
        flex-direction: column;
        align-items: flex-start;
    }

    .gorun-ty-total-value {
        font-size: 28px;
    }

    .gorun-ty-actions .gorun-ty-button {
        width: 100%;
    }

    .footer_form .elementor-column.elementor-sm-80 {
        width: 80%;
    }

}


/* Order received: hide the checkout hero straight away, so it
   does not flash before custom.js swaps in the order-confirmed
   banner. The hero is the section just above the one holding
   the order details (.gorun-ty-banner). */
body.woocommerce-order-received .checkout_banner,
body.woocommerce-order-received .elementor > .e-con:has(+ .e-con .gorun-ty-banner),
body.woocommerce-order-received .elementor > .elementor-section:has(+ .elementor-section .gorun-ty-banner),
body.woocommerce-order-received .elementor-section-wrap > .elementor-section:has(+ .elementor-section .gorun-ty-banner) {
    display: none !important;
}


/* Header: logged-in user's profile picture in place of the
   user icon (swapped in by custom.js). Same size as the other
   header icons, with a gold ring to match them. */
.header_icon .gorun-header-avatar {
    display: block;
    flex: 0 0 auto;
    box-sizing: border-box;

    /* Fallback only - custom.js sets the real icon size. */
    width: var(--e-icon-list-icon-size, 32px);
    height: var(--e-icon-list-icon-size, 32px);
    max-width: none;
    margin: 0;
    padding: 0;

    /* Ring drawn inside the size, not around it */
    border: 2px solid #F4B400;
    border-radius: 50%;
    background: #F4B400;

    object-fit: cover;
}

.gorun-header-avatar {
    margin-right: 6px !important;
}

.footer_form .elementor-field-type-submit button{
    min-height: 44px !important;
}