


/* ==========================================================
   UNITEDLYNKS PORTAL DESIGN SYSTEM
========================================================== */

:root {
    --ul-portal-navy: #081827;
    --ul-portal-navy-2: #10283f;

    --ul-portal-bronze: #a78348;
    --ul-portal-bronze-soft: #c6aa78;

    --ul-portal-bg: #f5f6f7;
    --ul-portal-surface: #ffffff;

    --ul-portal-text: #18222d;
    --ul-portal-muted: #667482;
    --ul-portal-border: #e1e5e9;

    --ul-portal-radius: .7rem;

    --ul-portal-shadow:
        0 10px 30px rgba(8,24,39,.055);
}


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

.fi-body {
    background:
        var(--ul-portal-bg);
    color:
        var(--ul-portal-text);
}

.fi-main {
    padding-top: 1.5rem;
}

.fi-main-ctn {
    background:
        var(--ul-portal-bg);
}


/* ==========================================================
   SIDEBAR
========================================================== */

.fi-sidebar {
    background:
        var(--ul-portal-navy);

    border-right:
        1px solid rgba(255,255,255,.06);}

.fi-sidebar-header {
    background:
        var(--ul-portal-navy);

    border-bottom:
        1px solid rgba(255,255,255,.07);

    box-shadow: none;
}

.fi-sidebar-nav {
    padding-top: 1rem;
}

.fi-sidebar-group-label {
    color:
        rgba(255,255,255,.42);

    font-size: .68rem;
    font-weight: 700;

    letter-spacing: .08em;
    text-transform: uppercase;
}

.fi-sidebar-item-button {
    border-radius: .6rem;

    color:
        rgba(255,255,255,.72);

    transition:
        background .16s ease,
        color .16s ease;
}

.fi-sidebar-item-button:hover {
    background:
        rgba(255,255,255,.07);

    color:
        #fff;
}

.fi-sidebar-item.fi-active
.fi-sidebar-item-button {
    background:
        rgba(198,170,120,.16);

    color:
        #fff;

    box-shadow:
        inset 3px 0 0
        var(--ul-portal-bronze-soft);
}

.fi-sidebar-item-icon {
    color:
        rgba(255,255,255,.52);
}

.fi-sidebar-item.fi-active
.fi-sidebar-item-icon {
    color:
        var(--ul-portal-bronze-soft);
}


/* ==========================================================
   TOPBAR
========================================================== */

.fi-topbar nav {
    background:
        rgba(255,255,255,.97);

    border-bottom:
        1px solid var(--ul-portal-border);

    box-shadow:
        0 4px 18px rgba(8,24,39,.035);

    backdrop-filter:
        blur(12px);
}


/* ==========================================================
   HEADINGS
========================================================== */

.fi-header-heading {
    color:
        var(--ul-portal-navy);

    font-weight: 720;

    letter-spacing:
        -.025em;
}

.fi-header-subheading {
    color:
        var(--ul-portal-muted);
}


/* ==========================================================
   SECTIONS / CARDS
========================================================== */

.fi-section {
    overflow: hidden;

    background:
        var(--ul-portal-surface);

    border:
        1px solid var(--ul-portal-border);

    border-radius:
        var(--ul-portal-radius);

    box-shadow:
        var(--ul-portal-shadow);
}

.fi-section-header {
    border-bottom:
        1px solid #eef0f2;
}

.fi-section-header-heading {
    color:
        var(--ul-portal-navy);

    font-weight: 700;
}

.fi-section-header-description {
    color:
        var(--ul-portal-muted);
}


/* ==========================================================
   STATS
========================================================== */

.fi-wi-stats-overview-stat {
    border:
        1px solid var(--ul-portal-border);

    border-radius:
        var(--ul-portal-radius);

    box-shadow:
        var(--ul-portal-shadow);

    transition:
        transform .15s ease,
        box-shadow .15s ease;
}

.fi-wi-stats-overview-stat:hover {
    transform:
        translateY(-2px);

    box-shadow:
        0 16px 36px rgba(8,24,39,.075);
}

