/* =========================================================
   MOTOMART INSURANCE — FULL DARK MODE
========================================================= */

body.dark-mode {
    background: #07110c;
    color: #e5f1eb;
}

/* =========================================================
   TOP BAR
========================================================= */

body.dark-mode .insurance-top {
    background: #0b1812;
    border-bottom-color: #1d3528;
}

body.dark-mode .brand-area img {
    filter: brightness(1.05);
}

body.dark-mode .back-home {
    background: #10251a;
    border-color: #28513d;
    color: #8fe0b4;
}

body.dark-mode .back-home:hover {
    background: #163323;
    border-color: #37684f;
}


/* =========================================================
   HERO
========================================================= */

body.dark-mode .hero {
    background: #091710;
    color: #e5f1eb;
}

body.dark-mode .hero::before {
    background: rgba(36, 180, 112, 0.07);
}

body.dark-mode .hero::after {
    background: rgba(36, 180, 112, 0.05);
}

body.dark-mode .hero-badge {
    background: #10261b;
    border-color: #28513d;
    color: #8fe0b4;
}

body.dark-mode .hero-badge i {
    color: #79dca5;
}

body.dark-mode .hero h1 {
    color: #edf8f2;
}

body.dark-mode .hero h1 span {
    color: #54c98b;
}

body.dark-mode .hero-description {
    color: #9aaca3;
}


/* =========================================================
   HERO BUTTONS
========================================================= */

body.dark-mode .hero-btn.primary {
    background: #087a4d;
    color: #fff;
}

body.dark-mode .hero-btn.primary:hover {
    background: #099261;
}

body.dark-mode .hero-btn.secondary {
    background: #0d1d15;
    border-color: #2a4b3a;
    color: #8fe0b4;
}

body.dark-mode .hero-btn.secondary:hover {
    background: #132a1e;
    border-color: #3b6b50;
}


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

body.dark-mode .hero-card {
    background: #0d1b14;
    border-color: #244033;
    box-shadow: 0 15px 40px rgba(0, 0, 0, .25);
}

body.dark-mode .hero-card-title {
    color: #e8f5ee;
}

body.dark-mode .hero-stat {
    border-bottom-color: #20372b;
}

body.dark-mode .hero-stat-icon {
    background: #103322;
    color: #79dca5;
    border-color: #28573f;
}

body.dark-mode .hero-stat strong {
    color: #dcece4;
}

body.dark-mode .hero-stat span {
    color: #879b91;
}


/* =========================================================
   APPLICATION SECTION
========================================================= */

body.dark-mode .application-section {
    background: #07110c;
}


/* =========================================================
   POSTER PANEL
========================================================= */

body.dark-mode .poster-panel {
    background: #0c1a13;
    border-color: #243f31;
    box-shadow: 0 15px 45px rgba(0, 0, 0, .25);
}

body.dark-mode .poster-header {
    background: linear-gradient(
        135deg,
        #10231a,
        #0c1a13
    );
    border-bottom-color: #243f31;
}

body.dark-mode .poster-header h3 {
    color: #8fe0b4;
}

body.dark-mode .poster-header h3::before {
    background: #0b8f5a;
}

body.dark-mode .poster-header p {
    color: #879b91;
}

body.dark-mode .poster {
    background: #09150f;
    border-color: #263f33;
}

body.dark-mode .poster img,
body.dark-mode .poster video {
    background: #09150f;
}


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

body.dark-mode .form-card {
    background: #0c1a13;
    border-color: #243f31;
    box-shadow: 0 15px 45px rgba(0, 0, 0, .25);
}

body.dark-mode .form-top {
    border-bottom-color: #21382d;
}

body.dark-mode .form-title h2 {
    color: #e8f4ed;
}

body.dark-mode .form-title p {
    color: #8ea198;
}

body.dark-mode .form-icon {
    background: #103322;
    border-color: #28573f;
    color: #79dca5;
}


/* =========================================================
   FORM SECTIONS
========================================================= */

body.dark-mode .form-section-title {
    color: #dcece4;
    border-bottom-color: #21382d;
}

body.dark-mode .form-section-title i {
    color: #59c98c;
}


/* =========================================================
   FORM LABELS
========================================================= */

body.dark-mode .field label {
    color: #b3c5bc;
}


/* =========================================================
   FORM INPUTS
========================================================= */

body.dark-mode .field input,
body.dark-mode .field select,
body.dark-mode .field textarea {
    background: #08140e;
    border-color: #294337;
    color: #e4f1eb;
}

body.dark-mode .field input::placeholder,
body.dark-mode .field textarea::placeholder {
    color: #687a71;
}

body.dark-mode .field select {
    color-scheme: dark;
}

