:root {
    --sidebar-width: 270px;
    --sidebar-collapsed-width: 82px;
    --topbar-height: 72px;
    --background-primary: #071321;
    --background-secondary: #0b1c31;
    --background-card: #102743;
    --background-card-dark: #0a1d33;
    --background-sidebar: #06111f;
    --background-topbar: rgba(8, 22, 39, 0.94);
    --border-primary: rgba(139, 174, 218, 0.15);
    --border-hover: rgba(83, 146, 255, 0.45);
    --text-primary: #ffffff;
    --text-secondary: #adbed2;
    --text-muted: #758ba5;
    --blue-primary: #367ce8;
    --blue-secondary: #55a0ff;
    --green-primary: #54d5aa;
    --amber-primary: #f2bb4b;
    --red-primary: #ed6a73;
    --page-width: 1440px;
}

* {
    box-sizing: border-box;
}

html {
    min-height: 100%;
    font-size: 16px;
}

body {
    min-height: 100vh;
    margin: 0;
    overflow-x: hidden;
    background: var(--background-primary);
    color: var(--text-primary);
    font-family: Inter,
        ui-sans-serif,
        system-ui,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        sans-serif;
}

button,
input,
select,
textarea {
    font: inherit;
}

a {
    color: inherit;
}

.app-shell {
    display: flex;
    min-height: 100vh;
}

/*SIDEBAR*/

.application-sidebar {
    position: fixed;
    inset: 0 auto 0 0;
    z-index: 300;
    display: flex;
    flex-direction: column;
    width: var(--sidebar-width);
    min-height: 100vh;
    border-right: 1px solid var(--border-primary);
    background: linear-gradient(
            180deg,
            #071524 0%,
            #06111f 100%
        );
    transition: width 180ms ease,
        transform 180ms ease;
}

.sidebar-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: var(--topbar-height);
    padding: 0 16px;
    border-bottom: 1px solid var(--border-primary);
}

.sidebar-brand {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
    color: var(--text-primary);
    text-decoration: none;
}

.sidebar-brand-mark {
    display: inline-flex;
    flex: 0 0 42px;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border: 1px solid rgba(85, 160, 255, 0.42);
    border-radius: 11px;
    background: linear-gradient(
            135deg,
            var(--blue-primary),
            var(--blue-secondary)
        );
    box-shadow: 0 9px 26px rgba(43, 112, 220, 0.22);
    font-weight: 800;
}

.sidebar-brand-content {
    display: flex;
    flex-direction: column;
    min-width: 0;
    white-space: nowrap;
}

.sidebar-brand-content strong {
    font-size: 0.91rem;
}

.sidebar-brand-content small {
    margin-top: 2px;
    color: var(--text-muted);
    font-size: 0.69rem;
}

.sidebar-collapse-button,
.mobile-sidebar-button,
.topbar-action-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--border-primary);
    background: rgba(18, 44, 74, 0.72);
    color: var(--text-secondary);
    cursor: pointer;
}

.sidebar-collapse-button {
    flex: 0 0 31px;
    width: 31px;
    height: 31px;
    border-radius: 8px;
    font-size: 1.25rem;
    transition: transform 180ms ease;
}

.sidebar-collapse-button:hover,
.mobile-sidebar-button:hover,
.topbar-action-button:hover {
    border-color: var(--border-hover);
    color: var(--text-primary);
}

.sidebar-navigation {
    flex: 1;
    overflow-y: auto;
    padding: 20px 12px;
}

.sidebar-navigation-group {
    margin-bottom: 25px;
}

.sidebar-navigation-heading {
    display: block;
    margin: 0 11px 9px;
    color: #536a84;
    font-size: 0.65rem;
    font-weight: 800;
    letter-spacing: 0.11em;
    text-transform: uppercase;
    white-space: nowrap;
}

.sidebar-navigation-link {
    display: flex;
    align-items: center;
    gap: 13px;
    min-height: 45px;
    margin-bottom: 4px;
    padding: 9px 12px;
    border: 1px solid transparent;
    border-radius: 10px;
    color: #96aac2;
    font-size: 0.87rem;
    font-weight: 650;
    text-decoration: none;
    white-space: nowrap;
    transition: background 140ms ease,
        border-color 140ms ease,
        color 140ms ease;
}

.sidebar-navigation-link:hover {
    border-color: rgba(92, 153, 248, 0.16);
    background: rgba(48, 105, 190, 0.11);
    color: #ffffff;
}

.sidebar-navigation-link.active {
    border-color: rgba(92, 153, 248, 0.28);
    background: linear-gradient(
            135deg,
            rgba(53, 124, 232, 0.24),
            rgba(37, 91, 172, 0.11)
        );
    color: #ffffff;
}

.sidebar-navigation-icon {
    display: inline-flex;
    flex: 0 0 34px;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 8px;
    background: rgba(73, 127, 205, 0.1);
    color: #83b3ff;
    font-size: 1rem;
}

.sidebar-footer {
    padding: 14px;
    border-top: 1px solid var(--border-primary);
}

.sidebar-environment {
    display: flex;
    align-items: center;
    gap: 11px;
    padding: 12px;
    border: 1px solid var(--border-primary);
    border-radius: 11px;
    background: rgba(15, 38, 64, 0.7);
}

.sidebar-environment-dot {
    flex: 0 0 9px;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: var(--green-primary);
    box-shadow: 0 0 0 5px rgba(84, 213, 170, 0.08);
}

.sidebar-environment-content {
    display: flex;
    flex-direction: column;
    white-space: nowrap;
}

.sidebar-environment-content span {
    color: var(--text-muted);
    font-size: 0.67rem;
}

.sidebar-environment-content strong {
    margin-top: 2px;
    font-size: 0.78rem;
}

/*COLLAPSED SIDEBAR*/

.application-sidebar.is-collapsed {
    width: var(--sidebar-collapsed-width);
}

.application-sidebar.is-collapsed
.sidebar-brand-content,
.application-sidebar.is-collapsed
.sidebar-navigation-heading,
.application-sidebar.is-collapsed
.sidebar-navigation-text,
.application-sidebar.is-collapsed
.sidebar-environment-content {
    display: none;
}

.application-sidebar.is-collapsed
.sidebar-header {
    justify-content: center;
    padding: 0 10px;
}

.application-sidebar.is-collapsed
.sidebar-brand {
    justify-content: center;
}

.application-sidebar.is-collapsed
.sidebar-collapse-button {
    position: absolute;
    right: -15px;
    transform: rotate(180deg);
}

.application-sidebar.is-collapsed
.sidebar-navigation {
    padding-right: 11px;
    padding-left: 11px;
}

.application-sidebar.is-collapsed
.sidebar-navigation-link {
    justify-content: center;
    padding: 6px;
}

.application-sidebar.is-collapsed
.sidebar-navigation-icon {
    flex-basis: 38px;
    width: 38px;
    height: 38px;
}

.application-sidebar.is-collapsed
.sidebar-environment {
    justify-content: center;
    padding: 13px 8px;
}

/*WORKSPACE*/

.application-workspace {
    width: calc(100% - var(--sidebar-width));
    min-height: 100vh;
    margin-left: var(--sidebar-width);
    transition: width 180ms ease,
        margin-left 180ms ease;
}

.application-sidebar.is-collapsed
+ .application-workspace {
    width: calc(100% - var(--sidebar-collapsed-width));
    margin-left: var(--sidebar-collapsed-width);
}

.application-topbar {
    position: sticky;
    top: 0;
    z-index: 200;
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: var(--topbar-height);
    padding: 0 26px;
    border-bottom: 1px solid var(--border-primary);
    background: var(--background-topbar);
    backdrop-filter: blur(18px);
}

.application-topbar-left,
.application-topbar-actions {
    display: flex;
    align-items: center;
}

.application-topbar-left {
    gap: 14px;
}

.application-topbar-actions {
    gap: 10px;
}

.application-page-context {
    display: flex;
    flex-direction: column;
}

.application-page-eyebrow {
    color: #5e7691;
    font-size: 0.62rem;
    font-weight: 800;
    letter-spacing: 0.11em;
}

.application-page-context strong {
    margin-top: 3px;
    font-size: 0.92rem;
}

.mobile-sidebar-button {
    display: none;
    width: 38px;
    height: 38px;
    border-radius: 9px;
}

.topbar-action-button {
    width: 38px;
    height: 38px;
    border-radius: 9px;
    font-weight: 800;
}

.topbar-user-button {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 44px;
    padding: 5px 10px 5px 6px;
    border: 1px solid var(--border-primary);
    border-radius: 11px;
    background: rgba(16, 41, 69, 0.68);
    color: var(--text-primary);
    cursor: pointer;
}

.topbar-user-button:hover {
    border-color: var(--border-hover);
}

.topbar-user-avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 9px;
    background: linear-gradient(
            135deg,
            #2865be,
            #4c92f5
        );
    font-size: 0.78rem;
    font-weight: 800;
}

.topbar-user-details {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.topbar-user-details strong {
    font-size: 0.75rem;
}

.topbar-user-details small {
    color: var(--text-muted);
    font-size: 0.65rem;
}

.topbar-user-arrow {
    color: var(--text-muted);
    font-size: 0.7rem;
}

.application-content {
    min-height: calc(100vh - var(--topbar-height));
    background: radial-gradient(
            circle at 10% 0%,
            rgba(54, 124, 232, 0.13),
            transparent 29%
        ),
        radial-gradient(
            circle at 95% 70%,
            rgba(36, 163, 138, 0.06),
            transparent 25%
        ),
        linear-gradient(
            145deg,
            #071321 0%,
            #0a1a2d 56%,
            #071321 100%
        );
}

/*MOBILE OVERLAY*/

.sidebar-overlay {
    position: fixed;
    inset: 0;
    z-index: 250;
    display: none;
    background: rgba(0, 0, 0, 0.58);
}

.sidebar-overlay.is-visible {
    display: block;
}

/*RESPONSIVE*/

@media (max-width: 900px) {
    .application-sidebar {
        width: var(--sidebar-width);
        transform: translateX(-100%);
    }

    .application-sidebar.is-collapsed {
        width: var(--sidebar-width);
    }

    .application-sidebar.is-mobile-open {
        transform: translateX(0);
    }

    .application-sidebar.is-collapsed
    .sidebar-brand-content,
    .application-sidebar.is-collapsed
    .sidebar-navigation-heading,
    .application-sidebar.is-collapsed
    .sidebar-navigation-text,
    .application-sidebar.is-collapsed
    .sidebar-environment-content {
        display: flex;
    }

    .application-sidebar.is-collapsed
    .sidebar-navigation-heading {
        display: block;
    }

    .application-sidebar.is-collapsed
    .sidebar-header {
        justify-content: space-between;
        padding: 0 16px;
    }

    .application-sidebar.is-collapsed
    .sidebar-collapse-button {
        position: static;
        transform: none;
    }

    .application-sidebar.is-collapsed
    .sidebar-navigation-link {
        justify-content: flex-start;
        padding: 9px 12px;
    }

    .application-sidebar.is-collapsed
    .sidebar-environment {
        justify-content: flex-start;
    }

    .application-workspace,
    .application-sidebar.is-collapsed
    + .application-workspace {
        width: 100%;
        margin-left: 0;
    }

    .mobile-sidebar-button {
        display: inline-flex;
    }

    .sidebar-collapse-button {
        display: none;
    }
}

@media (max-width: 620px) {
    .application-topbar {
        padding: 0 15px;
    }

    .application-page-eyebrow,
    .topbar-user-details,
    .topbar-user-arrow {
        display: none;
    }
}

/*=========================================================
   HOME PAGE
   =========================================================*/

.home-page {
    min-height: calc(100vh - var(--topbar-height));
    padding: 42px 30px 70px;
}

.home-page-container {
    width: min(1320px, 100%);
    margin: 0 auto;
}

.home-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 280px;
    gap: 36px;
    align-items: end;
    margin-bottom: 52px;
}

.home-hero-content {
    max-width: 880px;
}

.home-eyebrow,
.home-section-header > div > span,
.home-module-label {
    color: #6aa5ff;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.12em;
}

.home-hero h1 {
    max-width: 900px;
    margin: 14px 0 18px;
    color: #ffffff;
    font-size: clamp(2.4rem, 4vw, 4rem);
    line-height: 1.06;
    letter-spacing: -0.045em;
}

.home-hero p {
    max-width: 760px;
    margin: 0;
    color: var(--text-secondary);
    font-size: 1rem;
    line-height: 1.7;
}

.home-status-card {
    padding: 20px;
    border: 1px solid var(--border-primary);
    border-radius: 14px;
    background: rgba(11, 31, 53, 0.84);
}

.home-status-card > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.home-status-card span {
    color: var(--text-muted);
    font-size: 0.74rem;
}

.home-status-card strong {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #ffffff;
    font-size: 0.85rem;
}

.home-status-card small {
    display: block;
    margin-top: 13px;
    padding-top: 13px;
    border-top: 1px solid rgba(139, 174, 218, 0.1);
    color: var(--text-muted);
    font-size: 0.72rem;
}

.home-status-dot {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--green-primary);
    box-shadow: 0 0 0 5px rgba(84, 213, 170, 0.08);
}

.home-section-header {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 28px;
    margin-bottom: 22px;
}

.home-section-header h2 {
    margin: 6px 0 0;
    color: #ffffff;
    font-size: 1.65rem;
}

.home-section-header p {
    max-width: 480px;
    margin: 0;
    color: var(--text-muted);
    line-height: 1.5;
    text-align: right;
}

.home-module-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
}

.home-module-card {
    display: flex;
    flex-direction: column;
    min-height: 330px;
    padding: 22px;
    border: 1px solid var(--border-primary);
    border-radius: 15px;
    background: linear-gradient(
            150deg,
            rgba(16, 39, 67, 0.94),
            rgba(7, 24, 42, 0.97)
        );
    color: #ffffff;
    text-decoration: none;
    box-shadow: 0 14px 30px rgba(0, 0, 0, 0.16);
    transition: transform 160ms ease,
        border-color 160ms ease,
        box-shadow 160ms ease;
}

.home-module-card:hover {
    transform: translateY(-4px);
    border-color: var(--border-hover);
    color: #ffffff;
    box-shadow: 0 22px 42px rgba(0, 0, 0, 0.24);
}

.home-module-card-primary {
    border-color: rgba(85, 160, 255, 0.38);
    background: linear-gradient(
            150deg,
            rgba(37, 91, 170, 0.44),
            rgba(7, 25, 44, 0.98)
        );
}

.home-module-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 26px;
}

.home-module-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 46px;
    border: 1px solid rgba(85, 160, 255, 0.25);
    border-radius: 11px;
    background: rgba(48, 111, 207, 0.13);
    font-size: 1.25rem;
}

.home-module-badge {
    padding: 5px 9px;
    border: 1px solid rgba(84, 213, 170, 0.25);
    border-radius: 999px;
    background: rgba(84, 213, 170, 0.1);
    color: #73dfb8;
    font-size: 0.65rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.home-module-badge-muted {
    border-color: rgba(148, 163, 184, 0.2);
    background: rgba(148, 163, 184, 0.07);
    color: #9eafc2;
}

.home-module-card h2 {
    margin: 7px 0 10px;
    color: #ffffff;
    font-size: 1.4rem;
}

.home-module-card p {
    margin: 0;
    color: var(--text-secondary);
    line-height: 1.62;
}

.home-module-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: auto;
    padding-top: 21px;
    border-top: 1px solid rgba(139, 174, 218, 0.1);
    color: #91bbff;
    font-size: 0.83rem;
    font-weight: 700;
}

.home-module-footer strong {
    font-size: 1.2rem;
    transition: transform 160ms ease;
}

.home-module-card:hover .home-module-footer strong {
    transform: translateX(4px);
}

@media (max-width: 1100px) {
    .home-module-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .home-hero {
        grid-template-columns: 1fr;
    }

    .home-status-card {
        max-width: 380px;
    }
}

@media (max-width: 700px) {
    .home-page {
        padding: 30px 16px 52px;
    }

    .home-hero {
        margin-bottom: 40px;
    }

    .home-section-header {
        align-items: flex-start;
        flex-direction: column;
    }

    .home-section-header p {
        text-align: left;
    }

    .home-module-grid {
        grid-template-columns: 1fr;
    }

    .home-module-card {
        min-height: 300px;
    }
}

.platform-home-with-sidebar {
    min-height: calc(100vh - var(--topbar-height));
}

/*=========================================================
   FACILITIES PAGE
   =========================================================*/

.facilities-page {
    min-height: calc(100vh - var(--topbar-height));
    padding: 38px 30px 70px;
}

.facilities-page-container {
    width: min(1320px, 100%);
    margin: 0 auto;
}

.facilities-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 32px;
    margin-bottom: 32px;
}

.facilities-header > div {
    max-width: 760px;
}

.facilities-eyebrow {
    color: #6aa5ff;
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.12em;
}

.facilities-header h1 {
    margin: 8px 0 10px;
    color: #ffffff;
    font-size: clamp(2.2rem, 4vw, 3.3rem);
    letter-spacing: -0.04em;
}

.facilities-header p {
    margin: 0;
    color: var(--text-secondary);
    line-height: 1.65;
}

.facilities-add-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    min-height: 44px;
    padding: 10px 17px;
    border: 1px solid rgba(85, 160, 255, 0.46);
    border-radius: 10px;
    background: linear-gradient(
            135deg,
            #2e70d5,
            #438cf2
        );
    color: #ffffff;
    font-weight: 750;
    cursor: pointer;
}

.facilities-add-button span {
    font-size: 1.2rem;
    line-height: 1;
}

.facilities-summary-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
    margin-bottom: 24px;
}

.facilities-summary-card {
    padding: 19px 20px;
    border: 1px solid var(--border-primary);
    border-radius: 13px;
    background: rgba(10, 29, 50, 0.82);
}

.facilities-summary-card > span {
    display: block;
    color: var(--text-muted);
    font-size: 0.74rem;
    font-weight: 700;
    text-transform: uppercase;
}

.facilities-summary-card strong {
    display: block;
    margin: 8px 0 4px;
    color: #ffffff;
    font-size: 2rem;
}

.facilities-summary-card small {
    color: var(--text-muted);
}

.summary-value-healthy {
    color: var(--green-primary) !important;
}

.summary-value-warning {
    color: var(--amber-primary) !important;
}

/*=========================================================
   FACILITIES SEARCH TOOLBAR
   =========================================================*/

.facilities-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 22px;
    padding: 15px;
    border: 1px solid var(--border-primary);
    border-radius: 14px;
    background: linear-gradient(
            145deg,
            rgba(13, 37, 64, 0.94),
            rgba(8, 27, 48, 0.94)
        );
    box-shadow: 0 12px 28px rgba(2, 12, 24, 0.12);
}

.facilities-search-form {
    display: flex;
    align-items: center;
    gap: 12px;
    flex: 1;
    min-width: 0;
}

.facilities-search-field {
    display: flex;
    align-items: center;
    flex: 1;
    min-width: 0;
    min-height: 46px;
    overflow: hidden;
    border: 1px solid rgba(148, 163, 184, 0.2);
    border-radius: 10px;
    background: #0a223b;
    transition: border-color 160ms ease,
        background 160ms ease,
        box-shadow 160ms ease;
}

.facilities-search-field:hover {
    border-color: rgba(96, 165, 250, 0.34);
    background: #0c2744;
}

.facilities-search-field:focus-within {
    border-color: rgba(96, 165, 250, 0.68);
    background: #0c2948;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.12);
}

.facilities-search-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    min-width: 44px;
    align-self: stretch;
    border-right: 1px solid rgba(148, 163, 184, 0.13);
    color: var(--blue-secondary);
    font-size: 1rem;
}

.facilities-search-field input {
    width: 100%;
    min-width: 0;
    min-height: 44px;
    padding: 0 13px;
    border: 0;
    outline: 0;
    background: transparent;
    color: var(--text-primary);
    font-family: "Segoe UI", Arial, sans-serif;
    font-size: 0.82rem;
    font-weight: 600;
}

.facilities-search-field input::placeholder {
    color: rgba(148, 163, 184, 0.72);
    font-weight: 500;
}

.facilities-search-field input::-webkit-search-cancel-button {
    display: none;
}

.facilities-search-clear {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    min-width: 32px;
    height: 32px;
    margin-right: 6px;
    border-radius: 7px;
    color: var(--text-muted);
    font-size: 1.05rem;
    line-height: 1;
    text-decoration: none;
    transition: background 150ms ease,
        color 150ms ease;
}

.facilities-search-clear:hover {
    background: rgba(96, 165, 250, 0.12);
    color: var(--text-primary);
}

.facilities-search-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 46px;
    padding: 0 20px;
    border: 1px solid rgba(96, 165, 250, 0.48);
    border-radius: 10px;
    background: linear-gradient(
            135deg,
            var(--blue-primary),
            #1d4ed8
        );
    box-shadow: 0 8px 18px rgba(29, 78, 216, 0.18);
    color: #ffffff;
    font-size: 0.76rem;
    font-weight: 800;
    cursor: pointer;
    transition: transform 160ms ease,
        border-color 160ms ease,
        box-shadow 160ms ease;
}

.facilities-search-button:hover {
    transform: translateY(-1px);
    border-color: rgba(147, 197, 253, 0.72);
    box-shadow: 0 11px 22px rgba(29, 78, 216, 0.25);
}

.facilities-search-button:active {
    transform: translateY(0);
}

.facilities-result-count {
    display: flex;
    align-items: baseline;
    gap: 6px;
    flex-shrink: 0;
    padding-right: 4px;
    color: var(--text-muted);
    white-space: nowrap;
}

.facilities-result-count strong {
    color: var(--text-primary);
    font-size: 1rem;
    font-variant-numeric: tabular-nums;
}

.facilities-result-count span {
    font-size: 0.72rem;
    font-weight: 650;
}

/*=========================================================
   RESPONSIVE
   =========================================================*/

@media (max-width: 800px) {
    .facilities-toolbar {
        align-items: stretch;
        flex-direction: column;
        gap: 12px;
    }

    .facilities-search-form {
        width: 100%;
    }

    .facilities-result-count {
        padding: 0 2px;
    }
}

@media (max-width: 560px) {
    .facilities-search-form {
        align-items: stretch;
        flex-direction: column;
    }

    .facilities-search-button {
        width: 100%;
    }
}

.facilities-clear-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 8px 15px;
    border-radius: 9px;
    font-weight: 700;
    text-decoration: none;
}

.facilities-clear-button {
    border: 1px solid var(--border-primary);
    color: var(--text-secondary);
}

.facilities-result-count {
    flex: 0 0 auto;
    color: var(--text-muted);
    font-size: 0.82rem;
}

.facilities-card-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
}

.facility-card {
    display: flex;
    flex-direction: column;
    min-height: 400px;
    padding: 21px;
    border: 1px solid var(--border-primary);
    border-radius: 15px;
    background: linear-gradient(
            150deg,
            rgba(15, 38, 65, 0.94),
            rgba(7, 23, 40, 0.98)
        );
    box-shadow: 0 14px 30px rgba(0, 0, 0, 0.16);
    transition: transform 160ms ease,
        border-color 160ms ease,
        box-shadow 160ms ease;
}

.facility-card:hover {
    transform: translateY(-4px);
    border-color: var(--border-hover);
    box-shadow: 0 22px 42px rgba(0, 0, 0, 0.23);
}

.facility-card-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 24px;
}

.facility-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border: 1px solid rgba(85, 160, 255, 0.25);
    border-radius: 11px;
    background: rgba(48, 111, 207, 0.13);
    color: #83b3ff;
    font-size: 1.1rem;
}

.facility-status-badge {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 6px 9px;
    border-radius: 999px;
    font-size: 0.67rem;
    font-weight: 800;
    text-transform: uppercase;
}

.facility-status-badge > span {
    width: 7px;
    height: 7px;
    border-radius: 50%;
}

.facility-status-healthy {
    border: 1px solid rgba(84, 213, 170, 0.24);
    background: rgba(84, 213, 170, 0.09);
    color: #74dfba;
}

.facility-status-healthy > span {
    background: var(--green-primary);
}

.facility-status-warning {
    border: 1px solid rgba(242, 187, 75, 0.24);
    background: rgba(242, 187, 75, 0.09);
    color: #f0c666;
}

.facility-status-warning > span {
    background: var(--amber-primary);
}

.facility-card-heading > span {
    color: #6f87a2;
    font-size: 0.69rem;
    font-weight: 800;
    letter-spacing: 0.1em;
}

.facility-card-heading h2 {
    margin: 7px 0 7px;
    color: #ffffff;
    font-size: 1.35rem;
}

.facility-card-heading p {
    margin: 0;
    color: var(--text-secondary);
}

.facility-metrics {
    display: grid;
    gap: 14px;
    margin: 23px 0;
    padding: 18px 0;
    border-top: 1px solid rgba(139, 174, 218, 0.1);
    border-bottom: 1px solid rgba(139, 174, 218, 0.1);
}

.facility-metric {
    display: grid;
    grid-template-columns: 105px minmax(0, 1fr);
    gap: 12px;
    align-items: center;
}

.facility-metric > span {
    color: var(--text-muted);
    font-size: 0.72rem;
}

.facility-metric strong {
    color: #ffffff;
    font-size: 0.79rem;
    text-align: right;
}

.facility-quality-track {
    grid-column: 1 / -1;
    height: 5px;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(139, 174, 218, 0.12);
}

.facility-quality-track span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(
            90deg,
            #367ce8,
            #54d5aa
        );
}

.facility-card-actions {
    display: flex;
    gap: 10px;
    margin-top: auto;
}

.facility-primary-action,
.facility-secondary-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    border-radius: 9px;
    font-weight: 750;
}

.facility-primary-action {
    flex: 1;
    justify-content: space-between;
    padding: 9px 14px;
    border: 1px solid rgba(85, 160, 255, 0.35);
    background: rgba(46, 112, 213, 0.18);
    color: #ffffff;
    text-decoration: none;
}

.facility-secondary-action {
    padding: 9px 13px;
    border: 1px solid var(--border-primary);
    background: transparent;
    color: var(--text-secondary);
    cursor: pointer;
}

.facilities-empty-state {
    padding: 70px 24px;
    border: 1px dashed rgba(139, 174, 218, 0.24);
    border-radius: 14px;
    background: rgba(8, 24, 42, 0.55);
    text-align: center;
}

.facilities-empty-icon {
    margin-bottom: 13px;
    color: #77a9f6;
    font-size: 2rem;
}

.facilities-empty-state h2 {
    margin: 0 0 8px;
}

.facilities-empty-state p {
    margin: 0 0 18px;
    color: var(--text-secondary);
}

.facilities-empty-state a {
    color: #8fbaff;
    font-weight: 700;
}

@media (max-width: 1100px) {
    .facilities-card-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .facilities-page {
        padding: 28px 16px 52px;
    }

    .facilities-header,
    .facilities-toolbar {
        align-items: flex-start;
        flex-direction: column;
    }

    .facilities-add-button {
        width: 100%;
    }

    .facilities-summary-grid,
    .facilities-card-grid {
        grid-template-columns: 1fr;
    }

    .facilities-search-form {
        flex-wrap: wrap;
    }

    .facilities-search-field {
        flex-basis: 100%;
    }
}

/*=========================================================
   FACILITY WORKSPACE
   =========================================================*/

.facility-workspace-page {
    min-height: calc(100vh - var(--topbar-height));
    padding: 30px 30px 70px;
}

.facility-workspace-container {
    width: min(1380px, 100%);
    margin: 0 auto;
}

.facility-breadcrumb {
    display: flex;
    align-items: center;
    gap: 9px;
    margin-bottom: 22px;
    color: var(--text-muted);
    font-size: 0.76rem;
}

.facility-breadcrumb a {
    color: #8fbaff;
    font-weight: 700;
    text-decoration: none;
}

.facility-breadcrumb strong {
    color: var(--text-secondary);
}

.facility-workspace-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
    margin-bottom: 26px;
}

.facility-workspace-heading {
    display: flex;
    align-items: center;
    gap: 17px;
}

.facility-workspace-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 58px;
    height: 58px;
    border: 1px solid rgba(85, 160, 255, 0.31);
    border-radius: 14px;
    background: rgba(49, 116, 218, 0.15);
    color: #87b7ff;
    font-size: 1.35rem;
}

.facility-workspace-code {
    color: #6c87a6;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.11em;
}

.facility-workspace-heading h1 {
    margin: 4px 0 3px;
    font-size: clamp(2rem, 4vw, 3rem);
    letter-spacing: -0.04em;
}

.facility-workspace-heading p {
    margin: 0;
    color: var(--text-secondary);
}

.facility-workspace-header-actions {
    display: flex;
    align-items: center;
    gap: 12px;
}

.facility-change-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    padding: 8px 14px;
    border: 1px solid var(--border-primary);
    border-radius: 9px;
    background: rgba(13, 35, 59, 0.7);
    color: var(--text-secondary);
    font-size: 0.78rem;
    font-weight: 750;
    text-decoration: none;
}

.facility-change-button:hover {
    border-color: var(--border-hover);
    color: #ffffff;
}

.facility-section-navigation {
    display: flex;
    gap: 5px;
    margin-bottom: 25px;
    padding: 6px;
    overflow-x: auto;
    border: 1px solid var(--border-primary);
    border-radius: 12px;
    background: rgba(7, 23, 40, 0.78);
}

.facility-section-navigation a {
    flex: 0 0 auto;
    padding: 9px 13px;
    border: 1px solid transparent;
    border-radius: 8px;
    color: var(--text-muted);
    font-size: 0.77rem;
    font-weight: 700;
    text-decoration: none;
}

.facility-section-navigation a:hover {
    color: #ffffff;
}

.facility-section-navigation a.active {
    border-color: rgba(85, 160, 255, 0.25);
    background: rgba(48, 111, 207, 0.16);
    color: #ffffff;
}

.facility-overview-summary {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
    margin-bottom: 22px;
}

.facility-overview-card {
    padding: 20px;
    border: 1px solid var(--border-primary);
    border-radius: 14px;
    background: linear-gradient(
            150deg,
            rgba(15, 38, 65, 0.93),
            rgba(7, 23, 40, 0.98)
        );
}

.facility-overview-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 17px;
}

.facility-overview-card-header > span {
    color: var(--text-muted);
    font-size: 0.72rem;
    font-weight: 750;
    text-transform: uppercase;
}

.facility-overview-card-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border: 1px solid rgba(85, 160, 255, 0.2);
    border-radius: 9px;
    background: rgba(49, 116, 218, 0.1);
    color: #84b5ff;
}

.facility-icon-warning {
    border-color: rgba(242, 187, 75, 0.27);
    background: rgba(242, 187, 75, 0.1);
    color: var(--amber-primary);
}

.facility-overview-card strong {
    display: inline;
    font-size: 2rem;
}

.facility-overview-card small {
    margin-left: 6px;
    color: var(--text-secondary);
}

.facility-overview-card p {
    margin: 9px 0 0;
    color: var(--text-muted);
    font-size: 0.74rem;
}

.facility-overview-content-grid {
    display: grid;
    grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
    gap: 20px;
}

.facility-overview-panel {
    padding: 21px;
    border: 1px solid var(--border-primary);
    border-radius: 14px;
    background: rgba(8, 26, 45, 0.82);
}

/*=========================================================
   FACILITY OVERVIEW CONTENT
   =========================================================*/

.facility-overview-content {
    display: grid;
    gap: 20px;
}

.facility-overview-panel {
    padding: 22px;
    border: 1px solid var(--border-primary);
    border-radius: 15px;
    background: linear-gradient(
            145deg,
            rgba(13, 35, 60, 0.94),
            rgba(7, 23, 40, 0.98)
        );
    box-shadow: 0 14px 30px rgba(0, 0, 0, 0.14);
}

.facility-panel-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 28px;
    margin-bottom: 22px;
}

.facility-panel-header > div {
    min-width: 0;
}

