/* Final responsive layout overrides. Loaded after main.css on purpose. */
@media (min-width: 992px) {
    body > .navbar .navbar-flex { flex-wrap: nowrap !important; gap: clamp(.45rem, 1.1vw, 1rem) !important; }
    body > .navbar .navbar-brand { flex: 0 0 auto; margin-right: 0 !important; white-space: nowrap; }
    body > .navbar .header-search { flex: 1 1 clamp(220px, 42vw, 560px) !important; width: auto !important; max-width: none !important; min-width: 0; }
    body > .navbar .header-search-form, body > .navbar .header-search .search-shell { min-width: 0; }
    body > .navbar .header-search input { min-width: 0; }
    body > .navbar .nav-actions { flex: 0 0 auto; gap: clamp(.25rem, .6vw, .55rem); }
    body > .navbar .nav-actions .nav-profile-trigger span { max-width: clamp(80px, 12vw, 180px); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
}

/* ==========================================================
   FINAL D Sec 1: dashboard launcher — four boxes in a single
   vertical column (desktop and mobile), titles only, centered.
   Subtle hover lift, chevron affordance, focus-visible and
   reduced-motion respected.
   ========================================================== */
body.page-xblivian-dashboard .xblivian-dashboard-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: none;
    justify-content: center;
    align-content: start;
    width: 100%;
    max-width: 720px;
    height: auto;
    min-height: 0;
    margin-inline: auto;
    margin-block: clamp(.6rem, 2vw, 1.2rem);
    padding-block: 0;
    column-gap: 0;
    row-gap: clamp(.7rem, 1.8vw, 1.1rem);
}
body.page-xblivian-dashboard .xblivian-dashboard-card,
body.page-xblivian-dashboard .xblivian-dashboard-assistant-card {
    width: 100%;
    min-width: 0;
    height: auto;
    max-height: none;
    min-height: clamp(84px, 11vh, 116px);
    aspect-ratio: auto;
    align-self: stretch;
    align-items: center;
    justify-content: center;
    text-align: center;
    gap: 0;
    padding: clamp(.9rem, 2vw, 1.3rem) clamp(1rem, 2.4vw, 1.6rem);
    border-radius: 18px;
}
body.page-xblivian-dashboard .xblivian-dashboard-card-title { max-width: 100%; text-align: center; overflow-wrap: anywhere; font-size: clamp(2.3rem, 4.2vw, 3.5rem); line-height: 1.15; letter-spacing: .02em; }