.fi-wi-stats-overview-stat-value {
    color:
        var(--ul-portal-navy);

    font-weight: 730;
}


/* ==========================================================
   TABLES
========================================================== */

.fi-ta {
    overflow: hidden;

    border:
        1px solid var(--ul-portal-border);

    border-radius:
        var(--ul-portal-radius);

    box-shadow:
        var(--ul-portal-shadow);
}

.fi-ta-header {
    background:
        #fbfbfc;

    border-bottom:
        1px solid var(--ul-portal-border);
}

.fi-ta-header-heading {
    color:
        var(--ul-portal-navy);
}

.fi-ta-row {
    transition:
        background .12s ease;
}

.fi-ta-row:hover {
    background:
        #fafbfc;
}

.fi-ta-header-cell {
    color:
        #536170;

    font-size:
        .72rem;

    font-weight:
        700;

    letter-spacing:
        .025em;
}


/* ==========================================================
   FORMS
========================================================== */

.fi-fo-field-wrp-label {
    color:
        #354352;

    font-weight:
        650;
}

.fi-input-wrp {
    border-radius:
        .6rem;
}

.fi-input,
.fi-select-input {
    color:
        var(--ul-portal-text);
}

.fi-fo-field-wrp-helper-text {
    color:
        #75818d;
}


/* ==========================================================
   BUTTONS
========================================================== */

.fi-btn {
    border-radius:
        .58rem;

    font-weight:
        650;

    transition:
        transform .12s ease,
        box-shadow .12s ease;
}

.fi-btn:hover {
    transform:
        translateY(-1px);
}


/* ==========================================================
   BADGES
========================================================== */

.fi-badge {
    border-radius:
        999px;

    font-weight:
        650;

    letter-spacing:
        .01em;
}


/* ==========================================================
   MODALS
========================================================== */

.fi-modal-window {
    border-radius:
        .85rem;

    box-shadow:
        0 30px 90px rgba(8,24,39,.18);
}


/* ==========================================================
   LOGIN / AUTH
========================================================== */

.fi-simple-layout {
    background:
        linear-gradient(
            145deg,
            #f7f8f9,
            #eef1f3
        );
}

.fi-simple-main {
    border:
        1px solid var(--ul-portal-border);

    border-radius:
        1rem;

    box-shadow:
        0 24px 70px rgba(8,24,39,.10);
}


/* ==========================================================
   MOBILE
========================================================== */

@media (max-width: 768px) {

    .fi-main {
        padding-top:
            .75rem;
    }

    .fi-header {
        gap:
            .85rem;
    }

    .fi-section {
        border-radius:
            .6rem;
    }

    .fi-ta {
        border-radius:
            .6rem;
    }

    .fi-btn {
        min-height:
            2.65rem;
    }

}


/* ==========================================================
   UNITEDLYNKS ADMIN UI — EXECUTIVE LIGHT MODE
   Phase 2A
========================================================== */

/*
|--------------------------------------------------------------------------
| Application Chrome
|--------------------------------------------------------------------------
*/

.fi-body,
.fi-main,
.fi-main-ctn {
    background: #f5f6f7 !important;
    color: #18222d;
}


/*
|--------------------------------------------------------------------------
| Topbar
|--------------------------------------------------------------------------
*/

.fi-topbar nav {
    background: #ffffff !important;

    border-bottom:
        1px solid #e1e5e9 !important;

    box-shadow:
        0 4px 18px rgba(8, 24, 39, .035) !important;
}


/*
|--------------------------------------------------------------------------
| Brand
|--------------------------------------------------------------------------
*/

.fi-logo {
    color: #081827 !important;

    font-weight: 750;

    letter-spacing: -.015em;
}


/*
|--------------------------------------------------------------------------
| Dashboard Widgets
|--------------------------------------------------------------------------
*/

.fi-wi-stats-overview-stat {
    background: #ffffff !important;

    color: #18222d !important;

    border:
        1px solid #e1e5e9 !important;

    box-shadow:
        0 7px 22px rgba(8,24,39,.045) !important;
}