.facility-panel-header > div > span {
    color: #6aa5ff;
    font-size: 0.66rem;
    font-weight: 850;
    letter-spacing: 0.11em;
}

.facility-panel-header h2 {
    margin: 5px 0 7px;
    color: var(--text-primary);
    font-size: 1.25rem;
}

.facility-panel-header p {
    max-width: 680px;
    margin: 0;
    color: var(--text-muted);
    font-size: 0.73rem;
    line-height: 1.55;
}

/*=========================================================
   HEALTH PANEL
   =========================================================*/

.facility-health-summary {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    flex: 0 0 auto;
    min-height: 32px;
    padding: 0 12px;
    border: 1px solid var(--border-primary);
    border-radius: 999px;
    background: rgba(10, 29, 50, 0.7);
    color: var(--text-secondary);
    font-size: 0.67rem;
    font-weight: 800;
    text-transform: uppercase;
}

.facility-health-summary > span {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--green-primary);
    box-shadow: 0 0 0 4px rgba(84, 213, 170, 0.1);
}

.facility-health-summary-warning > span {
    background: var(--amber-primary);
    box-shadow: 0 0 0 4px rgba(242, 187, 75, 0.1);
}

.facility-health-summary-critical > span {
    background: #ed6a73;
    box-shadow: 0 0 0 4px rgba(237, 106, 115, 0.1);
}

.facility-health-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.facility-health-card {
    display: flex;
    align-items: center;
    gap: 14px;
    min-width: 0;
    min-height: 112px;
    padding: 17px;
    border: 1px solid rgba(139, 174, 218, 0.13);
    border-radius: 12px;
    background: rgba(7, 25, 44, 0.68);
    transition: transform 160ms ease,
        border-color 160ms ease,
        background 160ms ease;
}

.facility-health-card:hover {
    transform: translateY(-2px);
    border-color: rgba(85, 160, 255, 0.3);
    background: rgba(10, 32, 55, 0.82);
}

.facility-health-card-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    border: 1px solid rgba(85, 160, 255, 0.22);
    border-radius: 10px;
    background: rgba(49, 116, 218, 0.12);
    color: #86b7ff;
    font-size: 1rem;
}

.facility-health-card > div:last-child {
    min-width: 0;
}

.facility-health-card span {
    color: var(--text-muted);
    font-size: 0.65rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.facility-health-card strong {
    display: block;
    margin: 6px 0 4px;
    overflow: hidden;
    color: var(--text-primary);
    font-size: 0.94rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.facility-health-card small {
    color: var(--text-muted);
    font-size: 0.68rem;
    line-height: 1.4;
}

.facility-health-quality-card {
    display: block;
}

.facility-health-card-heading {
    display: flex;
    align-items: center;
    gap: 14px;
}

.facility-health-card-label {
    display: block;
    color: var(--text-muted);
    font-size: 0.65rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.facility-health-quality-track {
    height: 6px;
    margin: 15px 0 9px;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(139, 174, 218, 0.12);
}

.facility-health-quality-track span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(
            90deg,
            var(--blue-primary),
            var(--green-primary)
        );
}

/*=========================================================
   FACILITY MODULE LINKS
   =========================================================*/

.facility-module-links {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-top: 20px;
    padding-top: 18px;
    border-top: 1px solid rgba(139, 174, 218, 0.1);
}

.facility-module-link {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) 24px;
    align-items: center;
    gap: 13px;
    min-width: 0;
    min-height: 76px;
    padding: 14px;
    border: 1px solid rgba(139, 174, 218, 0.13);
    border-radius: 11px;
    background: rgba(7, 25, 44, 0.58);
    color: inherit;
    text-decoration: none;
    transition: transform 160ms ease,
        border-color 160ms ease,
        background 160ms ease,
        box-shadow 160ms ease;
}

.facility-module-link:hover {
    transform: translateY(-2px);
    border-color: rgba(85, 160, 255, 0.32);
    background: linear-gradient(
            135deg,
            rgba(44, 102, 192, 0.15),
            rgba(8, 29, 50, 0.84)
        );
    box-shadow: 0 10px 22px rgba(0, 0, 0, 0.13);
}

.facility-module-link-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border: 1px solid rgba(85, 160, 255, 0.22);
    border-radius: 10px;
    background: rgba(49, 116, 218, 0.11);
    color: #86b7ff;
    font-size: 1rem;
}

.facility-module-link-content {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.facility-module-link-content strong {
    color: var(--text-primary);
    font-size: 0.79rem;
}

.facility-module-link-content small {
    margin-top: 5px;
    overflow: hidden;
    color: var(--text-muted);
    font-size: 0.66rem;
    line-height: 1.4;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.facility-module-link-arrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #6886a7;
    font-size: 1rem;
    transition: color 160ms ease,
        transform 160ms ease;
}

.facility-module-link:hover
.facility-module-link-arrow {
    transform: translateX(3px);
    color: #9ac3ff;
}

@media (max-width: 760px) {
    .facility-module-links {
        grid-template-columns: 1fr;
    }
}

.facility-panel-actions {
    display: flex;
    gap: 12px;
    margin-top: 18px;
}

.facility-panel-actions a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex: 1;
    min-height: 43px;
    padding: 0 14px;
    border: 1px solid rgba(85, 160, 255, 0.24);
    border-radius: 9px;
    background: rgba(42, 98, 183, 0.11);
    color: var(--text-primary);
    font-size: 0.75rem;
    font-weight: 750;
    text-decoration: none;
    transition: transform 160ms ease,
        border-color 160ms ease,
        background 160ms ease;
}

.facility-panel-actions a:hover {
    transform: translateY(-1px);
    border-color: rgba(85, 160, 255, 0.45);
    background: rgba(42, 98, 183, 0.18);
}

/*=========================================================
   ACTIVITY PANEL
   =========================================================*/

.facility-activity-panel {
    padding-bottom: 24px;
}

.facility-view-all-button {
    flex: 0 0 auto;
    min-height: 36px;
    padding: 0 13px;
    border: 1px solid rgba(85, 160, 255, 0.23);
    border-radius: 8px;
    background: rgba(42, 98, 183, 0.1);
    color: #8fbaff;
    font-size: 0.7rem;
    font-weight: 750;
    cursor: pointer;
    transition: border-color 160ms ease,
        background 160ms ease,
        color 160ms ease;
}

.facility-view-all-button:hover {
    border-color: rgba(85, 160, 255, 0.42);
    background: rgba(42, 98, 183, 0.18);
    color: #ffffff;
}

.facility-activity-timeline {
    display: grid;
}

.facility-activity-item {
    display: grid;
    grid-template-columns: 24px minmax(0, 1fr);
    gap: 13px;
}

.facility-activity-marker {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.facility-activity-indicator {
    position: relative;
    z-index: 1;
    flex: 0 0 10px;
    width: 10px;
    height: 10px;
    margin-top: 22px;
    border: 2px solid rgba(7, 23, 40, 0.95);
    border-radius: 50%;
    background: #718aa5;
    box-shadow: 0 0 0 4px rgba(113, 138, 165, 0.1);
}

.facility-activity-line {
    width: 1px;
    min-height: 100%;
    background: rgba(139, 174, 218, 0.13);
}

.facility-activity-item:last-child
.facility-activity-line {
    display: none;
}

.activity-success {
    background: var(--green-primary);
    box-shadow: 0 0 0 4px rgba(84, 213, 170, 0.1);
}

.activity-carbon {
    background: #55a0ff;
    box-shadow: 0 0 0 4px rgba(85, 160, 255, 0.1);
}

.activity-report {
    background: #a98bff;
    box-shadow: 0 0 0 4px rgba(169, 139, 255, 0.1);
}

.activity-warning {
    background: var(--amber-primary);
    box-shadow: 0 0 0 4px rgba(242, 187, 75, 0.1);
}

.facility-activity-card {
    margin-bottom: 12px;
    padding: 17px 18px;
    border: 1px solid rgba(139, 174, 218, 0.12);
    border-radius: 12px;
    background: linear-gradient(
            135deg,
            rgba(9, 30, 52, 0.82),
            rgba(7, 24, 42, 0.7)
        );
    transition: transform 160ms ease,
        border-color 160ms ease,
        background 160ms ease;
}

.facility-activity-card:hover {
    transform: translateX(3px);
    border-color: rgba(85, 160, 255, 0.28);
    background: linear-gradient(
            135deg,
            rgba(12, 37, 63, 0.92),
            rgba(8, 27, 47, 0.82)
        );
}

.facility-activity-card-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
}

.facility-activity-title-group {
    min-width: 0;
}

.facility-activity-type {
    display: block;
    margin-bottom: 5px;
    color: #6aa5ff;
    font-size: 0.59rem;
    font-weight: 850;
    letter-spacing: 0.09em;
    text-transform: uppercase;
}

.facility-activity-title-group h3 {
    margin: 0;
    color: var(--text-primary);
    font-size: 0.86rem;
}

.facility-activity-card time {
    flex: 0 0 auto;
    color: var(--text-muted);
    font-size: 0.65rem;
    white-space: nowrap;
}

.facility-activity-card > p {
    max-width: 900px;
    margin: 9px 0 13px;
    color: var(--text-secondary);
    font-size: 0.74rem;
    line-height: 1.55;
}

.facility-activity-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    padding-top: 11px;
    border-top: 1px solid rgba(139, 174, 218, 0.09);
    color: var(--text-muted);
    font-size: 0.64rem;
}

.facility-activity-meta strong {
    color: var(--text-secondary);
}

.facility-activity-status {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 24px;
    padding: 0 8px;
    border: 1px solid rgba(139, 174, 218, 0.16);
    border-radius: 999px;
    background: rgba(139, 174, 218, 0.06);
    color: var(--text-secondary);
    font-size: 0.57rem;
    font-weight: 800;
    text-transform: uppercase;
}

.activity-status-success {
    border-color: rgba(84, 213, 170, 0.23);
    background: rgba(84, 213, 170, 0.08);
    color: #75dfbb;
}

.activity-status-carbon {
    border-color: rgba(85, 160, 255, 0.24);
    background: rgba(85, 160, 255, 0.08);
    color: #8cbdff;
}

.activity-status-report {
    border-color: rgba(169, 139, 255, 0.24);
    background: rgba(169, 139, 255, 0.08);
    color: #c0aaff;
}

.activity-status-warning {
    border-color: rgba(242, 187, 75, 0.24);
    background: rgba(242, 187, 75, 0.08);
    color: #ffd179;
}

.facility-activity-empty {
    padding: 46px 20px;
    border: 1px dashed rgba(139, 174, 218, 0.18);
    border-radius: 12px;
    background: rgba(7, 24, 42, 0.45);
    text-align: center;
}

.facility-activity-empty > div {
    margin-bottom: 10px;
    color: #6aa5ff;
    font-size: 1.7rem;
}

.facility-activity-empty h3 {
    margin: 0 0 7px;
    color: var(--text-primary);
}

.facility-activity-empty p {
    margin: 0;
    color: var(--text-muted);
    font-size: 0.73rem;
}

/*=========================================================
   RESPONSIVE
   =========================================================*/

@media (max-width: 900px) {
    .facility-health-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 700px) {
    .facility-panel-header,
    .facility-activity-card-header,
    .facility-activity-meta {
        align-items: flex-start;
        flex-direction: column;
    }

    .facility-panel-actions {
        flex-direction: column;
    }

    .facility-panel-actions a {
        flex: none;
        width: 100%;
    }

    .facility-view-all-button {
        width: 100%;
    }
}

.facility-reporting-status {
    display: inline-flex !important;
    align-items: center;
    gap: 8px;
    width: fit-content;
    min-height: 28px;
    margin-top: 7px;
    padding: 0 10px;
    border: 1px solid rgba(84, 213, 170, 0.26);
    border-radius: 999px;
    background: rgba(84, 213, 170, 0.09);
    color: #7ce4c0 !important;
    font-size: 0.7rem !important;
    font-weight: 800;
    letter-spacing: 0.02em;
    text-transform: uppercase;
}

.facility-reporting-status > span {
    display: block;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--green-primary);
    box-shadow: 0 0 0 4px rgba(84, 213, 170, 0.1);
}

.facility-panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 20px;
}

.facility-panel-header span {
    color: #6aa5ff;
    font-size: 0.67rem;
    font-weight: 800;
    letter-spacing: 0.11em;
}

.facility-panel-header h2 {
    margin: 5px 0 0;
    font-size: 1.25rem;
}

.facility-panel-header button {
    border: 0;
    background: transparent;
    color: #8fbaff;
    font-size: 0.75rem;
    font-weight: 700;
    cursor: pointer;
}

.facility-health-card-content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    min-width: 0;
}

.facility-health-card-content .facility-reporting-status {
    margin: 7px 0 6px;
}

.facility-health-card-content small {
    display: block;
    width: 100%;
}

.facility-health-list {
    display: grid;
    gap: 14px;
}

.facility-health-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    padding-bottom: 13px;
    border-bottom: 1px solid rgba(139, 174, 218, 0.09);
}

.facility-health-row span {
    color: var(--text-muted);
    font-size: 0.75rem;
}

.facility-health-row strong {
    font-size: 0.78rem;
}

.facility-health-quality-track {
    height: 6px;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(139, 174, 218, 0.12);
}

.facility-panel-actions {
    display: flex;
    gap: 10px;
    margin-top: 21px;
}

.facility-panel-actions a {
    flex: 1;
    padding: 10px 12px;
    border: 1px solid var(--border-primary);
    border-radius: 9px;
    background: rgba(42, 98, 183, 0.12);
    color: #ffffff;
    font-size: 0.76rem;
    font-weight: 700;
    text-align: center;
    text-decoration: none;
}

.facility-activity-list {
    display: grid;
    gap: 4px;
}

.facility-activity-item {
    display: grid;
    grid-template-columns: 10px minmax(0, 1fr);
    gap: 13px;
    padding: 13px 0;
    border-bottom: 1px solid rgba(139, 174, 218, 0.08);
}

.facility-activity-item:last-child {
    border-bottom: 0;
}

.facility-activity-indicator {
    width: 8px;
    height: 8px;
    margin-top: 6px;
    border-radius: 50%;
    background: #7690aa;
}

.activity-success {
    background: var(--green-primary);
}

.activity-carbon {
    background: #55a0ff;
}

.activity-report {
    background: #a98bff;
}

.facility-activity-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 15px;
}

.facility-activity-heading strong {
    font-size: 0.79rem;
}

.facility-activity-heading span {
    flex: 0 0 auto;
    color: var(--text-muted);
    font-size: 0.67rem;
}

.facility-activity-content small {
    display: block;
    margin-top: 3px;
    color: #6f8aa8;
    font-size: 0.65rem;
    font-weight: 750;
    text-transform: uppercase;
}

.facility-activity-content p {
    margin: 6px 0 0;
    color: var(--text-secondary);
    font-size: 0.75rem;
    line-height: 1.5;
}

@media (max-width: 1100px) {
    .facility-overview-summary {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .facility-overview-content-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 700px) {
    .facility-workspace-page {
        padding: 25px 16px 50px;
    }

    .facility-workspace-header {
        align-items: flex-start;
        flex-direction: column;
    }

    .facility-workspace-header-actions {
        width: 100%;
        justify-content: space-between;
    }

    .facility-overview-summary {
        grid-template-columns: 1fr;
    }
}

/*=========================================================
   FACILITY-AWARE SIDEBAR
   =========================================================*/

.sidebar-facility-context {
    margin-bottom: 24px;
    padding-bottom: 18px;
    border-bottom: 1px solid var(--border-primary);
}

.sidebar-back-link {
    display: flex;
    align-items: center;
    gap: 11px;
    min-height: 38px;
    margin-bottom: 11px;
    padding: 7px 11px;
    border-radius: 8px;
    color: var(--text-muted);
    font-size: 0.72rem;
    font-weight: 700;
    text-decoration: none;
}

.sidebar-back-link:hover {
    background: rgba(48, 105, 190, 0.1);
    color: #ffffff;
}

.sidebar-selected-facility {
    display: flex;
    align-items: center;
    gap: 11px;
    padding: 12px;
    border: 1px solid rgba(85, 160, 255, 0.2);
    border-radius: 11px;
    background: linear-gradient(
            135deg,
            rgba(49, 116, 218, 0.16),
            rgba(10, 31, 54, 0.72)
        );
}

.sidebar-selected-facility-icon {
    display: inline-flex;
    flex: 0 0 36px;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border: 1px solid rgba(85, 160, 255, 0.23);
    border-radius: 9px;
    background: rgba(48, 111, 207, 0.12);
    color: #85b6ff;
}

.sidebar-selected-facility-content {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.sidebar-selected-facility-content span {
    color: #5e7691;
    font-size: 0.57rem;
    font-weight: 800;
    letter-spacing: 0.09em;
}

.sidebar-selected-facility-content strong {
    margin-top: 3px;
    overflow: hidden;
    color: #ffffff;
    font-size: 0.74rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.application-sidebar.is-collapsed
.sidebar-selected-facility-content,
.application-sidebar.is-collapsed
.sidebar-back-link .sidebar-navigation-text {
    display: none;
}

.application-sidebar.is-collapsed
.sidebar-selected-facility {
    justify-content: center;
    padding: 8px;
}

.application-sidebar.is-collapsed
.sidebar-back-link {
    justify-content: center;
    padding: 7px;
}

.facility-module-page {
    min-height: calc(100vh - var(--topbar-height));
    padding: 30px 30px 70px;
}

.facility-module-container {
    width: min(1380px, 100%);
    margin: 0 auto;
}

.facility-module-header {
    padding: 32px;
    border: 1px solid var(--border-primary);
    border-radius: 15px;
    background: linear-gradient(
            145deg,
            rgba(15, 39, 67, 0.92),
            rgba(7, 23, 40, 0.97)
        );
}

.facility-module-header h1 {
    margin: 8px 0 10px;
    font-size: clamp(2rem, 4vw, 3rem);
    letter-spacing: -0.04em;
}

.facility-module-header p {
    max-width: 700px;
    margin: 0;
    color: var(--text-secondary);
    line-height: 1.6;
}

@media (max-width: 900px) {
    .application-sidebar.is-collapsed
    .sidebar-selected-facility-content,
    .application-sidebar.is-collapsed
    .sidebar-back-link .sidebar-navigation-text {
        display: flex;
    }

    .application-sidebar.is-collapsed
    .sidebar-selected-facility {
        justify-content: flex-start;
        padding: 12px;
    }

    .application-sidebar.is-collapsed
    .sidebar-back-link {
        justify-content: flex-start;
        padding: 7px 11px;
    }
}

@media (max-width: 700px) {
    .facility-module-page {
        padding: 25px 16px 50px;
    }

    .facility-module-header {
        padding: 23px;
    }
}

/*=========================================================
   OPERATIONS LANDING PAGE
   =========================================================*/

.operations-page {
    min-height: calc(100vh - var(--topbar-height));
    padding: 30px 30px 70px;
}

.operations-page-container {
    width: min(1380px, 100%);
    margin: 0 auto;
}

.operations-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 32px;
    margin-bottom: 26px;
}

.operations-header-content {
    max-width: 780px;
}

.operations-eyebrow,
.operations-section-heading > div > span,
.operations-module-eyebrow,
.operations-activity-header span {
    color: #6aa5ff;
    font-size: 0.69rem;
    font-weight: 800;
    letter-spacing: 0.11em;
}

.operations-header h1 {
    margin: 8px 0 10px;
    color: #ffffff;
    font-size: clamp(2.2rem, 4vw, 3.4rem);
    letter-spacing: -0.045em;
}

.operations-header p {
    margin: 0;
    color: var(--text-secondary);
    line-height: 1.65;
}

.operations-header-status {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 11px;
}

.operations-header-status small {
    color: var(--text-muted);
    font-size: 0.7rem;
}

.operations-header-status small strong {
    margin-left: 4px;
    color: var(--text-secondary);
}

.operations-summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 17px;
    margin-bottom: 32px;
}

.operations-summary-card {
    padding: 19px 20px;
    border: 1px solid var(--border-primary);
    border-radius: 13px;
    background: linear-gradient(
            150deg,
            rgba(14, 37, 63, 0.92),
            rgba(7, 23, 40, 0.97)
        );
}

.operations-summary-card > span {
    display: block;
    color: var(--text-muted);
    font-size: 0.7rem;
    font-weight: 750;
    text-transform: uppercase;
}

.operations-summary-card strong {
    display: inline-block;
    margin-top: 13px;
    color: #ffffff;
    font-size: 1.8rem;
}

.operations-summary-card small {
    margin-left: 5px;
    color: var(--text-secondary);
    font-size: 0.72rem;
}

.operations-summary-card p {
    margin: 7px 0 0;
    color: var(--text-muted);
    font-size: 0.72rem;
}

.operations-warning-value {
    color: var(--amber-primary) !important;
}

.operations-section-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 28px;
    margin-bottom: 20px;
}

.operations-section-heading h2 {
    margin: 5px 0 0;
    font-size: 1.55rem;
}

.operations-section-heading p {
    max-width: 500px;
    margin: 0;
    color: var(--text-muted);
    line-height: 1.5;
    text-align: right;
}

.operations-module-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 19px;
    margin-bottom: 24px;
}

.operations-module-card {
    display: flex;
    flex-direction: column;
    min-height: 355px;
    padding: 21px;
    border: 1px solid var(--border-primary);
    border-radius: 14px;
    background: linear-gradient(
            150deg,
            rgba(15, 38, 65, 0.94),
            rgba(7, 23, 40, 0.98)
        );
    color: #ffffff;
    text-decoration: none;
    box-shadow: 0 14px 30px rgba(0, 0, 0, 0.15);
    transition: transform 160ms ease,
        border-color 160ms ease,
        box-shadow 160ms ease;
}

.operations-module-card:hover {
    transform: translateY(-4px);
    border-color: var(--border-hover);
    color: #ffffff;
    box-shadow: 0 22px 40px rgba(0, 0, 0, 0.23);
}

.operations-module-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 23px;
}

.operations-module-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 45px;
    height: 45px;
    border: 1px solid rgba(85, 160, 255, 0.24);
    border-radius: 11px;
    background: rgba(48, 111, 207, 0.12);
    color: #85b6ff;
    font-size: 1.15rem;
}

.operations-module-status {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 5px 9px;
    border-radius: 999px;
    font-size: 0.63rem;
    font-weight: 800;
    text-transform: uppercase;
}

.operations-module-status > span {
    width: 6px;
    height: 6px;
    border-radius: 50%;
}

.operations-status-healthy {
    border: 1px solid rgba(84, 213, 170, 0.23);
    background: rgba(84, 213, 170, 0.08);
    color: #74dfba;
}

.operations-status-healthy > span {
    background: var(--green-primary);
}

.operations-status-active {
    border: 1px solid rgba(85, 160, 255, 0.25);
    background: rgba(85, 160, 255, 0.09);
    color: #8dbbff;
}

.operations-status-active > span {
    background: #55a0ff;
}

.operations-status-warning {
    border: 1px solid rgba(242, 187, 75, 0.25);
    background: rgba(242, 187, 75, 0.09);
    color: #f0c666;
}

.operations-status-warning > span {
    background: var(--amber-primary);
}

.operations-module-card h2 {
    margin: 6px 0 10px;
    font-size: 1.35rem;
}

.operations-module-card > p {
    margin: 0;
    color: var(--text-secondary);
    font-size: 0.78rem;
    line-height: 1.6;
}

.operations-module-metric {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    margin-top: 21px;
    padding: 14px 0;
    border-top: 1px solid rgba(139, 174, 218, 0.09);
}

.operations-module-metric span {
    color: var(--text-muted);
    font-size: 0.7rem;
}

.operations-module-metric strong {
    color: #ffffff;
    font-size: 0.77rem;
    text-align: right;
}

.operations-module-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: auto;
    padding-top: 16px;
    border-top: 1px solid rgba(139, 174, 218, 0.09);
    color: #91bbff;
    font-size: 0.75rem;
    font-weight: 750;
}

.operations-module-footer strong {
    font-size: 1.1rem;
    transition: transform 160ms ease;
}

.operations-module-card:hover
.operations-module-footer strong {
    transform: translateX(4px);
}

.operations-activity-panel {
    padding: 21px;
    border: 1px solid var(--border-primary);
    border-radius: 14px;
    background: rgba(8, 26, 45, 0.82);
}

.operations-activity-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 22px;
    margin-bottom: 13px;
}

.operations-activity-header h2 {
    margin: 5px 0 0;
    font-size: 1.25rem;
}

.operations-activity-header button {
    border: 0;
    background: transparent;
    color: #8fbaff;
    font-size: 0.72rem;
    font-weight: 700;
    cursor: pointer;
}

.operations-activity-list {
    display: grid;
}

.operations-activity-item {
    display: grid;
    grid-template-columns: 9px minmax(0, 1fr);
    gap: 13px;
    padding: 15px 0;
    border-bottom: 1px solid rgba(139, 174, 218, 0.08);
}

.operations-activity-item:last-child {
    border-bottom: 0;
}

.operations-activity-indicator {
    width: 8px;
    height: 8px;
    margin-top: 5px;
    border-radius: 50%;
    background: #7289a3;
}

.operations-activity-success {
    background: var(--green-primary);
}

.operations-activity-monitoring {
    background: #55a0ff;
}

.operations-activity-storage {
    background: #a98bff;
}

.operations-activity-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
}

.operations-activity-heading > div {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.operations-activity-heading span {
    color: #6f8aa8;
    font-size: 0.63rem;
    font-weight: 800;
    text-transform: uppercase;
}

.operations-activity-heading strong {
    font-size: 0.78rem;
}

.operations-activity-heading time {
    flex: 0 0 auto;
    color: var(--text-muted);
    font-size: 0.67rem;
}

.operations-activity-body p {
    margin: 6px 0 0;
    color: var(--text-secondary);
    font-size: 0.74rem;
    line-height: 1.5;
}

@media (max-width: 1100px) {
    .operations-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .operations-module-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 700px) {
    .operations-page {
        padding: 25px 16px 50px;
    }

    .operations-header,
    .operations-section-heading {
        align-items: flex-start;
        flex-direction: column;
    }

    .operations-header-status {
        align-items: flex-start;
    }

    .operations-section-heading p {
        text-align: left;
    }

    .operations-summary-grid,
    .operations-module-grid {
        grid-template-columns: 1fr;
    }

    .operations-module-card {
        min-height: 330px;
    }
}

.operations-module-metrics {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin-top: 18px;
}

.operations-module-metric {
    min-width: 0;
    padding: 12px;
    border: 1px solid rgba(139, 174, 218, 0.11);
    border-radius: 9px;
    background: rgba(5, 22, 39, 0.48);
}

.operations-module-metric > span {
    display: block;
    margin-bottom: 6px;
    color: var(--text-muted);
    font-size: 0.6rem;
    font-weight: 750;
    letter-spacing: 0.035em;
    text-transform: uppercase;
}

.operations-module-metric strong {
    color: var(--text-primary);
    font-size: 0.92rem;
}

.operations-module-metric small {
    margin-left: 3px;
    color: var(--text-muted);
    font-size: 0.58rem;
}

.operations-metric-warning {
    color: var(--amber-primary) !important;
}

.operations-utilization {
    margin-top: 15px;
}

.operations-utilization-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 7px;
}

.operations-utilization-heading span {
    color: var(--text-muted);
    font-size: 0.65rem;
    font-weight: 700;
}

.operations-utilization-heading strong {
    color: var(--text-secondary);
    font-size: 0.67rem;
}

.operations-utilization-track {
    height: 5px;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(139, 174, 218, 0.12);
}

.operations-utilization-track > span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(
        90deg,
        var(--blue-primary),
        var(--green-primary)
    );
}

.operations-module-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.operations-module-card {
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 330px;
    padding: 20px;
    border: 1px solid rgba(139, 174, 218, 0.13);
    border-radius: 14px;
    background: linear-gradient(
            145deg,
            rgba(13, 38, 64, 0.92),
            rgba(6, 24, 42, 0.94)
        );
    box-shadow: 0 14px 30px rgba(0, 0, 0, 0.13);
    transition: transform 160ms ease,
        border-color 160ms ease,
        box-shadow 160ms ease;
}

.operations-module-card:hover {
    transform: translateY(-3px);
    border-color: rgba(83, 158, 255, 0.3);
    box-shadow: 0 18px 34px rgba(0, 0, 0, 0.18);
}

.operations-module-card-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}

.operations-module-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    flex-shrink: 0;
    border: 1px solid rgba(89, 165, 255, 0.22);
    border-radius: 11px;
    background: rgba(45, 111, 211, 0.12);
    color: #8dbdff;
    font-size: 1.05rem;
    font-weight: 800;
}

.operations-module-status {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 27px;
    padding: 0 10px;
    border: 1px solid rgba(139, 174, 218, 0.17);
    border-radius: 999px;
    background: rgba(139, 174, 218, 0.07);
    color: var(--text-muted);
    font-size: 0.62rem;
    font-weight: 800;
    letter-spacing: 0.025em;
    text-transform: uppercase;
}

.operations-module-status > span {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
}

.operations-module-status.healthy {
    border-color: rgba(84, 213, 170, 0.25);
    background: rgba(84, 213, 170, 0.08);
    color: #7ce4c0;
}

.operations-module-status.warning {
    border-color: rgba(245, 180, 70, 0.26);
    background: rgba(245, 180, 70, 0.09);
    color: #f4c76f;
}

.operations-module-status.critical {
    border-color: rgba(244, 96, 96, 0.27);
    background: rgba(244, 96, 96, 0.09);
    color: #ff9292;
}

.operations-module-heading {
    margin-top: 20px;
}

.operations-module-eyebrow {
    display: block;
    margin-bottom: 7px;
    color: #6f92bb;
    font-size: 0.61rem;
    font-weight: 850;
    letter-spacing: 0.075em;
    text-transform: uppercase;
}

.operations-module-heading h2 {
    margin: 0;
    color: var(--text-primary);
    font-size: 1.05rem;
    line-height: 1.25;
}

.operations-module-heading p {
    min-height: 60px;
    margin: 10px 0 0;
    color: var(--text-muted);
    font-size: 0.72rem;
    line-height: 1.55;
}

.operations-module-summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-top: 18px;
    padding: 14px;
    border: 1px solid rgba(139, 174, 218, 0.1);
    border-radius: 10px;
    background: rgba(4, 20, 35, 0.48);
}

.operations-module-summary span {
    color: var(--text-muted);
    font-size: 0.65rem;
    font-weight: 750;
}

.operations-module-summary strong {
    color: var(--text-primary);
    font-size: 1rem;
}

.operations-module-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-top: auto;
    padding-top: 18px;
    color: #84b7ff;
    font-size: 0.7rem;
    font-weight: 800;
    text-decoration: none;
}

.operations-module-link span:last-child {
    font-size: 1rem;
    transition: transform 160ms ease;
}

.operations-module-link:hover span:last-child {
    transform: translateX(4px);
}

@media (max-width: 1080px) {
    .operations-module-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 700px) {
    .operations-module-grid {
        grid-template-columns: 1fr;
    }
}

/*=========================================================
   STORAGE
   =========================================================*/

.storage-page,
.storage-detail-page {
    min-height: calc(100vh - var(--topbar-height));
    padding: 30px 30px 70px;
}

.storage-page-container,
.storage-detail-container {
    width: min(1380px, 100%);
    margin: 0 auto;
}

.storage-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 30px;
    margin-bottom: 27px;
}

.storage-header > div:first-child {
    max-width: 780px;
}

.storage-eyebrow,
.storage-section-heading > div > span,
.storage-detail-panel header span {
    color: #6aa5ff;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.11em;
}

.storage-header h1 {
    margin: 8px 0 10px;
    font-size: clamp(2.2rem, 4vw, 3.4rem);
    letter-spacing: -0.045em;
}

.storage-header p {
    margin: 0;
    color: var(--text-secondary);
    line-height: 1.65;
}

.storage-header-actions {
    display: flex;
    gap: 10px;
}

