/**
 * Đồng Phục Bắc Ninh — final frontend palette.
 * Logo blue communicates trust and structure; logo red is reserved for action.
 * Loaded last to neutralize legacy green/orange skins without changing layout.
 */
:root {
    --dq-logo-blue: var(--dq-option-primary, #014792);
    --dq-logo-blue-dark: #00356f;
    --dq-logo-blue-deep: #00254e;
    --dq-logo-blue-soft: #e8f2fb;
    --dq-logo-blue-mist: #f5f9fd;
    --dq-logo-red: var(--dq-option-secondary, #cb090d);
    --dq-logo-red-dark: #a9080b;
    --dq-logo-red-soft: #fff0f1;
    --dq-primary: var(--dq-logo-blue);
    --dq-secondary: var(--dq-logo-blue-dark);
    --dq-brand-green: var(--dq-logo-blue);
    --dq-brand-green-dark: var(--dq-logo-blue-dark);
    --dq-brand-green-deep: var(--dq-logo-blue-deep);
    --dq-brand-green-soft: var(--dq-logo-blue-soft);
    --dq-brand-green-mist: var(--dq-logo-blue-mist);
    --dq-brand-orange: var(--dq-logo-red);
    --dq-brand-orange-dark: var(--dq-logo-red-dark);
    --dq-brand-orange-soft: var(--dq-logo-red-soft);
    --dq-content-green: var(--dq-logo-blue);
    --dq-content-green-deep: var(--dq-logo-blue-dark);
    --dq-content-orange: var(--dq-logo-red);
    --dq-content-ink: #102a43;
    --dq-content-muted: #5a6d7f;
    --dq-content-line: #d4e1ec;
    --dq-content-soft: var(--dq-logo-blue-mist);
    --dq-wellness-green: var(--dq-logo-blue-dark);
    --dq-wellness-green-2: var(--dq-logo-blue);
    --dq-wellness-orange: var(--dq-logo-red);
    --dq-wp-green: var(--dq-logo-blue-dark);
    --dq-wp-green-soft: var(--dq-logo-blue);
}

body { color: #102a43; }
.dq-header.dq-header {
    border-bottom-color: rgba(1, 71, 146, .14);
    box-shadow: 0 5px 24px rgba(0, 53, 111, .09);
}

/* Compact header actions: keep both labels on one line and in the logo palette. */
@media (min-width: 901px) {
    .dq-header-main--desktop .dq-header-main__grid {
        grid-template-columns: auto minmax(0, 1fr) auto;
    }

    .dq-header-main--desktop .dq-menu {
        gap: clamp(16px, 1.35vw, 22px);
    }

    .dq-header-main--desktop .dq-header-zone--right {
        gap: 10px;
        flex-wrap: nowrap;
    }

    .dq-header.dq-header .dq-hotline,
    .dq-header.dq-header .dq-header-btn {
        min-height: 44px;
        padding: 0 18px;
        border-radius: 999px;
        font-size: 14px;
        line-height: 1;
        white-space: nowrap;
        transition: color .2s ease, background-color .2s ease, border-color .2s ease, box-shadow .2s ease, transform .2s ease;
    }

    .dq-header.dq-header .dq-hotline {
        gap: 9px;
        color: var(--dq-logo-blue-dark);
        background: #fff;
        border: 1px solid rgba(1, 71, 146, .38);
        box-shadow: 0 5px 14px rgba(0, 53, 111, .07);
    }

    .dq-header.dq-header .dq-hotline__icon {
        width: 19px;
        height: 19px;
        flex: 0 0 19px;
        fill: currentColor;
    }

    .dq-header.dq-header .dq-header-btn {
        color: #fff;
        background: linear-gradient(135deg, var(--dq-logo-red), var(--dq-logo-red-dark));
        border: 1px solid var(--dq-logo-red);
        box-shadow: 0 7px 17px rgba(203, 9, 13, .18);
    }

    .dq-header.dq-header .dq-hotline:hover,
    .dq-header.dq-header .dq-hotline:focus-visible {
        color: #fff;
        background: var(--dq-logo-blue);
        border-color: var(--dq-logo-blue);
        box-shadow: 0 8px 20px rgba(1, 71, 146, .2);
        transform: translateY(-1px);
    }

    .dq-header.dq-header .dq-header-btn:hover,
    .dq-header.dq-header .dq-header-btn:focus-visible {
        color: #fff;
        background: var(--dq-logo-red-dark);
        border-color: var(--dq-logo-red-dark);
        box-shadow: 0 9px 22px rgba(203, 9, 13, .25);
        transform: translateY(-1px);
    }
}

/* Balance the desktop header: move the menu right without crowding the actions. */
@media (min-width: 1280px) {
    .dq-header--desktop-logo-left .dq-header-main--desktop .dq-header-zone--center {
        justify-content: center;
        padding-left: clamp(34px, 3vw, 58px);
    }
}

body.home [data-layout="banner_slider"],
body.home [data-layout="banner_slider"] .dq-banner { background-color: var(--dq-logo-blue-deep); }
body.home [data-layout="banner_slider"] .dq-banner::before {
    background: linear-gradient(90deg, rgba(0, 37, 78, .88), rgba(0, 53, 111, .15) 70%);
}
.dq-brand-intro__group span {
    -webkit-text-stroke-color: rgba(1, 71, 146, .22);
    text-stroke-color: rgba(1, 71, 146, .22);
}

/* Product gallery, product detail and consultation. */
.dq-product-detail__zoom { background: rgba(1, 71, 146, .9); box-shadow: 0 8px 22px rgba(0, 37, 78, .24); }
.dq-product-detail__sidebar {
    background: linear-gradient(145deg, var(--dq-logo-blue-dark), var(--dq-logo-blue));
    box-shadow: 0 18px 42px rgba(0, 53, 111, .2);
}
.dq-product-detail__sidebar-eyebrow { color: #cfe5f3; }
.dq-product-detail__sidebar p { color: #eef6ff; }
.dq-product-detail__sidebar li::before { color: #ffb5b8; }
.dq-product-detail__side-button,
.dq-product-detail__cta:not(.dq-product-detail__cta--secondary),
.dq-product-consult .dqc-contact-form button {
    border-color: var(--dq-logo-red);
    background: linear-gradient(135deg, var(--dq-logo-red), var(--dq-logo-red-dark));
    color: #fff;
    box-shadow: 0 12px 26px rgba(203, 9, 13, .22);
}
.dq-product-detail__cta--secondary { border-color: var(--dq-logo-blue); color: var(--dq-logo-blue); }
.dq-product-consult__close { border-color: #d4e1ec; color: var(--dq-logo-blue-dark); }
.dq-product-consult__form { border-color: #d4e1ec; background: var(--dq-logo-blue-mist); }
.dq-product-consult .dqc-contact-form label { color: #294d70; }
.dq-product-consult .dqc-contact-form input,
.dq-product-consult .dqc-contact-form textarea { border-color: #cfe1ee; }
.dq-product-lightbox__close { color: var(--dq-logo-blue-dark); }

/* Editorial, archive and sidebar surfaces. */
.dq-journal-hero,
.dq-article-hero { background: linear-gradient(125deg, var(--dq-logo-blue-deep), var(--dq-logo-blue)); }
.dq-journal-card__placeholder,
.dq-sidebar-cta { background: linear-gradient(145deg, var(--dq-logo-blue), var(--dq-logo-blue-dark)); }
.dq-sidebar-cta { box-shadow: 0 18px 38px rgba(0, 53, 111, .2); }
.dq-sidebar-cta a { background: var(--dq-logo-red); color: #fff; }
.category .dq-main,
.single-post .dq-main { background: #f8fbfe; }
.dq-article-content blockquote,
.dq-expert-box { background: var(--dq-logo-blue-mist); border-color: #d4e1ec; }

/* Reusable dark bands and calls to action. */
.dq-trust-story,
.dq-quote-panel,
.dq-contact-orbit__form,
.dq-contact-dispatch__form,
.dq-contact-dispatch__mast,
.dq-story-route__footer { background-color: var(--dq-logo-blue-dark); }
.dq-quote-panel__form .dq-btn,
.dq-quote-panel__form button[type="submit"],
.dq-quote-panel__form input[type="submit"] { background: var(--dq-logo-red); }

/* Floating contact: hotline red, Zalo blue, matching the logo. */
.dq-floating-contact { --dq-contact-group: var(--dq-logo-blue); --dq-contact-phone: var(--dq-logo-red); --dq-contact-zalo: var(--dq-logo-blue); }
.dq-floating-contact--action_bar .dq-floating-contact__item--phone,
.dq-floating-contact--dual_pills .dq-floating-contact__item--phone { --dq-active-color: var(--dq-logo-red); }
.dq-floating-contact--action_bar .dq-floating-contact__item--zalo,
.dq-floating-contact--dual_pills .dq-floating-contact__item--zalo { --dq-active-color: var(--dq-logo-blue); }
.dq-floating-contact--action_bar .dq-floating-contact__item--contact,
.dq-floating-contact--action_bar .dq-floating-contact__item--chat { --dq-active-color: var(--dq-logo-red); }

/* Legacy wellness/service palettes are normalized when those layouts are used. */
.dq-media-gallery-band.is-forest,
.dq-media-gallery-band__copy,
.dq-wellness-expert-note__copy,
.dq-wellness-inner-hero.is-forest { background: linear-gradient(145deg, var(--dq-logo-blue-dark), var(--dq-logo-blue)); }
.dq-wellness-btn,
.dq-wellness-inner-page .dq-header-btn { background: linear-gradient(135deg, var(--dq-logo-red), var(--dq-logo-red-dark)); }
.dq-content-cta-grid__nav:hover:not(:disabled),
.dq-wellness-rail__nav:hover:not(:disabled) { background: var(--dq-logo-blue); }
.dq-wellness-inner-page .dq-copyright,
.home .dq-copyright { background: var(--dq-logo-blue-dark); color: #dbeafe; }

@media (max-width: 600px) {
    body.home [data-layout="banner_slider"] .dq-banner::before {
        background: linear-gradient(90deg, rgba(0, 37, 78, .9), rgba(0, 53, 111, .34));
    }
}