/* Chevron affordance that slides in on hover/focus (desktop pointers). */
body.page-xblivian-dashboard .xblivian-dashboard-card::after,
body.page-xblivian-dashboard .xblivian-dashboard-assistant-card::after {
    content: "\f054";
    font-family: "Font Awesome 6 Free", "Font Awesome 5 Free";
    font-weight: 900;
    position: absolute;
    right: clamp(.9rem, 2vw, 1.4rem);
    bottom: clamp(.85rem, 1.8vw, 1.25rem);
    font-size: .78rem;
    color: #4ade80;
    opacity: 0;
    transform: translateX(-6px);
    transition: opacity .22s ease, transform .22s ease;
    pointer-events: none;
}
@media (hover: hover) and (min-width: 768px) {
    body.page-xblivian-dashboard .xblivian-dashboard-card:hover::after,
    body.page-xblivian-dashboard .xblivian-dashboard-assistant-card:hover::after,
    body.page-xblivian-dashboard .xblivian-dashboard-card:focus-visible::after,
    body.page-xblivian-dashboard .xblivian-dashboard-assistant-card:focus-visible::after {
        opacity: 1;
        transform: translateX(0);
    }
    body.page-xblivian-dashboard .xblivian-dashboard-card:hover,
    body.page-xblivian-dashboard .xblivian-dashboard-assistant-card:hover {
        transform: translateY(-3px);
        border-color: rgba(74, 222, 128, 0.45);
        box-shadow: 0 22px 44px rgba(2, 8, 23, 0.45);
    }
}
/* Touch feedback on mobile. */
body.page-xblivian-dashboard .xblivian-dashboard-card:active,
body.page-xblivian-dashboard .xblivian-dashboard-assistant-card:active { transform: scale(.985); }
/* Keyboard focus. */
body.page-xblivian-dashboard .xblivian-dashboard-card:focus-visible,
body.page-xblivian-dashboard .xblivian-dashboard-assistant-card:focus-visible { outline: 2px solid #4ade80; outline-offset: 2px; }
/* Reduced motion: keep the UI calm. */
@media (prefers-reduced-motion: reduce) {
    body.page-xblivian-dashboard .xblivian-dashboard-card,
    body.page-xblivian-dashboard .xblivian-dashboard-assistant-card { transition: none; }
    body.page-xblivian-dashboard .xblivian-dashboard-card::after,
    body.page-xblivian-dashboard .xblivian-dashboard-assistant-card::after { transition: none; opacity: 1; transform: none; }
}
body.page-xblivian-dashboard .site-footer { margin-top: 0 !important; }
.site-footer .footer-bottom { width: 100%; text-align: initial; }
.site-footer .footer-bottom > * { width: auto; margin-inline: 0; text-align: initial !important; }
.site-footer .footer-copyright, .site-footer .footer-powered { white-space: nowrap; font-size: clamp(.68rem, 1.2vw, .88rem); line-height: 1.25; }

@media (max-width: 767.98px) {
    /* Single vertical column on mobile too, with small side margins. */
    body.page-xblivian-dashboard .xblivian-dashboard-grid {
        grid-template-columns: minmax(0, 1fr);
        grid-template-rows: none;
        max-width: none;
        height: auto;
        column-gap: 0;
        row-gap: .65rem;
        margin-block: .5rem .9rem;
        padding-inline: clamp(5px, 1.5vw, 12px);
    }
    body.page-xblivian-dashboard .xblivian-dashboard-card,
    body.page-xblivian-dashboard .xblivian-dashboard-assistant-card {
        min-height: 76px;
        max-height: none;
        height: auto;
        padding: .8rem 1rem;
        border-radius: 15px;
    }
    body.page-xblivian-dashboard .xblivian-dashboard-card-title { font-size: clamp(2.2rem, 9.5vw, 2.8rem); }
    .site-footer { padding-top: 1rem !important; padding-bottom: max(1rem, env(safe-area-inset-bottom, 0px)) !important; }
    .site-footer .footer-bottom { gap: .5rem !important; }
    .site-footer .footer-copyright, .site-footer .footer-powered { font-size: clamp(.62rem, 2.4vw, .78rem); }
}
@media (max-width: 400px) {
    body.page-xblivian-dashboard .xblivian-dashboard-grid { row-gap: .5rem; }
    body.page-xblivian-dashboard .xblivian-dashboard-card,
    body.page-xblivian-dashboard .xblivian-dashboard-assistant-card { min-height: 68px; padding: .7rem .85rem; border-radius: 13px; }
    body.page-xblivian-dashboard .xblivian-dashboard-card-title { font-size: clamp(1.9rem, 9.5vw, 2.4rem); }
    .site-footer .footer-bottom { gap: .3rem !important; }
    .site-footer .footer-copyright, .site-footer .footer-powered { font-size: .6rem; }
}

/* ============================================================
   MANDATO follow-ups: UPDATED stamp visibility (Sec 18) and
   mobile notification badge enlargement (Sec 19).
   ============================================================ */

/* UPDATED stamp: never let the pill's nowrap contract clip the timestamp.
   Backend + JS already supply the stamp; these rules only make the
   layout robust when the pill runs out of horizontal room. */
body.page-xblivian-dashboard .xblivian-dashboard-live-pill {
    overflow: visible;
}
body.page-xblivian-dashboard .xblivian-dashboard-live-stamp {
    overflow-wrap: anywhere;
    font-size: .85rem;
}
body.page-xblivian-dashboard .xblivian-dashboard-title-row .xblivian-dashboard-live-pill {
    grid-column: 2;
    justify-self: center;
}

@media (max-width: 767.98px) {
    body.page-xblivian-dashboard .xblivian-dashboard-live-pill {
        white-space: normal;
        flex-wrap: wrap;
        row-gap: 0.1rem;
    }
    body.page-xblivian-dashboard .xblivian-dashboard-live-stamp {
        white-space: normal;
        font-size: 0.82rem;
    }
}

/* Notification badge: larger and clearly legible on mobile (Sec 19).
   Only the badge grows — the bell icon stays the same size. */
@media (max-width: 767.98px) {
    body.page-xblivian-dashboard .xblivian-dashboard-mobile-notification-badge {
        align-items: center;
        justify-content: center;
        background: #dc2626;
        color: #fff;
        border: 2px solid #111827;
        border-radius: 999px;
        font-weight: 800;
        min-width: 1.6rem;
        padding: 0.3rem 0.5rem;
        font-size: 0.95rem;
        line-height: 1.1;
        top: -0.35rem;
        right: -0.3rem;
    }
}

/* ============================================================
   Sec 30: mobile dashboard — SETTINGS replaces BOSS as the
   fourth card. SETTINGS card exists in the DOM for both
   breakpoints (links stay accessible) but is visually hidden on
   desktop; BOSS is hidden on mobile where the floating control
   provides access (Sec 31).
   ============================================================ */
body.page-xblivian-dashboard .xblivian-dashboard-card--settings { display: none; }
@media (max-width: 767.98px) {
    body.page-xblivian-dashboard .xblivian-dashboard-card--settings { display: flex; }
    body.page-xblivian-dashboard .xblivian-dashboard-card--boss,
    body.page-xblivian-dashboard .xblivian-dashboard-assistant-card.xblivian-dashboard-card--boss { display: none; }
}