.storage-primary-button,
.storage-secondary-button {
    min-height: 42px;
    padding: 9px 15px;
    border-radius: 9px;
    font-weight: 750;
    cursor: pointer;
}

.storage-primary-button {
    border: 1px solid rgba(85, 160, 255, 0.42);
    background: #367ce8;
    color: #ffffff;
}

.storage-secondary-button {
    border: 1px solid var(--border-primary);
    background: rgba(10, 30, 52, 0.72);
    color: var(--text-secondary);
}

.storage-summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 17px;
    margin-bottom: 32px;
}

.storage-summary-card,
.storage-detail-summary article {
    padding: 19px 20px;
    border: 1px solid var(--border-primary);
    border-radius: 13px;
    background: linear-gradient(
            150deg,
            rgba(14, 37, 63, 0.92),
            rgba(7, 23, 40, 0.97)
        );
}

.storage-summary-card > span,
.storage-detail-summary article > span {
    display: block;
    color: var(--text-muted);
    font-size: 0.7rem;
    font-weight: 750;
    text-transform: uppercase;
}

.storage-summary-card strong,
.storage-detail-summary article strong {
    display: inline-block;
    margin-top: 12px;
    color: #ffffff;
    font-size: 1.8rem;
}

.storage-summary-card small,
.storage-detail-summary article small {
    margin-left: 5px;
    color: var(--text-secondary);
}

.storage-summary-card p {
    margin: 7px 0 0;
    color: var(--text-muted);
    font-size: 0.72rem;
}

.storage-warning-value {
    color: var(--amber-primary) !important;
}

.storage-summary-progress {
    height: 6px;
    margin-top: 13px;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(139, 174, 218, 0.12);
}

.storage-summary-progress span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(
        90deg,
        #367ce8,
        #54d5aa
    );
}

.storage-section-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 28px;
    margin-bottom: 20px;
}

.storage-section-heading h2 {
    margin: 5px 0 0;
    font-size: 1.55rem;
}

.storage-section-heading p {
    max-width: 500px;
    margin: 0;
    color: var(--text-muted);
    line-height: 1.5;
    text-align: right;
}

.storage-tank-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 19px;
}

.storage-tank-card {
    display: flex;
    flex-direction: column;
    min-height: 430px;
    padding: 21px;
    border: 1px solid var(--border-primary);
    border-radius: 14px;
    background: linear-gradient(
            150deg,
            rgba(15, 38, 65, 0.94),
            rgba(7, 23, 40, 0.98)
        );
    box-shadow: 0 14px 30px rgba(0, 0, 0, 0.15);
    transition: transform 160ms ease,
        border-color 160ms ease,
        box-shadow 160ms ease;
}

.storage-tank-card:hover {
    transform: translateY(-4px);
    border-color: var(--border-hover);
    box-shadow: 0 22px 40px rgba(0, 0, 0, 0.23);
}

.storage-tank-card-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 22px;
}

.storage-tank-icon,
.storage-detail-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 46px;
    border: 1px solid rgba(85, 160, 255, 0.24);
    border-radius: 11px;
    background: rgba(48, 111, 207, 0.12);
    color: #85b6ff;
    font-size: 1.15rem;
}

.storage-status-badge {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 6px 9px;
    border-radius: 999px;
    font-size: 0.65rem;
    font-weight: 800;
    text-transform: uppercase;
}

.storage-status-badge > span {
    width: 6px;
    height: 6px;
    border-radius: 50%;
}

.storage-status-healthy {
    border: 1px solid rgba(84, 213, 170, 0.23);
    background: rgba(84, 213, 170, 0.08);
    color: #74dfba;
}

.storage-status-healthy > span {
    background: var(--green-primary);
}

.storage-status-warning {
    border: 1px solid rgba(242, 187, 75, 0.25);
    background: rgba(242, 187, 75, 0.09);
    color: #f0c666;
}

.storage-status-warning > span {
    background: var(--amber-primary);
}

.storage-status-critical {
    border: 1px solid rgba(239, 100, 100, 0.25);
    background: rgba(239, 100, 100, 0.09);
    color: #ff8c8c;
}

.storage-status-critical > span {
    background: #ef6464;
}

.storage-tank-heading > span,
.storage-detail-heading > div > span {
    color: #6f87a2;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.1em;
}

.storage-tank-heading h2 {
    margin: 7px 0;
    font-size: 1.25rem;
}

.storage-tank-heading p {
    margin: 0;
    color: var(--text-secondary);
    font-size: 0.76rem;
}

.storage-tank-volume {
    margin: 22px 0 18px;
    padding: 17px 0;
    border-top: 1px solid rgba(139, 174, 218, 0.09);
    border-bottom: 1px solid rgba(139, 174, 218, 0.09);
}

.storage-volume-heading,
.storage-volume-values {
    display: flex;
    justify-content: space-between;
    gap: 14px;
}

.storage-volume-heading span {
    color: var(--text-muted);
    font-size: 0.7rem;
}

.storage-volume-heading strong {
    font-size: 0.75rem;
}

.storage-volume-track {
    height: 8px;
    margin: 11px 0;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(139, 174, 218, 0.12);
}

.storage-volume-fill {
    display: block;
    height: 100%;
    border-radius: inherit;
}

.storage-volume-healthy {
    background: linear-gradient(
        90deg,
        #367ce8,
        #54d5aa
    );
}

.storage-volume-warning {
    background: linear-gradient(
        90deg,
        #367ce8,
        #f2bb4b
    );
}

.storage-volume-critical {
    background: linear-gradient(
        90deg,
        #f2bb4b,
        #ef6464
    );
}

.storage-volume-values strong {
    font-size: 0.78rem;
}

.storage-volume-values span {
    color: var(--text-muted);
    font-size: 0.68rem;
}

.storage-tank-metrics {
    display: grid;
    gap: 12px;
}

.storage-tank-metric {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
}

.storage-tank-metric span {
    color: var(--text-muted);
    font-size: 0.69rem;
}

.storage-tank-metric strong {
    color: #ffffff;
    font-size: 0.72rem;
    text-align: right;
}

.storage-tank-actions {
    display: flex;
    gap: 10px;
    margin-top: auto;
    padding-top: 21px;
}

.storage-tank-primary-action,
.storage-tank-secondary-action {
    min-height: 41px;
    border-radius: 9px;
    font-weight: 750;
}

.storage-tank-primary-action {
    display: flex;
    flex: 1;
    align-items: center;
    justify-content: space-between;
    padding: 9px 13px;
    border: 1px solid rgba(85, 160, 255, 0.35);
    background: rgba(46, 112, 213, 0.18);
    color: #ffffff;
    text-decoration: none;
}

.storage-tank-secondary-action {
    padding: 9px 13px;
    border: 1px solid var(--border-primary);
    background: transparent;
    color: var(--text-secondary);
    cursor: pointer;
}

.storage-detail-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
    margin-bottom: 25px;
}

.storage-detail-heading {
    display: flex;
    align-items: center;
    gap: 16px;
}

.storage-detail-heading h1 {
    margin: 4px 0;
    font-size: clamp(2rem, 4vw, 3rem);
    letter-spacing: -0.04em;
}

.storage-detail-heading p {
    margin: 0;
    color: var(--text-secondary);
}

.storage-detail-summary {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 17px;
    margin-bottom: 20px;
}

.storage-detail-grid {
    display: grid;
    grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
    gap: 20px;
}

.storage-detail-panel {
    padding: 21px;
    border: 1px solid var(--border-primary);
    border-radius: 14px;
    background: rgba(8, 26, 45, 0.82);
}

.storage-detail-panel header {
    margin-bottom: 20px;
}

.storage-detail-panel h2 {
    margin: 5px 0 0;
    font-size: 1.25rem;
}

.storage-detail-reading-list {
    display: grid;
    gap: 14px;
}

.storage-detail-reading-list > div {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    padding-bottom: 13px;
    border-bottom: 1px solid rgba(139, 174, 218, 0.09);
}

.storage-detail-reading-list span {
    color: var(--text-muted);
    font-size: 0.73rem;
}

.storage-detail-reading-list strong {
    font-size: 0.76rem;
    text-align: right;
}

.storage-chart-placeholder {
    display: flex;
    min-height: 250px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border: 1px dashed rgba(139, 174, 218, 0.22);
    border-radius: 11px;
    background: rgba(7, 22, 39, 0.55);
    text-align: center;
}

.storage-chart-placeholder strong {
    font-size: 0.9rem;
}

.storage-chart-placeholder p {
    max-width: 360px;
    margin: 8px 0 0;
    color: var(--text-muted);
    font-size: 0.74rem;
    line-height: 1.5;
}

@media (max-width: 1100px) {
    .storage-summary-grid,
    .storage-detail-summary {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .storage-tank-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .storage-detail-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 700px) {
    .storage-page,
    .storage-detail-page {
        padding: 25px 16px 50px;
    }

    .storage-header,
    .storage-section-heading,
    .storage-detail-header {
        align-items: flex-start;
        flex-direction: column;
    }

    .storage-header-actions {
        width: 100%;
    }

    .storage-header-actions button {
        flex: 1;
    }

    .storage-section-heading p {
        text-align: left;
    }

    .storage-summary-grid,
    .storage-detail-summary,
    .storage-tank-grid {
        grid-template-columns: 1fr;
    }
}

/*=========================================================
   STORAGE HISTORY
   =========================================================*/

.storage-history-header,
.storage-reading-history-panel > header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
}

.storage-history-header small,
.storage-reading-history-panel > header small {
    color: var(--text-muted);
    font-size: 0.68rem;
}

.storage-history-bars {
    display: flex;
    align-items: flex-end;
    gap: 5px;
    min-height: 250px;
    padding: 18px 12px 0;
    border: 1px solid rgba(139, 174, 218, 0.1);
    border-radius: 11px;
    background: linear-gradient(
            to top,
            rgba(54, 124, 232, 0.04),
            transparent
        );
}

.storage-history-bar-item {
    display: flex;
    flex: 1;
    align-items: flex-end;
    height: 220px;
}

.storage-history-bar-track {
    display: flex;
    align-items: flex-end;
    width: 100%;
    height: 100%;
    overflow: hidden;
    border-radius: 4px 4px 0 0;
    background: rgba(139, 174, 218, 0.07);
}

.storage-history-bar-track span {
    display: block;
    width: 100%;
    min-height: 2px;
    border-radius: 4px 4px 0 0;
    background: linear-gradient(
            to top,
            #367ce8,
            #54d5aa
        );
    transition: opacity 150ms ease;
}

.storage-history-bar-item:hover
.storage-history-bar-track span {
    opacity: 0.72;
}

.storage-history-axis {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 10px;
    color: var(--text-muted);
    font-size: 0.64rem;
}

.storage-history-summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 17px;
    margin-top: 20px;
}

.storage-history-summary-grid article {
    padding: 18px 20px;
    border: 1px solid var(--border-primary);
    border-radius: 13px;
    background: linear-gradient(
            150deg,
            rgba(14, 37, 63, 0.92),
            rgba(7, 23, 40, 0.97)
        );
}

.storage-history-summary-grid span {
    display: block;
    color: var(--text-muted);
    font-size: 0.68rem;
    font-weight: 750;
    text-transform: uppercase;
}

.storage-history-summary-grid strong {
    display: inline-block;
    margin-top: 11px;
    color: #ffffff;
    font-size: 1.55rem;
}

.storage-history-summary-grid small {
    margin-left: 5px;
    color: var(--text-secondary);
    font-size: 0.7rem;
}

.storage-reading-history-panel {
    margin-top: 20px;
    padding: 21px;
    border: 1px solid var(--border-primary);
    border-radius: 14px;
    background: rgba(8, 26, 45, 0.82);
}

.storage-reading-history-panel > header {
    margin-bottom: 18px;
}

.storage-reading-history-panel > header > div > span {
    color: #6aa5ff;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.11em;
}

.storage-reading-history-panel h2 {
    margin: 5px 0 0;
    font-size: 1.25rem;
}

.storage-reading-table-wrapper {
    overflow-x: auto;
}

.storage-reading-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
}

.storage-reading-table th {
    padding: 11px 13px;
    border-bottom: 1px solid var(--border-primary);
    color: var(--text-muted);
    font-size: 0.64rem;
    font-weight: 800;
    text-align: left;
    text-transform: uppercase;
    white-space: nowrap;
}

.storage-reading-table td {
    padding: 13px;
    border-bottom: 1px solid rgba(139, 174, 218, 0.08);
    color: var(--text-secondary);
    font-size: 0.7rem;
    white-space: nowrap;
}

.storage-reading-table tbody tr:hover {
    background: rgba(85, 160, 255, 0.04);
}

.storage-reading-table tbody tr:last-child td {
    border-bottom: 0;
}

.storage-quality-badge,
.storage-estimated-badge {
    display: inline-flex;
    align-items: center;
    padding: 4px 7px;
    border-radius: 999px;
    font-size: 0.58rem;
    font-weight: 800;
    text-transform: uppercase;
}

.storage-quality-badge {
    border: 1px solid rgba(84, 213, 170, 0.2);
    background: rgba(84, 213, 170, 0.07);
    color: #74dfba;
}

.storage-estimated-badge {
    margin-left: 5px;
    border: 1px solid rgba(242, 187, 75, 0.22);
    background: rgba(242, 187, 75, 0.08);
    color: #f0c666;
}

.storage-empty-state {
    display: flex;
    min-height: 170px;
    align-items: center;
    justify-content: center;
    border: 1px dashed rgba(139, 174, 218, 0.18);
    border-radius: 10px;
    color: var(--text-muted);
    font-size: 0.78rem;
}

@media (max-width: 1100px) {
    .storage-history-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 700px) {
    .storage-history-summary-grid {
        grid-template-columns: 1fr;
    }

    .storage-history-bars {
        gap: 3px;
        padding-inline: 7px;
    }

    .storage-history-bar-item {
        min-width: 3px;
    }
}

/*=========================================================
   PROCESSING MODULE
   =========================================================*/

.processing-page {
    min-height: 100%;
    padding: 30px;
}

.processing-container {
    width: 100%;
    max-width: 1500px;
    margin: 0 auto;
}

.processing-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 28px;
    margin-top: 22px;
}

.processing-header > div:first-child > span {
    color: #6aa5ff;
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.12em;
}

.processing-header h1 {
    margin: 8px 0 7px;
    font-size: clamp(2rem, 4vw, 3.1rem);
    line-height: 1.05;
}

.processing-header p {
    max-width: 720px;
    margin: 0;
    color: var(--text-secondary);
    line-height: 1.7;
}

.processing-header-context {
    min-width: 180px;
    padding: 15px 18px;
    border: 1px solid var(--border-primary);
    border-radius: 12px;
    background: rgba(8, 27, 47, 0.8);
}

.processing-header-context span {
    display: block;
    color: var(--text-muted);
    font-size: 0.65rem;
    font-weight: 800;
    text-transform: uppercase;
}

.processing-header-context strong {
    display: block;
    margin-top: 7px;
    color: #ffffff;
}

.processing-summary-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 15px;
    margin-top: 28px;
}

.processing-summary-grid article {
    padding: 19px;
    border: 1px solid var(--border-primary);
    border-radius: 13px;
    background: linear-gradient(
            150deg,
            rgba(14, 37, 63, 0.94),
            rgba(7, 23, 40, 0.98)
        );
}

.processing-summary-grid span {
    display: block;
    color: var(--text-muted);
    font-size: 0.65rem;
    font-weight: 800;
    text-transform: uppercase;
}

.processing-summary-grid strong {
    display: inline-block;
    margin-top: 12px;
    color: #ffffff;
    font-size: 1.5rem;
}

.processing-summary-grid small {
    display: block;
    margin-top: 4px;
    color: var(--text-secondary);
    font-size: 0.66rem;
}

.processing-events-panel {
    margin-top: 22px;
    padding: 22px;
    border: 1px solid var(--border-primary);
    border-radius: 14px;
    background: rgba(8, 26, 45, 0.84);
}

.processing-events-panel > header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 18px;
}

.processing-events-panel header span {
    color: #6aa5ff;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.11em;
}

.processing-events-panel h2 {
    margin: 5px 0 0;
    font-size: 1.3rem;
}

.processing-events-panel header small {
    color: var(--text-muted);
    font-size: 0.68rem;
}

.processing-table-wrapper {
    overflow-x: auto;
}

.processing-table {
    width: 100%;
    min-width: 1300px;
    border-collapse: collapse;
}

.processing-table th {
    padding: 11px 13px;
    border-bottom: 1px solid var(--border-primary);
    color: var(--text-muted);
    font-size: 0.63rem;
    font-weight: 800;
    text-align: left;
    text-transform: uppercase;
    white-space: nowrap;
}

.processing-table td {
    padding: 14px 13px;
    border-bottom: 1px solid rgba(139, 174, 218, 0.08);
    color: var(--text-secondary);
    font-size: 0.7rem;
    vertical-align: middle;
}

.processing-table td strong {
    display: block;
    color: #eef6ff;
    font-size: 0.72rem;
}

.processing-table td small {
    display: block;
    margin-top: 4px;
    color: var(--text-muted);
    font-size: 0.62rem;
}

.processing-table tbody tr:hover {
    background: rgba(84, 151, 255, 0.04);
}

.processing-table tbody tr:last-child td {
    border-bottom: 0;
}

.processing-badge {
    display: inline-flex;
    align-items: center;
    padding: 5px 8px;
    border: 1px solid transparent;
    border-radius: 999px;
    font-size: 0.58rem;
    font-weight: 800;
    text-transform: uppercase;
    white-space: nowrap;
}

.processing-badge-healthy {
    border-color: rgba(84, 213, 170, 0.22);
    background: rgba(84, 213, 170, 0.08);
    color: #78dfbc;
}

.processing-badge-active {
    border-color: rgba(90, 158, 255, 0.24);
    background: rgba(90, 158, 255, 0.09);
    color: #77adff;
}

.processing-badge-warning {
    border-color: rgba(243, 187, 74, 0.24);
    background: rgba(243, 187, 74, 0.09);
    color: #f0c766;
}

.processing-badge-critical {
    border-color: rgba(246, 102, 116, 0.25);
    background: rgba(246, 102, 116, 0.09);
    color: #ff7c8a;
}

.processing-badge-neutral {
    border-color: rgba(166, 184, 207, 0.18);
    background: rgba(166, 184, 207, 0.07);
    color: #a8b8cb;
}

.processing-details-link {
    display: inline-flex;
    padding: 7px 11px;
    border: 1px solid rgba(91, 157, 255, 0.22);
    border-radius: 7px;
    color: #78adff;
    font-size: 0.65rem;
    font-weight: 750;
    text-decoration: none;
}

.processing-details-link:hover {
    border-color: rgba(91, 157, 255, 0.45);
    background: rgba(91, 157, 255, 0.07);
    color: #a8caff;
}

.processing-empty-state {
    display: flex;
    min-height: 180px;
    align-items: center;
    justify-content: center;
    border: 1px dashed rgba(139, 174, 218, 0.18);
    border-radius: 10px;
    color: var(--text-muted);
}

@media (max-width: 1350px) {
    .processing-summary-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 800px) {
    .processing-page {
        padding: 22px 16px;
    }

    .processing-header {
        align-items: stretch;
        flex-direction: column;
    }

    .processing-header-context {
        min-width: 0;
    }

    .processing-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 520px) {
    .processing-summary-grid {
        grid-template-columns: 1fr;
    }
}

/*=========================================================
   PROCESSING EVENT DETAILS
   =========================================================*/

.processing-detail-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
    margin-top: 22px;
}

.processing-detail-eyebrow {
    color: #6aa5ff;
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.12em;
}

.processing-detail-header h1 {
    margin: 8px 0 7px;
    font-size: clamp(2rem, 4vw, 3rem);
}

.processing-detail-header p {
    max-width: 690px;
    margin: 0;
    color: var(--text-secondary);
    line-height: 1.7;
}

.processing-detail-header-actions {
    display: flex;
    align-items: center;
    gap: 12px;
}

.processing-back-button {
    display: inline-flex;
    align-items: center;
    padding: 9px 13px;
    border: 1px solid var(--border-primary);
    border-radius: 8px;
    color: var(--text-secondary);
    font-size: 0.68rem;
    font-weight: 750;
    text-decoration: none;
}

.processing-back-button:hover {
    border-color: rgba(91, 157, 255, 0.4);
    color: #ffffff;
}

.processing-detail-summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
    margin-top: 28px;
}

.processing-detail-summary-grid article {
    padding: 20px;
    border: 1px solid var(--border-primary);
    border-radius: 13px;
    background: linear-gradient(
            150deg,
            rgba(14, 37, 63, 0.94),
            rgba(7, 23, 40, 0.98)
        );
}

.processing-detail-summary-grid span {
    display: block;
    color: var(--text-muted);
    font-size: 0.65rem;
    font-weight: 800;
    text-transform: uppercase;
}

.processing-detail-summary-grid strong {
    display: block;
    margin-top: 12px;
    color: #ffffff;
    font-size: 1.55rem;
}

.processing-detail-summary-grid small {
    display: block;
    margin-top: 5px;
    color: var(--text-secondary);
    font-size: 0.67rem;
}

.processing-detail-layout {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    margin-top: 20px;
}

.processing-detail-panel {
    padding: 22px;
    border: 1px solid var(--border-primary);
    border-radius: 14px;
    background: rgba(8, 26, 45, 0.84);
}

.processing-detail-panel > header {
    margin-bottom: 20px;
}

.processing-detail-panel header span {
    color: #6aa5ff;
    font-size: 0.65rem;
    font-weight: 800;
    letter-spacing: 0.11em;
}

.processing-detail-panel h2 {
    margin: 5px 0 0;
    font-size: 1.2rem;
}

.processing-route {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 18px;
}

.processing-route-node {
    padding: 20px;
    border: 1px solid rgba(139, 174, 218, 0.14);
    border-radius: 11px;
    background: rgba(5, 19, 34, 0.72);
}

.processing-route-node span {
    display: block;
    color: var(--text-muted);
    font-size: 0.63rem;
    font-weight: 800;
    text-transform: uppercase;
}

.processing-route-node strong {
    display: block;
    margin-top: 9px;
    color: #ffffff;
    font-size: 0.85rem;
}

.processing-route-node small {
    display: block;
    margin-top: 5px;
    color: var(--text-secondary);
}

.processing-route-arrow {
    color: #6aa5ff;
    font-size: 1.5rem;
}

.processing-detail-list {
    margin: 0;
}

.processing-detail-list > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 13px 0;
    border-bottom: 1px solid rgba(139, 174, 218, 0.09);
}

.processing-detail-list > div:last-child {
    border-bottom: 0;
}

.processing-detail-list dt {
    color: var(--text-muted);
    font-size: 0.67rem;
    font-weight: 700;
}

.processing-detail-list dd {
    margin: 0;
    color: #eef6ff;
    font-size: 0.72rem;
    font-weight: 700;
    text-align: right;
}

.processing-volume-comparison {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 18px;
}

.processing-volume-comparison article,
.processing-volume-change {
    padding: 20px;
    border-radius: 11px;
    text-align: center;
}

.processing-volume-comparison article {
    border: 1px solid rgba(139, 174, 218, 0.14);
    background: rgba(5, 19, 34, 0.72);
}

.processing-volume-change {
    border: 1px solid rgba(90, 158, 255, 0.2);
    background: rgba(90, 158, 255, 0.07);
}

.processing-volume-comparison span {
    display: block;
    color: var(--text-muted);
    font-size: 0.62rem;
    font-weight: 800;
    text-transform: uppercase;
}

.processing-volume-comparison strong {
    display: block;
    margin-top: 8px;
    color: #ffffff;
    font-size: 1.2rem;
}

.processing-volume-comparison small {
    display: block;
    margin-top: 4px;
    color: var(--text-secondary);
    font-size: 0.62rem;
}

@media (max-width: 950px) {
    .processing-detail-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .processing-detail-layout {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 650px) {
    .processing-detail-header {
        align-items: stretch;
        flex-direction: column;
    }

    .processing-detail-header-actions {
        align-items: flex-start;
        flex-direction: column;
    }

    .processing-detail-summary-grid {
        grid-template-columns: 1fr;
    }

    .processing-route,
    .processing-volume-comparison {
        grid-template-columns: 1fr;
    }

    .processing-route-arrow {
        transform: rotate(90deg);
        text-align: center;
    }
}

/*=========================================================
   PUMPS MODULE — OPERATIONS DESIGN OVERRIDE
   Add this section at the bottom of site.css
   =========================================================*/

.pump-page {
    min-height: calc(100vh - var(--topbar-height));
    padding: 30px 30px 70px;
    background: transparent;
}

.pump-page-container {
    width: min(1380px, 100%);
    margin: 0 auto;
}

/*PAGE HEADER*/

.pump-page-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 30px;
    margin-bottom: 27px;
}

.pump-page-header > div:first-child {
    max-width: 780px;
}

.pump-page-eyebrow {
    color: #6aa5ff;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.11em;
    text-transform: uppercase;
}

.pump-page-header h1 {
    margin: 8px 0 10px;
    color: #ffffff;
    font-size: clamp(2.2rem, 4vw, 3.4rem);
    line-height: 1.08;
    letter-spacing: -0.045em;
}

.pump-page-header p {
    max-width: 760px;
    margin: 0;
    color: var(--text-secondary);
    line-height: 1.65;
}

.pump-page-actions {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 10px;
}

.pump-primary-button,
.pump-secondary-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 9px 15px;
    border-radius: 9px;
    font-size: 0.76rem;
    font-weight: 750;
    text-decoration: none;
    cursor: pointer;
    transition: border-color 150ms ease,
        background 150ms ease,
        color 150ms ease,
        transform 150ms ease;
}

.pump-primary-button {
    border: 1px solid rgba(85, 160, 255, 0.42);
    background: #367ce8;
    color: #ffffff;
}

.pump-secondary-button {
    border: 1px solid var(--border-primary);
    background: rgba(10, 30, 52, 0.72);
    color: var(--text-secondary);
}

.pump-primary-button:hover,
.pump-secondary-button:hover {
    transform: translateY(-1px);
    border-color: var(--border-hover);
    color: #ffffff;
}

/*SUMMARY CARDS*/

.pump-summary-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 17px;
    margin-bottom: 32px;
}

.pump-summary-card {
    min-width: 0;
    padding: 19px 20px;
    border: 1px solid var(--border-primary);
    border-radius: 13px;
    background: linear-gradient(
            150deg,
            rgba(14, 37, 63, 0.92),
            rgba(7, 23, 40, 0.97)
        );
    box-shadow: none;
}

.pump-summary-card > span {
    display: block;
    margin: 0;
    color: var(--text-muted);
    font-size: 0.7rem;
    font-weight: 750;
    letter-spacing: 0;
    text-transform: uppercase;
}

.pump-summary-card > strong {
    display: block;
    margin-top: 12px;
    overflow: hidden;
    color: #ffffff;
    font-size: 1.8rem;
    line-height: 1.1;
    text-overflow: ellipsis;
}

.pump-summary-card strong small {
    margin-left: 4px;
    color: var(--text-secondary);
    font-size: 0.7rem;
    font-weight: 600;
}

.pump-summary-card > small {
    display: block;
    margin-top: 7px;
    color: var(--text-muted);
    font-size: 0.7rem;
    line-height: 1.45;
}

/*SECTION CARDS*/

.pump-section-card {
    margin-bottom: 22px;
    overflow: hidden;
    border: 1px solid var(--border-primary);
    border-radius: 14px;
    background: rgba(8, 26, 45, 0.82);
    box-shadow: none;
}

.pump-section-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 20px 22px;
    border-bottom: 1px solid var(--border-primary);
    background: rgba(10, 31, 53, 0.48);
}

.pump-section-header span {
    display: block;
    margin: 0;
    color: #6aa5ff;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.11em;
    text-transform: uppercase;
}

.pump-section-header h2 {
    margin: 5px 0 0;
    color: #ffffff;
    font-size: 1.25rem;
}

.pump-reading-time {
    flex: 0 0 auto;
    color: var(--text-muted);
    font-size: 0.68rem;
    text-align: right;
}

.pump-reading-time span {
    color: var(--text-muted);
    font-size: 0.63rem;
    letter-spacing: 0;
    text-transform: none;
}

.pump-reading-time strong {
    display: block;
    margin-top: 4px;
    color: var(--text-secondary);
    font-size: 0.74rem;
}

/*LIVE PUMP GRID*/

.pump-card-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    padding: 22px;
}

.pump-equipment-card {
    min-width: 0;
    padding: 20px;
    border: 1px solid var(--border-primary);
    border-radius: 13px;
    background: linear-gradient(
            150deg,
            rgba(15, 38, 65, 0.9),
            rgba(7, 23, 40, 0.97)
        );
    transition: border-color 160ms ease,
        transform 160ms ease,
        box-shadow 160ms ease;
}

.pump-equipment-card:hover {
    transform: translateY(-2px);
    border-color: var(--border-hover);
    box-shadow: 0 17px 34px rgba(0, 0, 0, 0.18);
}

.pump-equipment-card-header,
.pump-equipment-identity,
.pump-equipment-card-footer {
    display: flex;
    align-items: center;
}

.pump-equipment-card-header,
.pump-equipment-card-footer {
    justify-content: space-between;
    gap: 16px;
}

.pump-equipment-identity {
    min-width: 0;
    gap: 12px;
}

.pump-equipment-icon {
    display: inline-flex;
    flex: 0 0 42px;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border: 1px solid rgba(85, 160, 255, 0.23);
    border-radius: 10px;
    background: rgba(48, 111, 207, 0.12);
    color: #85b6ff;
    font-size: 1.05rem;
}

.pump-equipment-identity > div {
    min-width: 0;
}

.pump-equipment-identity span {
    display: block;
    color: #6f87a2;
    font-size: 0.64rem;
    font-weight: 800;
    letter-spacing: 0.09em;
    text-transform: uppercase;
}