body.dark-mode .field input:focus,
body.dark-mode .field select:focus,
body.dark-mode .field textarea:focus {
    background: #0b1912;
    border-color: #39b879;
    box-shadow:
        0 0 0 3px rgba(57, 184, 121, .12);
}


/* =========================================================
   SUBMIT BUTTON
========================================================= */

body.dark-mode .submit-btn {
    background: linear-gradient(
        135deg,
        #087a4d,
        #0ba66a
    );
    color: #fff;
}

body.dark-mode .submit-btn:hover {
    background: linear-gradient(
        135deg,
        #099261,
        #0db977
    );
}

body.dark-mode .submit-note {
    color: #74877d;
}


/* =========================================================
   FEATURES SECTION
========================================================= */

body.dark-mode .features-section {
    background: #0a1711;
    border-top-color: #1d3528;
    border-bottom-color: #1d3528;
}

body.dark-mode .section-heading h2 {
    color: #e8f4ed;
}

body.dark-mode .section-heading p {
    color: #879a91;
}

body.dark-mode .feature {
    background: #0d1b14;
    border-color: #263f33;
}

body.dark-mode .feature:hover {
    background: #10241a;
    border-color: #37694f;
    box-shadow: 0 15px 30px rgba(0, 0, 0, .20);
}

body.dark-mode .feature-icon {
    background: #103322;
    border-color: #28573f;
    color: #79dca5;
}

body.dark-mode .feature h3 {
    color: #dcece4;
}

body.dark-mode .feature p {
    color: #879a91;
}


/* =========================================================
   HOW IT WORKS
========================================================= */

body.dark-mode .how-section {
    background: #07110c;
}

body.dark-mode .step-number {
    background: linear-gradient(
        135deg,
        #087a4d,
        #0ca96c
    );
    color: #fff;
}

body.dark-mode .step h3 {
    color: #dcece4;
}

body.dark-mode .step p {
    color: #82958b;
}


/* =========================================================
   OPTIONS
========================================================= */

body.dark-mode .options-section {
    background: #0a1711;
}

body.dark-mode .option {
    background: #0d1b14;
    border-color: #263f33;
    color: #d5e5dc;
}

body.dark-mode .option:hover {
    background: #10241a;
    border-color: #37694f;
}

body.dark-mode .option i {
    color: #59c98c;
}


/* =========================================================
   CTA
========================================================= */

body.dark-mode .cta {
    background:
        radial-gradient(
            circle at 90% 20%,
            rgba(92, 224, 157, .16),
            transparent 30%
        ),
        linear-gradient(
            135deg,
            #043523,
            #076b45
        );

    box-shadow:
        0 18px 45px rgba(0, 0, 0, .30);
}

body.dark-mode .cta h2 {
    color: #ffffff;
}

body.dark-mode .cta p {
    color: #c1dfcf;
}

body.dark-mode .whatsapp-btn {
    background: #25d366;
    color: #fff;
}

body.dark-mode .whatsapp-btn:hover {
    background: #20bd5b;
}


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

body.dark-mode .site-footer {
    background: #050d08;
    color: #dcece4;
    border-top: 1px solid #1d3528;
}

body.dark-mode .site-footer h2,
body.dark-mode .site-footer h3 {
    color: #e8f4ed;
}

body.dark-mode .site-footer p {
    color: #81958b;
}

body.dark-mode .site-footer a {
    color: #9caf a5;
}

body.dark-mode .site-footer a:hover {
    color: #69d49a;
}

body.dark-mode .footer-bottom {
    border-top-color: #1d3528;
}


/* =========================================================
   EMPTY POSTER MESSAGE
========================================================= */

body.dark-mode .poster-list [style*="text-align"] {
    color: #788c81 !important;
}

body.dark-mode .poster-list [style*="text-align"] i {
    color: #456154 !important;
}


/* =========================================================
   MOBILE DARK MODE
========================================================= */

@media (max-width:700px) {

    body.dark-mode .insurance-top {
        background: #0b1812;
    }

    body.dark-mode .hero {
        background: #091710;
    }

    body.dark-mode .hero-card {
        background: #0d1b14;
    }

    body.dark-mode .poster-panel,
    body.dark-mode .form-card {
        background: #0c1a13;
    }

    body.dark-mode .feature,
    body.dark-mode .option {
        background: #0d1b14;
    }

    body.dark-mode .feature:hover,
    body.dark-mode .option:hover {
        background: #10241a;
    }

    body.dark-mode .cta {
        background:
            radial-gradient(
                circle at 90% 10%,
                rgba(92,224,157,.14),
                transparent 35%
            ),
            linear-gradient(
                135deg,
                #043523,
                #076b45
            );
    }
}