/*!
 * IDDS CONSOLE — polished civic shell (admin-like cards)
 * Per-dinas identity comes from arch DNA + brand tokens — do not flatten.
 * Load before idds-arch-dna.css.
 */
@import url("https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap");

:root, body.skin-magz, body.idds {
    --c-ink: #101826;
    --c-ink-2: var(--idds-primary, #1a365d);
    --c-paper: var(--hz-surface, var(--idds-a-bg, #eef1f5));
    --c-card: #ffffff;
    --c-line: #dde3ec;
    --c-mute: #5b6b82;
    --c-text: #152033;
    --c-radius: 14px;
    --c-radius-sm: 10px;
    --c-shadow: 0 1px 2px rgba(21, 32, 51, .04), 0 8px 22px rgba(21, 32, 51, .06);
    --c-shadow-lg: 0 14px 36px rgba(21, 32, 51, .1);
    --c-font: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
}

/* Kill Magz 2017 ornaments / chrome */
body.skin-magz nav.menu::after,
body.skin-magz footer.footer::before,
body.skin-magz .leaders-band__motif,
body.skin-magz .ornament,
body.skin-magz .line.top > div::before,
body.skin-magz .line.top > div::after {
    display: none !important;
    content: none !important;
    background: none !important;
}

/* ==========================================================================
   BASE CANVAS
   ========================================================================== */
html { scroll-behavior: smooth; }
body.skin-magz,
body.skin-magz #wrapper,
body.skin-magz .wrapper,
body.skin-magz .container-content {
    font-family: var(--c-font) !important;
    background: var(--c-paper) !important;
    color: var(--c-text) !important;
}
body.skin-magz .home--nexus,
body.skin-magz .home--compose,
body.skin-magz .home.top {
    background: transparent !important;
}

/* Nav follows dinas primary (not one global navy) — detailed rule below */

/* ==========================================================================
   MASTHEAD = admin top navbar
   ========================================================================== */
body.skin-magz .firstbar,
body.skin-magz .firstbar.firstbar--aether {
    position: sticky;
    top: 0;
    z-index: 1040;
    background: rgba(255, 255, 255, .92) !important;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-bottom: 1px solid var(--c-line) !important;
    box-shadow: none !important;
    padding: .65rem 0 !important;
}
body.skin-magz .firstbar .brand__kicker {
    font-size: .62rem !important;
    font-weight: 800 !important;
    letter-spacing: .14em !important;
    text-transform: uppercase !important;
    color: var(--idds-primary, var(--c-ink-2)) !important;
}
body.skin-magz .firstbar .brand__name {
    font-size: 1.02rem !important;
    font-weight: 800 !important;
    letter-spacing: -.025em !important;
    color: var(--c-text) !important;
}
body.skin-magz .firstbar .brand__mark {
    width: 52px !important;
    height: 52px !important;
    border-radius: 12px !important;
    background: #fff !important;
    border: 1px solid var(--c-line) !important;
    box-shadow: var(--c-shadow) !important;
    display: grid !important;
    place-items: center !important;
}
body.skin-magz .firstbar .brand__logo {
    max-height: 36px !important;
    height: 36px !important;
}
body.skin-magz .firstbar .form-control {
    min-height: 42px !important;
    border-radius: 10px 0 0 10px !important;
    border: 1px solid var(--c-line) !important;
    background: #f8fafc !important;
    font-size: .9rem !important;
}
body.skin-magz .firstbar .btn-primary {
    min-height: 42px !important;
    border-radius: 0 10px 10px 0 !important;
    background: var(--idds-primary, var(--c-ink-2)) !important;
    padding-inline: 1rem !important;
}
body.skin-magz .gov-ident {
    display: flex !important;
    flex-direction: column;
    align-items: flex-end;
    gap: .35rem;
}
body.skin-magz .gov-ident__badge {
    background: var(--idds-primary, var(--c-ink-2)) !important;
    border: 1px solid color-mix(in srgb, var(--idds-primary, var(--c-ink-2)) 70%, #0b1220) !important;
    color: #fff !important;
    border-radius: 999px !important;
    font-size: .68rem !important;
    font-weight: 750 !important;
    padding: .35rem .75rem !important;
}
body.skin-magz .gov-ident__badge i {
    color: #fff !important;
}
body.skin-magz .gov-ident__date {
    display: inline-flex !important;
    align-items: center;
    gap: .4rem;
    padding: .35rem .75rem !important;
    border-radius: 999px !important;
    background: #f1f5f9 !important;
    border: 1px solid var(--c-line) !important;
    color: var(--c-mute) !important;
    font-size: .72rem !important;
    font-weight: 650 !important;
}

/* ==========================================================================
   NAV = admin sidebar energy (horizontal)
   ========================================================================== */
body.skin-magz nav.menu,
body.hd-bar nav.menu,
body.hd-solid nav.menu,
body.hd-glass nav.menu,
body.hd-underline nav.menu,
body.hd-split nav.menu {
    background: linear-gradient(185deg,
        color-mix(in srgb, var(--idds-primary, #1a365d) 72%, #0b1220) 0%,
        var(--idds-primary, #1a365d) 55%,
        color-mix(in srgb, var(--idds-primary, #1a365d) 82%, #0b1220) 100%) !important;
    border: none !important;
    box-shadow: 0 10px 28px color-mix(in srgb, var(--idds-primary, #1a365d) 22%, transparent) !important;
    padding: .35rem 0 !important;
}
body.skin-magz nav.menu .nav-list > li > a,
body.skin-magz nav.menu ul.float-end > li > a {
    color: rgba(255, 255, 255, .78) !important;
    font-weight: 600 !important;
    font-size: .84rem !important;
    letter-spacing: -.01em;
    border-radius: 8px !important;
    padding: .55rem .85rem !important;
    margin: 0 2px;
    transition: background .15s ease, color .15s ease;
}
body.skin-magz nav.menu .nav-list > li > a:hover,
body.skin-magz nav.menu .nav-list > li > a:focus {
    background: rgba(255, 255, 255, .07) !important;
    color: #fff !important;
}
body.skin-magz nav.menu .nav-list > li.active > a,
body.skin-magz nav.menu .nav-list > li.current-menu-item > a {
    background: var(--idds-primary, var(--c-ink-2)) !important;
    color: #fff !important;
    box-shadow: inset 3px 0 0 var(--idds-accent, #a67c2a);
}

/* Breadcrumb — admin quiet */
body.skin-magz .breadcrumb {
    background: transparent !important;
    padding: .75rem 0 .25rem !important;
    margin: 0 !important;
    font-size: .82rem;
}
body.skin-magz .breadcrumb a { color: var(--idds-primary, var(--c-ink-2)); font-weight: 650; }

/* ==========================================================================
   SECTION TITLES — kill Magz .line.top teal bricks
   ========================================================================== */
body.skin-magz .line.top {
    border: none !important;
    margin: 0 0 1rem !important;
    padding: 0 !important;
    background: transparent !important;
}
body.skin-magz .line.top > div,
body.skin-magz .line.top div {
    display: inline-flex !important;
    align-items: center;
    gap: .55rem;
    background: transparent !important;
    color: var(--c-text) !important;
    font-size: 1.15rem !important;
    font-weight: 800 !important;
    letter-spacing: -.025em !important;
    padding: 0 !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    text-transform: none !important;
}
body.skin-magz .line.top > div::before {
    content: "" !important;
    display: inline-block !important;
    width: 10px !important;
    height: 10px !important;
    border-radius: 4px !important;
    background: linear-gradient(135deg, var(--idds-primary, var(--c-ink-2)), var(--idds-accent, #a67c2a)) !important;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--idds-primary, var(--c-ink-2)) 16%, transparent);
}
body.skin-magz .title-col {
    font-size: 1.05rem !important;
    font-weight: 800 !important;
    letter-spacing: -.02em !important;
    color: var(--c-text) !important;
}

/* ==========================================================================
   PANELS / CARDS — dash-metric language
   ========================================================================== */
body.skin-magz .home--nexus .nx-panel,
body.skin-magz .home--nexus .nx-panel--leaders,
body.skin-magz .home--nexus .nx-panel--dock,
body.skin-magz .home--nexus .nx-panel--news,
body.skin-magz .home-section-grid__cell {
    background: var(--c-card) !important;
    border: 1px solid var(--c-line) !important;
    border-radius: var(--c-radius) !important;
    box-shadow: var(--c-shadow) !important;
    padding: 1.25rem 1.35rem !important;
}
body.skin-magz .home--nexus .nx-kicker {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    font-size: .66rem !important;
    font-weight: 800 !important;
    letter-spacing: .12em !important;
    text-transform: uppercase !important;
    color: var(--c-mute) !important;
}
body.skin-magz .home--nexus .nx-title {
    font-size: clamp(1.15rem, 2vw, 1.4rem) !important;
    font-weight: 800 !important;
    letter-spacing: -.03em !important;
    color: var(--c-text) !important;
    margin: .2rem 0 0 !important;
}
body.skin-magz .home--nexus .nx-identity__arch {
    background: var(--idds-primary, var(--c-ink-2)) !important;
    border-radius: 8px !important;
    box-shadow: inset 3px 0 0 var(--idds-accent, #a67c2a);
}

/* Hero welcome badge = dash-hero chip */
body.skin-magz .home--nexus .nx-hero__badge {
    background: linear-gradient(135deg, color-mix(in srgb, var(--idds-primary, #1a365d) 72%, #0b1220), var(--idds-primary, #1a365d)) !important;
    border-radius: 12px !important;
    border: 1px solid rgba(255,255,255,.1) !important;
    box-shadow: var(--c-shadow) !important;
    color: #fff !important;
    padding: .6rem 1rem !important;
    gap: .55rem !important;
}
body.skin-magz .home--nexus .nx-hero__frame .hero-carousel,
body.skin-magz .home--nexus .nx-hero__frame .hz-slider__frame,
body.skin-magz .home--nexus .home-compose__slider-frame {
    border-radius: 16px !important;
    overflow: hidden;
    box-shadow: var(--c-shadow-lg) !important;
    border: 1px solid rgba(16, 24, 40, .06);
}

/* Portal services = metric tiles */
body.skin-magz .home--nexus .portal-strip--flat .portal-services {
    display: grid !important;
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
    gap: .75rem !important;
}
@media (max-width: 991.98px) {
    body.skin-magz .home--nexus .portal-strip--flat .portal-services {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }
}
@media (max-width: 575.98px) {
    body.skin-magz .home--nexus .portal-strip--flat .portal-services {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}
body.skin-magz .home--nexus .portal-strip--flat .portal-services__item {
    background: #fff !important;
    border: 1px solid var(--c-line) !important;
    border-radius: 14px !important;
    box-shadow: var(--c-shadow) !important;
    padding: 1rem .75rem !important;
    text-align: center;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
    position: relative;
    overflow: hidden;
}
body.skin-magz .home--nexus .portal-strip--flat .portal-services__item::before {
    content: "";
    position: absolute;
    left: 0; top: 0; bottom: 0;
    width: 3px;
    background: var(--idds-accent, #a67c2a);
}
body.skin-magz .home--nexus .portal-strip--flat .portal-services__item:hover {
    transform: translateY(-3px);
    box-shadow: var(--c-shadow-lg) !important;
    border-color: color-mix(in srgb, var(--idds-primary, var(--c-ink-2)) 28%, var(--c-line)) !important;
}
body.skin-magz .home--nexus .portal-strip--flat .portal-services__ico {
    width: 44px !important;
    height: 44px !important;
    border-radius: 12px !important;
    margin: 0 auto .55rem !important;
    display: grid !important;
    place-items: center !important;
    background: color-mix(in srgb, var(--idds-primary, var(--c-ink-2)) 12%, #fff) !important;
    color: var(--idds-primary, var(--c-ink-2)) !important;
    font-size: 1.1rem !important;
    border: none !important;
    box-shadow: none !important;
}

/* News cards */
body.skin-magz .home--nexus .article:not(.main-article) .inner,
body.skin-magz .home--nexus article.article-list .inner {
    border-radius: 14px !important;
    border: 1px solid var(--c-line) !important;
    box-shadow: var(--c-shadow) !important;
    background: #fff !important;
    overflow: hidden;
}
body.skin-magz .home--nexus .article:not(.main-article) .inner:hover {
    transform: translateY(-3px);
    box-shadow: var(--c-shadow-lg) !important;
}
body.skin-magz .home--nexus article.featured {
    border-radius: 16px !important;
    box-shadow: var(--c-shadow-lg) !important;
}

/* Tags — admin chips */
body.skin-magz .home--nexus .nx-tag,
body.skin-magz .home--nexus .tags-list a {
    border-radius: 8px !important;
    background: #f1f5f9 !important;
    border: 1px solid var(--c-line) !important;
    font-weight: 650 !important;
}

/* ==========================================================================
   FOOTER = admin sidebar ink
   ========================================================================== */
body.skin-magz footer.footer,
body.skin-magz .footer {
    background: linear-gradient(185deg, #0f1624 0%, #151e30 55%, #121a28 100%) !important;
    color: rgba(255,255,255,.78) !important;
    margin-top: 2rem;
    padding-top: 2rem;
    border-top: none !important;
}
body.skin-magz footer.footer a { color: rgba(255,255,255,.84) !important; }
body.skin-magz footer.footer h1,
body.skin-magz footer.footer h2,
body.skin-magz footer.footer h3,
body.skin-magz footer.footer h4,
body.skin-magz footer.footer .block-title,
body.skin-magz footer.footer .title-col {
    color: #fff !important;
    font-weight: 800 !important;
    letter-spacing: -.02em;
}
body.skin-magz footer.footer .form-control {
    background: rgba(255,255,255,.08) !important;
    border: 1px solid rgba(255,255,255,.14) !important;
    color: #fff !important;
    border-radius: 10px !important;
}
body.skin-magz footer.footer .btn-primary {
    background: var(--idds-accent, #a67c2a) !important;
    color: #101826 !important;
    border: none !important;
    border-radius: 10px !important;
    font-weight: 750 !important;
}
body.skin-magz footer.footer .tags-list a,
body.skin-magz footer.footer .nx-tag {
    background: rgba(255,255,255,.08) !important;
    border-color: rgba(255,255,255,.14) !important;
    color: #fff !important;
}

/* ==========================================================================
   INNER PAGES
   ========================================================================== */
body.skin-magz .page .main,
body.skin-magz section.single,
body.skin-magz .page-content,
body.skin-magz article.main-article .main {
    background: transparent;
}
body.skin-magz .page .inner,
body.skin-magz article.main-article,
body.skin-magz .contact-form,
body.skin-magz .comments {
    background: #fff;
    border: 1px solid var(--c-line);
    border-radius: var(--c-radius);
    box-shadow: var(--c-shadow);
    padding: 1.35rem 1.5rem;
}

/* Density — less Magz air */
body.skin-magz .home--nexus .nx-panel,
body.skin-magz .home--nexus section.nx-panel {
    margin-bottom: 1rem !important;
}
body.skin-magz .home--nexus .nx-body {
    padding-top: .85rem !important;
    padding-bottom: 1.5rem !important;
}

/* Soft reduce ambient noise so console cards dominate */
body.skin-magz .home--nexus .nx-ambient__orb { opacity: .12 !important; }
body.skin-magz .home--nexus .nx-ambient__grid { opacity: .03 !important; }
body.skin-magz .home--nexus .nx-motif__art--hero { opacity: .08 !important; }
body.skin-magz .home--nexus .nx-motif__art--mid,
body.skin-magz .home--nexus .nx-motif__art--float { opacity: .06 !important; }

/* ==========================================================================
   HERO BANNER — edge-to-edge, no letterbox padding
   ========================================================================== */
body.skin-magz .home--nexus .nx-hero__frame .home-compose__slider-frame,
body.skin-magz .home--nexus .nx-hero__frame .hz-slider__frame,
body.skin-magz .home--nexus .nx-hero__frame .hero-carousel {
    padding: 0 !important;
    background: transparent !important;
    border: 1px solid var(--c-line) !important;
    box-shadow: var(--c-shadow-lg) !important;
    border-radius: 16px !important;
    overflow: hidden !important;
    line-height: 0 !important;
}
body.skin-magz .home--nexus .hero-carousel--fit-banner .carousel-item,
body.skin-magz .home--nexus .hero-carousel--fit-banner .hero-carousel__media,
body.skin-magz .home--nexus .nx-hero__frame .hz-slider__frame {
    background: transparent !important;
    min-height: 0 !important;
    height: auto !important;
    padding: 0 !important;
}
body.skin-magz .home--nexus .hero-carousel--fit-banner .hero-carousel__img,
body.skin-magz .home--nexus .hero-carousel--fit-banner .carousel-item img {
    width: 100% !important;
    height: auto !important;
    max-height: none !important;
    min-height: 0 !important;
    object-fit: contain !important;
    object-position: center center !important;
    display: block !important;
    vertical-align: top;
}

/* ==========================================================================
   PEJABAT — equal height + fill row when few cards
   ========================================================================== */
body.skin-magz .home--nexus .hz-officers--marquee .hz-officers__viewport {
    width: 100% !important;
}
body.skin-magz .home--nexus .hz-officers--marquee.hz-officers--fill .hz-officers__track {
    width: 100% !important;
    max-width: 100% !important;
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 1rem;
    transform: none !important;
}
body.skin-magz .home--nexus .hz-officers--marquee.hz-officers--fill .hz-officer {
    flex: unset !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    height: 100% !important;
    min-height: 320px !important;
}
@media (max-width: 575.98px) {
    body.skin-magz .home--nexus .hz-officers--marquee.hz-officers--fill .hz-officers__track {
        grid-template-columns: 1fr;
    }
}
body.skin-magz .home--nexus .hz-officers--marquee .hz-officer {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    min-height: 320px !important;
    height: auto !important;
}
body.skin-magz .home--nexus .hz-officers--marquee .hz-officer__body {
    flex: 1 1 auto !important;
    width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    min-height: 0 !important;
}
body.skin-magz .home--nexus .hz-officers--marquee .hz-officer__nip {
    margin-top: auto !important;
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: center !important;
    gap: .3rem !important;
    width: 100% !important;
    min-height: 2.1rem !important;
    height: 2.1rem !important;
    max-height: 2.1rem !important;
    padding: .35rem .5rem !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    box-sizing: border-box !important;
    font-size: .58rem !important;
    line-height: 1 !important;
}
body.skin-magz .home--nexus .hz-officers--marquee .hz-officer__nip span {
    flex: 0 0 auto !important;
    white-space: nowrap !important;
}
body.skin-magz .home--nexus .hz-officers--marquee .hz-officer__nip--empty {
    visibility: hidden !important;
    min-height: 2.1rem !important;
    height: 2.1rem !important;
}