:root {
    --smu-topbar-height: 48px;
    --smu-red: #cc0101;
    --smu-red-dark: #cc0101;
}

.smu-topbar,
.smu-topbar * {
    box-sizing: border-box;
}

.smu-topbar {
    min-height: var(--smu-topbar-height);
    position: relative;
    z-index: 1100;
    clear: both;
    direction: ltr;
    color: #fff;
    background: #cc0101;
    font-family: Tahoma, Arial, sans-serif !important;
}

.smu-topbar a,
.smu-topbar span,
.smu-topbar button {
    font-family: Tahoma, Arial, sans-serif !important;
}

/*
 * Exact vertical order:
 * 1. Top bar at the very top.
 * 2. Complete Acadia header directly underneath.
 * Both remain in normal document flow, so the logo cannot be covered.
 */
body.acidachiled-topbar-enabled .header-area {
    position: relative;
    z-index: 1000;
    clear: both;
    margin-top: 0 !important;
}

body.acidachiled-topbar-enabled .header-area .tp-header-2,
body.acidachiled-topbar-enabled .header-area .tp-header-2-logo,
body.acidachiled-topbar-enabled .header-area .tp-header-2-logo a {
    overflow: visible;
}

body.acidachiled-topbar-enabled .header-area .tp-header-2-logo img {
    display: block;
    height: auto;
}


.smu-topbar__inner {
    width: min(1380px, calc(100% - 40px));
    min-height: var(--smu-topbar-height);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    margin-inline: auto;
}

.smu-topbar__contact,
.smu-topbar__links {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 10px;
    direction: ltr;
}

.smu-topbar__contact-item,
.smu-topbar__action,
.smu-topbar__language {
    color: #fff !important;
    text-decoration: none !important;
    white-space: nowrap;
}

.smu-topbar__contact-item {
    min-height: 30px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin: 0;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.2;
}

.smu-topbar__icon {
    width: 14px;
    height: 14px;
    display: inline-flex;
    flex: 0 0 14px;
}

.smu-topbar svg {
    width: 100%;
    height: 100%;
    display: block;
    fill: currentColor;
}

.smu-topbar__phone {
    direction: ltr !important;
    unicode-bidi: isolate;
}

.smu-topbar__action,
.smu-topbar__language {
    min-height: 31px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 0 11px;
    border: 1px solid rgba(255, 255, 255, .22);
    border-radius: 9px;
    background: rgba(255, 255, 255, .09);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12), 0 5px 13px rgba(62, 0, 8, .14);
    font-size: 12px;
    font-weight: 700;
    line-height: 1.1;
    transition: background .2s ease, border-color .2s ease, transform .2s ease, box-shadow .2s ease;
}

.smu-topbar__action:hover,
.smu-topbar__language:hover,
.smu-topbar__action:focus-visible,
.smu-topbar__language:focus-visible {
    color: #fff !important;
    border-color: rgba(255, 255, 255, .48);
    background: rgba(255, 255, 255, .18);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .16), 0 7px 17px rgba(62, 0, 8, .2);
    transform: translateY(-1px);
    outline: 2px solid rgba(255, 255, 255, .72);
    outline-offset: 2px;
}

.smu-topbar__action-icon {
    width: 23px;
    height: 23px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 23px;
    padding: 5px;
    border-radius: 7px;
    background: rgba(255, 255, 255, .14);
}

.smu-topbar__language {
    min-width: 96px;
    direction: ltr;
}

.smu-topbar__language img {
    width: 25px;
    height: 17px;
    display: block;
    flex: 0 0 25px;
    border: 1px solid rgba(255, 255, 255, .45);
    border-radius: 3px;
    object-fit: cover;
    box-shadow: 0 2px 5px rgba(39, 0, 5, .2);
}

@media (max-width: 1380px) and (min-width: 1101px) {
    .smu-topbar__inner { gap: 16px; }
    .smu-topbar__contact,
    .smu-topbar__links { gap: 6px; }
    .smu-topbar__action,
    .smu-topbar__language { padding-inline: 8px; }
    .smu-topbar__contact-item,
    .smu-topbar__action,
    .smu-topbar__language { font-size: 11px; }
}

@media (max-width: 1210px) and (min-width: 1101px) {
    .smu-topbar__location { display: none; }
}

@media (min-width: 621px) and (max-width: 1100px) {
    .smu-topbar__inner {
        width: min(calc(100% - 24px), 1080px);
    }
    .smu-topbar__contact-item { font-size: 10px; }
    .smu-topbar__action,
    .smu-topbar__language {
        min-height: 29px;
        padding-inline: 7px;
        font-size: 10px;
    }
    .smu-topbar__location { display: none; }
}