.pump-equipment-identity h3 {
    margin: 4px 0 0;
    overflow: hidden;
    color: #ffffff;
    font-size: 1rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/*STATUS BADGES*/

.pump-status-badge,
.pump-quality-badge {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    padding: 5px 8px;
    border: 1px solid transparent;
    border-radius: 999px;
    font-size: 0.59rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    line-height: 1;
    text-transform: uppercase;
    white-space: nowrap;
}

.pump-status-running,
.pump-status-available {
    border-color: rgba(84, 213, 170, 0.24);
    background: rgba(84, 213, 170, 0.09);
    color: #74dfba;
}

.pump-status-standby {
    border-color: rgba(85, 160, 255, 0.25);
    background: rgba(85, 160, 255, 0.1);
    color: #8bbcff;
}

.pump-status-stopped,
.pump-status-unknown {
    border-color: rgba(139, 174, 218, 0.18);
    background: rgba(139, 174, 218, 0.07);
    color: #9eb0c4;
}

.pump-status-fault,
.pump-status-warning {
    border-color: rgba(237, 106, 115, 0.26);
    background: rgba(237, 106, 115, 0.09);
    color: #f18b92;
}

/*ASSOCIATED TANK*/

.pump-equipment-location {
    margin: 18px 0;
    padding: 13px 14px;
    border: 1px solid rgba(139, 174, 218, 0.1);
    border-radius: 10px;
    background: rgba(5, 19, 34, 0.56);
}

.pump-equipment-location span,
.pump-equipment-location small {
    display: block;
    color: var(--text-muted);
    font-size: 0.65rem;
}

.pump-equipment-location strong {
    display: block;
    margin: 5px 0 3px;
    color: #ffffff;
    font-size: 0.79rem;
}

/*PUMP METRICS*/

.pump-metric-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.pump-metric {
    min-width: 0;
    padding: 12px;
    border: 1px solid rgba(139, 174, 218, 0.09);
    border-radius: 9px;
    background: rgba(6, 20, 36, 0.52);
}

.pump-metric span {
    display: block;
    margin-bottom: 6px;
    color: var(--text-muted);
    font-size: 0.59rem;
    font-weight: 750;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.pump-metric strong {
    color: #ffffff;
    font-size: 0.87rem;
}

.pump-metric small {
    margin-left: 3px;
    color: var(--text-muted);
    font-size: 0.61rem;
}

/*CARD FOOTER*/

.pump-equipment-card-footer {
    margin-top: 18px;
    padding-top: 15px;
    border-top: 1px solid rgba(139, 174, 218, 0.09);
}

.pump-equipment-card-footer a {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: #8fbaff;
    font-size: 0.72rem;
    font-weight: 750;
    text-decoration: none;
}

.pump-equipment-card-footer a:hover {
    color: #ffffff;
}

/*DATA QUALITY*/

.pump-quality-good {
    border-color: rgba(84, 213, 170, 0.22);
    background: rgba(84, 213, 170, 0.08);
    color: #74dfba;
}

.pump-quality-fair {
    border-color: rgba(242, 187, 75, 0.24);
    background: rgba(242, 187, 75, 0.08);
    color: #f0c666;
}

.pump-quality-poor {
    border-color: rgba(237, 106, 115, 0.24);
    background: rgba(237, 106, 115, 0.08);
    color: #f18b92;
}

.pump-quality-unknown {
    border-color: rgba(139, 174, 218, 0.18);
    background: rgba(139, 174, 218, 0.07);
    color: #9eafc2;
}

/*INVENTORY TABLE*/

.pump-table-wrapper {
    width: 100%;
    overflow-x: auto;
}

.pump-table {
    width: 100%;
    min-width: 1120px;
    border-collapse: collapse;
}

.pump-table th,
.pump-table td {
    text-align: left;
    white-space: nowrap;
}

.pump-table th {
    padding: 11px 13px;
    border-bottom: 1px solid var(--border-primary);
    background: transparent;
    color: var(--text-muted);
    font-size: 0.64rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.pump-table td {
    padding: 13px;
    border-bottom: 1px solid rgba(139, 174, 218, 0.08);
    color: var(--text-secondary);
    font-size: 0.7rem;
}

.pump-table tbody tr {
    transition: background 140ms ease;
}

.pump-table tbody tr:hover {
    background: rgba(85, 160, 255, 0.04);
}

.pump-table tbody tr:last-child td {
    border-bottom: 0;
}

.pump-table td strong,
.pump-table td span {
    display: block;
}

.pump-table td strong {
    color: #ffffff;
    font-size: 0.73rem;
}

.pump-table td > span:not(.pump-status-badge):not(.pump-quality-badge) {
    margin-top: 3px;
    color: var(--text-muted);
    font-size: 0.64rem;
}

.pump-table a {
    color: #8fbaff;
    font-size: 0.69rem;
    font-weight: 750;
    text-decoration: none;
}

.pump-table a:hover {
    color: #ffffff;
}

/*EMPTY STATE*/

.pump-empty-state {
    display: flex;
    min-height: 180px;
    align-items: center;
    justify-content: center;
    margin: 22px;
    padding: 30px;
    border: 1px dashed rgba(139, 174, 218, 0.2);
    border-radius: 11px;
    background: rgba(6, 20, 36, 0.35);
    color: var(--text-muted);
    font-size: 0.76rem;
    text-align: center;
}

/*RESPONSIVE*/

@media (max-width: 1250px) {
    .pump-summary-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 1000px) {
    .pump-card-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {
    .pump-page {
        padding: 25px 16px 50px;
    }

    .pump-page-header {
        align-items: flex-start;
        flex-direction: column;
    }

    .pump-page-actions {
        width: 100%;
    }

    .pump-primary-button,
    .pump-secondary-button {
        flex: 1;
    }

    .pump-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .pump-section-header {
        align-items: flex-start;
        flex-direction: column;
    }

    .pump-reading-time {
        text-align: left;
    }

    .pump-card-grid {
        padding: 16px;
    }
}

@media (max-width: 520px) {
    .pump-page-actions {
        flex-direction: column;
    }

    .pump-primary-button,
    .pump-secondary-button {
        width: 100%;
    }

    .pump-summary-grid {
        grid-template-columns: 1fr;
    }

    .pump-equipment-card-header {
        align-items: flex-start;
        flex-direction: column;
    }

    .pump-metric-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/*=========================================================
   PUMP DETAILS
   =========================================================*/

.pump-detail-page {
    min-height: calc(100vh - var(--topbar-height));
    padding: 30px 30px 70px;
}

.pump-detail-container {
    width: min(1380px, 100%);
    margin: 0 auto;
}

.pump-detail-breadcrumb {
    display: flex;
    align-items: center;
    gap: 9px;
    margin-bottom: 22px;
    color: var(--text-muted);
    font-size: 0.72rem;
}

.pump-detail-breadcrumb a {
    color: #8fbaff;
    font-weight: 700;
    text-decoration: none;
}

.pump-detail-breadcrumb a:hover {
    color: #ffffff;
}

.pump-detail-breadcrumb strong {
    overflow: hidden;
    color: var(--text-secondary);
    text-overflow: ellipsis;
    white-space: nowrap;
}

.pump-detail-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
    margin-bottom: 26px;
    padding: 25px;
    border: 1px solid var(--border-primary);
    border-radius: 15px;
    background: linear-gradient(
            145deg,
            rgba(15, 39, 67, 0.92),
            rgba(7, 23, 40, 0.97)
        );
}

.pump-detail-header-main {
    display: flex;
    align-items: center;
    min-width: 0;
    gap: 18px;
}

.pump-detail-header-icon {
    display: inline-flex;
    flex: 0 0 58px;
    align-items: center;
    justify-content: center;
    width: 58px;
    height: 58px;
    border: 1px solid rgba(85, 160, 255, 0.31);
    border-radius: 14px;
    background: rgba(49, 116, 218, 0.15);
    color: #87b7ff;
    font-size: 1.35rem;
}

.pump-detail-header-content {
    min-width: 0;
}

.pump-detail-eyebrow,
.pump-detail-panel-header > div > span {
    color: #6aa5ff;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.11em;
}

.pump-detail-title-row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 13px;
}

.pump-detail-title-row h1 {
    margin: 5px 0;
    color: #ffffff;
    font-size: clamp(2rem, 4vw, 3rem);
    line-height: 1.12;
    letter-spacing: -0.04em;
}

.pump-detail-header-content > p {
    max-width: 760px;
    margin: 0;
    color: var(--text-secondary);
    line-height: 1.55;
}

.pump-detail-identifiers {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 22px;
    margin-top: 16px;
}

.pump-detail-identifiers > span {
    color: var(--text-muted);
    font-size: 0.67rem;
}

.pump-detail-identifiers strong {
    margin-left: 5px;
    color: var(--text-secondary);
}

.pump-detail-header-actions {
    flex: 0 0 auto;
}

.pump-detail-summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 17px;
    margin-bottom: 22px;
}

.pump-detail-summary-card,
.pump-detail-specification-card {
    min-width: 0;
    padding: 19px 20px;
    border: 1px solid var(--border-primary);
    border-radius: 13px;
    background: linear-gradient(
            150deg,
            rgba(14, 37, 63, 0.92),
            rgba(7, 23, 40, 0.97)
        );
}

.pump-detail-summary-card > span,
.pump-detail-specification-card > span {
    display: block;
    color: var(--text-muted);
    font-size: 0.7rem;
    font-weight: 750;
    text-transform: uppercase;
}

.pump-detail-summary-card > strong,
.pump-detail-specification-card > strong {
    display: inline-block;
    margin-top: 12px;
    color: #ffffff;
    font-size: 1.8rem;
}

.pump-detail-summary-card > small,
.pump-detail-specification-card > small {
    margin-left: 5px;
    color: var(--text-secondary);
    font-size: 0.7rem;
}

.pump-detail-summary-card > p {
    margin: 7px 0 0;
    color: var(--text-muted);
    font-size: 0.7rem;
}

.pump-detail-status-value {
    font-size: 1.25rem !important;
}

.pump-detail-main-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.25fr)
        minmax(300px, 0.75fr);
    gap: 20px;
    margin-bottom: 22px;
}

.pump-detail-panel,
.pump-detail-history-panel {
    overflow: hidden;
    border: 1px solid var(--border-primary);
    border-radius: 14px;
    background: rgba(8, 26, 45, 0.82);
}

.pump-detail-panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 20px 22px;
    border-bottom: 1px solid var(--border-primary);
    background: rgba(10, 31, 53, 0.48);
}

.pump-detail-panel-header h2 {
    margin: 5px 0 0;
    color: #ffffff;
    font-size: 1.25rem;
}

.pump-detail-panel-header > small {
    color: var(--text-muted);
    font-size: 0.7rem;
}

.pump-detail-reading-time {
    flex: 0 0 auto;
    text-align: right;
}

.pump-detail-reading-time span {
    display: block;
    color: var(--text-muted);
    font-size: 0.63rem;
}

.pump-detail-reading-time strong {
    display: block;
    margin-top: 4px;
    color: var(--text-secondary);
    font-size: 0.72rem;
}

.pump-detail-live-content {
    padding: 22px;
}

.pump-detail-gauge-grid {
    display: grid;
    gap: 19px;
}

.pump-detail-gauge {
    padding: 16px;
    border: 1px solid rgba(139, 174, 218, 0.1);
    border-radius: 11px;
    background: rgba(5, 19, 34, 0.5);
}

.pump-detail-gauge-heading,
.pump-detail-gauge-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
}

.pump-detail-gauge-heading span {
    color: var(--text-secondary);
    font-size: 0.75rem;
    font-weight: 700;
}

.pump-detail-gauge-heading strong {
    color: #ffffff;
    font-size: 0.82rem;
}

.pump-detail-gauge-track {
    height: 7px;
    margin: 13px 0 9px;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(139, 174, 218, 0.12);
}

.pump-detail-gauge-track span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(
            90deg,
            var(--blue-primary),
            var(--green-primary)
        );
}

.pump-detail-gauge-footer span {
    color: var(--text-muted);
    font-size: 0.64rem;
}

.pump-detail-live-metrics {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 11px;
    margin-top: 19px;
}

.pump-detail-live-metric {
    min-width: 0;
    padding: 13px;
    border: 1px solid rgba(139, 174, 218, 0.09);
    border-radius: 9px;
    background: rgba(6, 20, 36, 0.52);
}

.pump-detail-live-metric > span {
    display: block;
    margin-bottom: 7px;
    color: var(--text-muted);
    font-size: 0.61rem;
    font-weight: 750;
    text-transform: uppercase;
}

.pump-detail-live-metric > strong {
    color: #ffffff;
    font-size: 0.88rem;
}

.pump-detail-live-metric > small {
    margin-left: 3px;
    color: var(--text-muted);
    font-size: 0.61rem;
}

.pump-detail-equipment-list {
    padding: 10px 22px;
}

.pump-detail-equipment-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 13px 0;
    border-bottom: 1px solid rgba(139, 174, 218, 0.08);
}

.pump-detail-equipment-row:last-child {
    border-bottom: 0;
}

.pump-detail-equipment-row span {
    color: var(--text-muted);
    font-size: 0.7rem;
}

.pump-detail-equipment-row strong {
    color: var(--text-secondary);
    font-size: 0.73rem;
    text-align: right;
}

.pump-detail-specification-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 17px;
    margin-bottom: 22px;
}

.pump-detail-history-panel {
    margin-bottom: 22px;
}

.pump-detail-table-wrapper {
    width: 100%;
    overflow-x: auto;
}

.pump-detail-table {
    width: 100%;
    min-width: 1200px;
    border-collapse: collapse;
}

.pump-detail-table th {
    padding: 11px 13px;
    border-bottom: 1px solid var(--border-primary);
    color: var(--text-muted);
    font-size: 0.64rem;
    font-weight: 800;
    text-align: left;
    text-transform: uppercase;
    white-space: nowrap;
}

.pump-detail-table td {
    padding: 13px;
    border-bottom: 1px solid rgba(139, 174, 218, 0.08);
    color: var(--text-secondary);
    font-size: 0.7rem;
    white-space: nowrap;
}

.pump-detail-table tbody tr:hover {
    background: rgba(85, 160, 255, 0.04);
}

.pump-detail-table tbody tr:last-child td {
    border-bottom: 0;
}

.pump-detail-table td strong,
.pump-detail-table td > span:not(.pump-status-badge):not(.pump-quality-badge) {
    display: block;
}

.pump-detail-table td strong {
    color: #ffffff;
    font-size: 0.72rem;
}

.pump-detail-table td > span:not(.pump-status-badge):not(.pump-quality-badge) {
    margin-top: 3px;
    color: var(--text-muted);
    font-size: 0.63rem;
}

.pump-detail-empty-state {
    display: flex;
    min-height: 190px;
    align-items: center;
    justify-content: center;
    padding: 30px;
    color: var(--text-muted);
    text-align: center;
}

.pump-detail-empty-state strong {
    color: #ffffff;
}

.pump-detail-empty-state p {
    margin: 8px 0 0;
    font-size: 0.74rem;
}

@media (max-width: 1100px) {
    .pump-detail-summary-grid,
    .pump-detail-specification-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .pump-detail-main-grid {
        grid-template-columns: 1fr;
    }

    .pump-detail-live-metrics {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 700px) {
    .pump-detail-page {
        padding: 25px 16px 50px;
    }

    .pump-detail-header {
        align-items: flex-start;
        flex-direction: column;
        padding: 21px;
    }

    .pump-detail-header-main {
        align-items: flex-start;
    }

    .pump-detail-header-actions,
    .pump-detail-header-actions a {
        width: 100%;
    }

    .pump-detail-summary-grid,
    .pump-detail-specification-grid {
        grid-template-columns: 1fr;
    }

    .pump-detail-panel-header {
        align-items: flex-start;
        flex-direction: column;
    }

    .pump-detail-reading-time {
        text-align: left;
    }
}

@media (max-width: 520px) {
    .pump-detail-header-main {
        flex-direction: column;
    }

    .pump-detail-live-metrics {
        grid-template-columns: 1fr;
    }

    .pump-detail-identifiers {
        flex-direction: column;
    }
}

/*=========================================================
   ALARMS
   =========================================================*/

.alarm-page {
    width: min(100%, var(--page-width));
    margin: 0 auto;
}

.alarm-page-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 28px;
    margin-bottom: 28px;
}

.alarm-page-header h1 {
    margin: 7px 0 10px;
    font-size: clamp(2rem, 4vw, 3.35rem);
    line-height: 1.05;
}

.alarm-page-header p {
    max-width: 720px;
    margin: 0;
    color: var(--text-secondary);
    line-height: 1.7;
}

.alarm-header-button {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 0 18px;
    border: 1px solid var(--border-primary);
    border-radius: 10px;
    background: rgba(18, 44, 74, 0.72);
    color: var(--text-primary);
    font-size: 0.84rem;
    font-weight: 750;
    text-decoration: none;
}

.alarm-header-button:hover {
    border-color: var(--border-hover);
    background: rgba(46, 101, 181, 0.2);
}

.alarm-summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
    margin-bottom: 22px;
}

.alarm-summary-card {
    position: relative;
    overflow: hidden;
    min-height: 146px;
    padding: 22px;
    border: 1px solid var(--border-primary);
    border-radius: 15px;
    background: linear-gradient(
            145deg,
            rgba(22, 52, 87, 0.95),
            rgba(10, 29, 51, 0.96)
        );
}

.alarm-summary-card::before {
    position: absolute;
    inset: 0 auto 0 0;
    width: 3px;
    background: var(--blue-secondary);
    content: "";
}

.alarm-summary-card.critical::before {
    background: var(--red-primary);
}

.alarm-summary-card.warning::before {
    background: var(--amber-primary);
}

.alarm-summary-card.healthy::before {
    background: var(--green-primary);
}

.alarm-summary-card span {
    display: block;
    color: var(--text-secondary);
    font-size: 0.76rem;
    font-weight: 800;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.alarm-summary-card strong {
    display: block;
    margin: 13px 0 8px;
    font-size: 2rem;
    line-height: 1;
}

.alarm-summary-card small {
    color: var(--text-muted);
}

.alarm-table-card {
    overflow: hidden;
    border: 1px solid var(--border-primary);
    border-radius: 15px;
    background: var(--background-card-dark);
}

.alarm-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 22px 24px;
    border-bottom: 1px solid var(--border-primary);
}

.alarm-card-header > div:first-child > span {
    color: var(--blue-secondary);
    font-size: 0.69rem;
    font-weight: 800;
    letter-spacing: 0.09em;
}

.alarm-card-header h2 {
    margin: 5px 0 0;
    font-size: 1.25rem;
}

.alarm-latest-reading {
    text-align: right;
}

.alarm-latest-reading span,
.alarm-latest-reading strong {
    display: block;
}

.alarm-latest-reading span {
    margin-bottom: 4px;
    color: var(--text-muted);
    font-size: 0.72rem;
}

.alarm-latest-reading strong {
    color: var(--text-secondary);
    font-size: 0.82rem;
}

.alarm-table-wrapper {
    overflow-x: auto;
}

.alarm-table {
    width: 100%;
    min-width: 1050px;
    border-collapse: collapse;
}

.alarm-table th,
.alarm-table td {
    padding: 17px 18px;
    border-bottom: 1px solid var(--border-primary);
    text-align: left;
    vertical-align: middle;
}

.alarm-table th {
    background: rgba(8, 27, 48, 0.72);
    color: var(--text-muted);
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.alarm-table tbody tr {
    transition: background 140ms ease,
        border-color 140ms ease;
}

.alarm-table tbody tr:hover {
    background: rgba(52, 108, 187, 0.08);
}

.alarm-table tbody tr:last-child td {
    border-bottom: 0;
}

.alarm-description-cell,
.alarm-equipment-cell {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.alarm-description-cell {
    min-width: 260px;
    max-width: 390px;
}

.alarm-description-cell strong {
    color: var(--text-primary);
    font-size: 0.84rem;
}

.alarm-description-cell span,
.alarm-equipment-cell span {
    color: var(--text-muted);
    font-size: 0.76rem;
    line-height: 1.45;
}

.alarm-equipment-cell strong {
    color: var(--text-secondary);
    font-size: 0.8rem;
}

.alarm-table time {
    color: var(--text-secondary);
    font-size: 0.78rem;
    white-space: nowrap;
}

.alarm-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 27px;
    padding: 4px 9px;
    border: 1px solid var(--border-primary);
    border-radius: 999px;
    background: rgba(117, 139, 165, 0.1);
    color: var(--text-secondary);
    font-size: 0.65rem;
    font-weight: 850;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    white-space: nowrap;
}

.alarm-badge.critical {
    border-color: rgba(237, 106, 115, 0.32);
    background: rgba(237, 106, 115, 0.12);
    color: #ff9ba3;
}

.alarm-badge.warning {
    border-color: rgba(242, 187, 75, 0.32);
    background: rgba(242, 187, 75, 0.11);
    color: #ffd47b;
}

.alarm-badge.healthy {
    border-color: rgba(84, 213, 170, 0.29);
    background: rgba(84, 213, 170, 0.1);
    color: #7ce4c0;
}

.alarm-detail-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: 0 12px;
    border: 1px solid rgba(85, 160, 255, 0.26);
    border-radius: 8px;
    background: rgba(54, 124, 232, 0.1);
    color: #88baff;
    font-size: 0.74rem;
    font-weight: 750;
    text-decoration: none;
}

.alarm-detail-link:hover {
    border-color: var(--border-hover);
    color: #ffffff;
}

.alarm-empty-state {
    padding: 64px 24px;
    text-align: center;
}

.alarm-empty-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 58px;
    height: 58px;
    margin-bottom: 16px;
    border-radius: 50%;
    background: rgba(84, 213, 170, 0.12);
    color: var(--green-primary);
    font-size: 1.5rem;
}

.alarm-empty-state h3 {
    margin: 0 0 8px;
}

.alarm-empty-state p {
    margin: 0;
    color: var(--text-muted);
}

.alarm-detail-hero {
    position: relative;
    overflow: hidden;
    margin-bottom: 20px;
    padding: 28px;
    border: 1px solid var(--border-primary);
    border-radius: 15px;
    background: linear-gradient(
            145deg,
            rgba(22, 52, 87, 0.96),
            rgba(10, 29, 51, 0.98)
        );
}

.alarm-detail-hero::before {
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: var(--text-muted);
    content: "";
}

.alarm-detail-hero.critical::before {
    background: var(--red-primary);
}

.alarm-detail-hero.warning::before {
    background: var(--amber-primary);
}

.alarm-detail-hero.healthy::before {
    background: var(--green-primary);
}

.alarm-detail-status {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 18px;
}

.alarm-detail-hero h2 {
    max-width: 850px;
    margin: 0 0 11px;
    font-size: clamp(1.35rem, 3vw, 2rem);
    line-height: 1.3;
}

.alarm-detail-hero p {
    margin: 0;
    color: var(--text-muted);
}

.alarm-detail-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.alarm-detail-card {
    min-height: 128px;
    padding: 21px;
    border: 1px solid var(--border-primary);
    border-radius: 14px;
    background: var(--background-card);
}

.alarm-detail-card span,
.alarm-detail-card strong,
.alarm-detail-card small {
    display: block;
}

.alarm-detail-card span {
    margin-bottom: 12px;
    color: var(--text-muted);
    font-size: 0.69rem;
    font-weight: 800;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.alarm-detail-card strong {
    color: var(--text-primary);
    line-height: 1.4;
}

.alarm-detail-card small {
    margin-top: 6px;
    color: var(--text-muted);
}

@media (max-width: 1050px) {
    .alarm-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .alarm-detail-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 700px) {
    .alarm-page-header,
    .alarm-card-header {
        flex-direction: column;
        align-items: stretch;
    }

    .alarm-header-button {
        width: 100%;
    }

    .alarm-summary-grid,
    .alarm-detail-grid {
        grid-template-columns: 1fr;
    }

    .alarm-latest-reading {
        text-align: left;
    }
}

/*=========================================================
   ACCOUNTING
   =========================================================*/

.accounting-page {
    min-height: calc(100vh - var(--topbar-height));
    padding: 30px 30px 70px;
}

.accounting-page-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 32px;
    margin-bottom: 26px;
}

.accounting-page-container {
    width: min(1380px, 100%);
    margin: 0 auto;
}

.accounting-page-header h1 {
    margin: 7px 0 10px;
    font-size: clamp(2rem, 4vw, 3.35rem);
    line-height: 1.05;
}

.accounting-page-header p {
    max-width: 760px;
    margin: 0;
    color: var(--text-secondary);
    line-height: 1.7;
}

.accounting-header-status {
    flex: 0 0 auto;
    min-width: 210px;
    padding: 17px 19px;
    border: 1px solid var(--border-primary);
    border-radius: 13px;
    background: var(--background-card);
}

.accounting-header-status span,
.accounting-header-status strong,
.accounting-header-status small {
    display: block;
}

.accounting-header-status span {
    color: var(--text-muted);
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.accounting-header-status strong {
    margin: 7px 0 4px;
}

.accounting-header-status small {
    color: var(--text-muted);
}

.accounting-header-status.healthy {
    border-color: rgba(84, 213, 170, 0.28);
}

.accounting-header-status.warning {
    border-color: rgba(242, 187, 75, 0.3);
}

.accounting-header-status.critical {
    border-color: rgba(237, 106, 115, 0.32);
}

.accounting-disclaimer {
    margin-bottom: 21px;
    padding: 14px 17px;
    border: 1px solid rgba(242, 187, 75, 0.22);
    border-radius: 11px;
    background: rgba(242, 187, 75, 0.07);
    color: var(--text-secondary);
    font-size: 0.82rem;
    line-height: 1.6;
}

.accounting-disclaimer strong {
    color: #ffd47b;
}

.accounting-summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
    margin-bottom: 18px;
}

.accounting-summary-card {
    position: relative;
    overflow: hidden;
    min-height: 155px;
    padding: 22px;
    border: 1px solid var(--border-primary);
    border-radius: 15px;
    background: linear-gradient(
            145deg,
            rgba(22, 52, 87, 0.96),
            rgba(10, 29, 51, 0.98)
        );
}

.accounting-summary-card::before {
    position: absolute;
    inset: 0 auto 0 0;
    width: 3px;
    background: var(--blue-secondary);
    content: "";
}

.accounting-summary-card.methane::before {
    background: var(--green-primary);
}

.accounting-summary-card.carbon::before {
    background: #9f87ff;
}

.accounting-summary-card.credits::before {
    background: var(--amber-primary);
}

.accounting-summary-card span {
    display: block;
    color: var(--text-secondary);
    font-size: 0.73rem;
    font-weight: 800;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.accounting-summary-card strong {
    display: block;
    margin: 16px 0 9px;
    font-size: clamp(1.65rem, 3vw, 2.3rem);
    line-height: 1;
}

.accounting-summary-card small {
    color: var(--text-muted);
}

.accounting-secondary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
    margin-bottom: 25px;
}

.accounting-secondary-card {
    padding: 17px 19px;
    border: 1px solid var(--border-primary);
    border-radius: 12px;
    background: var(--background-card-dark);
}

.accounting-secondary-card span,
.accounting-secondary-card strong {
    display: block;
}

.accounting-secondary-card span {
    margin-bottom: 8px;
    color: var(--text-muted);
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.accounting-secondary-card strong {
    font-size: 1rem;
}

.accounting-section {
    margin-top: 24px;
}

.accounting-section-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 13px;
}

.accounting-section-header span {
    color: var(--blue-secondary);
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.09em;
}

.accounting-section-header h2 {
    margin: 5px 0 0;
    font-size: 1.32rem;
}

.accounting-module-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
}

.accounting-module-card {
    display: flex;
    flex-direction: column;
    min-height: 285px;
    padding: 21px;
    border: 1px solid var(--border-primary);
    border-radius: 15px;
    background: var(--background-card);
    color: inherit;
    text-decoration: none;
    transition: transform 150ms ease,
        border-color 150ms ease,
        background 150ms ease;
}

.accounting-module-card:hover {
    transform: translateY(-3px);
    border-color: var(--border-hover);
    background: #122d4e;
    color: inherit;
}

.accounting-module-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.accounting-module-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 43px;
    height: 43px;
    border-radius: 11px;
    background: rgba(54, 124, 232, 0.14);
    color: #86b8ff;
    font-size: 1.1rem;
    font-weight: 800;
}

.accounting-module-card h3 {
    margin: 20px 0 9px;
    font-size: 1.06rem;
}

.accounting-module-card p {
    min-height: 67px;
    margin: 0;
    color: var(--text-muted);
    font-size: 0.8rem;
    line-height: 1.6;
}

.accounting-module-metric {
    margin-top: auto;
    padding-top: 16px;
    border-top: 1px solid var(--border-primary);
}

.accounting-module-metric span,
.accounting-module-metric strong {
    display: block;
}

.accounting-module-metric span {
    margin-bottom: 5px;
    color: var(--text-muted);
    font-size: 0.67rem;
    text-transform: uppercase;
}

.accounting-module-metric strong {
    font-size: 0.95rem;
}

.accounting-module-link {
    margin-top: 16px;
    color: #83b3ff;
    font-size: 0.75rem;
    font-weight: 750;
}

.accounting-status-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 27px;
    padding: 4px 9px;
    border: 1px solid var(--border-primary);
    border-radius: 999px;
    background: rgba(117, 139, 165, 0.1);
    color: var(--text-secondary);
    font-size: 0.63rem;
    font-weight: 850;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    white-space: nowrap;
}

.accounting-status-badge.healthy {
    border-color: rgba(84, 213, 170, 0.29);
    background: rgba(84, 213, 170, 0.1);
    color: #7ce4c0;
}

.accounting-status-badge.warning {
    border-color: rgba(242, 187, 75, 0.3);
    background: rgba(242, 187, 75, 0.1);
    color: #ffd47b;
}

.accounting-status-badge.critical {
    border-color: rgba(237, 106, 115, 0.32);
    background: rgba(237, 106, 115, 0.12);
    color: #ff9ba3;
}

.accounting-table-card {
    overflow: hidden;
    border: 1px solid var(--border-primary);
    border-radius: 15px;
    background: var(--background-card-dark);
}

.accounting-table-wrapper {
    overflow-x: auto;
}

.accounting-table {
    width: 100%;
    min-width: 1050px;
    border-collapse: collapse;
}

.accounting-table th,
.accounting-table td {
    padding: 16px 17px;
    border-bottom: 1px solid var(--border-primary);
    text-align: left;
    vertical-align: middle;
}

.accounting-table th {
    background: rgba(8, 27, 48, 0.74);
    color: var(--text-muted);
    font-size: 0.66rem;
    font-weight: 800;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.accounting-table td {
    color: var(--text-secondary);
    font-size: 0.78rem;
}

.accounting-table tbody tr:hover {
    background: rgba(52, 108, 187, 0.07);
}

.accounting-table tbody tr:last-child td {
    border-bottom: 0;
}

.accounting-table-asset {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.accounting-table-asset strong {
    color: var(--text-primary);
}

.accounting-table-asset span {
    color: var(--text-muted);
    font-size: 0.7rem;
}

.accounting-empty-state {
    padding: 55px 24px;
    text-align: center;
}

.accounting-empty-state h3 {
    margin: 0 0 8px;
}

.accounting-empty-state p {
    margin: 0;
    color: var(--text-muted);
}

@media (max-width: 1150px) {
    .accounting-summary-grid,
    .accounting-secondary-grid,
    .accounting-module-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 700px) {
    .accounting-page-header {
        flex-direction: column;
    }

    .accounting-header-status {
        width: 100%;
    }

    .accounting-summary-grid,
    .accounting-secondary-grid,
    .accounting-module-grid {
        grid-template-columns: 1fr;
    }
}

/*=========================================================
   DAILY CARBON
   =========================================================*/

.carbon-page {
    width: 100%;
    max-width: var(--page-width, 1480px);
    margin: 0 auto;
    padding: 0 24px 40px;
}

.carbon-page-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 22px;
}

.carbon-page-header h1 {
    margin: 7px 0 10px;
    font-size: clamp(2rem, 4vw, 3.3rem);
    line-height: 1.05;
}

.carbon-page-header p {
    max-width: 720px;
    margin: 0;
    color: var(--text-secondary);
    line-height: 1.6;
}

.carbon-back-button,
.carbon-clear-button,
.carbon-filter-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 42px;
    padding: 0 17px;
    border: 1px solid var(--border-primary);
    border-radius: 9px;
    font-size: 0.76rem;
    font-weight: 750;
    text-decoration: none;
    white-space: nowrap;
    transition: transform 160ms ease,
        border-color 160ms ease,
        background 160ms ease,
        box-shadow 160ms ease;
}

.carbon-back-button,
.carbon-clear-button {
    background: rgba(18, 44, 74, 0.72);
    color: var(--text-secondary);
}

.carbon-back-button:hover,
.carbon-clear-button:hover {
    transform: translateY(-1px);
    border-color: rgba(85, 160, 255, 0.42);
    background: rgba(24, 57, 94, 0.92);
    color: var(--text-primary);
}

/*=========================================================
   CARBON FILTER TOOLBAR
   =========================================================*/

.carbon-filter-card {
    margin-bottom: 20px;
    padding: 0;
    overflow: hidden;
    border: 1px solid var(--border-primary);
    border-radius: 15px;
    background: linear-gradient(
            145deg,
            rgba(13, 37, 64, 0.96),
            rgba(8, 27, 48, 0.96)
        );
    box-shadow: 0 14px 32px rgba(2, 12, 24, 0.14);
}

.carbon-filter-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 16px 19px;
    border-bottom: 1px solid var(--border-primary);
    background: rgba(8, 27, 48, 0.46);
}

.carbon-filter-header span {
    display: block;
    color: var(--blue-secondary);
    font-size: 0.64rem;
    font-weight: 850;
    letter-spacing: 0.1em;
}

.carbon-filter-header h2 {
    margin: 4px 0 0;
    color: var(--text-primary);
    font-size: 1rem;
    font-weight: 760;
}

