/*
 * Sovereign Header Nav Overflow Fix — v3.0
 * Prevents nav buttons from colliding with the rounded right edge.
 * Applied to ALL op pages via sovereign-header.css import chain.
 */

@import url('sovereign-accents-rounded.css');

/* ── §HEADER NAV: Prevent right-edge collision + left logo clearance ─────── */
.hdr-bottom {
    padding: 0 60px 0 56px !important;
    box-sizing: border-box !important;
    gap: 8px !important;
}

.hdr-nav {
    display: flex !important;
    gap: 5px !important;
    align-items: center !important;
    overflow: hidden !important;
    min-width: 0 !important;
    flex: 1 !important;
    justify-content: flex-end !important;
    padding-right: 0 !important;
}

/* Shrink ALL button variants to fit */
.hdr-btn,
.hdr-btn-wide,
.hdr-btn-op03 {
    padding: 5px 10px !important;
    font-size: 11px !important;
    white-space: nowrap !important;
    flex-shrink: 1 !important;
    min-width: 0 !important;
    max-width: 170px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    letter-spacing: 0.3px !important;
}

/* ── §AXIOM MODAL: Guarantee topmost z-index above everything ─────── */
#abm-ov {
    z-index: 2147483640 !important;  /* matches HITL bridge overlay level */
}
#abm-card-ov {
    z-index: 2147483645 !important;  /* detail card must be above main overlay */
}

/* ── §SCROLLBAR: Gold pill — z41-body (AXIOM APPLIED) in OP-01 ───── */
/* Inherits global glass scrollbars from sovereign_scrollbar.css for consistent visual aesthetics */

/* ── §3D CANVAS CENTERING: All visualization containers ──────────── */
.z42-body,
.model-visual,
.gnn-visual {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: hidden !important;
}

.z42-body > canvas,
.model-visual > canvas,
.gnn-visual > canvas {
    width: 100% !important;
    height: 100% !important;
    display: block !important;
    border-radius: 0 !important;
    touch-action: none !important;
}

/* ── §L5: Ensure minimum visible fill even at 0% ─────────────────── */
.eng-bar-fill[data-lane="5"] {
    background: var(--lane-l5) !important;
}

/* ── §MODAL: Nuclear scrollbar hide when HITL modal is active ──────────────
 * FIX-SCROLL-03: z-index warfare is non-deterministic against position:fixed
 * golden scrollbar rails that use z-index:2147483647 (INT_MAX). Setting z:1
 * on a non-positioned element cannot win that fight. The only guaranteed fix
 * is to remove the scrollbar from view entirely with visibility:hidden +
 * opacity:0 + pointer-events:none — this works regardless of stacking context.
 * The HITL bridge applies body.modal-active-lock on show() and removes it
 * on hide(), so this rule is only active while the modal is open. */
body.modal-active-lock .sv-pill,
body.modal-active-lock .sv-track,
body.modal-active-lock [class*="scrollbar"],
body.modal-active-lock .card-container,
body.modal-active-lock ::-webkit-scrollbar,
body.modal-active-lock ::-webkit-scrollbar-thumb,
body.modal-active-lock ::-webkit-scrollbar-track {
    visibility:      hidden       !important;
    opacity:         0            !important;
    pointer-events:  none         !important;
    z-index:         -1           !important;
}

/* Firefox: disable scrollbar colour during modal lockdown */
body.modal-active-lock * {
    scrollbar-width: none !important;
}

/* ── §TUBE ARROWS: Hide literal Unicode ▼ characters to prevent double arrows ── */
.eng-tube-arrow {
    color: transparent !important;
}

/* ── §PREMIUM TABS: 3D Crystal Glass Plates with Highly Polished Gold Casing Borders ─────── */
.hdr-btn,
.ded-phase-tab {
    font-family: 'Quicksand', 'Nunito', -apple-system, BlinkMacSystemFont, "PingFang TC", "Microsoft JhengHei", "微軟正黑體", sans-serif !important;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0.18) 0%, rgba(255, 255, 255, 0.08) 49%, rgba(212, 175, 55, 0.12) 50%, rgba(0, 0, 0, 0.6) 100%) !important;
    backdrop-filter: blur(12px) saturate(160%) !important;
    -webkit-backdrop-filter: blur(12px) saturate(160%) !important;
    border: none !important; /* STRICTLY REMOVE BORDERS per mockup change notes */
    border-radius: 25px !important; /* Capsule shape */
    color: #ffd700 !important;
    font-weight: 700 !important;
    font-size: 11px !important;
    padding: 6px 14px !important;
    box-shadow: 
        inset 0 1.5px 3px rgba(255, 255, 255, 0.45), 
        inset 0 -1.5px 3px rgba(0, 0, 0, 0.6),
        0 4px 10px rgba(0, 0, 0, 0.4) !important; /* Bumped up 3D embossed look without borders */
    text-shadow: 0 0 6px rgba(255, 215, 0, 0.35) !important;
    letter-spacing: 0.5px !important;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

/* Active & Hovered Nav Tabs & Phase Tabs: Fluorescent Lime-Green (#c1ff72) Crystal Glass Capsule with Green Casing */
.hdr-btn:hover,
.hdr-btn.active,
.ded-phase-tab:hover,
.ded-phase-tab.active {
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0.22) 0%, rgba(255, 255, 255, 0.12) 49%, rgba(193, 255, 114, 0.15) 50%, rgba(0, 0, 0, 0.55) 100%) !important;
    border: none !important; /* STRICTLY REMOVE BORDERS per mockup change notes */
    color: #c1ff72 !important;
    box-shadow: 
        inset 0 1.5px 3px rgba(255, 255, 255, 0.5), 
        inset 0 -1.5px 3px rgba(0, 0, 0, 0.6),
        0 6px 14px rgba(193, 255, 114, 0.25) !important; /* Active bumped up 3D embossed look */
    text-shadow: 0 0 8px rgba(193, 255, 114, 0.45) !important;
    font-weight: 800 !important;
}