/**
 * HD Child Theme - Inline CSS (Hotfix)
 *
 * This file is loaded directly WITHOUT build.
 * Use for quick fixes and emergency patches.
 *
 * Load: Enqueued directly via Theme.php
 * Note: Keep this file minimal for production performance.
 */

/* ============================================================
   FIX 1: Prevent horizontal scroll / overflow-x on all pages
   → Fixes: mobile menu toggle appearing on desktop (caused by
     overflow-x pushing viewport wider than screen width)
   ============================================================ */
html, body {
    overflow-x: hidden;
}

/* All sections & wrappers must not bleed outside viewport */
.splw-section,
.ws-hero, .wa-hero, .ps-hero, .hst-hero,
#cp-hero, .cp-hero-inner {
    max-width: 100%;
    overflow-x: hidden;
}

/* Orb / background blobs can overflow — clip per specific sections only */
.splw-section,
.splw-cta-band-gradient,
.ws-hero, .wa-hero, .ps-hero, .hst-hero, #cp-hero {
    overflow: hidden;
}
/* splw-hero MUST NOT clip (float card extends outside) */
.splw-hero { overflow: visible; }

/* ============================================================
   FIX 2: Ensure desktop nav shows only when enough width is available
   High specificity override
   ============================================================ */
@media (min-width: 1180px) {
    .splw-nav-desktop {
        display: flex !important;
    }
    #splw-mobile-toggle {
        display: none !important;
    }
    #header-cta {
        display: inline-flex !important;
    }
}
@media (max-width: 1179px) {
    .splw-nav-desktop {
        display: none !important;
    }
    #splw-mobile-toggle {
        display: flex !important;
    }
    #header-cta {
        display: none !important;
    }
}

/* ============================================================
   FIX 3: Tech stack / feature item text — explicit colors
   → Fixes: white text on white card background in dark mode
     (var(--color-surface) and var(--color-heading) not resolving
     correctly when used inside inline-style dark sections)
   ============================================================ */

/* Dark mode: explicit navy card + white text */
.ws-stack-item,
.cp-tech,
.cp-tech-item {
    background: #162044 !important;
    border-color: #2A3B6E !important;
    color: #E8ECF8 !important;
}
.ws-stack-item:hover,
.cp-tech:hover,
.cp-tech-item:hover {
    border-color: rgba(212,160,23,.45) !important;
    background: #1B2D6B !important;
}

/* Light mode: white card + dark text */
body.splw-light .ws-stack-item,
body.splw-light .cp-tech,
body.splw-light .cp-tech-item {
    background: #FFFFFF !important;
    border-color: #C5D0EE !important;
    color: #1E2D5E !important;
    box-shadow: 0 4px 12px rgba(27,45,107,.06) !important;
}

/* FIX 4: Service page cards text visibility */
.cp-card,
.wa-use-card,
.ws-case-card,
.ws-sys-card,
.hst-type-card,
.hst-feat,
.ps-issue-card,
.ps-case-card {
    --color-surface: #162044;
    --color-border: #2A3B6E;
}

/* Dark mode: card text explicit */
.cp-ctitle, .wa-use-title, .ws-case-title,
.ws-sys-name, .hst-type-name, .hst-feat-title,
.ps-issue-title, .ps-case-title {
    color: #fff;
}
.cp-cdesc, .wa-use-desc, .ws-case-desc,
.ws-sys-desc, .hst-type-desc, .hst-feat-desc,
.ps-issue-desc, .ps-case-desc {
    color: #A0B0D0;
}

/* Light mode: card text */
body.splw-light .cp-ctitle,
body.splw-light .wa-use-title,
body.splw-light .ws-case-title,
body.splw-light .ws-sys-name,
body.splw-light .hst-type-name,
body.splw-light .hst-feat-title,
body.splw-light .ps-issue-title {
    color: #0A1535 !important;
}
body.splw-light .cp-cdesc,
body.splw-light .wa-use-desc,
body.splw-light .ws-case-desc,
body.splw-light .ws-sys-desc,
body.splw-light .hst-type-desc,
body.splw-light .hst-feat-desc,
body.splw-light .ps-issue-desc {
    color: #4A5A8A !important;
}

/* Light mode: card backgrounds for new service pages */
body.splw-light .cp-card,
body.splw-light .wa-use-card,
body.splw-light .ws-case-card,
body.splw-light .hst-type-card,
body.splw-light .hst-feat,
body.splw-light .ps-issue-card,
body.splw-light .ps-case-card {
    background: #FFFFFF !important;
    border-color: #C5D0EE !important;
    box-shadow: 0 4px 14px rgba(27,45,107,.07) !important;
}