.carbon-filter-reset {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: 0 12px;
    border: 1px solid rgba(148, 163, 184, 0.18);
    border-radius: 8px;
    background: rgba(18, 44, 74, 0.48);
    color: var(--text-muted);
    font-size: 0.7rem;
    font-weight: 800;
    text-decoration: none;
    transition: border-color 160ms ease,
        background 160ms ease,
        color 160ms ease;
}

.carbon-filter-reset:hover {
    border-color: rgba(85, 160, 255, 0.38);
    background: rgba(24, 57, 94, 0.82);
    color: var(--text-primary);
}

.carbon-filter-grid {
    display: grid;
    grid-template-columns: minmax(210px, 1.3fr)
        minmax(170px, 0.9fr)
        minmax(170px, 0.9fr)
        auto;
    gap: 14px;
    align-items: end;
    padding: 18px 19px 19px;
}

.carbon-filter-field {
    display: flex;
    flex-direction: column;
    gap: 7px;
    min-width: 0;
}

.carbon-filter-field label {
    color: var(--text-muted);
    font-size: 0.65rem;
    font-weight: 850;
    letter-spacing: 0.075em;
    text-transform: uppercase;
}

.carbon-filter-control {
    display: flex;
    align-items: center;
    min-height: 46px;
    overflow: hidden;
    border: 1px solid rgba(148, 163, 184, 0.2);
    border-radius: 10px;
    background: #0a223b;
    transition: border-color 160ms ease,
        box-shadow 160ms ease,
        background 160ms ease;
}

.carbon-filter-control:hover {
    border-color: rgba(96, 165, 250, 0.34);
    background: #0c2744;
}

.carbon-filter-control:focus-within {
    border-color: rgba(96, 165, 250, 0.7);
    background: #0c2948;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.12);
}

.carbon-filter-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    min-width: 42px;
    align-self: stretch;
    border-right: 1px solid rgba(148, 163, 184, 0.13);
    color: #69a9f5;
    font-size: 0.85rem;
}

.carbon-filter-control select,
.carbon-filter-control input {
    width: 100%;
    min-width: 0;
    min-height: 44px;
    padding: 0 13px;
    border: 0;
    outline: 0;
    background: transparent;
    color: #e7edf5;
    font-family: Inter,
        "Segoe UI",
        Arial,
        sans-serif;
    font-size: 0.82rem;
    font-weight: 600;
    letter-spacing: 0;
}

/*Dark native dropdown*/

.carbon-filter-control select {
    appearance: none;
    -webkit-appearance: none;
    color-scheme: dark;
    padding-right: 42px;
    background-color: #0a223b;
    background-image: linear-gradient(
            45deg,
            transparent 50%,
            #8fb4da 50%
        ),
        linear-gradient(
            135deg,
            #8fb4da 50%,
            transparent 50%
        );
    background-position: calc(100% - 18px) 20px,
        calc(100% - 13px) 20px;
    background-size: 5px 5px;
    background-repeat: no-repeat;
    color: #e7edf5;
    cursor: pointer;
}

/*Open dropdown options*/

.carbon-filter-control select option {
    background-color: #0b2139;
    color: #e7edf5;
    font-family: "Segoe UI", Arial, sans-serif;
    font-size: 0.84rem;
    font-weight: 500;
}

/*Selected and hovered options*/

.carbon-filter-control select option:checked {
    background-color: #1d4f82;
    color: #ffffff;
}

.carbon-filter-control select:focus {
    background-color: #0c2948;
    color: #ffffff;
}

.carbon-filter-control {
    color-scheme: dark;
}

.carbon-filter-actions {
    display: flex;
    align-items: flex-end;
}

.carbon-filter-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 44px;
    padding: 0 19px;
    border: 1px solid rgba(96, 165, 250, 0.48);
    border-radius: 9px;
    background: linear-gradient(
            135deg,
            var(--blue-primary),
            #1d4ed8
        );
    box-shadow: 0 9px 20px rgba(29, 78, 216, 0.19);
    color: #ffffff;
    font-size: 0.74rem;
    font-weight: 850;
    white-space: nowrap;
    cursor: pointer;
    transition: transform 160ms ease,
        border-color 160ms ease,
        box-shadow 160ms ease;
}

.carbon-filter-button:hover {
    transform: translateY(-1px);
    border-color: rgba(147, 197, 253, 0.74);
    box-shadow: 0 12px 24px rgba(29, 78, 216, 0.27);
}

.carbon-filter-button:active {
    transform: translateY(0);
}

.carbon-summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    margin-bottom: 14px;
}

.carbon-summary-card {
    position: relative;
    overflow: hidden;
    min-width: 0;
    min-height: 126px;
    padding: 18px;
    border: 1px solid var(--border-primary);
    border-radius: 14px;
    background: var(--background-card);
}

.carbon-summary-card::before {
    position: absolute;
    inset: 0 auto 0 0;
    width: 3px;
    background: var(--blue-secondary);
    content: "";
}

.carbon-summary-card.methane::before {
    background: var(--green-primary);
}

.carbon-summary-card.co2::before {
    background: #9f87ff;
}

.carbon-summary-card.credits::before {
    background: var(--amber-primary);
}

.carbon-summary-card span,
.carbon-summary-card strong,
.carbon-summary-card small {
    display: block;
}

.carbon-summary-card span {
    overflow: hidden;
    color: var(--text-muted);
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.035em;
    text-overflow: ellipsis;
    text-transform: uppercase;
    white-space: nowrap;
}

.carbon-summary-card strong {
    margin: 12px 0 6px;
    color: var(--text-primary);
    font-size: clamp(1.35rem, 2vw, 1.75rem);
    line-height: 1.1;
    font-variant-numeric: tabular-nums;
}

.carbon-summary-card small {
    color: var(--text-muted);
    font-size: 0.72rem;
    line-height: 1.4;
}

.carbon-quality-card {
    display: flex;
    align-items: center;
    gap: 13px;
    margin-bottom: 18px;
    padding: 14px 17px;
    border: 1px solid var(--border-primary);
    border-radius: 11px;
    background: var(--background-card-dark);
}

.carbon-quality-card span {
    color: var(--text-muted);
    font-size: 0.7rem;
    font-weight: 800;
    text-transform: uppercase;
}

.carbon-quality-card strong {
    color: var(--text-primary);
    font-size: 1rem;
    font-variant-numeric: tabular-nums;
}

.carbon-quality-card small {
    color: var(--text-muted);
}

.carbon-table-card {
    width: 100%;
    overflow: hidden;
    border: 1px solid var(--border-primary);
    border-radius: 15px;
    background: var(--background-card-dark);
}

.carbon-table-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 18px 20px;
    border-bottom: 1px solid var(--border-primary);
}

.carbon-table-header span {
    color: var(--blue-secondary);
    font-size: 0.65rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.carbon-table-header h2 {
    margin: 5px 0 0;
    font-size: 1.15rem;
}

.carbon-table-wrapper {
    width: 100%;
    overflow-x: auto;
    scrollbar-width: thin;
    scrollbar-color: rgba(85, 160, 255, 0.35)
        transparent;
}

.carbon-table-wrapper::-webkit-scrollbar {
    height: 9px;
}

.carbon-table-wrapper::-webkit-scrollbar-track {
    background: transparent;
}

.carbon-table-wrapper::-webkit-scrollbar-thumb {
    border: 2px solid transparent;
    border-radius: 999px;
    background: rgba(85, 160, 255, 0.32)
        padding-box;
}

.carbon-table {
    width: 100%;
    min-width: 1180px;
    border-collapse: collapse;
    table-layout: auto;
}

.carbon-table th,
.carbon-table td {
    padding: 12px 11px;
    border-bottom: 1px solid var(--border-primary);
    vertical-align: middle;
    white-space: nowrap;
}

.carbon-table th {
    background: rgba(8, 27, 48, 0.82);
    color: var(--text-muted);
    font-size: 0.6rem;
    font-weight: 800;
    letter-spacing: 0.045em;
    text-align: left;
    text-transform: uppercase;
}

.carbon-table td {
    color: var(--text-secondary);
    font-size: 0.72rem;
    font-variant-numeric: tabular-nums;
}

.carbon-table tbody tr {
    transition: background 150ms ease;
}

.carbon-table tbody tr:hover {
    background: rgba(52, 108, 187, 0.07);
}

.carbon-table tbody tr:last-child td {
    border-bottom: 0;
}

.carbon-table th.numeric-column,
.carbon-table td.numeric-column {
    text-align: right;
}

.carbon-date-column {
    width: 108px;
}

.carbon-tank-column {
    min-width: 145px;
}

.carbon-net-value {
    color: var(--text-primary) !important;
    font-weight: 800;
}

.carbon-table-unit {
    margin-left: 3px;
    color: var(--text-muted);
    font-size: 0.6rem;
}

.carbon-table-asset {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.carbon-table-asset strong {
    color: var(--text-primary);
    font-size: 0.74rem;
}

.carbon-table-asset span {
    color: var(--text-muted);
    font-size: 0.65rem;
}

.carbon-status-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 25px;
    padding: 4px 8px;
    border: 1px solid var(--border-primary);
    border-radius: 999px;
    font-size: 0.59rem;
    font-weight: 800;
    letter-spacing: 0.025em;
    text-transform: uppercase;
}

.carbon-status-badge.healthy {
    border-color: rgba(84, 213, 170, 0.3);
    background: rgba(84, 213, 170, 0.1);
    color: #7ce4c0;
}

.carbon-status-badge.warning {
    border-color: rgba(242, 187, 75, 0.3);
    background: rgba(242, 187, 75, 0.1);
    color: #ffd47b;
}

.carbon-status-badge.critical {
    border-color: rgba(237, 106, 115, 0.3);
    background: rgba(237, 106, 115, 0.1);
    color: #ff9ba3;
}

.carbon-empty-state {
    padding: 50px 24px;
    text-align: center;
}

.carbon-empty-state p {
    margin: 0;
    color: var(--text-muted);
}

@media (max-width: 1050px) {
    .carbon-filter-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .carbon-filter-actions {
        grid-column: 2;
        justify-content: flex-end;
    }
}

@media (max-width: 700px) {
    .carbon-filter-header {
        align-items: flex-start;
    }

    .carbon-filter-grid {
        grid-template-columns: 1fr;
        padding: 16px;
    }

    .carbon-filter-actions {
        grid-column: auto;
    }

    .carbon-filter-button {
        width: 100%;
    }
}

/*=========================================================
   CARBON FACTORS
   =========================================================*/

.factor-page {
    width: min(100%, var(--page-width));
    margin: 0 auto;
}

.factor-page-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 22px;
}

.factor-page-header h1 {
    margin: 7px 0 10px;
    font-size: clamp(2rem, 4vw, 3.3rem);
}

.factor-page-header p {
    max-width: 730px;
    margin: 0;
    color: var(--text-secondary);
    line-height: 1.65;
}

.factor-header-actions {
    display: flex;
    gap: 10px;
}

.factor-secondary-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 0 16px;
    border: 1px solid var(--border-primary);
    border-radius: 9px;
    background: rgba(18, 44, 74, 0.72);
    color: var(--text-secondary);
    font-weight: 750;
    text-decoration: none;
}

.factor-secondary-button:hover {
    border-color: var(--border-hover);
    color: var(--text-primary);
}

.factor-notice {
    margin-bottom: 20px;
    padding: 14px 17px;
    border: 1px solid rgba(242, 187, 75, 0.23);
    border-radius: 11px;
    background: rgba(242, 187, 75, 0.07);
    color: var(--text-secondary);
    font-size: 0.82rem;
    line-height: 1.6;
}

.factor-notice strong {
    color: #ffd47b;
}

.factor-summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 17px;
    margin-bottom: 22px;
}

.factor-summary-card {
    padding: 20px;
    border: 1px solid var(--border-primary);
    border-radius: 13px;
    background: var(--background-card);
}

.factor-summary-card.active {
    border-color: rgba(84, 213, 170, 0.25);
}

.factor-summary-card span,
.factor-summary-card strong {
    display: block;
}

.factor-summary-card span {
    color: var(--text-muted);
    font-size: 0.69rem;
    font-weight: 800;
    letter-spacing: 0.07em;
    text-transform: uppercase;
}

.factor-summary-card strong {
    margin-top: 12px;
    font-size: 1.8rem;
}

.factor-table-card {
    overflow: hidden;
    border: 1px solid var(--border-primary);
    border-radius: 15px;
    background: var(--background-card-dark);
}

.factor-table-header {
    padding: 21px 23px;
    border-bottom: 1px solid var(--border-primary);
}

.factor-table-header span {
    color: var(--blue-secondary);
    font-size: 0.67rem;
    font-weight: 800;
    letter-spacing: 0.08em;
}

.factor-table-header h2 {
    margin: 5px 0 0;
    font-size: 1.25rem;
}

.factor-table-wrapper {
    overflow-x: auto;
}

.factor-table {
    width: 100%;
    min-width: 1750px;
    border-collapse: collapse;
}

.factor-table th,
.factor-table td {
    padding: 15px;
    border-bottom: 1px solid var(--border-primary);
    text-align: left;
    vertical-align: middle;
    white-space: nowrap;
}

.factor-table th {
    background: rgba(8, 27, 48, 0.75);
    color: var(--text-muted);
    font-size: 0.64rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.factor-table td {
    color: var(--text-secondary);
    font-size: 0.76rem;
}

.factor-table td small {
    margin-left: 4px;
    color: var(--text-muted);
}

.factor-table tbody tr:hover {
    background: rgba(52, 108, 187, 0.07);
}

.factor-table tbody tr:last-child td {
    border-bottom: 0;
}

.factor-version-cell {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.factor-version-cell strong {
    color: var(--text-primary);
}

.factor-version-cell span {
    color: var(--text-muted);
    font-size: 0.67rem;
}

.factor-status-badge {
    display: inline-flex;
    padding: 5px 9px;
    border: 1px solid var(--border-primary);
    border-radius: 999px;
    color: var(--text-secondary);
    font-size: 0.62rem;
    font-weight: 800;
    text-transform: uppercase;
}

.factor-status-badge.healthy {
    border-color: rgba(84, 213, 170, 0.3);
    background: rgba(84, 213, 170, 0.1);
    color: #7ce4c0;
}

.factor-empty-state {
    padding: 55px 24px;
    text-align: center;
}

.factor-empty-state p {
    color: var(--text-muted);
}

.factor-explanation-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 17px;
    margin-top: 22px;
}

.factor-explanation-card {
    padding: 19px;
    border: 1px solid var(--border-primary);
    border-radius: 13px;
    background: var(--background-card);
}

.factor-explanation-card span {
    color: var(--blue-secondary);
    font-size: 0.66rem;
    font-weight: 800;
    letter-spacing: 0.08em;
}

.factor-explanation-card h3 {
    margin: 9px 0 8px;
    font-size: 0.98rem;
}

.factor-explanation-card p {
    margin: 0;
    color: var(--text-muted);
    font-size: 0.77rem;
    line-height: 1.6;
}

@media (max-width: 1100px) {
    .factor-summary-grid,
    .factor-explanation-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 700px) {
    .factor-page-header {
        flex-direction: column;
    }

    .workspace-primary-action,
    .workspace-secondary-action {
        width: 100%;
    }

    .workspace-breadcrumb {
        gap: 6px;
        margin-bottom: 18px;
    }
}

/*=========================================================
   WORKSPACE BREADCRUMB
   =========================================================*/

.workspace-breadcrumb {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 22px;
    color: var(--text-muted);
    font-size: 0.76rem;
    font-weight: 700;
}

.workspace-breadcrumb a {
    color: var(--text-muted);
    text-decoration: none;
    transition: color 160ms ease,
        background 160ms ease;
}

.workspace-breadcrumb a:hover {
    color: var(--blue-secondary);
}

.workspace-breadcrumb-separator {
    color: rgba(148, 163, 184, 0.45);
    font-size: 1rem;
    line-height: 1;
}

.workspace-breadcrumb-current {
    color: var(--text-primary);
}

.workspace-primary-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 44px;
    padding: 0 18px;
    border: 1px solid rgba(96, 165, 250, 0.38);
    border-radius: 10px;
    background: linear-gradient(
            135deg,
            rgba(37, 99, 235, 0.96),
            rgba(29, 78, 216, 0.96)
        );
    box-shadow: 0 10px 24px rgba(15, 64, 145, 0.18);
    color: #ffffff;
    font-size: 0.78rem;
    font-weight: 800;
    text-decoration: none;
    white-space: nowrap;
    transition: transform 160ms ease,
        border-color 160ms ease,
        box-shadow 160ms ease;
}

.workspace-primary-action:hover {
    transform: translateY(-1px);
    border-color: rgba(147, 197, 253, 0.7);
    box-shadow: 0 13px 28px rgba(15, 64, 145, 0.27);
    color: #ffffff;
}

.workspace-primary-action:active {
    transform: translateY(0);
}

.workspace-secondary-action {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 10px;
min-height: 44px;
padding: 0 18px;
border: 1px solid var(--border-primary);
border-radius: 10px;
background: rgba(18, 44, 74, 0.72);
color: var(--text-secondary);
font-size: 0.76rem;
font-weight: 750;
text-decoration: none;
transition:
transform 160ms ease,
border-color 160ms ease,
background 160ms ease,
color 160ms ease,
box-shadow 160ms ease;
}

.workspace-secondary-action:hover {
transform: translateY(-1px);
border-color: rgba(96, 165, 250, 0.42);
background: rgba(24, 57, 94, 0.92);
color: var(--text-primary);
box-shadow: 0 10px 22px rgba(2, 12, 24, 0.18);
}

.workspace-secondary-action:active {
transform: translateY(0);
}


/* =========================================================
CARBON DATA QUALITY
========================================================= */

.data-quality-page {
min-height: calc(100vh - var(--topbar-height));
padding: 32px 30px 70px;
}

.data-quality-page-container {
width: min(100%, var(--page-width));
margin: 0 auto;
}

/* =========================================================
HEADER
========================================================= */

.data-quality-header {
display: flex;
align-items: flex-start;
justify-content: space-between;
gap: 30px;
margin: 24px 0 26px;
}

.data-quality-header-content {
max-width: 820px;
}

.data-quality-eyebrow {
color: var(--blue-secondary);
font-size: 0.68rem;
font-weight: 850;
letter-spacing: 0.1em;
text-transform: uppercase;
}

.data-quality-header h1 {
margin: 8px 0 11px;
color: var(--text-primary);
font-size: clamp(2.2rem, 4vw, 3.3rem);
line-height: 1.05;
letter-spacing: -0.04em;
}

.data-quality-header p {
max-width: 760px;
margin: 0;
color: var(--text-secondary);
line-height: 1.65;
}

.data-quality-header-actions {
display: flex;
flex-direction: column;
align-items: flex-end;
gap: 12px;
flex-shrink: 0;
}

.data-quality-readiness-badge,
.data-quality-status-badge {
display: inline-flex;
align-items: center;
gap: 8px;
width: fit-content;
border: 1px solid var(--border-primary);
border-radius: 999px;
font-weight: 800;
letter-spacing: 0.025em;
text-transform: uppercase;
}

.data-quality-readiness-badge {
min-height: 32px;
padding: 0 12px;
font-size: 0.66rem;
}

.data-quality-status-badge {
min-height: 27px;
padding: 0 10px;
font-size: 0.61rem;
}

.data-quality-readiness-badge > span,
.data-quality-status-badge > span {
display: block;
width: 7px;
height: 7px;
flex-shrink: 0;
border-radius: 50%;
background: currentColor;
}

.data-quality-back-button {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 8px;
min-height: 42px;
padding: 0 16px;
border: 1px solid var(--border-primary);
border-radius: 9px;
background: rgba(18, 44, 74, 0.72);
color: var(--text-secondary);
font-size: 0.72rem;
font-weight: 750;
text-decoration: none;
transition:
transform 160ms ease,
border-color 160ms ease,
background 160ms ease,
color 160ms ease;
}

.data-quality-back-button:hover {
transform: translateY(-1px);
border-color: rgba(85, 160, 255, 0.42);
background: rgba(24, 57, 94, 0.92);
color: var(--text-primary);
}

/* =========================================================
STATUS COLORS
========================================================= */

.data-quality-status-healthy {
border-color: rgba(84, 213, 170, 0.3);
background: rgba(84, 213, 170, 0.1);
color: #7ce4c0;
}

.data-quality-status-good {
border-color: rgba(85, 160, 255, 0.3);
background: rgba(85, 160, 255, 0.1);
color: #8fc1ff;
}

.data-quality-status-warning {
border-color: rgba(242, 187, 75, 0.3);
background: rgba(242, 187, 75, 0.1);
color: #ffd47b;
}

.data-quality-status-critical {
border-color: rgba(237, 106, 115, 0.32);
background: rgba(237, 106, 115, 0.1);
color: #ff9ba3;
}

.data-quality-status-neutral {
border-color: var(--border-primary);
background: rgba(139, 174, 218, 0.07);
color: var(--text-muted);
}

.data-quality-text-healthy {
color: var(--green-primary) !important;
}

.data-quality-text-warning {
color: var(--amber-primary) !important;
}

.data-quality-value-warning,
.data-quality-table-warning {
color: var(--amber-primary) !important;
}

/* =========================================================
SUMMARY CARDS
========================================================= */

.data-quality-summary-grid {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 17px;
margin-bottom: 20px;
}

.data-quality-summary-card {
position: relative;
overflow: hidden;
min-height: 155px;
padding: 21px;
border: 1px solid var(--border-primary);
border-radius: 14px;
background:
linear-gradient(
145deg,
rgba(15, 39, 67, 0.94),
rgba(8, 27, 47, 0.94)
);
}

.data-quality-summary-card::before {
position: absolute;
inset: 0 auto 0 0;
width: 3px;
background: var(--blue-secondary);
content: "";
}

.data-quality-summary-card:nth-child(2)::before {
background: var(--amber-primary);
}

.data-quality-summary-card:nth-child(3)::before {
background: var(--red-primary);
}

.data-quality-summary-card:nth-child(4)::before {
background: var(--green-primary);
}

.data-quality-summary-card > span,
.data-quality-summary-card > strong,
.data-quality-summary-card > small {
display: block;
}

.data-quality-summary-card > span {
color: var(--text-muted);
font-size: 0.68rem;
font-weight: 800;
letter-spacing: 0.045em;
text-transform: uppercase;
}

.data-quality-summary-card > strong {
margin: 15px 0 7px;
color: var(--text-primary);
font-size: 1.85rem;
line-height: 1;
}

.data-quality-summary-card > small {
color: var(--text-muted);
font-size: 0.68rem;
line-height: 1.45;
}

.data-quality-summary-progress {
height: 5px;
margin-top: 15px;
overflow: hidden;
border-radius: 999px;
background: rgba(139, 174, 218, 0.13);
}

.data-quality-summary-progress > span {
display: block;
height: 100%;
border-radius: inherit;
background:
linear-gradient(
90deg,
var(--blue-primary),
var(--green-primary)
);
}

/* =========================================================
SHARED PANELS
========================================================= */

.data-quality-overview-grid {
display: grid;
grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
gap: 18px;
margin-bottom: 20px;
}

.data-quality-score-panel,
.data-quality-readiness-panel,
.data-quality-validation-panel,
.data-quality-issues-panel {
overflow: hidden;
border: 1px solid var(--border-primary);
border-radius: 15px;
background:
linear-gradient(
145deg,
rgba(13, 37, 64, 0.94),
rgba(7, 25, 44, 0.96)
);
}

.data-quality-validation-panel,
.data-quality-issues-panel {
margin-bottom: 20px;
}

.data-quality-panel-header {
display: flex;
align-items: center;
justify-content: space-between;
gap: 20px;
padding: 20px 22px;
border-bottom: 1px solid var(--border-primary);
background: rgba(7, 25, 44, 0.38);
}

.data-quality-panel-header > div > span {
color: var(--blue-secondary);
font-size: 0.64rem;
font-weight: 850;
letter-spacing: 0.09em;
}

.data-quality-panel-header h2 {
margin: 5px 0 0;
color: var(--text-primary);
font-size: 1.15rem;
}

.data-quality-panel-header > small {
color: var(--text-muted);
font-size: 0.68rem;
}

/* =========================================================
QUALITY SCORE PANEL
========================================================= */

.data-quality-score-content {
display: grid;
grid-template-columns: 190px minmax(0, 1fr);
align-items: center;
gap: 28px;
padding: 26px;
}

.data-quality-score-ring {
position: relative;
display: flex;
align-items: center;
justify-content: center;
width: 172px;
height: 172px;
border: 13px solid rgba(139, 174, 218, 0.12);
border-radius: 50%;
background: rgba(5, 21, 37, 0.52);
}

.data-quality-score-ring::before {
position: absolute;
inset: -13px;
border: 13px solid transparent;
border-top-color: currentColor;
border-right-color: currentColor;
border-radius: 50%;
content: "";
transform: rotate(25deg);
}

.data-quality-score-ring > div {
position: relative;
z-index: 1;
text-align: center;
}

.data-quality-score-ring strong,
.data-quality-score-ring span {
display: block;
}

.data-quality-score-ring strong {
color: var(--text-primary);
font-size: 1.65rem;
}

.data-quality-score-ring span {
margin-top: 6px;
color: currentColor;
font-size: 0.68rem;
font-weight: 800;
text-transform: uppercase;
}

.data-quality-score-healthy {
color: var(--green-primary);
}

.data-quality-score-good {
color: var(--blue-secondary);
}

.data-quality-score-warning {
color: var(--amber-primary);
}

.data-quality-score-critical {
color: var(--red-primary);
}

.data-quality-score-details {
display: flex;
flex-direction: column;
}

.data-quality-score-row {
display: flex;
align-items: center;
justify-content: space-between;
gap: 18px;
min-height: 47px;
border-bottom: 1px solid rgba(139, 174, 218, 0.1);
}

.data-quality-score-row:last-child {
border-bottom: 0;
}

.data-quality-score-row span {
color: var(--text-muted);
font-size: 0.7rem;
}

.data-quality-score-row strong {
color: var(--text-primary);
font-size: 0.72rem;
text-align: right;
}

/* =========================================================
REGISTRY READINESS PANEL
========================================================= */

.data-quality-readiness-list {
padding: 10px 22px;
}

.data-quality-readiness-row {
display: grid;
grid-template-columns: 35px minmax(0, 1fr);
align-items: center;
gap: 13px;
padding: 13px 0;
border-bottom: 1px solid rgba(139, 174, 218, 0.09);
}

.data-quality-readiness-row:last-child {
border-bottom: 0;
}

.data-quality-readiness-icon {
display: inline-flex;
align-items: center;
justify-content: center;
width: 31px;
height: 31px;
border: 1px solid var(--border-primary);
border-radius: 50%;
font-size: 0.72rem;
font-weight: 900;
}

.data-quality-readiness-icon.healthy {
border-color: rgba(84, 213, 170, 0.3);
background: rgba(84, 213, 170, 0.1);
color: var(--green-primary);
}

.data-quality-readiness-icon.warning {
border-color: rgba(242, 187, 75, 0.3);
background: rgba(242, 187, 75, 0.1);
color: var(--amber-primary);
}

.data-quality-readiness-row strong,
.data-quality-readiness-row small {
display: block;
}

.data-quality-readiness-row strong {
color: var(--text-primary);
font-size: 0.74rem;
}

.data-quality-readiness-row small {
margin-top: 4px;
color: var(--text-muted);
font-size: 0.66rem;
line-height: 1.4;
}

.data-quality-readiness-footer {
display: flex;
align-items: center;
justify-content: center;
gap: 9px;
min-height: 51px;
border-top: 1px solid var(--border-primary);
font-size: 0.7rem;
text-transform: uppercase;
}

.data-quality-readiness-footer > span {
width: 7px;
height: 7px;
border-radius: 50%;
background: currentColor;
}

.data-quality-readiness-footer-healthy {
background: rgba(84, 213, 170, 0.08);
color: var(--green-primary);
}

.data-quality-readiness-footer-warning {
background: rgba(242, 187, 75, 0.08);
color: var(--amber-primary);
}

/* =========================================================
VALIDATION TABLE
========================================================= */

.data-quality-table-wrapper {
overflow-x: auto;
}

.data-quality-table {
width: 100%;
min-width: 1020px;
border-collapse: collapse;
}

.data-quality-table th,
.data-quality-table td {
padding: 15px 17px;
border-bottom: 1px solid var(--border-primary);
text-align: left;
vertical-align: middle;
}

.data-quality-table th {
background: rgba(6, 23, 40, 0.72);
color: var(--text-muted);
font-size: 0.62rem;
font-weight: 850;
letter-spacing: 0.06em;
text-transform: uppercase;
}

.data-quality-table td {
color: var(--text-secondary);
font-size: 0.72rem;
}

.data-quality-table tbody tr:last-child td {
border-bottom: 0;
}

.data-quality-table tbody tr:hover {
background: rgba(52, 108, 187, 0.07);
}

.data-quality-validation-name {
display: flex;
flex-direction: column;
min-width: 280px;
max-width: 420px;
}

.data-quality-validation-name > span {
color: var(--blue-secondary);
font-size: 0.59rem;
font-weight: 800;
letter-spacing: 0.05em;
text-transform: uppercase;
}

.data-quality-validation-name strong {
margin-top: 5px;
color: var(--text-primary);
font-size: 0.75rem;
}

.data-quality-validation-name small {
margin-top: 5px;
color: var(--text-muted);
font-size: 0.65rem;
line-height: 1.4;
}

.data-quality-score-cell {
min-width: 120px;
}

.data-quality-score-cell strong {
color: var(--text-primary);
font-size: 0.72rem;
}

.data-quality-table-progress {
width: 100%;
height: 4px;
margin-top: 7px;
overflow: hidden;
border-radius: 999px;
background: rgba(139, 174, 218, 0.13);
}

.data-quality-table-progress > span {
display: block;
height: 100%;
border-radius: inherit;
background: var(--green-primary);
}

/* =========================================================
QUALITY ISSUES
========================================================= */

.data-quality-issue-count {
display: inline-flex;
align-items: center;
min-height: 28px;
padding: 0 10px;
border: 1px solid var(--border-primary);
border-radius: 999px;
background: rgba(139, 174, 218, 0.07);
color: var(--text-muted);
font-size: 0.64rem;
font-weight: 800;
}

.data-quality-issue-list {
display: flex;
flex-direction: column;
}

.data-quality-issue-item {
display: grid;
grid-template-columns: 4px minmax(0, 1fr);
border-bottom: 1px solid var(--border-primary);
}

.data-quality-issue-item:last-child {
border-bottom: 0;
}

.data-quality-issue-indicator {
min-height: 100%;
}

.data-quality-issue-warning {
background: var(--amber-primary);
}

.data-quality-issue-critical {
background: var(--red-primary);
}

.data-quality-issue-content {
padding: 19px 22px;
}

.data-quality-issue-heading {
display: flex;
align-items: flex-start;
justify-content: space-between;
gap: 20px;
}

.data-quality-issue-heading > div > span,
.data-quality-issue-heading > div > strong {
display: block;
}

.data-quality-issue-heading > div > span {
color: var(--blue-secondary);
font-size: 0.6rem;
font-weight: 800;
letter-spacing: 0.05em;
text-transform: uppercase;
}

.data-quality-issue-heading > div > strong {
margin-top: 4px;
color: var(--text-primary);
font-size: 0.8rem;
}

.data-quality-issue-content > p {
margin: 12px 0;
color: var(--text-secondary);
font-size: 0.72rem;
line-height: 1.55;
}

.data-quality-issue-action {
padding: 12px 14px;
border: 1px solid rgba(139, 174, 218, 0.1);
border-radius: 9px;
background: rgba(4, 20, 35, 0.42);
}

.data-quality-issue-action span,
.data-quality-issue-action strong {
display: block;
}

.data-quality-issue-action span {
color: var(--text-muted);
font-size: 0.58rem;
font-weight: 800;
text-transform: uppercase;
}