.fi-wi-stats-overview-stat-value {
    color: #081827 !important;

    font-weight: 750 !important;
}

.fi-wi-stats-overview-stat-label {
    color: #536170 !important;

    font-weight: 650;
}

.fi-wi-stats-overview-stat-description {
    color: #73808d !important;
}


/*
|--------------------------------------------------------------------------
| Sections
|--------------------------------------------------------------------------
*/

.fi-section {
    background: #ffffff !important;

    color: #18222d !important;
}


/*
|--------------------------------------------------------------------------
| Tables
|--------------------------------------------------------------------------
*/

.fi-ta {
    background: #ffffff !important;
}

.fi-ta-header {
    background: #fafbfc !important;
}


/*
|--------------------------------------------------------------------------
| Inputs
|--------------------------------------------------------------------------
*/

.fi-input-wrp {
    background: #ffffff !important;
}


/*
|--------------------------------------------------------------------------
| Sidebar
|--------------------------------------------------------------------------
*/

.fi-sidebar {
    background: #081b2b !important;}

.fi-sidebar-header {
    background: #081b2b !important;
}


/*
|--------------------------------------------------------------------------
| Desktop Density
|--------------------------------------------------------------------------
*/

@media (min-width: 1024px) {

    .fi-main {
        padding-top: 1.15rem;
    }

    .fi-wi-stats-overview-stat {
        min-height: auto !important;
    }

}


/* ==========================================================
   UNITEDLYNKS EXECUTIVE OPERATIONS DASHBOARD
   Phase 3
========================================================== */


/* COMMAND HEADER */

.ul-admin-command {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 2rem;

    padding: 1.45rem 1.6rem;

    background: #ffffff;

    border:
        1px solid #e1e5e9;

    border-radius:
        .72rem;

    box-shadow:
        0 8px 24px rgba(8,24,39,.045);
}

.ul-admin-command__content {
    max-width: 760px;
}

.ul-admin-command__eyebrow {
    color: #9a763e;

    font-size: .67rem;
    font-weight: 800;

    letter-spacing: .12em;
}

.ul-admin-command h2 {
    margin: .28rem 0 0;

    color: #081827;

    font-size: 1.55rem;
    font-weight: 740;

    letter-spacing: -.025em;
}

.ul-admin-command__date {
    margin-top: .22rem;

    color: #77838e;

    font-size: .76rem;
}

.ul-admin-command p {
    margin: .7rem 0 0;

    color: #5d6a77;

    font-size: .84rem;
    line-height: 1.6;
}

.ul-admin-command p strong {
    color: #172534;
}

.ul-admin-command__actions {
    display: flex;

    flex-wrap: wrap;

    justify-content: flex-end;

    gap: .5rem;
}

.ul-admin-quick-action {
    min-height: 2.35rem;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    padding: 0 .85rem;

    color: #273847;

    background: #fff;

    border:
        1px solid #d5dbe0;

    border-radius: .52rem;

    font-size: .73rem;
    font-weight: 680;

    transition:
        background .15s ease,
        border-color .15s ease;
}

.ul-admin-quick-action:hover {
    background: #f6f7f8;

    border-color: #bfc7ce;
}

.ul-admin-quick-action--primary {
    color: #fff;

    background: #9c7136;

    border-color: #9c7136;
}

.ul-admin-quick-action--primary:hover {
    background: #855f2d;

    border-color: #855f2d;
}


/* ACTION REQUIRED */

.ul-admin-panel {
    overflow: hidden;

    background: #fff;

    border: 1px solid #e1e5e9;

    border-radius: .72rem;

    box-shadow:
        0 8px 24px rgba(8,24,39,.04);
}

.ul-admin-panel__header {
    min-height: 4.3rem;

    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 1rem;

    padding: .9rem 1.2rem;

    border-bottom: 1px solid #e8ebee;
}

.ul-admin-panel__header span {
    color: #9a763e;

    font-size: .62rem;
    font-weight: 800;

    letter-spacing: .1em;
}

.ul-admin-panel__header h3 {
    margin: .12rem 0 0;

    color: #102131;

    font-size: 1rem;
    font-weight: 720;
}

.ul-admin-panel__count {
    padding:
        .3rem .55rem;

    color: #556371;

    background: #f3f5f6;

    border-radius: 999px;

    font-size: .68rem;
    font-weight: 700;
}

.ul-admin-alert-list {
    display: grid;
}

.ul-admin-alert {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 1rem;

    padding: .9rem 1.2rem;

    border-bottom: 1px solid #edf0f2;
}

.ul-admin-alert:last-child {
    border-bottom: 0;
}

.ul-admin-alert > div {
    position: relative;

    padding-left: 1rem;
}

.ul-admin-alert > div::before {
    content: "";

    position: absolute;

    left: 0;
    top: .32rem;

    width: .4rem;
    height: .4rem;

    border-radius: 50%;

    background: #d49532;
}

.ul-admin-alert--critical > div::before {
    background: #b44949;
}

.ul-admin-alert strong,
.ul-admin-alert span {
    display: block;
}

.ul-admin-alert strong {
    color: #1a2937;

    font-size: .78rem;
}

.ul-admin-alert span {
    margin-top: .14rem;

    color: #75818c;

    font-size: .7rem;
}

.ul-admin-alert a {
    flex-shrink: 0;

    color: #8a642f;

    font-size: .71rem;
    font-weight: 750;
}

.ul-admin-clear-state {
    padding: 1.1rem 1.2rem;
}

.ul-admin-clear-state strong,
.ul-admin-clear-state span {
    display: block;
}

.ul-admin-clear-state strong {
    color: #267451;

    font-size: .8rem;
}

.ul-admin-clear-state span {
    margin-top: .2rem;

    color: #74818d;

    font-size: .72rem;
}


/* COMPACT KPI CARDS */

.fi-wi-stats-overview-stat {
    min-height: 8.3rem !important;

    padding: 1.05rem 1.15rem !important;
}

.fi-wi-stats-overview-stat-value {
    font-size: 1.65rem !important;

    line-height: 1.15 !important;
}

.fi-wi-stats-overview-stat-label {
    font-size: .76rem !important;
}

.fi-wi-stats-overview-stat-description {
    font-size: .69rem !important;
}


/* DASHBOARD TABLE */

.fi-ta {
    box-shadow:
        0 8px 24px rgba(8,24,39,.04) !important;
}


/* MOBILE */

@media (max-width: 900px) {

    .ul-admin-command {
        align-items: flex-start;

        flex-direction: column;
    }

    .ul-admin-command__actions {
        justify-content: flex-start;
    }

}


@media (max-width: 640px) {

    .ul-admin-command {
        padding: 1.15rem;
    }

    .ul-admin-command__actions {
        width: 100%;
    }

    .ul-admin-quick-action {
        flex: 1 1 calc(50% - .5rem);
    }

    .ul-admin-alert {
        align-items: flex-start;

        flex-direction: column;
    }

}


/* ==========================================================
   UNITEDLYNKS ADMIN REFINEMENT — PHASE 3B
========================================================== */


/* SIDEBAR READABILITY */

.fi-sidebar {}

.fi-sidebar .fi-sidebar-item-label {
    color: #e7edf3 !important;
    font-weight: 560 !important;
}

.fi-sidebar .fi-sidebar-item-icon {
    color: #aebdca !important;
}

.fi-sidebar .fi-sidebar-item-button:hover {
    background: rgba(255,255,255,.065) !important;
}

.fi-sidebar .fi-sidebar-item-button:hover
.fi-sidebar-item-label {
    color: #ffffff !important;
}

.fi-sidebar .fi-sidebar-item-button:hover
.fi-sidebar-item-icon {
    color: #ffffff !important;
}

.fi-sidebar .fi-sidebar-item.fi-active
.fi-sidebar-item-button {
    background: rgba(255,255,255,.09) !important;

    box-shadow:
        inset 3px 0 0 #b79255 !important;
}

.fi-sidebar .fi-sidebar-item.fi-active
.fi-sidebar-item-label {
    color: #ffffff !important;
    font-weight: 720 !important;
}

.fi-sidebar .fi-sidebar-item.fi-active
.fi-sidebar-item-icon {
    color: #c9aa73 !important;
}

.fi-sidebar .fi-sidebar-group-label {
    color: #96a9b9 !important;

    font-size: .67rem !important;

    font-weight: 760 !important;

    letter-spacing: .09em !important;
}

.fi-sidebar .fi-sidebar-group-button,
.fi-sidebar .fi-sidebar-group-collapse-button,
.fi-sidebar .fi-sidebar-group-collapse-button svg {
    color: #aebdca !important;
}

.fi-sidebar-group {
    margin-top: .65rem !important;
}


/* SUBTLE SIDEBAR SCROLLBAR */

.fi-sidebar-nav {
    scrollbar-width: thin;
    scrollbar-color:
        rgba(255,255,255,.18)
        transparent;
}

.fi-sidebar-nav::-webkit-scrollbar {
    width: 5px;
}

.fi-sidebar-nav::-webkit-scrollbar-track {
    background: transparent;
}

.fi-sidebar-nav::-webkit-scrollbar-thumb {
    background:
        rgba(255,255,255,.16);

    border-radius: 999px;
}

.fi-sidebar-nav::-webkit-scrollbar-thumb:hover {
    background:
        rgba(255,255,255,.26);
}


/* WELCOME PANEL */

.ul-admin-command {
    padding: 1.15rem 1.35rem;
}

.ul-admin-command__topline {
    display: flex;
    align-items: center;

    gap: .8rem;

    flex-wrap: wrap;
}

.ul-admin-command h2 {
    margin-top: .38rem;

    font-size: 1.4rem;
}

.ul-admin-command__meta {
    display: flex;
    align-items: center;

    gap: .75rem;

    flex-wrap: wrap;

    margin-top: .25rem;

    color: #77838e;

    font-size: .69rem;
}

.ul-admin-command__meta span + span {
    position: relative;

    padding-left: .75rem;
}

.ul-admin-command__meta span + span::before {
    content: "";

    position: absolute;

    left: 0;
    top: 50%;

    width: 3px;
    height: 3px;

    border-radius: 50%;

    background: #aab3bb;

    transform: translateY(-50%);
}

.ul-admin-command p {
    margin-top: .55rem;
}

.ul-admin-operating-status {
    display: inline-flex;
    align-items: center;

    gap: .35rem;

    padding: .25rem .5rem;

    border-radius: 999px;

    font-size: .63rem;
    font-weight: 720;
}

.ul-admin-operating-status span {
    width: .4rem;
    height: .4rem;

    border-radius: 50%;
}

.ul-admin-operating-status--clear {
    color: #256448;
    background: #edf8f2;
}

.ul-admin-operating-status--clear span {
    background: #2e8a61;
}

.ul-admin-operating-status--attention {
    color: #80561d;
    background: #fff7e8;
}

.ul-admin-operating-status--attention span {
    background: #d18a24;
}

.ul-admin-command__actions {
    flex-wrap: nowrap;
}

.ul-admin-quick-action {
    white-space: nowrap;
}


/* LIVE OPERATIONS */

.ul-live-operations {
    overflow: hidden;

    background: #ffffff;

    border: 1px solid #e1e5e9;

    border-radius: .72rem;

    box-shadow:
        0 7px 22px rgba(8,24,39,.04);
}

.ul-live-operations__header {
    min-height: 3.9rem;

    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 1rem;

    padding: .8rem 1.15rem;

    border-bottom: 1px solid #e8ebee;
}

.ul-live-operations__header span {
    color: #98713b;

    font-size: .61rem;
    font-weight: 800;

    letter-spacing: .1em;
}

.ul-live-operations__header h3 {
    margin: .1rem 0 0;

    color: #102131;

    font-size: .95rem;
    font-weight: 720;
}

.ul-live-operations__header small {
    color: #7a8691;

    font-size: .66rem;
}

.ul-live-status-grid {
    display: grid;

    grid-template-columns:
        repeat(4, minmax(0,1fr));
}

.ul-live-status {
    min-height: 5.9rem;

    display: flex;
    align-items: center;

    gap: .75rem;

    padding: .85rem 1rem;

    border-right: 1px solid #edf0f2;
    border-bottom: 1px solid #edf0f2;

    transition:
        background .14s ease;
}

.ul-live-status:nth-child(4n) {
    border-right: 0;
}

.ul-live-status:nth-last-child(-n+4) {
    border-bottom: 0;
}

.ul-live-status:hover {
    background: #fafbfc;
}

.ul-live-status__icon-wrap {
    width: 2rem;
    height: 2rem;

    display: flex;
    align-items: center;
    justify-content: center;

    flex-shrink: 0;

    border-radius: .5rem;

    background: #f2f4f6;
}

.ul-live-status__icon {
    width: 1.05rem;
    height: 1.05rem;

    color: #607080;
}

.ul-live-status span {
    display: block;

    color: #65727f;

    font-size: .67rem;
    font-weight: 620;
}

.ul-live-status strong {
    display: block;

    margin-top: .1rem;

    color: #0c1e2e;

    font-size: 1.35rem;
    line-height: 1.15;
}

.ul-live-status--clear
.ul-live-status__icon-wrap {
    background: #edf8f2;
}

.ul-live-status--clear
.ul-live-status__icon {
    color: #34785a;
}

.ul-live-status--attention
.ul-live-status__icon-wrap {
    background: #fff6e7;
}

.ul-live-status--attention
.ul-live-status__icon {
    color: #b47620;
}

.ul-live-status--critical
.ul-live-status__icon-wrap {
    background: #fff0f0;
}

.ul-live-status--critical
.ul-live-status__icon {
    color: #a94545;
}

.ul-live-status--info
.ul-live-status__icon-wrap {
    background: #eef5fb;
}

.ul-live-status--info
.ul-live-status__icon {
    color: #3b6f99;
}


/* QUIETER ZERO VALUES */

.ul-live-status--neutral strong,
.ul-live-status--clear strong {
    font-weight: 690;
}


/* RESPONSIVE */

@media (max-width: 1250px) {

    .ul-admin-command {
        align-items: flex-start;

        flex-direction: column;
    }

    .ul-admin-command__actions {
        width: 100%;
        justify-content: flex-start;
    }

}


@media (max-width: 1000px) {

    .ul-live-status-grid {
        grid-template-columns:
            repeat(2, minmax(0,1fr));
    }

    .ul-live-status:nth-child(4n) {
        border-right:
            1px solid #edf0f2;
    }

    .ul-live-status:nth-child(2n) {
        border-right: 0;
    }

    .ul-live-status:nth-last-child(-n+4) {
        border-bottom:
            1px solid #edf0f2;
    }

    .ul-live-status:nth-last-child(-n+2) {
        border-bottom: 0;
    }

}


@media (max-width: 700px) {

    .ul-admin-command__actions {
        flex-wrap: wrap;
    }

    .ul-admin-quick-action {
        flex:
            1 1 calc(50% - .5rem);
    }

    .ul-live-status-grid {
        grid-template-columns: 1fr;
    }

    .ul-live-status {
        border-right: 0 !important;
        border-bottom:
            1px solid #edf0f2 !important;
    }

    .ul-live-status:last-child {
        border-bottom: 0 !important;
    }

}


/* ==========================================================
   UNITEDLYNKS WORKSPACE REFINEMENT — PHASE 4B
========================================================== */

/*
|--------------------------------------------------------------------------
| Sidebar
|--------------------------------------------------------------------------
*/

.fi-sidebar {}

/* Navigation */

.fi-sidebar-item-button {
    transition:
        background-color .14s ease,
        box-shadow .14s ease,
        color .14s ease !important;
}

.fi-sidebar-item-button:hover {
    background:
        rgba(255,255,255,.075) !important;
}

.fi-sidebar-item-button:focus-visible {
    outline:
        2px solid rgba(198,170,120,.55);

    outline-offset: 2px;
}

.fi-sidebar-item.fi-active
.fi-sidebar-item-button {
    background:
        rgba(255,255,255,.10) !important;

    box-shadow:
        inset 3px 0 0 #b79255 !important;
}


/*
|--------------------------------------------------------------------------
| Content Workspace
|--------------------------------------------------------------------------
*/

.fi-main {
    transition:
        padding .16s ease;
}


/*
|--------------------------------------------------------------------------
| Panels / Sections
|--------------------------------------------------------------------------
*/

.fi-section,
.ul-admin-panel,
.ul-live-operations,
.ul-admin-command {
    border-radius:
        .72rem !important;

    transition:
        border-color .15s ease,
        box-shadow .15s ease,
        background-color .15s ease;
}

.fi-section:hover {
    border-color:
        #d2d8de !important;

    box-shadow:
        0 8px 24px rgba(8,24,39,.05) !important;
}


/*
|--------------------------------------------------------------------------
| Dashboard Cards
|--------------------------------------------------------------------------
*/

.fi-wi-stats-overview-stat,
.ul-live-status {
    transition:
        background-color .15s ease,
        border-color .15s ease,
        box-shadow .15s ease,
        transform .15s ease;
}

.fi-wi-stats-overview-stat:hover,
.ul-live-status:hover {
    background:
        #fafbfc !important;

    border-color:
        #d6dce1 !important;

    box-shadow:
        0 9px 24px rgba(8,24,39,.055) !important;

    transform:
        translateY(-1px);
}


/*
|--------------------------------------------------------------------------
| Tables
|--------------------------------------------------------------------------
*/

.fi-ta-row {
    transition:
        background-color .12s ease,
        box-shadow .12s ease;
}

.fi-ta-row:hover {
    background:
        #f7f9fa !important;

    box-shadow:
        inset 3px 0 0 rgba(167,131,72,.45);
}


/*
|--------------------------------------------------------------------------
| Tabs
|--------------------------------------------------------------------------
*/

.fi-tabs-item {
    transition:
        background-color .14s ease,
        color .14s ease,
        box-shadow .14s ease;
}

.fi-tabs-item:hover {
    background:
        #f3f5f6;
}


/*
|--------------------------------------------------------------------------
| Buttons
|--------------------------------------------------------------------------
*/

.fi-btn {
    transition:
        background-color .14s ease,
        border-color .14s ease,
        box-shadow .14s ease,
        transform .14s ease !important;
}

.fi-btn:hover {
    transform:
        translateY(-1px);

    box-shadow:
        0 5px 14px rgba(8,24,39,.07);
}


/*
|--------------------------------------------------------------------------
| Inputs
|--------------------------------------------------------------------------
*/

.fi-input-wrp {
    transition:
        border-color .14s ease,
        box-shadow .14s ease;
}

.fi-input-wrp:hover {
    border-color:
        #c9d0d6 !important;
}


/*
|--------------------------------------------------------------------------
| Scrollbar
|--------------------------------------------------------------------------
*/

.fi-sidebar-nav {
    scrollbar-width: thin;
    scrollbar-color:
        rgba(255,255,255,.16)
        transparent;
}

.fi-sidebar-nav::-webkit-scrollbar {
    width: 4px;
}

.fi-sidebar-nav::-webkit-scrollbar-thumb {
    background:
        rgba(255,255,255,.16);

    border-radius:
        999px;
}


/*
|--------------------------------------------------------------------------
| Record Details
|--------------------------------------------------------------------------
*/

.fi-in .fi-section {
    margin-bottom:
        .15rem;
}

.fi-in .fi-section-content {
    padding:
        1rem 1.1rem !important;
}

.fi-in-entry-wrp-state {
    line-height:
        1.45 !important;
}


/* ==========================================================
   UNITEDLYNKS EXECUTIVE RECORD SYSTEM — PHASE 4D
========================================================== */


/* Workspace */

.fi-body,
.fi-main-ctn {
    background:
        #f3f5f7 !important;
}

.fi-main {
    padding-top:
        1.1rem !important;
}


/* Page header */

.fi-header {
    margin-bottom:
        1rem !important;
}

.fi-header-heading {
    color:
        #0b1d30 !important;

    font-size:
        1.62rem !important;

    font-weight:
        740 !important;

    letter-spacing:
        -.025em !important;
}


/* Breadcrumbs */

.fi-breadcrumbs {
    margin-bottom:
        .3rem !important;
}

.fi-breadcrumbs-item {
    font-size:
        .71rem !important;
}


/* Remove generic large-card appearance */

.fi-in {
    gap:
        .75rem !important;
}

.fi-in .fi-section {
    overflow:
        hidden;

    background:
        #ffffff !important;

    border:
        1px solid #dce2e7 !important;

    border-radius:
        .58rem !important;

    box-shadow:
        none !important;

    transition:
        border-color .14s ease,
        box-shadow .14s ease,
        background-color .14s ease;
}

.fi-in .fi-section:hover {
    border-color:
        #cbd3da !important;

    box-shadow:
        0 4px 14px rgba(8,24,39,.035) !important;
}


/* Compact section header */

.fi-in .fi-section-header {
    min-height:
        auto !important;

    padding:
        .68rem .9rem !important;

    background:
        #f8fafb !important;

    border-bottom:
        1px solid #e4e8eb !important;
}

.fi-in .fi-section-header-heading {
    color:
        #112638 !important;

    font-size:
        .78rem !important;

    font-weight:
        740 !important;

    letter-spacing:
        .01em;
}

.fi-in .fi-section-header-description {
    display:
        none !important;
}


/* Compact content */

.fi-in .fi-section-content {
    padding:
        .82rem .9rem !important;
}


/* Field labels */

.fi-in-entry-wrp-label {
    color:
        #6c7884 !important;

    font-size:
        .64rem !important;

    font-weight:
        650 !important;

    letter-spacing:
        .015em !important;
}


/* Field values */

.fi-in-entry-wrp-state {
    color:
        #172635 !important;

    font-size:
        .78rem !important;

    line-height:
        1.4 !important;
}


/* Executive overview strip */

.ul-record-overview {
    border-top:
        3px solid #9c7136 !important;

    background:
        #ffffff !important;
}

.ul-record-overview
.fi-section-content {
    padding:
        .85rem 1rem !important;
}

.ul-record-overview
.fi-in-entry-wrp-state {
    font-size:
        .82rem !important;
}


/* Route */

.ul-record-route {
    background:
        #fbfcfd !important;
}

.ul-record-route
.fi-in-entry-wrp-state {
    font-size:
        .86rem !important;
}


/* Secondary sections */

.fi-in .fi-section.fi-section-secondary {
    background:
        #f8fafb !important;

    border-color:
        #e2e6e9 !important;
}


/* Badges */

.fi-in .fi-badge {
    padding:
        .18rem .46rem !important;

    border-radius:
        999px !important;

    font-size:
        .63rem !important;

    font-weight:
        720 !important;
}


/* Muted unavailable data */

.fi-in-entry-wrp-state:is(
    [data-placeholder]
) {
    color:
        #8a949d !important;
}


/* Top action buttons */

.fi-header-actions .fi-btn {
    min-height:
        2.35rem !important;

    padding-inline:
        .85rem !important;

    border-radius:
        .48rem !important;
}


/* Top bar */

.fi-topbar nav {
    min-height:
        4rem !important;

    border-bottom:
        1px solid #dfe4e8 !important;

    box-shadow:
        none !important;
}


/* Sidebar - final desktop proportions */

.fi-sidebar {
    border-right:
        1px solid rgba(255,255,255,.07) !important;}

.fi-sidebar-item-button {
    min-height:
        2.55rem !important;

    border-radius:
        .48rem !important;
}


/* Collapsed rail */

@media (min-width: 1024px) {

    .fi-sidebar.fi-sidebar-open {
        transition:
            width .16s ease !important;
    }

}


/* Mobile */

@media (max-width: 768px) {

    .fi-in {
        gap:
            .6rem !important;
    }

    .fi-in .fi-section-content {
        padding:
            .75rem !important;
    }

}