/* Web System: dark cards in hero area — explicit */
.ws-sys-card {
    background: #0D1B3E !important;
    border-color: #2A3B6E !important;
}
body.splw-light .ws-sys-card {
    background: #fff !important;
    border-color: #C5D0EE !important;
}
body.splw-light .ws-sys-name { color: #A67C10 !important; }
body.splw-light .ws-sys-desc { color: #4A5A8A !important; }
body.splw-light .ws-sys-pill {
    background: rgba(27,45,107,.08) !important;
    color: #1B2D6B !important;
    border-color: #BCC8E8 !important;
}

/* FIX 5: Code window in hero (cp-code-body) light mode */
body.splw-light .cp-code-win,
body.splw-light .wa-tech-showcase .wa-tech-card {
    background: #1B2D6B !important;
    border-color: #2A44A0 !important;
}

/* FIX 6: Process step title/desc explicit colors */
.cp-stitle, .wa-ptitle, .ws-ptitle { color: #fff; }
.cp-sdesc,  .wa-pdesc,  .ws-pdesc  { color: #A0B0D0; }
body.splw-light .cp-stitle,
body.splw-light .wa-ptitle,
body.splw-light .ws-ptitle { color: #0A1535 !important; }
body.splw-light .cp-sdesc,
body.splw-light .wa-pdesc,
body.splw-light .ws-pdesc  { color: #4A5A8A !important; }

/* FIX 7: Hosting stats */
body.splw-light .hst-stat-val { color: #A67C10 !important; }
body.splw-light .hst-stat-label { color: #7888AA !important; }

/* FIX 8: PageSpeed score gradient stays visible on light */
body.splw-light .ps-score {
    background: #fff !important;
    border-color: #C5D0EE !important;
    box-shadow: 0 4px 12px rgba(27,45,107,.08) !important;
}

/* FIX 9: Process connector needs relative parent */
.splw-process-connector {
    position: absolute;
}

/* FIX 10: Blog article cards — explicit dark/light colors */
article.group .text-heading { color: #E8ECF8; }
article.group .text-muted   { color: #A0B0D0; }
article.group .text-subtle  { color: #7888AA; }
article.group .text-accent  { color: #D4A017; }
article.group .bg-surface   { background: #162044; }
article.group .border-border{ border-color: #2A3B6E; }
body.splw-light article.group .text-heading { color: #0A1535; }
body.splw-light article.group .text-muted   { color: #4A5A8A; }
body.splw-light article.group .text-subtle  { color: #7888AA; }
body.splw-light article.group .text-accent  { color: #A67C10; }
body.splw-light article.group .bg-surface   { background: #fff; }
body.splw-light article.group .border-border{ border-color: #C5D0EE; }
body.splw-light article.group:hover { border-color: rgba(166,124,16,.25) !important; }

/* FIX 11: Pricing table / FAQ explicit colors for surface */
body.splw-light .splw-pt-card { background: #fff; border-color: #C5D0EE; }
body.splw-light .splw-pt-card.is-featured { background: #EAF0FF; border-color: rgba(166,124,16,.45); }
body.splw-light .splw-faq-item { background: #fff; border-color: #C5D0EE; }

/* FIX 12: Testimonial/Theme slider track overflow clip (uid applied via JS) */
[id$="-track"] { /* splw-ts-track, splw-ft-track */ }

/* FIX 13: btn outline hover explicit color fix in light mode */
body.splw-light .splw-btn--outline {
    color: #A67C10;
    border-color: rgba(166,124,16,.4);
}
body.splw-light .splw-btn--outline:hover {
    background: rgba(166,124,16,.08);
    border-color: #A67C10;
    color: #A67C10;
}

/* FIX 14: Focus visible accessibility */
.splw-btn:focus-visible,
.splw-svc-card:focus-visible,
.splw-filter-btn:focus-visible {
    outline: 2px solid rgba(212,160,23,.6);
    outline-offset: 2px;
}

/* Quick fixes go here... */
/* This file is NOT processed by SCSS/Vite */

/* Ẩn nút Zalo đơn — thay thế bằng icon trong floating contact bar */
#splw-zalo-widget { display: none !important; }

/* ══════════════════════════════════════════════════════
   LIGHT MODE: Sections giữ bg tối → text phải sáng
   ══════════════════════════════════════════════════════ */

/* CTA Band: bg gradient navy luôn tối → text phải trắng */
body.splw-light .splw-cta-band-gradient h2,
body.splw-light .splw-cta-band-gradient h3,
body.splw-light .splw-cta-band-gradient p {
    color: #ffffff !important;
}
body.splw-light .splw-cta-band-gradient .text-heading { color: #ffffff !important; }
body.splw-light .splw-cta-band-gradient .text-muted   { color: rgba(255,255,255,.8) !important; }

/* Mobile drawer: giữ dark bg → text sáng */
body.splw-light #splw-mobile-menu { background: #162044 !important; }
body.splw-light #splw-mobile-menu a { color: #E8ECF8 !important; }
body.splw-light #splw-mobile-menu a:hover { color: #D4A017 !important; background: rgba(255,255,255,.05) !important; }

/* Footer cột trái: bg dark #162044 → text phải sáng */
body.splw-light footer .splw-footer-contact-link { color: #A0B0D0 !important; }
body.splw-light footer .splw-footer-contact-link:hover { color: #D4A017 !important; }

/* Inline style dark panels (service_split, hero_small v.v.) */
body.splw-light [style*="background:#0F1A3A"] h1,
body.splw-light [style*="background:#0F1A3A"] h2,
body.splw-light [style*="background:#0F1A3A"] h3,
body.splw-light [style*="background:#0F1A3A"] p  { color: #E8ECF8 !important; }
body.splw-light [style*="background:#162044"] h2,
body.splw-light [style*="background:#162044"] p  { color: #E8ECF8 !important; }

/* FIX 15: Service/sub-page hero gradient bg → white text always */
body.splw-light .ws-hero h1, body.splw-light .ws-hero p,
body.splw-light .wa-hero h1, body.splw-light .wa-hero p,
body.splw-light .cp-hero-inner h1, body.splw-light .cp-hero-inner p,
body.splw-light .hst-hero h1, body.splw-light .hst-hero p,
body.splw-light .ps-hero h1,  body.splw-light .ps-hero p  {
    color: #E8ECF8 !important;
}

/* FIX 16: SPLSEO Landing — hero dark bg keeps white text */
body.splw-light .spl-hero h1,
body.splw-light .spl-hero p,
body.splw-light .spl-hero .spl-lead,
body.splw-light .spl-hero .splw-section-label {
    color: #E8ECF8 !important;
}
body.splw-light .spl-hero h1 span {
    -webkit-text-fill-color: transparent !important;
}
body.splw-light .spl-badge {
    color: #D4A017 !important;
}
/* SPLSEO compare boxes: keep readable in light */
body.splw-light .spl-compare-box.bad h3 { color: #dc2626 !important; }
body.splw-light .spl-compare-box.good h3 { color: #059669 !important; }
body.splw-light .spl-compare-row { color: #4A5A8A !important; }
/* SPLSEO pipeline steps */
body.splw-light .spl-step-name { color: #0A1535 !important; }
body.splw-light .spl-step-desc { color: #4A5A8A !important; }

/* FIX 17: Floating contact + assistant */
.splw-contact-map {
    border: 1px solid rgba(42,59,110,.55);
    border-radius: 16px;
    overflow: hidden;
    background: #0F1A3A;
    min-height: 220px;
}
.splw-contact-map iframe {
    display: block;
    width: 100%;
    min-height: 220px;
    border: 0;
    filter: saturate(.9) contrast(.95);
}
.splw-floating-contact {
    position: fixed;
    right: 18px;
    bottom: 96px;
    z-index: 990;
    display: flex;
    flex-direction: column;
    gap: 10px;
    pointer-events: none;
}
.splw-float-btn {
    width: 58px;
    min-height: 58px;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
    border: 1px solid rgba(212,160,23,.3);
    border-radius: 16px;
    background: rgba(15,26,58,.92);
    color: #fff;
    box-shadow: 0 14px 34px rgba(0,0,0,.28);
    backdrop-filter: blur(14px);
    text-decoration: none;
    cursor: pointer;
    pointer-events: auto;
    transition: transform .18s ease, border-color .18s ease, background .18s ease;
}
.splw-float-btn:hover,
.splw-float-btn:focus-visible {
    transform: translateY(-2px);
    border-color: rgba(212,160,23,.75);
    background: #1B2D6B;
    outline: none;
}
.splw-float-btn span {
    font-size: 15px;
    font-weight: 800;
    line-height: 1;
}
.splw-float-btn small {
    font-size: 10px;
    line-height: 1;
    font-weight: 700;
}
.splw-float-btn--zalo { background: #006AF5; border-color: rgba(255,255,255,.3); }
.splw-float-btn--phone { background: #0F766E; border-color: rgba(255,255,255,.24); }
.splw-float-btn--map { background: #7C3AED; border-color: rgba(255,255,255,.24); }
.splw-float-btn--ai { background: linear-gradient(135deg,#D4A017,#EFC132); color: #0F1A3A; }
.splw-assistant[hidden] { display: none; }
.splw-assistant {
    position: fixed;
    right: 88px;
    bottom: 96px;
    z-index: 991;
    width: min(380px, calc(100vw - 32px));
}
.splw-assistant__panel {
    overflow: hidden;
    border: 1px solid rgba(212,160,23,.32);
    border-radius: 18px;
    background: rgba(15,26,58,.98);
    box-shadow: 0 24px 70px rgba(0,0,0,.42);
    color: #E8ECF8;
}
.splw-assistant__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 16px;
    border-bottom: 1px solid rgba(255,255,255,.08);
}
.splw-assistant__head strong { display: block; font-size: 15px; color: #fff; }
.splw-assistant__head span { display: block; margin-top: 2px; font-size: 12px; color: #A0B0D0; }
.splw-assistant__head button {
    width: 32px;
    height: 32px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 10px;
    background: rgba(255,255,255,.06);
    color: #fff;
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
}
.splw-assistant__body {
    max-height: 260px;
    overflow-y: auto;
    padding: 14px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.splw-assistant__msg {
    max-width: 88%;
    padding: 10px 12px;
    border-radius: 14px;
    font-size: 13px;
    line-height: 1.55;
}
.splw-assistant__msg--bot {
    align-self: flex-start;
    background: rgba(255,255,255,.08);
    color: #DDE6FF;
}
.splw-assistant__msg--user {
    align-self: flex-end;
    background: rgba(212,160,23,.18);
    color: #fff;
}
.splw-assistant__msg--typing {
    opacity: .76;
    font-style: italic;
}
.splw-assistant__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 0 14px 12px;
}
.splw-assistant__chips button {
    border: 1px solid rgba(212,160,23,.28);
    border-radius: 999px;
    background: rgba(212,160,23,.08);
    color: #EFC132;
    font-size: 12px;
    font-weight: 700;
    padding: 7px 10px;
    cursor: pointer;
}
.splw-assistant__form {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 14px;
    border-top: 1px solid rgba(255,255,255,.08);
}
.splw-assistant__form input {
    min-width: 0;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 12px;
    background: rgba(255,255,255,.07);
    color: #fff;
    padding: 10px 12px;
    font-size: 13px;
    outline: none;
}
.splw-assistant__form input:focus { border-color: rgba(212,160,23,.58); }
.splw-assistant__form button {
    border: 0;
    border-radius: 12px;
    background: linear-gradient(135deg,#D4A017,#EFC132);
    color: #0F1A3A;
    font-weight: 800;
    padding: 0 14px;
    cursor: pointer;
}
.splw-assistant__fallback {
    padding: 0 14px 14px;
    font-size: 12px;
    color: #A0B0D0;
}
.splw-assistant__fallback a { color: #EFC132; font-weight: 700; }
body.splw-light .splw-contact-map { background: #fff; border-color: #C5D0EE; }

@media (max-width: 640px) {
    .splw-floating-contact {
        right: 10px;
        bottom: 74px;
        gap: 8px;
    }
    .splw-float-btn {
        width: 50px;
        min-height: 50px;
        border-radius: 14px;
    }
    .splw-float-btn small { display: none; }
    .splw-assistant {
        right: 10px;
        left: 10px;
        bottom: 76px;
        width: auto;
    }
    .splw-assistant__body { max-height: 220px; }
}

/* FIX 18: Mat Bao style assistant refresh */
.splw-floating-contact {
    bottom: 90px;
    align-items: flex-end;
}
.splw-ai-launcher {
    width: auto;
    min-width: 220px;
    min-height: 62px;
    flex-direction: row;
    justify-content: flex-start;
    gap: 10px;
    padding: 8px 16px 8px 9px;
    border-radius: 999px;
    background: linear-gradient(135deg,#0F65FF,#2E7BFF);
    color: #fff;
    box-shadow: 0 16px 36px rgba(15,101,255,.34), 0 8px 18px rgba(15,26,58,.18);
}
.splw-ai-launcher:hover,
.splw-ai-launcher:focus-visible {
    background: linear-gradient(135deg,#0958E8,#2563EB);
    border-color: rgba(255,255,255,.6);
}
.splw-ai-launcher__avatar,
.splw-assistant__avatar {
    width: 44px;
    height: 44px;
    display: inline-grid;
    place-items: center;
    flex: 0 0 auto;
    border: 3px solid rgba(255,255,255,.86);
    border-radius: 999px;
    background: radial-gradient(circle at 35% 30%,#fff 0 18%,#FF4D6D 19% 38%,#0F65FF 39% 100%);
    color: #fff;
    font-size: 13px;
    font-weight: 900;
    text-shadow: 0 1px 3px rgba(0,0,0,.35);
    box-shadow: 0 8px 20px rgba(0,0,0,.24);
}
/* Smaller avatar inside dialog header to avoid border-radius clipping */
.splw-assistant__head .splw-assistant__avatar {
    width: 38px;
    height: 38px;
    border-width: 2.5px;
    font-size: 11px;
    box-shadow: 0 4px 12px rgba(0,0,0,.18);
}
.splw-ai-launcher__copy {
    display: flex;
    min-width: 0;
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
}
.splw-ai-launcher__copy strong {
    font-size: 14px;
    line-height: 1.1;
    white-space: nowrap;
}
.splw-ai-launcher__copy small {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 11px;
    font-weight: 700;
    color: rgba(255,255,255,.82);
}
.splw-ai-launcher__copy small::before {
    content: "";
    width: 7px;
    height: 7px;
    border-radius: 999px;
    background: #31E67B;
    box-shadow: 0 0 0 4px rgba(49,230,123,.16);
}
.splw-assistant {
    right: 92px;
    bottom: 92px;
    width: min(460px, calc(100vw - 28px));
}
.splw-assistant__panel {
    border: 1px solid rgba(193,213,255,.9);
    border-radius: 22px;
    overflow: hidden;
    background:
        linear-gradient(180deg,rgba(255,255,255,.96),rgba(245,248,255,.92)),
        radial-gradient(circle at 0 0,rgba(15,101,255,.14),transparent 45%);
    box-shadow: 0 28px 72px rgba(10,33,84,.28), 0 0 0 1px rgba(255,255,255,.7) inset;
    color: #162044;
    backdrop-filter: blur(18px);
}
.splw-assistant__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 16px;
    border-bottom: 0;
    background: linear-gradient(135deg,#0F65FF,#2563EB);
    color: #fff;
    box-shadow: 0 12px 30px rgba(15,101,255,.24);
    border-radius: 22px 22px 0 0;
}
.splw-assistant__brand {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}
.splw-assistant__brand strong {
    display: block;
    color: #fff;
    font-size: 15px;
    line-height: 1.1;
}
.splw-assistant__brand span {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    margin-top: 3px;
    color: rgba(255,255,255,.8);
    font-size: 12px;
    font-weight: 700;
}
.splw-assistant__brand span::before {
    content: "";
    width: 7px;
    height: 7px;
    border-radius: 999px;
    background: #31E67B;
}
.splw-assistant__tools {
    display: flex;
    align-items: center;
    gap: 6px;
}
.splw-assistant__tools a,
.splw-assistant__tools button {
    min-width: 38px;
    height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(255,255,255,.24);
    border-radius: 999px;
    background: rgba(255,255,255,.12);
    color: #fff;
    padding: 0 11px;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0;
    line-height: 1;
    text-decoration: none;
    cursor: pointer;
}
.splw-assistant__tools button {
    font-size: 22px;
    padding-bottom: 2px;
}
.splw-assistant__body {
    min-height: 248px;
    max-height: min(48vh, 390px);
    padding: 26px 18px 14px;
    gap: 12px;
}
.splw-assistant__msg {
    max-width: 84%;
    padding: 13px 15px;
    border-radius: 18px;
    font-size: 14px;
    line-height: 1.55;
    box-shadow: 0 10px 24px rgba(10,33,84,.08);
}
.splw-assistant__msg--bot {
    background: #fff;
    color: #1F2A44;
    border-bottom-left-radius: 6px;
}
.splw-assistant__msg--user {
    background: linear-gradient(135deg,#0F65FF,#2563EB);
    color: #fff;
    border-bottom-right-radius: 6px;
}
.splw-assistant__chips {
    flex-direction: column;
    align-items: flex-end;
    padding: 0 18px 16px;
}
.splw-assistant__chips button {
    max-width: 100%;
    border: 1px solid rgba(15,101,255,.12);
    border-radius: 999px;
    background: #fff;
    color: #17213A;
    box-shadow: 0 8px 20px rgba(10,33,84,.08);
    font-size: 13px;
    font-weight: 700;
    padding: 9px 13px;
    text-align: right;
}
.splw-assistant__chips button::after {
    content: " →";
    color: #7C8BA8;
}
.splw-assistant__form {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 16px 0;
    padding: 8px 8px 8px 14px;
    border: 1px solid rgba(15,101,255,.18);
    border-radius: 18px;
    background: rgba(255,255,255,.9);
    box-shadow: 0 12px 30px rgba(10,33,84,.12);
    transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
}
.splw-assistant__form:focus-within {
    border-color: rgba(15,101,255,.42);
    background: #fff;
    box-shadow: 0 16px 34px rgba(10,33,84,.16), 0 0 0 3px rgba(15,101,255,.08);
}
.splw-assistant__form textarea {
    min-width: 0;
    flex: 1 1 auto;
    max-height: 92px;
    width: 100%;
    border: 0;
    background: transparent;
    color: #17213A;
    padding: 10px 6px 10px 0;
    font-size: 14px;
    line-height: 1.45;
    outline: none;
    resize: none;
}
.splw-assistant__form button {
    min-width: 72px;
    padding: 0 16px;
    height: 42px;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 14px;
    background: linear-gradient(135deg,#0F65FF,#2563EB);
    color: #fff;
    font-size: 14px;
    font-weight: 800;
    cursor: pointer;
}
.splw-assistant__form button:disabled {
    opacity: .64;
    cursor: wait;
}
.splw-assistant__fallback {
    padding: 12px 18px 18px;
    color: #6A7895;
    font-size: 11px;
    text-align: center;
}
.splw-assistant__fallback strong,
.splw-assistant__fallback a {
    color: #0F65FF;
    font-weight: 800;
}
body.splw-light .splw-assistant__panel {
    background:
        linear-gradient(180deg,rgba(255,255,255,.98),rgba(247,250,255,.94)),
        radial-gradient(circle at 0 0,rgba(15,101,255,.14),transparent 45%);
}
body:not(.splw-light) .splw-assistant__panel {
    background:
        linear-gradient(180deg,rgba(240,245,255,.96),rgba(225,235,255,.9)),
        radial-gradient(circle at 0 0,rgba(15,101,255,.18),transparent 45%);
}

@media (max-width: 640px) {
    .splw-floating-contact {
        right: 10px;
        bottom: 72px;
    }
    .splw-ai-launcher {
        min-width: 176px;
        min-height: 54px;
        padding: 7px 12px 7px 8px;
    }
    .splw-ai-launcher__avatar {
        width: 38px;
        height: 38px;
        font-size: 11px;
    }
    .splw-ai-launcher__copy strong {
        font-size: 12px;
    }
    .splw-ai-launcher__copy small {
        display: inline-flex;
        font-size: 10px;
    }
    .splw-assistant {
        right: 8px;
        left: 8px;
        bottom: 70px;
        width: auto;
    }
    .splw-assistant__body {
        min-height: 220px;
        max-height: 44vh;
        padding: 18px 14px 12px;
    }
    .splw-assistant__chips {
        padding-inline: 14px;
    }
    .splw-assistant__chips button {
        font-size: 12px;
        padding: 8px 11px;
    }
    .splw-assistant__form {
        margin-inline: 12px;
        padding: 8px 8px 8px 12px;
    }
    .splw-assistant__form button {
        min-width: 60px;
        height: 40px;
        padding: 0 12px;
    }
}

/* ============================================================
   UX/UI polish pass: dark + light consistency
   ============================================================ */
:root {
    --splw-ui-ring: 0 0 0 3px rgba(212,160,23,.16);
    --splw-ui-border-soft: rgba(148,163,184,.24);
    --splw-ui-card-dark: rgba(22,32,68,.78);
    --splw-ui-card-light: rgba(255,255,255,.92);
    --splw-ui-card-shadow-dark: 0 18px 48px rgba(4,10,28,.28);
    --splw-ui-card-shadow-light: 0 16px 42px rgba(27,45,107,.10);
}

body {
    background:
        linear-gradient(180deg, rgba(15,26,58,1) 0%, rgba(13,24,54,1) 48%, rgba(15,26,58,1) 100%);
    text-rendering: optimizeLegibility;
}
body.splw-light {
    background:
        linear-gradient(180deg, #F7F9FC 0%, #EEF3FA 48%, #F7F9FC 100%);
}

.splw-section {
    position: relative;
}
.splw-section--dark,
.splw-section--dark-2 {
    background: transparent;
}
body.splw-light .splw-section--dark,
body.splw-light .splw-section--dark-2 {
    background: transparent !important;
}

.splw-section-header {
    max-width: 760px;
}
.splw-section-header--center {
    margin-inline: auto;
}
.splw-section-label,
.splw-badge,
.splw-blog-hero-label {
    letter-spacing: .08em;
    border-color: rgba(212,160,23,.28);
    box-shadow: 0 8px 22px rgba(212,160,23,.08);
}

.splw-section-title,
.splw-blog-hero h1 {
    letter-spacing: 0;
}
.splw-section-subtitle,
.splw-blog-hero p {
    color: rgba(232,236,248,.78);
}
body.splw-light .splw-section-subtitle,
body.splw-light .splw-blog-hero p {
    color: #445476 !important;
}

.splw-svc-card,
.splw-stat-card,
.splw-blog-card,
.splw-pt-card,
.splw-faq-item,
.spl-feat-card,
.spl-step,
.spl-compare-box,
.cp-card,
.wa-use-card,
.ws-case-card,
.ws-sys-card,
.hst-type-card,
.hst-feat,
.ps-issue-card,
.ps-case-card,
article.group.flex.flex-col.rounded-2xl {
    border-color: rgba(148,163,184,.20) !important;
    background: linear-gradient(180deg, rgba(22,32,68,.86), rgba(18,28,60,.74)) !important;
    box-shadow: var(--splw-ui-card-shadow-dark);
    transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease, background .2s ease;
}
.splw-svc-card:hover,
.splw-stat-card:hover,
.splw-blog-card:hover,
.splw-pt-card:hover,
.splw-faq-item:hover,
.spl-feat-card:hover,
.spl-step:hover,
.spl-compare-box:hover,
.cp-card:hover,
.wa-use-card:hover,
.ws-case-card:hover,
.ws-sys-card:hover,
.hst-type-card:hover,
.hst-feat:hover,
.ps-issue-card:hover,
.ps-case-card:hover,
article.group.flex.flex-col.rounded-2xl:hover {
    transform: translateY(-3px);
    border-color: rgba(212,160,23,.36) !important;
    box-shadow: 0 22px 56px rgba(4,10,28,.34);
}

body.splw-light .splw-svc-card,
body.splw-light .splw-stat-card,
body.splw-light .splw-blog-card,
body.splw-light .splw-pt-card,
body.splw-light .splw-faq-item,
body.splw-light .spl-feat-card,
body.splw-light .spl-step,
body.splw-light .spl-compare-box,
body.splw-light .cp-card,
body.splw-light .wa-use-card,
body.splw-light .ws-case-card,
body.splw-light .ws-sys-card,
body.splw-light .hst-type-card,
body.splw-light .hst-feat,
body.splw-light .ps-issue-card,
body.splw-light .ps-case-card,
body.splw-light article.group.flex.flex-col.rounded-2xl {
    background: var(--splw-ui-card-light) !important;
    border-color: #D6DFEE !important;
    box-shadow: var(--splw-ui-card-shadow-light);
}
body.splw-light .splw-svc-card:hover,
body.splw-light .splw-stat-card:hover,
body.splw-light .splw-blog-card:hover,
body.splw-light .splw-pt-card:hover,
body.splw-light .splw-faq-item:hover,
body.splw-light .spl-feat-card:hover,
body.splw-light .spl-step:hover,
body.splw-light .spl-compare-box:hover,
body.splw-light .cp-card:hover,
body.splw-light .wa-use-card:hover,
body.splw-light .ws-case-card:hover,
body.splw-light .ws-sys-card:hover,
body.splw-light .hst-type-card:hover,
body.splw-light .hst-feat:hover,
body.splw-light .ps-issue-card:hover,
body.splw-light .ps-case-card:hover,
body.splw-light article.group.flex.flex-col.rounded-2xl:hover {
    border-color: rgba(166,124,16,.36) !important;
    box-shadow: 0 20px 48px rgba(27,45,107,.14);
}

.splw-btn,
.splw-blog-filter a,
.splw-blog-pagination a,
.splw-blog-pagination span,
button,
input[type="submit"] {
    letter-spacing: 0;
}
.splw-btn {
    min-height: 42px;
    justify-content: center;
    box-shadow: 0 10px 24px rgba(4,10,28,.14);
}
.splw-btn--outline,
.splw-btn--ghost {
    background: rgba(255,255,255,.04);
    backdrop-filter: blur(10px);
}
body.splw-light .splw-btn--outline,
body.splw-light .splw-btn--ghost {
    background: rgba(255,255,255,.86) !important;
    color: #1B2D6B !important;
    border-color: #D6DFEE !important;
}
.splw-btn:hover {
    box-shadow: 0 14px 30px rgba(4,10,28,.20);
}
.splw-btn:active,
button:active,
.splw-blog-filter a:active {
    transform: translateY(0);
}

input,
select,
textarea,
#contact-form-main input,
#contact-form-main select,
#contact-form-main textarea {
    border-radius: 14px !important;
    border-color: rgba(148,163,184,.28) !important;
    background: rgba(255,255,255,.06) !important;
    color: var(--color-text) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
    transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
}
input::placeholder,
textarea::placeholder {
    color: rgba(160,176,208,.72) !important;
}
input:focus,
select:focus,
textarea:focus,
#contact-form-main input:focus,
#contact-form-main select:focus,
#contact-form-main textarea:focus {
    outline: none !important;
    border-color: rgba(212,160,23,.58) !important;
    box-shadow: var(--splw-ui-ring) !important;
}
body.splw-light input,
body.splw-light select,
body.splw-light textarea,
body.splw-light #contact-form-main input,
body.splw-light #contact-form-main select,
body.splw-light #contact-form-main textarea {
    background: #FFFFFF !important;
    border-color: #D6DFEE !important;
    color: #1D2C58 !important;
    box-shadow: inset 0 1px 0 rgba(27,45,107,.03);
}
body.splw-light input::placeholder,
body.splw-light textarea::placeholder {
    color: #72809A !important;
}

#splw-header nav {
    border-bottom: 1px solid rgba(148,163,184,.12);
}
#splw-header.is-scrolled nav {
    border-bottom-color: rgba(148,163,184,.18);
    backdrop-filter: blur(16px);
}
body.splw-light #splw-header nav {
    border-bottom-color: rgba(188,200,232,.55);
}
.splw-nav-link,
.splw-nav-btn {
    border-radius: 10px;
}
.splw-nav-link:hover,
.splw-nav-btn:hover {
    background: rgba(255,255,255,.06);
}
body.splw-light .splw-nav-link:hover,
body.splw-light .splw-nav-btn:hover {
    background: rgba(27,45,107,.06);
}

.splw-blog-card__body,
.splw-svc-card,
.splw-pt-card,
.spl-feat-card {
    min-width: 0;
}
.splw-blog-card__title,
.splw-section-title,
.splw-svc-card h3 {
    overflow-wrap: anywhere;
}
.splw-blog-card__thumb img,
.spl-theme-card img,
.splw-svc-card img {
    background: rgba(255,255,255,.04);
}
body.splw-light .splw-blog-card__thumb img,
body.splw-light .spl-theme-card img,
body.splw-light .splw-svc-card img {
    background: #EEF3FA;
}

.splw-blog-filter {
    gap: 8px;
}
.splw-blog-filter a,
.splw-blog-pagination a,
.splw-blog-pagination span {
    border-color: rgba(148,163,184,.24);
}
.splw-blog-pagination ul {
    display: flex;
    gap: 8px;
    padding: 0;
    margin: 0;
    list-style: none;
}

.splw-footer {
    border-top: 1px solid rgba(148,163,184,.14);
}
body.splw-light .splw-footer {
    background: linear-gradient(180deg, #EAF0FF, #E4EAF8) !important;
    border-top-color: #D6DFEE;
}

@media (max-width: 900px) {
    .splw-section {
        padding-block: clamp(46px, 8vw, 72px);
    }
    .splw-section-header {
        margin-bottom: 34px;
    }
}

@media (max-width: 640px) {
    .splw-container {
        padding-inline: 16px;
    }
    .splw-section-label,
    .splw-badge,
    .splw-blog-hero-label {
        font-size: 11px;
        white-space: normal;
    }
    .splw-svc-card,
    .splw-stat-card,
    .splw-blog-card,
    .splw-pt-card,
    .splw-faq-item,
    .spl-feat-card,
    .spl-step,
    .spl-compare-box {
        border-radius: 16px !important;
    }
    .splw-blog-filter {
        justify-content: flex-start;
        overflow-x: auto;
        flex-wrap: nowrap;
        padding-bottom: 4px;
        scrollbar-width: none;
    }
    .splw-blog-filter::-webkit-scrollbar {
        display: none;
    }
    .splw-blog-filter a {
        flex: 0 0 auto;
    }
}

/* ============================================================
   UX/UI correction pass: restore float icons + clearer sections
   ============================================================ */
.splw-section {
    padding-block: clamp(48px, 6.4vw, 82px);
    border-top: 1px solid rgba(148,163,184,.08);
}
.splw-section--sm {
    padding-block: clamp(34px, 4.8vw, 58px);
}
.splw-section--dark {
    background:
        linear-gradient(180deg, rgba(15,26,58,.98), rgba(13,24,54,.98)) !important;
}
.splw-section--dark-2 {
    background:
        linear-gradient(180deg, rgba(22,32,68,.96), rgba(18,28,60,.96)) !important;
}
.splw-section--navy {
    background:
        linear-gradient(135deg, #17285f, #1B2D6B) !important;
}
body.splw-light .splw-section {
    border-top-color: rgba(188,200,232,.55);
}
body.splw-light .splw-section--dark {
    background: linear-gradient(180deg, #F7F9FC, #F2F6FB) !important;
}
body.splw-light .splw-section--dark-2 {
    background: linear-gradient(180deg, #EAF0FF, #EEF3FA) !important;
}
body.splw-light .splw-section--navy {
    background: linear-gradient(135deg, #1B2D6B, #243C86) !important;
}
.splw-section + .splw-section {
    margin-top: 0;
}
.splw-section-header {
    margin-bottom: clamp(28px, 4vw, 42px);
}
.splw-section-title {
    margin-bottom: 12px;
}
.splw-section-subtitle {
    max-width: 680px;
}
.splw-section-header--center .splw-section-subtitle {
    max-width: 680px;
}

.splw-floating-contact {
    gap: 9px;
}
.splw-float-btn:not(.splw-ai-launcher) {
    width: 58px;
    min-height: 58px;
    gap: 4px;
    border-radius: 18px;
}
.splw-float-icon {
    width: 23px;
    height: 23px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 0;
}
.splw-float-icon svg {
    width: 23px;
    height: 23px;
    display: block;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.9;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.splw-float-btn--zalo .splw-float-icon svg path:first-child,
.splw-float-btn--phone .splw-float-icon svg path,
.splw-float-btn--map .splw-float-icon svg path {
    fill: rgba(255,255,255,.14);
}
.splw-float-btn--map .splw-float-icon svg circle {
    fill: rgba(255,255,255,.32);
}
.splw-float-btn:not(.splw-ai-launcher) small {
    display: block;
    font-size: 10px;
}

.splw-svc-card,
.splw-stat-card,
.splw-blog-card,
.splw-pt-card,
.splw-faq-item,
.spl-feat-card,
.spl-step,
.spl-compare-box {
    box-shadow: 0 14px 34px rgba(4,10,28,.22);
}
body.splw-light .splw-svc-card,
body.splw-light .splw-stat-card,
body.splw-light .splw-blog-card,
body.splw-light .splw-pt-card,
body.splw-light .splw-faq-item,
body.splw-light .spl-feat-card,
body.splw-light .spl-step,
body.splw-light .spl-compare-box {
    box-shadow: 0 12px 28px rgba(27,45,107,.09);
}

@media (max-width: 900px) {
    .splw-section {
        padding-block: clamp(40px, 7vw, 64px);
    }
}

@media (max-width: 640px) {
    .splw-section {
        padding-block: 38px;
    }
    .splw-section--sm {
        padding-block: 30px;
    }
    .splw-section-header {
        margin-bottom: 24px;
    }
    .splw-float-btn:not(.splw-ai-launcher) {
        width: 50px;
        min-height: 50px;
        border-radius: 15px;
    }
    .splw-float-icon,
    .splw-float-icon svg {
        width: 22px;
        height: 22px;
    }
    .splw-float-btn:not(.splw-ai-launcher) small {
        display: none;
    }
}

/* Chatbox input contrast fix */
.splw-assistant__form textarea,
body.splw-light .splw-assistant__form textarea {
    background: transparent !important;
    border: 0 !important;
    color: #0A1535 !important;
    -webkit-text-fill-color: #0A1535 !important;
    caret-color: #0A1535 !important;
    box-shadow: none !important;
    font-weight: 500;
}
.splw-assistant__form textarea::placeholder,
body.splw-light .splw-assistant__form textarea::placeholder {
    color: #6A7895 !important;
    -webkit-text-fill-color: #6A7895 !important;
}
.splw-assistant__form:focus-within {
    border-color: rgba(15,101,255,.48) !important;
    box-shadow: 0 16px 34px rgba(10,33,84,.16), 0 0 0 3px rgba(15,101,255,.10) !important;
}