.data-quality-issue-action strong {
margin-top: 5px;
color: var(--text-secondary);
font-size: 0.69rem;
line-height: 1.45;
}

.data-quality-issue-content > small {
display: block;
margin-top: 11px;
color: var(--text-muted);
font-size: 0.63rem;
}

/* =========================================================
EMPTY / SUCCESS STATES
========================================================= */

.data-quality-empty-state,
.data-quality-success-state {
padding: 48px 24px;
text-align: center;
}

.data-quality-empty-icon,
.data-quality-success-icon {
display: inline-flex;
align-items: center;
justify-content: center;
width: 48px;
height: 48px;
margin-bottom: 14px;
border-radius: 50%;
font-weight: 900;
}

.data-quality-empty-icon {
border: 1px solid var(--border-primary);
background: rgba(139, 174, 218, 0.08);
color: var(--text-muted);
}

.data-quality-empty-state h3 {
margin: 0;
color: var(--text-primary);
font-size: 1rem;
}

.data-quality-empty-state p {
max-width: 520px;
margin: 8px auto 0;
color: var(--text-muted);
font-size: 0.72rem;
line-height: 1.55;
}

.data-quality-success-state {
display: flex;
align-items: center;
justify-content: center;
gap: 16px;
text-align: left;
}

.data-quality-success-icon {
flex-shrink: 0;
margin: 0;
border: 1px solid rgba(84, 213, 170, 0.3);
background: rgba(84, 213, 170, 0.1);
color: var(--green-primary);
}

.data-quality-success-state strong {
color: var(--text-primary);
font-size: 0.82rem;
}

.data-quality-success-state p {
max-width: 620px;
margin: 5px 0 0;
color: var(--text-muted);
font-size: 0.7rem;
line-height: 1.5;
}

/* =========================================================
RESPONSIVE
========================================================= */

@media (max-width: 1180px) {
.data-quality-summary-grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
}

.data-quality-overview-grid {
    grid-template-columns: 1fr;
}

}

@media (max-width: 760px) {
.data-quality-page {
padding: 24px 18px 55px;
}

.data-quality-header {
    flex-direction: column;
}

.data-quality-header-actions {
    align-items: stretch;
    width: 100%;
}

.data-quality-back-button {
    width: 100%;
}

.data-quality-summary-grid {
    grid-template-columns: 1fr;
}

.data-quality-score-content {
    grid-template-columns: 1fr;
    justify-items: center;
}

.data-quality-score-details {
    width: 100%;
}

.data-quality-panel-header {
    align-items: flex-start;
    flex-direction: column;
}

.data-quality-issue-heading {
    flex-direction: column;
}

.data-quality-success-state {
    align-items: flex-start;
    flex-direction: column;
    text-align: left;
}

}
/* =========================================================
CALIBRATION HISTORY
========================================================= */

.calibration-page {
min-height: calc(100vh - var(--topbar-height));
padding: 32px 30px 70px;
}

.calibration-page-container {
width: min(100%, var(--page-width));
margin: 0 auto;
}

/* =========================================================
HEADER
========================================================= */

.calibration-header {
display: flex;
align-items: flex-start;
justify-content: space-between;
gap: 30px;
margin: 24px 0 26px;
}

.calibration-header-content {
max-width: 820px;
}

.calibration-eyebrow {
color: var(--blue-secondary);
font-size: 0.68rem;
font-weight: 850;
letter-spacing: 0.1em;
text-transform: uppercase;
}

.calibration-header h1 {
margin: 8px 0 11px;
color: var(--text-primary);
font-size: clamp(2.2rem, 4vw, 3.3rem);
line-height: 1.05;
letter-spacing: -0.04em;
}

.calibration-header p {
max-width: 760px;
margin: 0;
color: var(--text-secondary);
line-height: 1.65;
}

.calibration-header-actions {
display: flex;
align-items: center;
justify-content: flex-end;
gap: 12px;
flex-shrink: 0;
}

/* =========================================================
SUMMARY CARDS
========================================================= */

.calibration-summary-grid {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 17px;
margin-bottom: 20px;
}

.calibration-summary-card {
position: relative;
overflow: hidden;
min-height: 150px;
padding: 21px;
border: 1px solid var(--border-primary);
border-radius: 14px;
background:
linear-gradient(
145deg,
rgba(15, 39, 67, 0.94),
rgba(8, 27, 47, 0.94)
);
}

.calibration-summary-card::before {
position: absolute;
inset: 0 auto 0 0;
width: 3px;
background: var(--blue-secondary);
content: "";
}

.calibration-summary-card.current::before {
background: var(--green-primary);
}

.calibration-summary-card.due::before {
background: var(--amber-primary);
}

.calibration-summary-card.overdue::before {
background: var(--red-primary);
}

.calibration-summary-card > span,
.calibration-summary-card > strong,
.calibration-summary-card > small {
display: block;
}

.calibration-summary-card > span {
color: var(--text-muted);
font-size: 0.68rem;
font-weight: 800;
letter-spacing: 0.045em;
text-transform: uppercase;
}

.calibration-summary-card > strong {
margin: 16px 0 8px;
color: var(--text-primary);
font-size: 1.9rem;
line-height: 1;
}

.calibration-summary-card > small {
color: var(--text-muted);
font-size: 0.68rem;
line-height: 1.45;
}

/* =========================================================
SHARED PANELS
========================================================= */

.calibration-overview-grid {
display: grid;
grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
gap: 18px;
margin-bottom: 20px;
}

.calibration-coverage-panel,
.calibration-status-panel,
.calibration-history-panel {
overflow: hidden;
border: 1px solid var(--border-primary);
border-radius: 15px;
background:
linear-gradient(
145deg,
rgba(13, 37, 64, 0.94),
rgba(7, 25, 44, 0.96)
);
}

.calibration-history-panel {
margin-bottom: 20px;
}

.calibration-panel-header {
display: flex;
align-items: center;
justify-content: space-between;
gap: 20px;
padding: 20px 22px;
border-bottom: 1px solid var(--border-primary);
background: rgba(7, 25, 44, 0.38);
}

.calibration-panel-header > div > span {
color: var(--blue-secondary);
font-size: 0.64rem;
font-weight: 850;
letter-spacing: 0.09em;
}

.calibration-panel-header h2 {
margin: 5px 0 0;
color: var(--text-primary);
font-size: 1.15rem;
}

.calibration-panel-header > small {
color: var(--text-muted);
font-size: 0.68rem;
}

/* =========================================================
COVERAGE PANEL
========================================================= */

.calibration-coverage-content {
padding: 26px;
}

.calibration-coverage-value {
display: flex;
align-items: flex-end;
justify-content: space-between;
gap: 18px;
}

.calibration-coverage-value strong {
color: var(--text-primary);
font-size: 2rem;
line-height: 1;
}

.calibration-coverage-value span {
color: var(--text-muted);
font-size: 0.68rem;
font-weight: 750;
text-transform: uppercase;
}

.calibration-coverage-track {
height: 9px;
margin: 22px 0;
overflow: hidden;
border-radius: 999px;
background: rgba(139, 174, 218, 0.13);
}

.calibration-coverage-track > span {
display: block;
height: 100%;
border-radius: inherit;
background:
linear-gradient(
90deg,
var(--blue-primary),
var(--green-primary)
);
}

.calibration-coverage-details {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 13px;
}

.calibration-coverage-details > div {
padding: 14px;
border: 1px solid rgba(139, 174, 218, 0.11);
border-radius: 10px;
background: rgba(4, 20, 35, 0.42);
}

.calibration-coverage-details span,
.calibration-coverage-details strong {
display: block;
}

.calibration-coverage-details span {
color: var(--text-muted);
font-size: 0.61rem;
font-weight: 800;
letter-spacing: 0.04em;
text-transform: uppercase;
}

.calibration-coverage-details strong {
margin-top: 7px;
color: var(--text-primary);
font-size: 0.73rem;
line-height: 1.4;
}

/* =========================================================
STATUS PANEL
========================================================= */

.calibration-status-list {
padding: 10px 22px;
}

.calibration-status-row {
display: grid;
grid-template-columns: 35px minmax(0, 1fr);
align-items: center;
gap: 13px;
padding: 13px 0;
border-bottom: 1px solid rgba(139, 174, 218, 0.09);
}

.calibration-status-row:last-child {
border-bottom: 0;
}

.calibration-status-icon {
display: inline-flex;
align-items: center;
justify-content: center;
width: 31px;
height: 31px;
border: 1px solid var(--border-primary);
border-radius: 50%;
font-size: 0.72rem;
font-weight: 900;
}

.calibration-status-icon.healthy {
border-color: rgba(84, 213, 170, 0.3);
background: rgba(84, 213, 170, 0.1);
color: var(--green-primary);
}

.calibration-status-icon.warning {
border-color: rgba(242, 187, 75, 0.3);
background: rgba(242, 187, 75, 0.1);
color: var(--amber-primary);
}

.calibration-status-icon.critical {
border-color: rgba(237, 106, 115, 0.3);
background: rgba(237, 106, 115, 0.1);
color: var(--red-primary);
}

.calibration-status-row strong,
.calibration-status-row small {
display: block;
}

.calibration-status-row strong {
color: var(--text-primary);
font-size: 0.74rem;
}

.calibration-status-row small {
margin-top: 4px;
color: var(--text-muted);
font-size: 0.66rem;
line-height: 1.4;
}

/* =========================================================
TABLE
========================================================= */

.calibration-table-wrapper {
overflow-x: auto;
}

.calibration-table {
width: 100%;
min-width: 1450px;
border-collapse: collapse;
}

.calibration-table th,
.calibration-table td {
padding: 15px 17px;
border-bottom: 1px solid var(--border-primary);
text-align: left;
vertical-align: middle;
}

.calibration-table th {
background: rgba(6, 23, 40, 0.72);
color: var(--text-muted);
font-size: 0.62rem;
font-weight: 850;
letter-spacing: 0.06em;
text-transform: uppercase;
white-space: nowrap;
}

.calibration-table td {
color: var(--text-secondary);
font-size: 0.71rem;
white-space: nowrap;
}

.calibration-table tbody tr:hover:not(.calibration-notes-row) {
background: rgba(52, 108, 187, 0.07);
}

.calibration-equipment {
display: flex;
flex-direction: column;
min-width: 210px;
}

.calibration-equipment > span {
color: var(--blue-secondary);
font-size: 0.59rem;
font-weight: 800;
letter-spacing: 0.05em;
text-transform: uppercase;
}

.calibration-equipment strong {
margin-top: 5px;
color: var(--text-primary);
font-size: 0.75rem;
}

.calibration-equipment small {
margin-top: 4px;
color: var(--text-muted);
font-size: 0.64rem;
}

.calibration-date {
display: flex;
flex-direction: column;
}

.calibration-date strong {
color: var(--text-primary);
font-size: 0.71rem;
}

.calibration-date small {
margin-top: 4px;
color: var(--text-muted);
font-size: 0.63rem;
}

.calibration-accuracy-value {
color: var(--text-primary);
font-size: 0.72rem;
}

.calibration-certificate {
display: inline-flex;
align-items: center;
min-height: 27px;
padding: 0 9px;
border: 1px solid rgba(85, 160, 255, 0.2);
border-radius: 7px;
background: rgba(85, 160, 255, 0.07);
color: #9bc5ff;
font-size: 0.64rem;
font-weight: 700;
}

.calibration-result-badge,
.calibration-status-badge {
display: inline-flex;
align-items: center;
gap: 7px;
min-height: 27px;
padding: 0 10px;
border: 1px solid var(--border-primary);
border-radius: 999px;
font-size: 0.61rem;
font-weight: 800;
letter-spacing: 0.025em;
text-transform: uppercase;
}

.calibration-result-badge > span,
.calibration-status-badge > span {
display: block;
width: 6px;
height: 6px;
border-radius: 50%;
background: currentColor;
}

.calibration-status-healthy {
border-color: rgba(84, 213, 170, 0.3);
background: rgba(84, 213, 170, 0.1);
color: #7ce4c0;
}

.calibration-status-warning {
border-color: rgba(242, 187, 75, 0.3);
background: rgba(242, 187, 75, 0.1);
color: #ffd47b;
}

.calibration-status-critical {
border-color: rgba(237, 106, 115, 0.32);
background: rgba(237, 106, 115, 0.1);
color: #ff9ba3;
}

.calibration-status-neutral {
border-color: var(--border-primary);
background: rgba(139, 174, 218, 0.07);
color: var(--text-muted);
}

/* =========================================================
NOTES ROW
========================================================= */

.calibration-notes-row {
background: rgba(4, 20, 35, 0.42);
}

.calibration-notes-row td {
padding: 0;
}

.calibration-notes {
display: grid;
grid-template-columns: 90px minmax(0, 1fr);
gap: 18px;
padding: 13px 18px 15px 34px;
}

.calibration-notes span {
color: var(--text-muted);
font-size: 0.59rem;
font-weight: 800;
letter-spacing: 0.05em;
text-transform: uppercase;
}

.calibration-notes p {
margin: 0;
color: var(--text-secondary);
font-size: 0.67rem;
line-height: 1.5;
white-space: normal;
}

/* =========================================================
EMPTY STATE
========================================================= */

.calibration-empty-state {
padding: 55px 24px;
text-align: center;
}

.calibration-empty-icon {
display: inline-flex;
align-items: center;
justify-content: center;
width: 48px;
height: 48px;
margin-bottom: 14px;
border: 1px solid var(--border-primary);
border-radius: 50%;
background: rgba(139, 174, 218, 0.08);
color: var(--text-muted);
font-weight: 900;
}

.calibration-empty-state h3 {
margin: 0;
color: var(--text-primary);
font-size: 1rem;
}

.calibration-empty-state p {
max-width: 520px;
margin: 8px auto 0;
color: var(--text-muted);
font-size: 0.72rem;
line-height: 1.55;
}

/* =========================================================
RESPONSIVE
========================================================= */

@media (max-width: 1180px) {
.calibration-summary-grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
}


.calibration-overview-grid {
    grid-template-columns: 1fr;
}


}

@media (max-width: 760px) {
.calibration-page {
padding: 24px 18px 55px;
}


.calibration-header {
    flex-direction: column;
}

.calibration-header-actions {
    align-items: stretch;
    flex-direction: column;
    width: 100%;
}

.calibration-header-actions a {
    width: 100%;
}

.calibration-summary-grid {
    grid-template-columns: 1fr;
}

.calibration-coverage-details {
    grid-template-columns: 1fr;
}

.calibration-panel-header {
    align-items: flex-start;
    flex-direction: column;
}

.calibration-notes {
    grid-template-columns: 1fr;
    padding: 14px 18px;
}

}

/* =========================================================
   CARBON LEDGER
   ========================================================= */

.ledger-page {
    min-height: calc(100vh - var(--topbar-height));
    padding: 32px 30px 70px;
}

.ledger-page-container {
    width: min(100%, var(--page-width));
    margin: 0 auto;
}

/* =========================================================
   HEADER
   ========================================================= */

.ledger-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 30px;
    margin: 24px 0 26px;
}

.ledger-header-content {
    max-width: 820px;
}

.ledger-eyebrow {
    color: var(--blue-secondary);
    font-size: 0.68rem;
    font-weight: 850;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.ledger-header h1 {
    margin: 8px 0 11px;
    color: var(--text-primary);
    font-size: clamp(2.2rem, 4vw, 3.3rem);
    line-height: 1.05;
    letter-spacing: -0.04em;
}

.ledger-header p {
    max-width: 760px;
    margin: 0;
    color: var(--text-secondary);
    line-height: 1.65;
}

.ledger-header-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    flex-shrink: 0;
}

/* =========================================================
   SUMMARY CARDS
   ========================================================= */

.ledger-summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 17px;
    margin-bottom: 20px;
}

.ledger-summary-card {
    position: relative;
    overflow: hidden;
    min-height: 150px;
    padding: 21px;
    border: 1px solid var(--border-primary);
    border-radius: 14px;
    background:
        linear-gradient(
            145deg,
            rgba(15, 39, 67, 0.94),
            rgba(8, 27, 47, 0.94)
        );
}

.ledger-summary-card::before {
    position: absolute;
    inset: 0 auto 0 0;
    width: 3px;
    background: var(--blue-secondary);
    content: "";
}

.ledger-summary-card.methane::before {
    background: var(--green-primary);
}

.ledger-summary-card.carbon::before {
    background: #9f87ff;
}

.ledger-summary-card.credits::before {
    background: var(--amber-primary);
}

.ledger-summary-card > span,
.ledger-summary-card > strong,
.ledger-summary-card > small {
    display: block;
}

.ledger-summary-card > span {
    color: var(--text-muted);
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.045em;
    text-transform: uppercase;
}

.ledger-summary-card > strong {
    margin: 16px 0 8px;
    color: var(--text-primary);
    font-size: 1.9rem;
    line-height: 1;
}

.ledger-summary-card > small {
    color: var(--text-muted);
    font-size: 0.68rem;
    line-height: 1.45;
}

/* =========================================================
   SHARED PANELS
   ========================================================= */

.ledger-overview-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
    gap: 18px;
    margin-bottom: 20px;
}

.ledger-status-panel,
.ledger-readiness-panel,
.ledger-history-panel {
    overflow: hidden;
    border: 1px solid var(--border-primary);
    border-radius: 15px;
    background:
        linear-gradient(
            145deg,
            rgba(13, 37, 64, 0.94),
            rgba(7, 25, 44, 0.96)
        );
}

.ledger-history-panel {
    margin-bottom: 20px;
}

.ledger-panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 20px 22px;
    border-bottom: 1px solid var(--border-primary);
    background: rgba(7, 25, 44, 0.38);
}

.ledger-panel-header > div > span {
    color: var(--blue-secondary);
    font-size: 0.64rem;
    font-weight: 850;
    letter-spacing: 0.09em;
}

.ledger-panel-header h2 {
    margin: 5px 0 0;
    color: var(--text-primary);
    font-size: 1.15rem;
}

.ledger-panel-header > small {
    color: var(--text-muted);
    font-size: 0.68rem;
}

/* =========================================================
   LEDGER STATUS
   ========================================================= */

.ledger-status-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 13px;
    padding: 22px;
}

.ledger-status-item {
    min-height: 118px;
    padding: 16px;
    border: 1px solid rgba(139, 174, 218, 0.11);
    border-radius: 10px;
    background: rgba(4, 20, 35, 0.42);
}

.ledger-status-item span,
.ledger-status-item strong,
.ledger-status-item small {
    display: block;
}

.ledger-status-item span {
    color: var(--text-muted);
    font-size: 0.62rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.ledger-status-item strong {
    margin: 12px 0 7px;
    color: var(--text-primary);
    font-size: 1.55rem;
}

.ledger-status-item small {
    color: var(--text-muted);
    font-size: 0.64rem;
    line-height: 1.4;
}

/* =========================================================
   REGISTRY READINESS
   ========================================================= */

.ledger-readiness-content {
    padding: 22px;
}

.ledger-readiness-value {
    margin-bottom: 17px;
    padding: 18px;
    border: 1px solid rgba(84, 213, 170, 0.18);
    border-radius: 11px;
    background: rgba(84, 213, 170, 0.07);
}

.ledger-readiness-value strong,
.ledger-readiness-value span {
    display: block;
}

.ledger-readiness-value strong {
    color: var(--text-primary);
    font-size: 2rem;
}

.ledger-readiness-value span {
    margin-top: 5px;
    color: var(--green-primary);
    font-size: 0.66rem;
    font-weight: 800;
    text-transform: uppercase;
}

.ledger-readiness-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    min-height: 47px;
    border-bottom: 1px solid rgba(139, 174, 218, 0.1);
}

.ledger-readiness-row:last-child {
    border-bottom: 0;
}

.ledger-readiness-row span {
    color: var(--text-muted);
    font-size: 0.7rem;
}

.ledger-readiness-row strong {
    color: var(--text-primary);
    font-size: 0.72rem;
    text-align: right;
}

/* =========================================================
   STATUS BADGES
   ========================================================= */

.ledger-status-badge {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 27px;
    padding: 0 10px;
    border: 1px solid var(--border-primary);
    border-radius: 999px;
    font-size: 0.61rem;
    font-weight: 800;
    letter-spacing: 0.025em;
    text-transform: uppercase;
}

.ledger-status-badge > span {
    display: block;
    width: 6px;
    height: 6px;
    flex-shrink: 0;
    border-radius: 50%;
    background: currentColor;
}

.ledger-status-healthy {
    border-color: rgba(84, 213, 170, 0.3);
    background: rgba(84, 213, 170, 0.1);
    color: #7ce4c0;
}

.ledger-status-good {
    border-color: rgba(85, 160, 255, 0.3);
    background: rgba(85, 160, 255, 0.1);
    color: #8fc1ff;
}

.ledger-status-warning {
    border-color: rgba(242, 187, 75, 0.3);
    background: rgba(242, 187, 75, 0.1);
    color: #ffd47b;
}

.ledger-status-critical {
    border-color: rgba(237, 106, 115, 0.32);
    background: rgba(237, 106, 115, 0.1);
    color: #ff9ba3;
}

.ledger-status-neutral {
    border-color: var(--border-primary);
    background: rgba(139, 174, 218, 0.07);
    color: var(--text-muted);
}

/* =========================================================
   TABLE
   ========================================================= */

.ledger-table-wrapper {
    overflow-x: auto;
}

.ledger-table {
    width: 100%;
    min-width: 1800px;
    border-collapse: collapse;
}

.ledger-table th,
.ledger-table td {
    padding: 15px 17px;
    border-bottom: 1px solid var(--border-primary);
    text-align: left;
    vertical-align: middle;
}

.ledger-table th {
    background: rgba(6, 23, 40, 0.72);
    color: var(--text-muted);
    font-size: 0.62rem;
    font-weight: 850;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    white-space: nowrap;
}

.ledger-table td {
    color: var(--text-secondary);
    font-size: 0.71rem;
    white-space: nowrap;
}

.ledger-table tbody tr:last-child td {
    border-bottom: 0;
}

.ledger-table tbody tr:hover {
    background: rgba(52, 108, 187, 0.07);
}

.ledger-date,
.ledger-asset {
    display: flex;
    flex-direction: column;
}

.ledger-date strong,
.ledger-asset strong {
    color: var(--text-primary);
    font-size: 0.72rem;
}

.ledger-date small,
.ledger-asset small {
    margin-top: 4px;
    color: var(--text-muted);
    font-size: 0.63rem;
}

.ledger-unit {
    margin-left: 4px;
    color: var(--text-muted);
    font-size: 0.6rem;
}

.ledger-net-value {
    color: var(--green-primary) !important;
    font-weight: 800;
}

.ledger-table .numeric-column {
    text-align: right;
}

/* =========================================================
   EMPTY STATE
   ========================================================= */

.ledger-empty-state {
    padding: 55px 24px;
    text-align: center;
}

.ledger-empty-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    margin-bottom: 14px;
    border: 1px solid var(--border-primary);
    border-radius: 50%;
    background: rgba(139, 174, 218, 0.08);
    color: var(--text-muted);
    font-weight: 900;
}

.ledger-empty-state h3 {
    margin: 0;
    color: var(--text-primary);
    font-size: 1rem;
}

.ledger-empty-state p {
    max-width: 520px;
    margin: 8px auto 0;
    color: var(--text-muted);
    font-size: 0.72rem;
    line-height: 1.55;
}

/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 1180px) {
    .ledger-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .ledger-overview-grid {
        grid-template-columns: 1fr;
    }

    .ledger-status-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .ledger-page {
        padding: 24px 18px 55px;
    }

    .ledger-header {
        flex-direction: column;
    }

    .ledger-header-actions {
        align-items: stretch;
        flex-direction: column;
        width: 100%;
    }

    .ledger-header-actions a {
        width: 100%;
    }

    .ledger-summary-grid,
    .ledger-status-grid {
        grid-template-columns: 1fr;
    }

    .ledger-panel-header {
        align-items: flex-start;
        flex-direction: column;
    }
}

/* =========================================================
   CREDIT ESTIMATES
   ========================================================= */

.credit-estimates-page {
    min-height: calc(100vh - var(--topbar-height));
    padding: 32px 30px 70px;
}

.credit-estimates-page-container {
    width: min(100%, var(--page-width));
    margin: 0 auto;
}

/* =========================================================
   HEADER
   ========================================================= */

.credit-estimates-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 30px;
    margin: 24px 0 26px;
}

.credit-estimates-header-content {
    max-width: 820px;
}

.credit-estimates-eyebrow {
    color: var(--blue-secondary);
    font-size: 0.68rem;
    font-weight: 850;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.credit-estimates-header h1 {
    margin: 8px 0 11px;
    color: var(--text-primary);
    font-size: clamp(2.2rem, 4vw, 3.3rem);
    line-height: 1.05;
    letter-spacing: -0.04em;
}

.credit-estimates-header p {
    max-width: 760px;
    margin: 0;
    color: var(--text-secondary);
    line-height: 1.65;
}

.credit-estimates-header-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    flex-shrink: 0;
}

/* =========================================================
   SUMMARY CARDS
   ========================================================= */

.credit-estimates-summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 17px;
    margin-bottom: 20px;
}

.credit-estimates-summary-card {
    position: relative;
    overflow: hidden;
    min-height: 150px;
    padding: 21px;
    border: 1px solid var(--border-primary);
    border-radius: 14px;
    background:
        linear-gradient(
            145deg,
            rgba(15, 39, 67, 0.94),
            rgba(8, 27, 47, 0.94)
        );
}

.credit-estimates-summary-card::before {
    position: absolute;
    inset: 0 auto 0 0;
    width: 3px;
    background: var(--blue-secondary);
    content: "";
}

.credit-estimates-summary-card.credits::before {
    background: var(--green-primary);
}

.credit-estimates-summary-card.price::before {
    background: #9f87ff;
}

.credit-estimates-summary-card.value::before {
    background: var(--amber-primary);
}

.credit-estimates-summary-card > span,
.credit-estimates-summary-card > strong,
.credit-estimates-summary-card > small {
    display: block;
}

.credit-estimates-summary-card > span {
    color: var(--text-muted);
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.045em;
    text-transform: uppercase;
}

.credit-estimates-summary-card > strong {
    margin: 16px 0 8px;
    color: var(--text-primary);
    font-size: 1.9rem;
    line-height: 1;
}

.credit-estimates-summary-card > small {
    color: var(--text-muted);
    font-size: 0.68rem;
    line-height: 1.45;
}

/* =========================================================
   SHARED PANELS
   ========================================================= */

.credit-estimates-overview-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
    gap: 18px;
    margin-bottom: 20px;
}

.credit-estimates-status-panel,
.credit-estimates-value-panel,
.credit-estimates-history-panel {
    overflow: hidden;
    border: 1px solid var(--border-primary);
    border-radius: 15px;
    background:
        linear-gradient(
            145deg,
            rgba(13, 37, 64, 0.94),
            rgba(7, 25, 44, 0.96)
        );
}

.credit-estimates-history-panel {
    margin-bottom: 20px;
}

.credit-estimates-panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 20px 22px;
    border-bottom: 1px solid var(--border-primary);
    background: rgba(7, 25, 44, 0.38);
}

.credit-estimates-panel-header > div > span {
    color: var(--blue-secondary);
    font-size: 0.64rem;
    font-weight: 850;
    letter-spacing: 0.09em;
}

.credit-estimates-panel-header h2 {
    margin: 5px 0 0;
    color: var(--text-primary);
    font-size: 1.15rem;
}

.credit-estimates-panel-header > small {
    color: var(--text-muted);
    font-size: 0.68rem;
}

/* =========================================================
   STATUS PANEL
   ========================================================= */

.credit-estimates-status-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 13px;
    padding: 22px;
}

.credit-estimates-status-item {
    min-height: 118px;
    padding: 16px;
    border: 1px solid rgba(139, 174, 218, 0.11);
    border-radius: 10px;
    background: rgba(4, 20, 35, 0.42);
}

.credit-estimates-status-item span,
.credit-estimates-status-item strong,
.credit-estimates-status-item small {
    display: block;
}

.credit-estimates-status-item span {
    color: var(--text-muted);
    font-size: 0.62rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.credit-estimates-status-item strong {
    margin: 12px 0 7px;
    color: var(--text-primary);
    font-size: 1.55rem;
}

.credit-estimates-status-item small {
    color: var(--text-muted);
    font-size: 0.64rem;
    line-height: 1.4;
}

/* =========================================================
   VALUE PANEL
   ========================================================= */

.credit-estimates-value-content {
    padding: 22px;
}

.credit-estimates-value-highlight {
    margin-bottom: 17px;
    padding: 18px;
    border: 1px solid rgba(242, 187, 75, 0.2);
    border-radius: 11px;
    background: rgba(242, 187, 75, 0.07);
}

.credit-estimates-value-highlight span,
.credit-estimates-value-highlight strong,
.credit-estimates-value-highlight small {
    display: block;
}

.credit-estimates-value-highlight span {
    color: var(--text-muted);
    font-size: 0.62rem;
    font-weight: 800;
    text-transform: uppercase;
}

.credit-estimates-value-highlight strong {
    margin-top: 8px;
    color: var(--text-primary);
    font-size: 2rem;
}

.credit-estimates-value-highlight small {
    margin-top: 5px;
    color: var(--amber-primary);
    font-size: 0.66rem;
}

.credit-estimates-value-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    min-height: 47px;
    border-bottom: 1px solid rgba(139, 174, 218, 0.1);
}

.credit-estimates-value-row:last-child {
    border-bottom: 0;
}

.credit-estimates-value-row span {
    color: var(--text-muted);
    font-size: 0.7rem;
}

.credit-estimates-value-row strong {
    color: var(--text-primary);
    font-size: 0.72rem;
    text-align: right;
}

/* =========================================================
   STATUS BADGES
   ========================================================= */

.credit-estimates-status-badge {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 27px;
    padding: 0 10px;
    border: 1px solid var(--border-primary);
    border-radius: 999px;
    font-size: 0.61rem;
    font-weight: 800;
    letter-spacing: 0.025em;
    text-transform: uppercase;
}

.credit-estimates-status-badge > span {
    display: block;
    width: 6px;
    height: 6px;
    flex-shrink: 0;
    border-radius: 50%;
    background: currentColor;
}

.credit-estimates-status-healthy {
    border-color: rgba(84, 213, 170, 0.3);
    background: rgba(84, 213, 170, 0.1);
    color: #7ce4c0;
}

.credit-estimates-status-good {
    border-color: rgba(85, 160, 255, 0.3);
    background: rgba(85, 160, 255, 0.1);
    color: #8fc1ff;
}

.credit-estimates-status-warning {
    border-color: rgba(242, 187, 75, 0.3);
    background: rgba(242, 187, 75, 0.1);
    color: #ffd47b;
}

.credit-estimates-status-critical {
    border-color: rgba(237, 106, 115, 0.32);
    background: rgba(237, 106, 115, 0.1);
    color: #ff9ba3;
}

.credit-estimates-status-neutral {
    border-color: var(--border-primary);
    background: rgba(139, 174, 218, 0.07);
    color: var(--text-muted);
}

/* =========================================================
   TABLE
   ========================================================= */

.credit-estimates-table-wrapper {
    overflow-x: auto;
}

.credit-estimates-table {
    width: 100%;
    min-width: 1320px;
    border-collapse: collapse;
}

.credit-estimates-table th,
.credit-estimates-table td {
    padding: 15px 17px;
    border-bottom: 1px solid var(--border-primary);
    text-align: left;
    vertical-align: middle;
}

.credit-estimates-table th {
    background: rgba(6, 23, 40, 0.72);
    color: var(--text-muted);
    font-size: 0.62rem;
    font-weight: 850;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    white-space: nowrap;
}

.credit-estimates-table td {
    color: var(--text-secondary);
    font-size: 0.71rem;
    white-space: nowrap;
}

.credit-estimates-table tbody tr:last-child td {
    border-bottom: 0;
}

.credit-estimates-table tbody tr:hover {
    background: rgba(52, 108, 187, 0.07);
}