@media (max-width: 760px) {
    .smu-topbar__contact { display: none; }
    .smu-topbar__inner { justify-content: center; }
}

@media (max-width: 620px) {
    .smu-topbar { display: none; }
}

/* Ensure all Acadia/Elementor logo wrappers remain visible on every page. */
body.acidachiled-topbar-enabled .header-area [class*="logo"],
body.acidachiled-topbar-enabled .header-area [class*="logo"] a {
    overflow: visible !important;
}

body.acidachiled-topbar-enabled .header-area [class*="logo"] img {
    display: block;
    height: auto;
}

/* =========================================================
   ACADIA LARGE DESKTOP LOGO — KEEP IT BELOW THE TOP BAR
   Acadia's MMU home stylesheet fixes this logo at top: 0.
   Offset it by the child top-bar height so the full logo is visible.
========================================================= */
@media (min-width: 768px) {
    body.acidachiled-topbar-enabled
    .header-area .tp-header-inner-logo.tp-el-logo {
        top: var(--smu-topbar-height) !important;
    }

    body.admin-bar.acidachiled-topbar-enabled
    .header-area .tp-header-inner-logo.tp-el-logo {
        top: calc(32px + var(--smu-topbar-height)) !important;
    }
}

/* WordPress uses a taller front-end admin bar on narrow screens. */
@media (min-width: 768px) and (max-width: 782px) {
    body.admin-bar.acidachiled-topbar-enabled
    .header-area .tp-header-inner-logo.tp-el-logo {
        top: calc(46px + var(--smu-topbar-height)) !important;
    }
}

/* =========================================================
   FIXED TOP BAR + FIXED ACADIA HEADER
   The top bar stays at the top of the viewport. The complete Acadia header
   stays immediately below it. A measured spacer preserves the page layout.
========================================================= */
:root {
    --smu-admin-offset: 0px;
    --smu-topbar-live-height: var(--smu-topbar-height);
    --smu-header-live-height: 80px;
    --smu-fixed-stack-height: calc(
        var(--smu-topbar-live-height) + var(--smu-header-live-height)
    );
}

body.admin-bar {
    --smu-admin-offset: 32px;
}

body.acidachiled-fixed-stack-enabled .smu-topbar {
    position: fixed !important;
    top: var(--smu-admin-offset) !important;
    right: 0;
    left: 0;
    width: 100%;
    z-index: 2000;
    margin: 0 !important;
}

body.acidachiled-fixed-stack-enabled .header-area {
    position: fixed !important;
    top: calc(
        var(--smu-admin-offset) + var(--smu-topbar-live-height)
    ) !important;
    right: 0;
    left: 0;
    width: 100%;
    z-index: 1900 !important;
    margin: 0 !important;
    transform: none !important;
}

/*
 * The parent script adds .tp-header-sticky after 200px. Do not let that inner
 * row become a second fixed header; the complete .header-area is already fixed.
 */
body.acidachiled-fixed-stack-enabled .header-area #header-sticky,
body.acidachiled-fixed-stack-enabled .header-area #header-sticky.tp-header-sticky,
body.acidachiled-fixed-stack-enabled .header-area .tp-header-sticky {
    position: relative !important;
    top: auto !important;
    right: auto !important;
    left: auto !important;
    width: 100% !important;
    z-index: auto !important;
    margin: 0 !important;
    animation: none !important;
    transform: none !important;
}

body.acidachiled-fixed-stack-enabled .smu-fixed-header-spacer {
    width: 100%;
    height: var(--smu-fixed-stack-height);
    display: block;
    clear: both;
    pointer-events: none;
}

/* Keep the large MMU logo completely below the red top bar while fixed. */
@media (min-width: 768px) {
    body.acidachiled-fixed-stack-enabled
    .header-area .tp-header-inner-logo.tp-el-logo {
        top: calc(
            var(--smu-admin-offset) + var(--smu-topbar-live-height)
        ) !important;
        z-index: 1950 !important;
    }
}

/* WordPress front-end admin bar is 46px on narrow screens. */
@media (max-width: 782px) {
    body.admin-bar {
        --smu-admin-offset: 46px;
    }
}

/* The existing design hides the top bar on phones; the header then fixes at top. */
@media (max-width: 620px) {
    :root {
        --smu-topbar-live-height: 0px;
    }

    body.acidachiled-fixed-stack-enabled .header-area {
        top: var(--smu-admin-offset) !important;
    }
}