.credit-estimates-date,
.credit-estimates-asset {
    display: flex;
    flex-direction: column;
}

.credit-estimates-date strong,
.credit-estimates-asset strong {
    color: var(--text-primary);
    font-size: 0.72rem;
}

.credit-estimates-date small,
.credit-estimates-asset small {
    margin-top: 4px;
    color: var(--text-muted);
    font-size: 0.63rem;
}

.credit-estimates-table .numeric-column {
    text-align: right;
}

.credit-estimates-credit-value {
    color: var(--green-primary) !important;
    font-weight: 800;
}

.credit-estimates-gross-value {
    color: var(--amber-primary) !important;
    font-weight: 800;
}

/* =========================================================
   EMPTY STATE
   ========================================================= */

.credit-estimates-empty-state {
    padding: 55px 24px;
    text-align: center;
}

.credit-estimates-empty-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    margin-bottom: 14px;
    border: 1px solid var(--border-primary);
    border-radius: 50%;
    background: rgba(139, 174, 218, 0.08);
    color: var(--text-muted);
    font-weight: 900;
}

.credit-estimates-empty-state h3 {
    margin: 0;
    color: var(--text-primary);
    font-size: 1rem;
}

.credit-estimates-empty-state p {
    max-width: 520px;
    margin: 8px auto 0;
    color: var(--text-muted);
    font-size: 0.72rem;
    line-height: 1.55;
}

/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 1180px) {
    .credit-estimates-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .credit-estimates-overview-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {
    .credit-estimates-page {
        padding: 24px 18px 55px;
    }

    .credit-estimates-header {
        flex-direction: column;
    }

    .credit-estimates-header-actions {
        align-items: stretch;
        flex-direction: column;
        width: 100%;
    }

    .credit-estimates-header-actions a {
        width: 100%;
    }

    .credit-estimates-summary-grid,
    .credit-estimates-status-grid {
        grid-template-columns: 1fr;
    }

    .credit-estimates-panel-header {
        align-items: flex-start;
        flex-direction: column;
    }
}

/* =========================================================
   EXPANDABLE SIDEBAR TREE
   ========================================================= */

.sidebar-tree-group,
.sidebar-tree-subgroup {
    width: 100%;
}

.sidebar-tree-toggle,
.sidebar-tree-subtoggle {
    width: 100%;
    margin: 0;
    border: 0;
    outline: 0;
    appearance: none;
    -webkit-appearance: none;
    background: transparent;
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
}

.sidebar-tree-toggle {
    position: relative;
    display: flex;
    align-items: center;
}

/* Prevent Bootstrap/default button styling */
button.sidebar-navigation-link,
button.sidebar-tree-link {
    background-color: transparent;
    color: inherit;
    box-shadow: none;
}

button.sidebar-navigation-link:hover,
button.sidebar-navigation-link:focus,
button.sidebar-tree-link:hover,
button.sidebar-tree-link:focus {
    color: inherit;
    box-shadow: none;
}

/* =========================================================
   CHEVRON
   ========================================================= */

.sidebar-tree-chevron {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 24px;
    width: 24px;
    height: 24px;
    margin-left: auto;
    color: var(--text-muted);
    font-size: 1rem;
    line-height: 1;
    transform: rotate(0deg);
    transition:
        transform 180ms ease,
        color 160ms ease;
}

.sidebar-tree-group.is-open
> .sidebar-tree-toggle
> .sidebar-tree-chevron,
.sidebar-tree-subgroup.is-open
> .sidebar-tree-subtoggle
> .sidebar-tree-chevron {
    transform: rotate(90deg);
    color: var(--blue-secondary);
}

/* =========================================================
   EXPANDING CONTAINERS
   ========================================================= */

.sidebar-tree-children,
.sidebar-tree-grandchildren {
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    visibility: hidden;
    transition:
        max-height 260ms ease,
        opacity 180ms ease,
        visibility 180ms ease,
        margin 220ms ease,
        padding 220ms ease;
}

.sidebar-tree-group.is-open
> .sidebar-tree-children {
    max-height: 620px;
    margin: 4px 0 8px 17px;
    padding-left: 15px;
    border-left: 1px solid rgba(139, 174, 218, 0.14);
    opacity: 1;
    visibility: visible;
}

.sidebar-tree-subgroup.is-open
> .sidebar-tree-grandchildren {
    max-height: 420px;
    margin: 3px 0 5px 12px;
    padding-left: 12px;
    border-left: 1px solid rgba(85, 160, 255, 0.14);
    opacity: 1;
    visibility: visible;
}

/* =========================================================
   TOP-LEVEL TOGGLES
   ========================================================= */

.sidebar-tree-toggle {
    border: 1px solid transparent;
    border-radius: 10px;
    background: transparent;
    color: #96aac2;
}

.sidebar-tree-toggle:hover {
    border-color: rgba(92, 153, 248, 0.16);
    background: rgba(48, 105, 190, 0.11);
    color: var(--text-primary);
}

.sidebar-tree-toggle.active,
.sidebar-tree-group.is-open
> .sidebar-tree-toggle {
    border-color: rgba(92, 153, 248, 0.22);
    background:
        linear-gradient(
            135deg,
            rgba(53, 124, 232, 0.2),
            rgba(37, 91, 172, 0.08)
        );
    color: var(--text-primary);
}

/* =========================================================
   CHILD CONTAINERS
   ========================================================= */

.sidebar-tree-children,
.sidebar-tree-grandchildren {
    display: grid;
    grid-template-rows: 0fr;
    opacity: 0;
    visibility: hidden;
    transition:
        grid-template-rows 190ms ease,
        opacity 150ms ease,
        visibility 150ms ease;
}

.sidebar-tree-children > *,
.sidebar-tree-grandchildren > * {
    overflow: hidden;
}

.sidebar-tree-group.is-open
> .sidebar-tree-children,
.sidebar-tree-subgroup.is-open
> .sidebar-tree-grandchildren {
    grid-template-rows: 1fr;
    opacity: 1;
    visibility: visible;
}

.sidebar-tree-group.is-open
> .sidebar-tree-children {
    margin: 4px 0 8px 17px;
    padding-left: 15px;
    border-left: 1px solid rgba(139, 174, 218, 0.14);
}

.sidebar-tree-subgroup.is-open
> .sidebar-tree-grandchildren {
    margin: 3px 0 5px 12px;
    padding-left: 12px;
    border-left: 1px solid rgba(85, 160, 255, 0.14);
}

/* =========================================================
   CHILD LINKS
   ========================================================= */

.sidebar-tree-link {
    position: relative;
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    min-height: 36px;
    margin-bottom: 2px;
    padding: 7px 9px;
    border: 1px solid transparent;
    border-radius: 8px;
    background: transparent;
    color: #8399b3;
    font-size: 0.75rem;
    font-weight: 650;
    text-decoration: none;
    cursor: pointer;
    transition:
        border-color 140ms ease,
        background 140ms ease,
        color 140ms ease,
        transform 140ms ease;
}

.sidebar-tree-link > span:first-child {
    display: block;
    flex: 0 0 6px;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: rgba(117, 139, 165, 0.52);
    transition:
        background 140ms ease,
        box-shadow 140ms ease;
}

.sidebar-tree-link:hover {
    transform: translateX(2px);
    border-color: rgba(85, 160, 255, 0.14);
    background: rgba(48, 105, 190, 0.09);
    color: var(--text-primary);
}

.sidebar-tree-link:hover
> span:first-child {
    background: var(--blue-secondary);
}

.sidebar-tree-link.active {
    border-color: rgba(85, 160, 255, 0.24);
    background:
        linear-gradient(
            135deg,
            rgba(54, 124, 232, 0.18),
            rgba(36, 82, 151, 0.08)
        );
    color: var(--text-primary);
}

.sidebar-tree-link.active
> span:first-child {
    background: var(--blue-secondary);
    box-shadow: 0 0 0 4px rgba(85, 160, 255, 0.1);
}

/* =========================================================
   NESTED CARBON ACCOUNTING GROUP
   ========================================================= */

.sidebar-tree-subtoggle {
    justify-content: flex-start;
}

.sidebar-tree-link-text {
    min-width: 0;
    flex: 1;
}

.sidebar-tree-subtoggle.active-parent {
    color: #a9caff;
}

.sidebar-tree-link-nested {
    min-height: 33px;
    padding-top: 6px;
    padding-bottom: 6px;
    font-size: 0.7rem;
}

.sidebar-tree-link-nested > span:first-child {
    width: 5px;
    height: 5px;
}

/* =========================================================
   MAIN TOGGLE ACTIVE STATE
   ========================================================= */

.sidebar-tree-toggle.active {
    border-color: rgba(92, 153, 248, 0.22);
    background:
        linear-gradient(
            135deg,
            rgba(53, 124, 232, 0.2),
            rgba(37, 91, 172, 0.08)
        );
    color: var(--text-primary);
}

/* =========================================================
   COLLAPSED SIDEBAR
   ========================================================= */

.application-sidebar.is-collapsed
.sidebar-tree-chevron,
.application-sidebar.is-collapsed
.sidebar-tree-children,
.application-sidebar.is-collapsed
.sidebar-tree-grandchildren {
    display: none;
}

.application-sidebar.is-collapsed
.sidebar-tree-toggle {
    justify-content: center;
    padding: 6px;
}

.application-sidebar.is-collapsed
.sidebar-tree-toggle
.sidebar-navigation-icon {
    flex-basis: 38px;
    width: 38px;
    height: 38px;
}

/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 900px) {
    .application-sidebar.is-collapsed
    .sidebar-tree-chevron {
        display: inline-flex;
    }

    .application-sidebar.is-collapsed
    .sidebar-tree-group.is-open
    > .sidebar-tree-children,
    .application-sidebar.is-collapsed
    .sidebar-tree-subgroup.is-open
    > .sidebar-tree-grandchildren {
        display: grid;
    }

    .application-sidebar.is-collapsed
    .sidebar-tree-toggle {
        justify-content: flex-start;
        padding: 9px 12px;
    }
}

/* =========================================================
   REGISTRY READINESS
   ========================================================= */

.registry-readiness-page {
    min-height: calc(100vh - var(--topbar-height));
    padding: 32px 30px 70px;
}

.registry-readiness-page-container {
    width: min(100%, var(--page-width));
    margin: 0 auto;
}

/* =========================================================
   HEADER
   ========================================================= */

.registry-readiness-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 30px;
    margin: 24px 0 26px;
}

.registry-readiness-header-content {
    max-width: 820px;
}

.registry-readiness-eyebrow {
    color: var(--blue-secondary);
    font-size: 0.68rem;
    font-weight: 850;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.registry-readiness-header h1 {
    margin: 8px 0 11px;
    color: var(--text-primary);
    font-size: clamp(2.2rem, 4vw, 3.3rem);
    line-height: 1.05;
    letter-spacing: -0.04em;
}

.registry-readiness-header p {
    max-width: 760px;
    margin: 0;
    color: var(--text-secondary);
    line-height: 1.65;
}

.registry-readiness-header-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    flex-shrink: 0;
}

/* =========================================================
   SUMMARY CARDS
   ========================================================= */

.registry-readiness-summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 17px;
    margin-bottom: 20px;
}

.registry-readiness-summary-card {
    position: relative;
    overflow: hidden;
    min-height: 150px;
    padding: 21px;
    border: 1px solid var(--border-primary);
    border-radius: 14px;
    background:
        linear-gradient(
            145deg,
            rgba(15, 39, 67, 0.94),
            rgba(8, 27, 47, 0.94)
        );
}

.registry-readiness-summary-card::before {
    position: absolute;
    inset: 0 auto 0 0;
    width: 3px;
    background: var(--blue-secondary);
    content: "";
}

.registry-readiness-summary-card.status::before {
    background: var(--green-primary);
}

.registry-readiness-summary-card.score::before {
    background: #9f87ff;
}

.registry-readiness-summary-card.checks::before {
    background: var(--blue-secondary);
}

.registry-readiness-summary-card.issues::before {
    background: var(--amber-primary);
}

.registry-readiness-summary-card > span,
.registry-readiness-summary-card > strong,
.registry-readiness-summary-card > small {
    display: block;
}

.registry-readiness-summary-card > span {
    color: var(--text-muted);
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.045em;
    text-transform: uppercase;
}

.registry-readiness-summary-card > strong {
    margin: 16px 0 8px;
    color: var(--text-primary);
    font-size: 1.9rem;
    line-height: 1;
}

.registry-readiness-summary-card > small {
    color: var(--text-muted);
    font-size: 0.68rem;
    line-height: 1.45;
}

.registry-readiness-summary-status {
    font-size: 1.45rem !important;
    text-transform: uppercase;
}

.registry-readiness-warning-value {
    color: var(--amber-primary) !important;
}

/* =========================================================
   SHARED PANELS
   ========================================================= */

.registry-readiness-overview-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 18px;
    margin-bottom: 20px;
}

.registry-readiness-score-panel,
.registry-readiness-gate-panel,
.registry-readiness-checks-panel,
.registry-readiness-blocking-panel {
    overflow: hidden;
    border: 1px solid var(--border-primary);
    border-radius: 15px;
    background:
        linear-gradient(
            145deg,
            rgba(13, 37, 64, 0.94),
            rgba(7, 25, 44, 0.96)
        );
}

.registry-readiness-checks-panel,
.registry-readiness-blocking-panel {
    margin-bottom: 20px;
}

.registry-readiness-panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 20px 22px;
    border-bottom: 1px solid var(--border-primary);
    background: rgba(7, 25, 44, 0.38);
}

.registry-readiness-panel-header > div > span {
    color: var(--blue-secondary);
    font-size: 0.64rem;
    font-weight: 850;
    letter-spacing: 0.09em;
}

.registry-readiness-panel-header h2 {
    margin: 5px 0 0;
    color: var(--text-primary);
    font-size: 1.15rem;
}

.registry-readiness-panel-header > small {
    color: var(--text-muted);
    font-size: 0.68rem;
}

/* =========================================================
   STATUS BADGES
   ========================================================= */

.registry-readiness-status-badge {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 27px;
    padding: 0 10px;
    border: 1px solid var(--border-primary);
    border-radius: 999px;
    font-size: 0.61rem;
    font-weight: 800;
    letter-spacing: 0.025em;
    text-transform: uppercase;
}

.registry-readiness-status-badge > span {
    display: block;
    width: 6px;
    height: 6px;
    flex-shrink: 0;
    border-radius: 50%;
    background: currentColor;
}

.registry-readiness-status-healthy {
    border-color: rgba(84, 213, 170, 0.3);
    background: rgba(84, 213, 170, 0.1);
    color: #7ce4c0;
}

.registry-readiness-status-warning {
    border-color: rgba(242, 187, 75, 0.3);
    background: rgba(242, 187, 75, 0.1);
    color: #ffd47b;
}

.registry-readiness-status-critical {
    border-color: rgba(237, 106, 115, 0.32);
    background: rgba(237, 106, 115, 0.1);
    color: #ff9ba3;
}

.registry-readiness-status-neutral {
    border-color: var(--border-primary);
    background: rgba(139, 174, 218, 0.07);
    color: var(--text-muted);
}

/* =========================================================
   SCORE PANEL
   ========================================================= */

.registry-readiness-score-content {
    display: grid;
    grid-template-columns: 190px minmax(0, 1fr);
    align-items: center;
    gap: 26px;
    padding: 26px;
}

.registry-readiness-score-ring {
    --score-value: calc(var(--readiness-score) * 1%);
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 170px;
    height: 170px;
    border-radius: 50%;
    background:
        conic-gradient(
            var(--green-primary) 0 var(--score-value),
            rgba(139, 174, 218, 0.12) var(--score-value) 100%
        );
}

.registry-readiness-score-ring::before {
    position: absolute;
    inset: 14px;
    border: 1px solid rgba(139, 174, 218, 0.12);
    border-radius: 50%;
    background:
        linear-gradient(
            145deg,
            rgba(10, 30, 52, 0.98),
            rgba(6, 22, 39, 0.98)
        );
    content: "";
}

.registry-readiness-score-ring > div {
    position: relative;
    z-index: 1;
    text-align: center;
}

.registry-readiness-score-ring strong,
.registry-readiness-score-ring span {
    display: block;
}

.registry-readiness-score-ring strong {
    color: var(--text-primary);
    font-size: 1.75rem;
}

.registry-readiness-score-ring span {
    margin-top: 5px;
    color: var(--text-muted);
    font-size: 0.66rem;
    font-weight: 800;
    text-transform: uppercase;
}

.registry-readiness-score-details {
    display: grid;
    gap: 0;
}

.registry-readiness-score-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    min-height: 48px;
    border-bottom: 1px solid rgba(139, 174, 218, 0.1);
}

.registry-readiness-score-row:last-child {
    border-bottom: 0;
}

.registry-readiness-score-row span {
    color: var(--text-muted);
    font-size: 0.7rem;
}

.registry-readiness-score-row strong {
    color: var(--text-primary);
    font-size: 0.72rem;
    text-align: right;
}

/* =========================================================
   SUBMISSION GATE
   ========================================================= */

.registry-readiness-gate-content {
    padding: 22px;
}

.registry-readiness-gate-state {
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr);
    gap: 15px;
    margin-bottom: 24px;
    padding: 18px;
    border: 1px solid var(--border-primary);
    border-radius: 12px;
}

.registry-readiness-gate-state.ready {
    border-color: rgba(84, 213, 170, 0.22);
    background: rgba(84, 213, 170, 0.07);
}

.registry-readiness-gate-state.review {
    border-color: rgba(242, 187, 75, 0.22);
    background: rgba(242, 187, 75, 0.07);
}

.registry-readiness-gate-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: rgba(84, 213, 170, 0.12);
    color: var(--green-primary);
    font-weight: 900;
}

.registry-readiness-gate-state.review
.registry-readiness-gate-icon {
    background: rgba(242, 187, 75, 0.12);
    color: var(--amber-primary);
}

.registry-readiness-gate-state strong {
    color: var(--text-primary);
    font-size: 0.84rem;
}

.registry-readiness-gate-state p {
    margin: 7px 0 0;
    color: var(--text-muted);
    font-size: 0.69rem;
    line-height: 1.55;
}

/* =========================================================
   WORKFLOW
   ========================================================= */

.registry-readiness-flow {
    display: grid;
    grid-template-columns:
        minmax(0, 1fr)
        24px
        minmax(0, 1fr)
        24px
        minmax(0, 1fr)
        24px
        minmax(0, 1fr);
    align-items: center;
    gap: 8px;
}

.registry-readiness-flow-step {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

.registry-readiness-flow-step > span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 29px;
    width: 29px;
    height: 29px;
    border: 1px solid var(--border-primary);
    border-radius: 50%;
    background: rgba(139, 174, 218, 0.07);
    color: var(--text-muted);
    font-size: 0.67rem;
    font-weight: 850;
}

.registry-readiness-flow-step.complete > span {
    border-color: rgba(84, 213, 170, 0.3);
    background: rgba(84, 213, 170, 0.1);
    color: var(--green-primary);
}

.registry-readiness-flow-step.current > span {
    border-color: rgba(85, 160, 255, 0.38);
    background: rgba(85, 160, 255, 0.12);
    color: var(--blue-secondary);
}

.registry-readiness-flow-step strong,
.registry-readiness-flow-step small {
    display: block;
}

.registry-readiness-flow-step strong {
    overflow: hidden;
    color: var(--text-primary);
    font-size: 0.69rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.registry-readiness-flow-step small {
    margin-top: 3px;
    color: var(--text-muted);
    font-size: 0.59rem;
    line-height: 1.3;
}

.registry-readiness-flow-line {
    height: 1px;
    background: rgba(139, 174, 218, 0.16);
}

/* =========================================================
   CHECKLIST
   ========================================================= */

.registry-readiness-check-list {
    padding: 10px 22px;
}

.registry-readiness-check-item {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) auto;
    align-items: center;
    gap: 15px;
    padding: 15px 0;
    border-bottom: 1px solid rgba(139, 174, 218, 0.1);
}

.registry-readiness-check-item:last-child {
    border-bottom: 0;
}

.registry-readiness-check-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border: 1px solid var(--border-primary);
    border-radius: 50%;
    font-size: 0.72rem;
    font-weight: 900;
}

.registry-readiness-check-healthy
.registry-readiness-check-icon {
    border-color: rgba(84, 213, 170, 0.3);
    background: rgba(84, 213, 170, 0.1);
    color: var(--green-primary);
}

.registry-readiness-check-warning
.registry-readiness-check-icon {
    border-color: rgba(242, 187, 75, 0.3);
    background: rgba(242, 187, 75, 0.1);
    color: var(--amber-primary);
}

.registry-readiness-check-content {
    min-width: 0;
}

.registry-readiness-check-content > span {
    color: var(--blue-secondary);
    font-size: 0.59rem;
    font-weight: 800;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.registry-readiness-check-content strong {
    display: block;
    margin-top: 4px;
    color: var(--text-primary);
    font-size: 0.76rem;
}

.registry-readiness-check-content p {
    margin: 5px 0 0;
    color: var(--text-muted);
    font-size: 0.67rem;
    line-height: 1.45;
}

/* =========================================================
   BLOCKING ISSUES
   ========================================================= */

.registry-readiness-blocking-list {
    padding: 10px 22px;
}

.registry-readiness-blocking-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 16px 0;
    border-bottom: 1px solid rgba(139, 174, 218, 0.1);
}

.registry-readiness-blocking-item:last-child {
    border-bottom: 0;
}

.registry-readiness-blocking-item > div {
    min-width: 0;
}

.registry-readiness-blocking-item span,
.registry-readiness-blocking-item strong {
    display: block;
}

.registry-readiness-blocking-item > div > span {
    color: var(--amber-primary);
    font-size: 0.59rem;
    font-weight: 800;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.registry-readiness-blocking-item strong {
    margin-top: 4px;
    color: var(--text-primary);
    font-size: 0.76rem;
}

.registry-readiness-blocking-item p {
    margin: 5px 0 0;
    color: var(--text-muted);
    font-size: 0.67rem;
    line-height: 1.45;
}

.registry-readiness-blocking-item > a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
    min-height: 36px;
    padding: 0 12px;
    border: 1px solid rgba(85, 160, 255, 0.25);
    border-radius: 8px;
    background: rgba(85, 160, 255, 0.08);
    color: #9bc5ff;
    font-size: 0.68rem;
    font-weight: 750;
    text-decoration: none;
}

/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 1180px) {
    .registry-readiness-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .registry-readiness-overview-grid {
        grid-template-columns: 1fr;
    }

    .registry-readiness-flow {
        grid-template-columns: 1fr;
        gap: 11px;
    }

    .registry-readiness-flow-line {
        width: 1px;
        height: 18px;
        margin-left: 14px;
    }
}

@media (max-width: 760px) {
    .registry-readiness-page {
        padding: 24px 18px 55px;
    }

    .registry-readiness-header {
        flex-direction: column;
    }

    .registry-readiness-header-actions {
        align-items: stretch;
        flex-direction: column;
        width: 100%;
    }

    .registry-readiness-header-actions a {
        width: 100%;
    }

    .registry-readiness-summary-grid {
        grid-template-columns: 1fr;
    }

    .registry-readiness-score-content {
        grid-template-columns: 1fr;
        justify-items: center;
    }

    .registry-readiness-score-details {
        width: 100%;
    }

    .registry-readiness-panel-header {
        align-items: flex-start;
        flex-direction: column;
    }

    .registry-readiness-check-item {
        grid-template-columns: 36px minmax(0, 1fr);
    }

    .registry-readiness-check-item
    > .registry-readiness-status-badge {
        grid-column: 2;
        justify-self: start;
    }

    .registry-readiness-blocking-item {
        align-items: flex-start;
        flex-direction: column;
    }
}

/* =========================================================
   CARBON MARKETS
   ========================================================= */

.carbon-markets-page {
    min-height: calc(100vh - var(--topbar-height));
    padding: 32px 30px 70px;
}

.carbon-markets-page-container {
    width: min(100%, var(--page-width));
    margin: 0 auto;
}

/* =========================================================
   HEADER
   ========================================================= */

.carbon-markets-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 30px;
    margin: 24px 0 26px;
}

.carbon-markets-header-content {
    max-width: 820px;
}

.carbon-markets-eyebrow {
    color: var(--blue-secondary);
    font-size: 0.68rem;
    font-weight: 850;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.carbon-markets-header h1 {
    margin: 8px 0 11px;
    color: var(--text-primary);
    font-size: clamp(2.2rem, 4vw, 3.3rem);
    line-height: 1.05;
    letter-spacing: -0.04em;
}

.carbon-markets-header p {
    max-width: 760px;
    margin: 0;
    color: var(--text-secondary);
    line-height: 1.65;
}

.carbon-markets-header-status {
    display: flex;
    align-items: flex-end;
    flex-direction: column;
    gap: 10px;
    flex-shrink: 0;
}

.carbon-markets-header-status small {
    color: var(--text-muted);
    font-size: 0.67rem;
}

.carbon-markets-header-status strong {
    margin-left: 5px;
    color: var(--text-primary);
}

/* =========================================================
   SUMMARY CARDS
   ========================================================= */

.carbon-markets-summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 17px;
    margin-bottom: 20px;
}

.carbon-markets-summary-card {
    position: relative;
    overflow: hidden;
    min-height: 150px;
    padding: 21px;
    border: 1px solid var(--border-primary);
    border-radius: 14px;
    background:
        linear-gradient(
            145deg,
            rgba(15, 39, 67, 0.94),
            rgba(8, 27, 47, 0.94)
        );
}

.carbon-markets-summary-card::before {
    position: absolute;
    inset: 0 auto 0 0;
    width: 3px;
    background: var(--blue-secondary);
    content: "";
}

.carbon-markets-summary-card.readiness::before {
    background: var(--green-primary);
}

.carbon-markets-summary-card.credits::before {
    background: #9f87ff;
}

.carbon-markets-summary-card.price::before {
    background: var(--blue-secondary);
}

.carbon-markets-summary-card.value::before {
    background: var(--amber-primary);
}

.carbon-markets-summary-card > span,
.carbon-markets-summary-card > strong,
.carbon-markets-summary-card > small {
    display: block;
}

.carbon-markets-summary-card > span {
    color: var(--text-muted);
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.045em;
    text-transform: uppercase;
}

.carbon-markets-summary-card > strong {
    margin: 16px 0 8px;
    color: var(--text-primary);
    font-size: 1.9rem;
    line-height: 1;
}

.carbon-markets-summary-card > small {
    color: var(--text-muted);
    font-size: 0.68rem;
    line-height: 1.45;
}

/* =========================================================
   SHARED PANELS
   ========================================================= */

.carbon-markets-overview-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
    gap: 18px;
    margin-bottom: 20px;
}

.carbon-markets-project-panel,
.carbon-markets-next-action-panel,
.carbon-markets-workflow-panel,
.carbon-markets-registry-panel {
    overflow: hidden;
    border: 1px solid var(--border-primary);
    border-radius: 15px;
    background:
        linear-gradient(
            145deg,
            rgba(13, 37, 64, 0.94),
            rgba(7, 25, 44, 0.96)
        );
}

.carbon-markets-workflow-panel,
.carbon-markets-registry-panel {
    margin-bottom: 20px;
}

.carbon-markets-panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 20px 22px;
    border-bottom: 1px solid var(--border-primary);
    background: rgba(7, 25, 44, 0.38);
}

.carbon-markets-panel-header > div > span {
    color: var(--blue-secondary);
    font-size: 0.64rem;
    font-weight: 850;
    letter-spacing: 0.09em;
}

.carbon-markets-panel-header h2 {
    margin: 5px 0 0;
    color: var(--text-primary);
    font-size: 1.15rem;
}

.carbon-markets-panel-header > small {
    color: var(--text-muted);
    font-size: 0.68rem;
}

/* =========================================================
   STATUS BADGES
   ========================================================= */

.carbon-markets-status-badge {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 27px;
    padding: 0 10px;
    border: 1px solid var(--border-primary);
    border-radius: 999px;
    font-size: 0.61rem;
    font-weight: 800;
    letter-spacing: 0.025em;
    text-transform: uppercase;
}

.carbon-markets-status-badge > span {
    display: block;
    width: 6px;
    height: 6px;
    flex-shrink: 0;
    border-radius: 50%;
    background: currentColor;
}

.carbon-markets-status-healthy {
    border-color: rgba(84, 213, 170, 0.3);
    background: rgba(84, 213, 170, 0.1);
    color: #7ce4c0;
}

.carbon-markets-status-good {
    border-color: rgba(85, 160, 255, 0.3);
    background: rgba(85, 160, 255, 0.1);
    color: #8fc1ff;
}

.carbon-markets-status-warning {
    border-color: rgba(242, 187, 75, 0.3);
    background: rgba(242, 187, 75, 0.1);
    color: #ffd47b;
}

.carbon-markets-status-critical {
    border-color: rgba(237, 106, 115, 0.32);
    background: rgba(237, 106, 115, 0.1);
    color: #ff9ba3;
}

.carbon-markets-status-neutral {
    border-color: var(--border-primary);
    background: rgba(139, 174, 218, 0.07);
    color: var(--text-muted);
}

/* =========================================================
   PROJECT POSITION
   ========================================================= */

.carbon-markets-project-content {
    padding: 22px;
}

.carbon-markets-project-highlight {
    margin-bottom: 17px;
    padding: 18px;
    border: 1px solid rgba(85, 160, 255, 0.2);
    border-radius: 11px;
    background: rgba(85, 160, 255, 0.07);
}

.carbon-markets-project-highlight span,
.carbon-markets-project-highlight strong,
.carbon-markets-project-highlight small {
    display: block;
}

.carbon-markets-project-highlight span {
    color: var(--text-muted);
    font-size: 0.62rem;
    font-weight: 800;
    text-transform: uppercase;
}

.carbon-markets-project-highlight strong {
    margin-top: 8px;
    color: var(--text-primary);
    font-size: 1.35rem;
}

.carbon-markets-project-highlight small {
    margin-top: 6px;
    color: var(--blue-secondary);
    font-size: 0.66rem;
}

.carbon-markets-project-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    min-height: 47px;
    border-bottom: 1px solid rgba(139, 174, 218, 0.1);
}

.carbon-markets-project-row:last-child {
    border-bottom: 0;
}

.carbon-markets-project-row span {
    color: var(--text-muted);
    font-size: 0.7rem;
}

.carbon-markets-project-row strong {
    color: var(--text-primary);
    font-size: 0.72rem;
    text-align: right;
}

/* =========================================================
   NEXT ACTION
   ========================================================= */

.carbon-markets-next-action-content {
    padding: 22px;
}

.carbon-markets-action-state {
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr);
    gap: 15px;
    margin-bottom: 18px;
    padding: 18px;
    border: 1px solid var(--border-primary);
    border-radius: 12px;
}

.carbon-markets-action-state.ready {
    border-color: rgba(84, 213, 170, 0.22);
    background: rgba(84, 213, 170, 0.07);
}

.carbon-markets-action-state.review {
    border-color: rgba(242, 187, 75, 0.22);
    background: rgba(242, 187, 75, 0.07);
}

.carbon-markets-action-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: rgba(84, 213, 170, 0.12);
    color: var(--green-primary);
    font-weight: 900;
}

.carbon-markets-action-state.review
.carbon-markets-action-icon {
    background: rgba(242, 187, 75, 0.12);
    color: var(--amber-primary);
}

.carbon-markets-action-state strong {
    color: var(--text-primary);
    font-size: 0.84rem;
}

.carbon-markets-action-state p {
    margin: 7px 0 0;
    color: var(--text-muted);
    font-size: 0.69rem;
    line-height: 1.55;
}

.carbon-markets-primary-link,
.carbon-markets-secondary-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 43px;
    padding: 0 14px;
    border-radius: 9px;
    font-size: 0.72rem;
    font-weight: 800;
    text-decoration: none;
}

.carbon-markets-primary-link {
    border: 1px solid rgba(85, 160, 255, 0.35);
    background: rgba(46, 112, 213, 0.18);
    color: var(--text-primary);
}

.carbon-markets-secondary-link {
    border: 1px solid var(--border-primary);
    background: rgba(18, 44, 74, 0.7);
    color: var(--text-secondary);
}

/* =========================================================
   WORKFLOW
   ========================================================= */

.carbon-markets-workflow-list {
    padding: 8px 22px;
}

.carbon-markets-workflow-step {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) auto;
    align-items: center;
    gap: 15px;
    padding: 16px 0;
    border-bottom: 1px solid rgba(139, 174, 218, 0.1);
}

.carbon-markets-workflow-step:last-child {
    border-bottom: 0;
}

.carbon-markets-workflow-number {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border: 1px solid var(--border-primary);
    border-radius: 50%;
    background: rgba(139, 174, 218, 0.07);
    color: var(--text-muted);
    font-size: 0.72rem;
    font-weight: 850;
}

.carbon-markets-workflow-step.complete
.carbon-markets-workflow-number {
    border-color: rgba(84, 213, 170, 0.3);
    background: rgba(84, 213, 170, 0.1);
    color: var(--green-primary);
}

.carbon-markets-workflow-step.current
.carbon-markets-workflow-number {
    border-color: rgba(85, 160, 255, 0.38);
    background: rgba(85, 160, 255, 0.12);
    color: var(--blue-secondary);
}

.carbon-markets-workflow-content > span {
    color: var(--blue-secondary);
    font-size: 0.59rem;
    font-weight: 800;
    letter-spacing: 0.05em;
}

.carbon-markets-workflow-content strong {
    display: block;
    margin-top: 4px;
    color: var(--text-primary);
    font-size: 0.76rem;
}

.carbon-markets-workflow-content p {
    margin: 5px 0 0;
    color: var(--text-muted);
    font-size: 0.67rem;
    line-height: 1.45;
}

/* =========================================================
   REGISTRY CARDS
   ========================================================= */

.carbon-markets-registry-header > a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #9bc5ff;
    font-size: 0.7rem;
    font-weight: 750;
    text-decoration: none;
}

.carbon-markets-registry-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
    padding: 22px;
}

.carbon-markets-registry-card {
    display: flex;
    flex-direction: column;
    min-height: 330px;
    padding: 18px;
    border: 1px solid rgba(139, 174, 218, 0.12);
    border-radius: 12px;
    background: rgba(5, 22, 39, 0.56);
    transition:
        transform 160ms ease,
        border-color 160ms ease,
        background 160ms ease;
}

.carbon-markets-registry-card:hover {
    transform: translateY(-2px);
    border-color: rgba(85, 160, 255, 0.28);
    background: rgba(8, 29, 50, 0.76);
}

.carbon-markets-registry-card.selected {
    border-color: rgba(84, 213, 170, 0.3);
}

.carbon-markets-registry-card-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.carbon-markets-registry-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 44px;
    height: 40px;
    padding: 0 10px;
    border: 1px solid rgba(85, 160, 255, 0.24);
    border-radius: 9px;
    background: rgba(85, 160, 255, 0.09);
    color: #95c0ff;
    font-size: 0.64rem;
    font-weight: 900;
    letter-spacing: 0.04em;
}

.carbon-markets-registry-heading {
    margin-top: 20px;
}

.carbon-markets-registry-heading > span {
    color: var(--blue-secondary);
    font-size: 0.59rem;
    font-weight: 800;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.carbon-markets-registry-heading h3 {
    margin: 6px 0;
    color: var(--text-primary);
    font-size: 1rem;
}

.carbon-markets-registry-heading p {
    margin: 0;
    color: var(--text-muted);
    font-size: 0.67rem;
}

.carbon-markets-registry-compatibility {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 18px;
    padding: 12px 0;
    border-top: 1px solid rgba(139, 174, 218, 0.1);
    border-bottom: 1px solid rgba(139, 174, 218, 0.1);
}

.carbon-markets-registry-compatibility span {
    color: var(--text-muted);
    font-size: 0.65rem;
}

.carbon-markets-registry-compatibility strong {
    font-size: 0.65rem;
    text-align: right;
}

.carbon-markets-compatibility-healthy {
    color: var(--green-primary);
}

.carbon-markets-compatibility-good {
    color: var(--blue-secondary);
}

.carbon-markets-compatibility-warning {
    color: var(--amber-primary);
}

.carbon-markets-compatibility-neutral {
    color: var(--text-muted);
}

.carbon-markets-registry-action {
    margin: 15px 0 0;
    color: var(--text-secondary);
    font-size: 0.68rem;
    line-height: 1.5;
}

.carbon-markets-registry-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 39px;
    margin-top: auto;
    padding: 0 12px;
    border: 1px solid rgba(85, 160, 255, 0.2);
    border-radius: 8px;
    background: rgba(85, 160, 255, 0.07);
    color: #9bc5ff;
    font-size: 0.68rem;
    font-weight: 750;
    text-decoration: none;
}

/* =========================================================
   MODULE CARDS
   ========================================================= */

.carbon-markets-module-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.carbon-markets-module-card {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr) 22px;
    align-items: start;
    gap: 14px;
    min-height: 160px;
    padding: 18px;
    border: 1px solid var(--border-primary);
    border-radius: 12px;
    background:
        linear-gradient(
            145deg,
            rgba(13, 37, 64, 0.9),
            rgba(7, 25, 44, 0.94)
        );
    color: inherit;
    text-decoration: none;
    transition:
        transform 160ms ease,
        border-color 160ms ease,
        box-shadow 160ms ease;
}

.carbon-markets-module-card:hover {
    transform: translateY(-3px);
    border-color: var(--border-hover);
    box-shadow: 0 15px 28px rgba(0, 0, 0, 0.17);
}

.carbon-markets-module-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border: 1px solid rgba(85, 160, 255, 0.22);
    border-radius: 10px;
    background: rgba(85, 160, 255, 0.08);
    color: #91bdff;
    font-weight: 900;
}

.carbon-markets-module-card > div > span {
    color: var(--blue-secondary);
    font-size: 0.59rem;
    font-weight: 800;
    letter-spacing: 0.05em;
}

.carbon-markets-module-card h3 {
    margin: 6px 0 8px;
    color: var(--text-primary);
    font-size: 0.95rem;
}

.carbon-markets-module-card p {
    margin: 0;
    color: var(--text-muted);
    font-size: 0.67rem;
    line-height: 1.5;
}

.carbon-markets-module-card > strong {
    align-self: center;
    color: #8fbaff;
    font-size: 1rem;
}

/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 1180px) {
    .carbon-markets-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .carbon-markets-overview-grid {
        grid-template-columns: 1fr;
    }

    .carbon-markets-registry-grid,
    .carbon-markets-module-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .carbon-markets-page {
        padding: 24px 18px 55px;
    }

    .carbon-markets-header {
        flex-direction: column;
    }

    .carbon-markets-header-status {
        align-items: flex-start;
    }

    .carbon-markets-summary-grid,
    .carbon-markets-registry-grid,
    .carbon-markets-module-grid {
        grid-template-columns: 1fr;
    }

    .carbon-markets-panel-header {
        align-items: flex-start;
        flex-direction: column;
    }

    .carbon-markets-workflow-step {
        grid-template-columns: 38px minmax(0, 1fr);
    }

    .carbon-markets-workflow-step
    > .carbon-markets-status-badge {
        grid-column: 2;
        justify-self: start;
    }
}

/* =========================================================
   CARBON MARKET REGISTRIES
   ========================================================= */

.market-registries-page {
    min-height: calc(100vh - var(--topbar-height));
    padding: 32px 30px 70px;
}

.market-registries-page-container {
    width: min(100%, var(--page-width));
    margin: 0 auto;
}

/* =========================================================
   HEADER
   ========================================================= */

.market-registries-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 30px;
    margin: 24px 0 26px;
}

.market-registries-header-content {
    max-width: 820px;
}

.market-registries-eyebrow {
    color: var(--blue-secondary);
    font-size: 0.68rem;
    font-weight: 850;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.market-registries-header h1 {
    margin: 8px 0 11px;
    color: var(--text-primary);
    font-size: clamp(2.2rem, 4vw, 3.3rem);
    line-height: 1.05;
    letter-spacing: -0.04em;
}

.market-registries-header p {
    max-width: 760px;
    margin: 0;
    color: var(--text-secondary);
    line-height: 1.65;
}

.market-registries-header-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    flex-shrink: 0;
}

/* =========================================================
   SUMMARY CARDS
   ========================================================= */

.market-registries-summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 17px;
    margin-bottom: 20px;
}

.market-registries-summary-card {
    position: relative;
    overflow: hidden;
    min-height: 150px;
    padding: 21px;
    border: 1px solid var(--border-primary);
    border-radius: 14px;
    background:
        linear-gradient(
            145deg,
            rgba(15, 39, 67, 0.94),
            rgba(8, 27, 47, 0.94)
        );
}

.market-registries-summary-card::before {
    position: absolute;
    inset: 0 auto 0 0;
    width: 3px;
    background: var(--blue-secondary);
    content: "";
}

.market-registries-summary-card.readiness::before {
    background: var(--green-primary);
}

.market-registries-summary-card.available::before {
    background: var(--blue-secondary);
}

.market-registries-summary-card.compatible::before {
    background: #9f87ff;
}

.market-registries-summary-card.selected::before {
    background: var(--amber-primary);
}

.market-registries-summary-card > span,
.market-registries-summary-card > strong,
.market-registries-summary-card > small {
    display: block;
}

.market-registries-summary-card > span {
    color: var(--text-muted);
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.045em;
    text-transform: uppercase;
}

.market-registries-summary-card > strong {
    margin: 16px 0 8px;
    color: var(--text-primary);
    font-size: 1.9rem;
    line-height: 1;
}

.market-registries-summary-card > small {
    color: var(--text-muted);
    font-size: 0.68rem;
    line-height: 1.45;
}

.market-registries-selected-value {
    font-size: 1.15rem !important;
    line-height: 1.2 !important;
}

/* =========================================================
   GUIDANCE PANEL
   ========================================================= */

.market-registries-guidance-panel {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    align-items: start;
    gap: 15px;
    margin-bottom: 20px;
    padding: 18px 20px;
    border: 1px solid rgba(85, 160, 255, 0.2);
    border-radius: 12px;
    background: rgba(85, 160, 255, 0.07);
}

.market-registries-guidance-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border: 1px solid rgba(85, 160, 255, 0.28);
    border-radius: 50%;
    color: var(--blue-secondary);
    font-weight: 900;
}

.market-registries-guidance-panel strong {
    color: var(--text-primary);
    font-size: 0.8rem;
}

.market-registries-guidance-panel p {
    margin: 6px 0 0;
    color: var(--text-muted);
    font-size: 0.69rem;
    line-height: 1.55;
}

/* =========================================================
   SHARED PANELS
   ========================================================= */

.market-registries-list-panel,
.market-registries-comparison-panel {
    overflow: hidden;
    margin-bottom: 20px;
    border: 1px solid var(--border-primary);
    border-radius: 15px;
    background:
        linear-gradient(
            145deg,
            rgba(13, 37, 64, 0.94),
            rgba(7, 25, 44, 0.96)
        );
}

.market-registries-panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 20px 22px;
    border-bottom: 1px solid var(--border-primary);
    background: rgba(7, 25, 44, 0.38);
}

.market-registries-panel-header > div > span {
    color: var(--blue-secondary);
    font-size: 0.64rem;
    font-weight: 850;
    letter-spacing: 0.09em;
}

.market-registries-panel-header h2 {
    margin: 5px 0 0;
    color: var(--text-primary);
    font-size: 1.15rem;
}

.market-registries-panel-header > small {
    color: var(--text-muted);
    font-size: 0.68rem;
}

/* =========================================================
   REGISTRY GRID
   ========================================================= */

.market-registries-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    padding: 22px;
}

.market-registry-card {
    display: flex;
    flex-direction: column;
    min-height: 430px;
    padding: 20px;
    border: 1px solid rgba(139, 174, 218, 0.12);
    border-radius: 13px;
    background: rgba(5, 22, 39, 0.56);
    transition:
        transform 160ms ease,
        border-color 160ms ease,
        background 160ms ease,
        box-shadow 160ms ease;
}

.market-registry-card:hover {
    transform: translateY(-2px);
    border-color: rgba(85, 160, 255, 0.28);
    background: rgba(8, 29, 50, 0.76);
    box-shadow: 0 15px 26px rgba(0, 0, 0, 0.15);
}

.market-registry-card.selected {
    border-color: rgba(84, 213, 170, 0.34);
    box-shadow: inset 0 0 0 1px rgba(84, 213, 170, 0.08);
}

.market-registry-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}

.market-registry-code {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 54px;
    height: 42px;
    padding: 0 11px;
    border: 1px solid rgba(85, 160, 255, 0.24);
    border-radius: 9px;
    background: rgba(85, 160, 255, 0.09);
    color: #95c0ff;
    font-size: 0.66rem;
    font-weight: 900;
    letter-spacing: 0.04em;
}

.market-registry-card-heading {
    margin-top: 20px;
}

.market-registry-card-heading > span {
    color: var(--blue-secondary);
    font-size: 0.59rem;
    font-weight: 800;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.market-registry-card-heading h2 {
    margin: 6px 0;
    color: var(--text-primary);
    font-size: 1.1rem;
}

.market-registry-card-heading p {
    margin: 0;
    color: var(--text-muted);
    font-size: 0.68rem;
}

/* =========================================================
   REGISTRY DETAILS
   ========================================================= */

.market-registry-detail-list {
    margin-top: 18px;
    border-top: 1px solid rgba(139, 174, 218, 0.1);
}

.market-registry-detail-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-height: 45px;
    border-bottom: 1px solid rgba(139, 174, 218, 0.1);
}

.market-registry-detail-row span {
    color: var(--text-muted);
    font-size: 0.67rem;
}

.market-registry-detail-row strong {
    color: var(--text-primary);
    font-size: 0.68rem;
    text-align: right;
}

.market-registry-compatibility-healthy {
    color: var(--green-primary) !important;
}

.market-registry-compatibility-good {
    color: var(--blue-secondary) !important;
}

.market-registry-compatibility-warning {
    color: var(--amber-primary) !important;
}

.market-registry-compatibility-neutral {
    color: var(--text-muted) !important;
}

.market-registry-selected-text {
    color: var(--green-primary) !important;
}

/* =========================================================
   RECOMMENDATION
   ========================================================= */

.market-registry-recommendation {
    margin-top: 17px;
    padding: 15px;
    border: 1px solid rgba(139, 174, 218, 0.11);
    border-radius: 9px;
    background: rgba(4, 20, 35, 0.42);
}

.market-registry-recommendation span {
    color: var(--blue-secondary);
    font-size: 0.58rem;
    font-weight: 800;
    letter-spacing: 0.05em;
}

.market-registry-recommendation p {
    margin: 6px 0 0;
    color: var(--text-secondary);
    font-size: 0.67rem;
    line-height: 1.5;
}

/* =========================================================
   CARD ACTIONS
   ========================================================= */

.market-registry-card-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin-top: auto;
    padding-top: 18px;
}

.market-registry-secondary-action,
.market-registry-primary-action,
.market-registry-selected-action {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    min-height: 40px;
    padding: 0 12px;
    border-radius: 8px;
    font-size: 0.68rem;
    font-weight: 750;
    text-decoration: none;
}

.market-registry-secondary-action {
    border: 1px solid var(--border-primary);
    background: rgba(18, 44, 74, 0.7);
    color: var(--text-secondary);
}

.market-registry-primary-action {
    border: 1px solid rgba(85, 160, 255, 0.3);
    background: rgba(46, 112, 213, 0.18);
    color: var(--text-primary);
    cursor: pointer;
}

.market-registry-select-form {
    margin: 0;
}

.market-registry-selected-action {
    border: 1px solid rgba(84, 213, 170, 0.28);
    background: rgba(84, 213, 170, 0.09);
    color: var(--green-primary);
}

/* =========================================================
   SELECTION PROCESS
   ========================================================= */

.market-registries-comparison-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 15px;
    padding: 22px;
}

.market-registries-comparison-card {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);
    align-items: start;
    gap: 13px;
    padding: 17px;
    border: 1px solid rgba(139, 174, 218, 0.11);
    border-radius: 10px;
    background: rgba(4, 20, 35, 0.42);
}

.market-registries-comparison-number {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border: 1px solid rgba(85, 160, 255, 0.25);
    border-radius: 50%;
    background: rgba(85, 160, 255, 0.08);
    color: var(--blue-secondary);
    font-size: 0.68rem;
    font-weight: 850;
}

.market-registries-comparison-card strong {
    color: var(--text-primary);
    font-size: 0.76rem;
}

.market-registries-comparison-card p {
    margin: 6px 0 0;
    color: var(--text-muted);
    font-size: 0.67rem;
    line-height: 1.5;
}

/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 1050px) {
    .market-registries-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .market-registries-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {
    .market-registries-page {
        padding: 24px 18px 55px;
    }

    .market-registries-header {
        flex-direction: column;
    }

    .market-registries-header-actions {
        align-items: stretch;
        flex-direction: column;
        width: 100%;
    }

    .market-registries-header-actions a {
        width: 100%;
    }

    .market-registries-summary-grid,
    .market-registries-comparison-grid {
        grid-template-columns: 1fr;
    }

    .market-registries-panel-header {
        align-items: flex-start;
        flex-direction: column;
    }

    .market-registry-card-actions {
        grid-template-columns: 1fr;
    }
}

/* =========================================================
   REGISTRY DETAILS
   ========================================================= */

.registry-details-page {
    min-height: calc(100vh - var(--topbar-height));
    padding: 32px 30px 70px;
}

.registry-details-page-container {
    width: min(100%, var(--page-width));
    margin: 0 auto;
}

/* =========================================================
   HEADER
   ========================================================= */

.registry-details-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 30px;
    margin: 24px 0 26px;
}

.registry-details-header-content {
    max-width: 820px;
}

.registry-details-eyebrow {
    color: var(--blue-secondary);
    font-size: 0.68rem;
    font-weight: 850;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.registry-details-title-row {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: flex-start;
    gap: 18px;
    margin-top: 10px;
}

.registry-details-code {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 64px;
    height: 52px;
    padding: 0 13px;
    border: 1px solid rgba(85, 160, 255, 0.26);
    border-radius: 11px;
    background: rgba(85, 160, 255, 0.09);
    color: #9bc5ff;
    font-size: 0.7rem;
    font-weight: 900;
    letter-spacing: 0.05em;
}

.registry-details-header h1 {
    margin: 0 0 10px;
    color: var(--text-primary);
    font-size: clamp(2.2rem, 4vw, 3.3rem);
    line-height: 1.05;
    letter-spacing: -0.04em;
}

.registry-details-header p {
    max-width: 760px;
    margin: 0;
    color: var(--text-secondary);
    line-height: 1.65;
}

.registry-details-header-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    flex-shrink: 0;
}

.registry-details-select-form {
    margin: 0;
}

.registry-details-selected-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    min-height: 44px;
    padding: 0 17px;
    border: 1px solid rgba(84, 213, 170, 0.3);
    border-radius: 10px;
    background: rgba(84, 213, 170, 0.1);
    color: var(--green-primary);
    font-size: 0.74rem;
    font-weight: 800;
}

/* =========================================================
   SUMMARY CARDS
   ========================================================= */

.registry-details-summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 17px;
    margin-bottom: 20px;
}

.registry-details-summary-card {
    position: relative;
    overflow: hidden;
    min-height: 150px;
    padding: 21px;
    border: 1px solid var(--border-primary);
    border-radius: 14px;
    background:
        linear-gradient(
            145deg,
            rgba(15, 39, 67, 0.94),
            rgba(8, 27, 47, 0.94)
        );
}

.registry-details-summary-card::before {
    position: absolute;
    inset: 0 auto 0 0;
    width: 3px;
    background: var(--blue-secondary);
    content: "";
}

.registry-details-summary-card.readiness::before {
    background: var(--green-primary);
}

.registry-details-summary-card.requirements::before {
    background: var(--blue-secondary);
}

.registry-details-summary-card.credits::before {
    background: #9f87ff;
}

.registry-details-summary-card.value::before {
    background: var(--amber-primary);
}

.registry-details-summary-card > span,
.registry-details-summary-card > strong,
.registry-details-summary-card > small {
    display: block;
}

.registry-details-summary-card > span {
    color: var(--text-muted);
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.045em;
    text-transform: uppercase;
}

.registry-details-summary-card > strong {
    margin: 16px 0 8px;
    color: var(--text-primary);
    font-size: 1.9rem;
    line-height: 1;
}

.registry-details-summary-card > small {
    color: var(--text-muted);
    font-size: 0.68rem;
    line-height: 1.45;
}

/* =========================================================
   SHARED PANELS
   ========================================================= */

.registry-details-overview-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 18px;
    margin-bottom: 20px;
}

.registry-details-profile-panel,
.registry-details-action-panel,
.registry-details-requirements-panel,
.registry-details-methodologies-panel {
    overflow: hidden;
    border: 1px solid var(--border-primary);
    border-radius: 15px;
    background:
        linear-gradient(
            145deg,
            rgba(13, 37, 64, 0.94),
            rgba(7, 25, 44, 0.96)
        );
}

.registry-details-requirements-panel,
.registry-details-methodologies-panel {
    margin-bottom: 20px;
}

.registry-details-panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 20px 22px;
    border-bottom: 1px solid var(--border-primary);
    background: rgba(7, 25, 44, 0.38);
}

.registry-details-panel-header > div > span {
    color: var(--blue-secondary);
    font-size: 0.64rem;
    font-weight: 850;
    letter-spacing: 0.09em;
}

.registry-details-panel-header h2 {
    margin: 5px 0 0;
    color: var(--text-primary);
    font-size: 1.15rem;
}

.registry-details-panel-header > a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #9bc5ff;
    font-size: 0.7rem;
    font-weight: 750;
    text-decoration: none;
}

/* =========================================================
   PROFILE PANEL
   ========================================================= */

.registry-details-profile-content {
    padding: 22px;
}

.registry-details-profile-highlight {
    margin-bottom: 17px;
    padding: 18px;
    border: 1px solid rgba(85, 160, 255, 0.2);
    border-radius: 11px;
    background: rgba(85, 160, 255, 0.07);
}

.registry-details-profile-highlight span,
.registry-details-profile-highlight strong {
    display: block;
}

.registry-details-profile-highlight span {
    color: var(--text-muted);
    font-size: 0.62rem;
    font-weight: 800;
    text-transform: uppercase;
}

.registry-details-profile-highlight strong {
    margin-top: 8px;
    font-size: 1.15rem;
}

.registry-details-compatibility-healthy {
    color: var(--green-primary);
}

.registry-details-compatibility-good {
    color: var(--blue-secondary);
}

.registry-details-compatibility-warning {
    color: var(--amber-primary);
}

.registry-details-compatibility-neutral {
    color: var(--text-muted);
}

.registry-details-profile-row,
.registry-details-action-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    min-height: 47px;
    border-bottom: 1px solid rgba(139, 174, 218, 0.1);
}

.registry-details-profile-row:last-child,
.registry-details-action-row:last-child {
    border-bottom: 0;
}

.registry-details-profile-row span,
.registry-details-action-row span {
    color: var(--text-muted);
    font-size: 0.7rem;
}

.registry-details-profile-row strong,
.registry-details-action-row strong {
    color: var(--text-primary);
    font-size: 0.72rem;
    text-align: right;
}

.registry-details-selected-text {
    color: var(--green-primary) !important;
}

.registry-details-warning-value {
    color: var(--amber-primary) !important;
}

/* =========================================================
   ACTION PANEL
   ========================================================= */

.registry-details-action-content {
    padding: 22px;
}

.registry-details-action-state {
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr);
    gap: 15px;
    margin-bottom: 18px;
    padding: 18px;
    border: 1px solid var(--border-primary);
    border-radius: 12px;
}

.registry-details-action-healthy,
.registry-details-action-good {
    border-color: rgba(84, 213, 170, 0.22);
    background: rgba(84, 213, 170, 0.07);
}

.registry-details-action-warning {
    border-color: rgba(242, 187, 75, 0.22);
    background: rgba(242, 187, 75, 0.07);
}

.registry-details-action-neutral {
    background: rgba(139, 174, 218, 0.06);
}

.registry-details-action-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: rgba(84, 213, 170, 0.12);
    color: var(--green-primary);
    font-weight: 900;
}

.registry-details-action-warning
.registry-details-action-icon {
    background: rgba(242, 187, 75, 0.12);
    color: var(--amber-primary);
}

.registry-details-action-state strong {
    color: var(--text-primary);
    font-size: 0.84rem;
}

.registry-details-action-state p {
    margin: 7px 0 0;
    color: var(--text-muted);
    font-size: 0.69rem;
    line-height: 1.55;
}

/* =========================================================
   REQUIREMENTS
   ========================================================= */

.registry-details-requirement-list {
    padding: 10px 22px;
}

.registry-details-requirement-item {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) auto;
    align-items: center;
    gap: 15px;
    padding: 15px 0;
    border-bottom: 1px solid rgba(139, 174, 218, 0.1);
}

.registry-details-requirement-item:last-child {
    border-bottom: 0;
}

.registry-details-requirement-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border: 1px solid var(--border-primary);
    border-radius: 50%;
    font-size: 0.72rem;
    font-weight: 900;
}

.registry-details-requirement-healthy
.registry-details-requirement-icon {
    border-color: rgba(84, 213, 170, 0.3);
    background: rgba(84, 213, 170, 0.1);
    color: var(--green-primary);
}

.registry-details-requirement-warning
.registry-details-requirement-icon {
    border-color: rgba(242, 187, 75, 0.3);
    background: rgba(242, 187, 75, 0.1);
    color: var(--amber-primary);
}

.registry-details-requirement-content {
    min-width: 0;
}

.registry-details-requirement-content > span {
    color: var(--blue-secondary);
    font-size: 0.59rem;
    font-weight: 800;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.registry-details-requirement-content strong {
    display: block;
    margin-top: 4px;
    color: var(--text-primary);
    font-size: 0.76rem;
}

.registry-details-requirement-content p {
    margin: 5px 0 0;
    color: var(--text-muted);
    font-size: 0.67rem;
    line-height: 1.45;
}

/* =========================================================
   METHODOLOGIES
   ========================================================= */

.registry-details-methodology-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    padding: 22px;
}

.registry-details-methodology-card {
    display: flex;
    flex-direction: column;
    min-height: 285px;
    padding: 18px;
    border: 1px solid rgba(139, 174, 218, 0.12);
    border-radius: 12px;
    background: rgba(5, 22, 39, 0.56);
}

.registry-details-methodology-card.selected {
    border-color: rgba(84, 213, 170, 0.34);
}

.registry-details-methodology-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.registry-details-methodology-code {
    display: inline-flex;
    align-items: center;
    min-height: 35px;
    padding: 0 10px;
    border: 1px solid rgba(85, 160, 255, 0.22);
    border-radius: 8px;
    background: rgba(85, 160, 255, 0.08);
    color: #9bc5ff;
    font-size: 0.61rem;
    font-weight: 850;
}

.registry-details-methodology-heading {
    margin-top: 18px;
}

.registry-details-methodology-heading > span {
    color: var(--blue-secondary);
    font-size: 0.59rem;
    font-weight: 800;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.registry-details-methodology-heading h3 {
    margin: 6px 0 8px;
    color: var(--text-primary);
    font-size: 0.95rem;
}

.registry-details-methodology-heading p {
    margin: 0;
    color: var(--text-muted);
    font-size: 0.67rem;
    line-height: 1.5;
}

.registry-details-methodology-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    margin-top: auto;
    padding-top: 17px;
    border-top: 1px solid rgba(139, 174, 218, 0.1);
}

.registry-details-methodology-footer span {
    color: var(--text-muted);
    font-size: 0.66rem;
}

.registry-details-methodology-footer strong {
    font-size: 0.67rem;
    text-align: right;
}

.registry-details-candidate-text {
    color: var(--green-primary);
}

.registry-details-review-text {
    color: var(--amber-primary);
}

/* =========================================================
   EMPTY STATE
   ========================================================= */

.registry-details-empty-state {
    padding: 55px 24px;
    text-align: center;
}

.registry-details-empty-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    margin-bottom: 14px;
    border: 1px solid var(--border-primary);
    border-radius: 50%;
    background: rgba(139, 174, 218, 0.08);
    color: var(--text-muted);
    font-weight: 900;
}

.registry-details-empty-state h3 {
    margin: 0;
    color: var(--text-primary);
    font-size: 1rem;
}

.registry-details-empty-state p {
    max-width: 520px;
    margin: 8px auto 0;
    color: var(--text-muted);
    font-size: 0.72rem;
    line-height: 1.55;
}

/* =========================================================
   DISCLAIMER
   ========================================================= */

.registry-details-disclaimer {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    align-items: start;
    gap: 15px;
    padding: 18px 20px;
    border: 1px solid rgba(85, 160, 255, 0.2);
    border-radius: 12px;
    background: rgba(85, 160, 255, 0.07);
}

.registry-details-disclaimer-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border: 1px solid rgba(85, 160, 255, 0.28);
    border-radius: 50%;
    color: var(--blue-secondary);
    font-weight: 900;
}

.registry-details-disclaimer strong {
    color: var(--text-primary);
    font-size: 0.8rem;
}

.registry-details-disclaimer p {
    margin: 6px 0 0;
    color: var(--text-muted);
    font-size: 0.69rem;
    line-height: 1.55;
}

/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 1100px) {
    .registry-details-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .registry-details-overview-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {
    .registry-details-page {
        padding: 24px 18px 55px;
    }

    .registry-details-header {
        flex-direction: column;
    }

    .registry-details-title-row {
        grid-template-columns: 1fr;
    }

    .registry-details-header-actions {
        align-items: stretch;
        flex-direction: column;
        width: 100%;
    }

    .registry-details-header-actions a,
    .registry-details-header-actions form,
    .registry-details-header-actions button,
    .registry-details-selected-button {
        width: 100%;
    }

    .registry-details-summary-grid,
    .registry-details-methodology-grid {
        grid-template-columns: 1fr;
    }

    .registry-details-panel-header {
        align-items: flex-start;
        flex-direction: column;
    }

    .registry-details-requirement-item {
        grid-template-columns: 36px minmax(0, 1fr);
    }

    .registry-details-requirement-item
    > .carbon-markets-status-badge {
        grid-column: 2;
        justify-self: start;
    }
}

/* =========================================================
   SIDEBAR TREE HEIGHT FIX
   Keep this block at the END of the stylesheet.
   The earlier 620px / 420px limits clipped nested Operations
   content before the final "View All Events" link.
   ========================================================= */

.sidebar-tree-group.is-open
> .sidebar-tree-children {
    max-height: 3000px;
    overflow: visible;
}

.sidebar-tree-subgroup.is-open
> .sidebar-tree-grandchildren {
    max-height: 1200px;
    overflow: visible;
}

.sidebar-tree-children > *,
.sidebar-tree-grandchildren > * {
    overflow: visible;
}

.sidebar-tree-detail-list {
    max-height: 220px;
    overflow-y: auto;
    overflow-x: hidden;
    scrollbar-width: thin;
}

.sidebar-tree-detail-list::-webkit-scrollbar {
    width: 6px;
}

.sidebar-tree-detail-list::-webkit-scrollbar-thumb {
    border-radius: 999px;
    background: rgba(117, 139, 165, 0.35);
}

.sidebar-tree-detail-list::-webkit-scrollbar-track {
    background: transparent;
}

/* =========================================================
   OPERATIONS OVERVIEW
   MATCH ACCOUNTING LANDING PAGE WIDTH
   ========================================================= */

.operations-page {
    min-height: calc(100vh - var(--topbar-height));
    padding: 30px 30px 70px;
}

.operations-page-container {
    width: 100%;
    min-width: 0;
    margin: 0 auto;
}