/*!
 * Pavana — SAP Ariba theme layer (ariba.css)
 * ------------------------------------------------------------------
 * Restyles the portal to look like SAP Ariba (Buying / Sourcing /
 * Business Network), i.e. the SAP Fiori 3 "Quartz Light" design language
 * that Ariba ships in the browser:
 *
 *   · dark shell bar (#354a5f) with white wordmark, bell, user chip
 *   · white horizontal tab bar with hover drop-downs instead of a sidebar
 *   · page title inside the content area (Ariba page header)
 *   · flat white panels with 1px #d9d9d9 borders and 4px corners
 *   · boxed white inputs (1px #89919a), blue #0a6ed1 emphasized buttons,
 *     white/blue-outline standard buttons
 *   · grey table header rows, plain-text semantic statuses
 *
 * Loaded AFTER horizon.css and BEFORE responsive.css in
 * layouts/app.blade.php and the three auth views. It re-points the design
 * tokens that pavana.css / horizon.css already read, then overrides the
 * shell. Remove the single <link> to fall back to the Horizon look.
 *
 * The mobile/tablet drawer (≤1024px) is untouched: every layout rule that
 * turns the sidebar into a menubar is wrapped in @media (min-width:1025px).
 */

/* ============================================================ */
/* 1. Quartz Light tokens                                       */
/* ============================================================ */
:root {
    /* Brand / interaction (sapBrandColor, sapButton_Emphasized_*) */
    --primary: #0a6ed1;
    --primary-light: #085caf;           /* hover — Quartz darkens on hover */
    --primary-dark: #0854a0;
    --primary-subtle: #e5f0fa;          /* sapList_SelectionBackgroundColor */
    --accent: #0a6ed1;

    /* Semantic value states (sapPositive/Critical/Negative/Informative) */
    --hz-positive: #107e3e;
    --hz-positive-bg: #f1fdf6;
    --hz-critical: #e9730c;
    --hz-critical-bg: #fef7f1;
    --hz-negative: #bb0000;
    --hz-negative-bg: #ffebeb;
    --hz-informative: #0a6ed1;
    --hz-informative-bg: #f5faff;
    --hz-neutral: #6a6d70;
    --hz-neutral-bg: #f4f4f4;

    /* Surfaces */
    --bg: #f7f7f7;                      /* sapBackgroundColor */
    --card-bg: #ffffff;
    --surface: #ffffff;
    --border: #e5e5e5;                  /* sapList_BorderColor */
    --text: #32363a;                    /* sapTextColor */
    --text-muted: #6a6d70;              /* sapContent_LabelColor */
    --muted: #f2f2f2;

    /* Shell */
    --ar-shell-bg: #354a5f;             /* sapShellColor */
    --ar-shell-text: #ffffff;
    --ar-shell-hover: rgba(255,255,255,.12);
    --ar-panel-border: #d9d9d9;         /* sapGroup_ContentBorderColor */
    --sidebar-bg: #ffffff;
    --sidebar-border: #d9d9d9;
    --sidebar-active: #e5f0fa;
    --topbar-height: 44px;
    --ar-menubar-height: 40px;
    --hz-shell-icon: #6a6d70;
    --hz-btn-text: #0854a0;             /* sapButton_TextColor */
    --hz-btn-border: #0854a0;           /* sapButton_BorderColor */
    --hz-field-border: #89919a;         /* sapField_BorderColor */
    --hz-field-bg: #ffffff;
    --hz-field-bg-hover: #ffffff;

    /* Fiori 3 shape language — square-ish */
    --radius: 0.25rem;
    --radius-sm: 0.25rem;
    --hz-radius-field: 0.125rem;

    /* Fiori 3 elevation (sapContent_Shadow0/1/2) */
    --shadow-sm: 0 0 0.125rem 0 rgba(0,0,0,.1);
    --shadow:    0 0 0.125rem 0 rgba(0,0,0,.1), 0 0.125rem 0.5rem 0 rgba(0,0,0,.1);
    --shadow-lg: 0 0 0 0.0625rem rgba(0,0,0,.1), 0 0.625rem 1.875rem 0 rgba(0,0,0,.3);

    /* Bootstrap 5.3 */
    --bs-primary: #0a6ed1;
    --bs-primary-rgb: 10,110,209;
    --bs-success-rgb: 16,126,62;
    --bs-danger-rgb: 187,0,0;
    --bs-warning-rgb: 233,115,12;
    --bs-info-rgb: 10,110,209;
    --bs-link-color: #0854a0;
    --bs-link-hover-color: #0a6ed1;
    --bs-link-color-rgb: 8,84,160;
    --bs-link-hover-color-rgb: 10,110,209;
    --bs-border-radius: 0.25rem;
    --bs-border-color: #e5e5e5;

    /* Aliases used inline by Blade views */
    --card: #ffffff;
    --surface2: #f7f7f7;
    --border-base: #e5e5e5;
    --text-dark: #32363a;
    --text-heading: #32363a;
    --success: #107e3e;
    --danger: #bb0000;
    --warning: #e9730c;
}

/* ============================================================ */
/* 2. Typography                                                */
/* ============================================================ */
body { color: var(--text); background: var(--bg); }
h1, h2, h3, h4, h5, h6 { color: var(--text); }
a { color: var(--hz-btn-text); }
/* Ariba underlines text links on hover, never buttons or nav */
.pavana-content a:not([class*="btn"]):not(.nav-link):not(.page-link):not(.pavana-tab):hover { text-decoration: underline; }
::selection { background: #e5f0fa; }

/* ============================================================ */
/* 3. Shell bar — dark Fiori 3 shell (sapShellColor)            */
/* ============================================================ */
.pavana-topbar {
    background: var(--ar-shell-bg);
    border-bottom: 0;
    box-shadow: none;
    color: var(--ar-shell-text);
    padding: 0 16px;
    gap: 10px;
}
/* Wordmark on the left of the shell, like "SAP Ariba" */
.ar-shell-brand {
    display: flex; align-items: center; gap: 10px;
    height: 100%; text-decoration: none; color: var(--ar-shell-text);
    flex-shrink: 0;
}
.ar-shell-brand img { height: 28px; width: auto; object-fit: contain; }
.ar-shell-brand-name { font-size: .95rem; font-weight: 400; white-space: nowrap; letter-spacing: .01em; }
.ar-shell-brand-name b { font-weight: 700; }
.ar-shell-spacer { flex: 1; }
/* The page title moved into the content area (Ariba page header) */
.topbar-title { display: none !important; }

.topbar-btn { color: var(--ar-shell-text); border-radius: var(--radius-sm); }
.topbar-btn:hover { background: var(--ar-shell-hover); color: var(--ar-shell-text); }
.topbar-notif-dot { background: #ff8888; border-color: var(--ar-shell-bg); }
.topbar-divider { background: rgba(255,255,255,.28); }
.topbar-hamburger, .topbar-hamburger:hover { color: var(--ar-shell-text); }
.topbar-hamburger:hover { background: var(--ar-shell-hover); }

.user-chip { background: transparent; border-radius: var(--radius-sm); }
.user-chip:hover { background: var(--ar-shell-hover); }
.user-avatar { background: #ebf5fe; border: 0; color: #0854a0; font-weight: 600; }
.user-info-name { color: var(--ar-shell-text); font-weight: 400; }
.user-info-role { color: rgba(255,255,255,.72); }
.user-chip .fa-pen { color: rgba(255,255,255,.7) !important; }

.topbar-logout { color: var(--ar-shell-text); font-weight: 400; border-radius: var(--radius-sm); }
.topbar-logout:hover { background: var(--ar-shell-hover); color: var(--ar-shell-text); }

/* Notification popover keeps a light body under the dark shell */
#notif-dropdown { border-radius: var(--radius) !important; box-shadow: var(--shadow-lg) !important; border-color: var(--ar-panel-border) !important; }

/* Chat pill sits in the shell: transparent shell-button styling */
#fw-chat-fab {
    top: 7px; height: 30px;
    background: transparent;
    border: 1px solid rgba(255,255,255,.6);
    color: #fff;
    box-shadow: none;
    border-radius: var(--radius-sm);
    font-family: var(--hz-font);
    font-weight: 400;
}
#fw-chat-fab:hover { background: var(--ar-shell-hover); transform: translateX(-50%); box-shadow: none; }
#fw-chat-panel { border-radius: var(--radius); border-color: var(--ar-panel-border); box-shadow: var(--shadow-lg); }
@media (max-width: 1024px) {
    /* responsive.css turns the pill into a round corner button on a light page */
    #fw-chat-fab { background: #0a6ed1; border: 0; box-shadow: var(--shadow); }
    #fw-chat-fab:hover { background: #085caf; }
}

/* ============================================================ */
/* 4. Navigation                                                */
/*    ≤1024px  — pavana.css/responsive.css off-canvas drawer   */
/*    ≥1025px  — Ariba horizontal tab bar with drop-downs       */
/* ============================================================ */
/* Drawer (all sizes): Fiori 3 colours */
.pavana-sidebar { border-right: 1px solid var(--sidebar-border); background: var(--sidebar-bg); }
.nav-item, .nav-parent-toggle { border-radius: var(--radius-sm); color: var(--text); font-weight: 400; }
.nav-item:hover, .nav-parent-toggle:hover { background: #f5f5f5; color: var(--hz-btn-text); }
.nav-item.active { background: var(--sidebar-active); color: var(--hz-btn-text); font-weight: 600; box-shadow: inset 0.1875rem 0 0 var(--primary); }
.nav-parent-toggle.active { color: var(--hz-btn-text); font-weight: 600; }
.nav-submenu .nav-item { color: var(--text); }
.nav-submenu .nav-item.active { color: var(--hz-btn-text); }
.sidebar-overlay { background: rgba(0,0,0,.5); }
/* Fiori side navigation icons are monochrome — drop pavana.css's per-module hues */
.sidebar-nav .nav-item .nav-icon,
.sidebar-nav .nav-parent-toggle .nav-icon { color: var(--hz-btn-text) !important; background: transparent !important; }

@media (min-width: 1025px) {
    /* The <aside> is placed after the shell bar inside .pavana-main, so in
       normal flow it becomes a full-width menubar directly under the shell. */
    .pavana-sidebar {
        position: static;
        top: auto; left: auto;
        width: 100%; height: var(--ar-menubar-height);
        flex-direction: row;
        flex-shrink: 0;
        border-right: 0;
        border-bottom: 1px solid var(--ar-panel-border);
        box-shadow: 0 1px 2px rgba(0,0,0,.06);
        overflow: visible;
        transform: none !important;
        transition: none;
        z-index: 150;
    }
    .sidebar-header, .sidebar-close-btn { display: none !important; }
    .sidebar-nav {
        flex-direction: row; align-items: stretch;
        padding: 0 12px; gap: 0;
        height: var(--ar-menubar-height);
        overflow: visible;
    }
    .sidebar-nav > .nav-item,
    .sidebar-nav .nav-parent-toggle {
        height: var(--ar-menubar-height);
        width: auto;
        padding: 0 14px;
        margin: 0;
        border-radius: 0;
        border-bottom: 3px solid transparent;
        font-size: .86rem;
        font-weight: 400;
        color: var(--text);
        background: transparent;
        white-space: nowrap;
        gap: 6px;
        transition: color .12s;
    }
    .sidebar-nav > .nav-item:hover,
    .sidebar-nav .nav-parent-toggle:hover,
    .sidebar-nav .nav-parent:hover > .nav-parent-toggle {
        background: transparent;
        color: var(--hz-btn-text);
    }
    .sidebar-nav > .nav-item.active,
    .sidebar-nav .nav-parent-toggle.active {
        background: transparent;
        color: var(--hz-btn-text);
        font-weight: 600;
        border-bottom-color: var(--primary);
        box-shadow: none;
    }
    /* Ariba tabs carry no icons */
    .sidebar-nav .nav-icon { display: none !important; }
    .sidebar-nav .nav-icon + * { margin-left: 0; }
    .sidebar-nav .nav-parent-toggle .nav-chevron {
        display: inline-block !important;
        margin-left: 2px;
        font-size: .5rem;
        color: var(--hz-shell-icon);
        transform: rotate(90deg) !important;    /* fa-chevron-right → caret down */
    }
    .sidebar-nav .nav-parent-toggle.active .nav-chevron,
    .sidebar-nav .nav-parent:hover .nav-chevron { color: var(--hz-btn-text); }

    /* Drop-down menus */
    .nav-parent { position: relative; height: var(--ar-menubar-height); }
    .nav-submenu {
        position: absolute; top: 100%; left: 0;
        display: none;
        max-height: none;
        overflow: visible;
        min-width: 15rem;
        background: #fff;
        border: 1px solid var(--ar-panel-border);
        border-top: 0;
        border-radius: 0 0 var(--radius) var(--radius);
        box-shadow: 0 0.25rem 0.75rem rgba(0,0,0,.18);
        z-index: 400;
        padding: 6px 0;
        transition: none;
    }
    .nav-parent:hover > .nav-submenu,
    .nav-parent:focus-within > .nav-submenu { display: block; }
    .nav-submenu-inner { padding: 0; }
    .nav-submenu .nav-item {
        padding: 8px 18px;
        font-size: .86rem;
        gap: 8px;
        border-radius: 0;
        color: var(--text);
        width: 100%;
    }
    .nav-submenu .nav-item::before,
    .nav-submenu .nav-item::after { display: none; }
    .nav-submenu .nav-item:hover { background: #f5f5f5; color: var(--hz-btn-text); }
    .nav-submenu .nav-item.active { background: var(--sidebar-active); color: var(--hz-btn-text); box-shadow: none; }
    /* Ariba drop-down group captions (Manage / Create) */
    .nav-submenu-caption {
        display: block;
        padding: 6px 18px 4px;
        font-size: .7rem;
        font-weight: 700;
        letter-spacing: .04em;
        text-transform: uppercase;
        color: var(--text-muted);
    }
    /* Unread-chat counter sits inline in the tab, not pinned to the right edge */
    #sidebar-chat-badge { position: static !important; transform: none !important; margin-left: 4px; }
    /* Lock icon that the layout appends on disabled modules */
    .sidebar-nav .nav-item.nav-disabled .fa-lock { position: static !important; margin-left: 4px; }

    /* Shell bar + tab bar stay put while the page scrolls (Fiori launchpad
       shell); .pavana-main is padded by their combined height. */
    .pavana-topbar { position: fixed; top: 0; left: 0; right: 0; z-index: 300; }
    .pavana-sidebar { position: fixed; top: var(--topbar-height); left: 0; right: 0; }
    .pavana-main { margin-left: 0; padding-top: calc(var(--topbar-height) + var(--ar-menubar-height)); }
    html { scroll-padding-top: calc(var(--topbar-height) + var(--ar-menubar-height) + 8px); }
}
/* Drawer (≤1024px): the group captions are plain small labels */
@media (max-width: 1024px) {
    .nav-submenu-caption { display: block; padding: 6px 12px 2px 34px; font-size: .62rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--text-muted); }
}

/* ============================================================ */
/* 5. Page header — Ariba puts the title inside the page        */
/* ============================================================ */
.pavana-content { max-width: none; padding: 0 24px 24px; }
.ar-page-header {
    display: flex; align-items: flex-end; justify-content: space-between;
    flex-wrap: wrap; gap: 8px 16px;
    padding: 18px 0 12px;
    margin-bottom: 10px;
}
.ar-page-title {
    font-size: 1.375rem;
    font-weight: 400;
    line-height: 1.3;
    color: var(--text);
    margin: 0;
    font-family: var(--hz-font);
}
.ar-page-sub { font-size: .8rem; color: var(--text-muted); margin-top: 2px; }
.ar-page-sub:empty { display: none; }
#pavana-alert-container { padding: 8px 24px 0 !important; max-width: none !important; }
/* Reports ships its own in-page <h1>; the layout header now carries the title */
.pavana-content .pavana-page-header:has(> h1:only-child) { display: none !important; }

/* ============================================================ */
/* 6. Panels, cards, tiles — flat white with hairline border    */
/* ============================================================ */
.pavana-card, .card {
    background: var(--card-bg);
    border: 1px solid var(--ar-panel-border);
    border-radius: var(--radius);
    box-shadow: none;
}
.pavana-card-header {
    background: #f7f7f7;
    border-bottom: 1px solid var(--ar-panel-border);
    border-radius: var(--radius) var(--radius) 0 0;
}
.pavana-card-header h2, .pavana-card-header h3 { color: var(--text); font-weight: 700; font-size: .85rem; }
.pavana-card-header i { color: var(--hz-shell-icon); }

.kpi-card {
    border: 1px solid var(--ar-panel-border);
    border-radius: var(--radius);
    box-shadow: var(--shadow-sm);
}
.kpi-card:hover { box-shadow: var(--shadow); }
.kpi-icon { color: var(--hz-btn-text) !important; border-radius: var(--radius-sm); }
.kpi-label { font-size: .78rem; font-weight: 400; color: var(--text-muted); text-transform: none; letter-spacing: 0; }
.kpi-value { font-weight: 300; color: var(--text); }
.kpi-trend { border-radius: var(--hz-radius-field); }
.kpi-trend.up   { background: transparent; color: var(--hz-positive); padding-left: 0; }
.kpi-trend.down { background: transparent; color: var(--hz-negative); padding-left: 0; }

.detail-section-title { color: var(--text); font-weight: 700; border-bottom: 1px solid var(--ar-panel-border); }
.detail-field label { color: var(--text-muted); font-weight: 400; text-transform: none; letter-spacing: 0; font-size: .74rem; }
.detail-field label::after { content: ":"; }
.detail-field span { font-weight: 400; }

/* ============================================================ */
/* 7. Buttons — Fiori 3 emphasized / standard / transparent     */
/* ============================================================ */
.btn-pavana, .btn {
    border-radius: var(--radius-sm);
    font-weight: 400;
    font-family: var(--hz-font);
}
.btn-pavana { font-size: .76rem; padding: 6px 12px; line-height: 1.2; }
.btn-sm-pavana { padding: 4px 10px; font-size: .74rem; }
.btn-pavana:focus-visible, .btn:focus-visible { outline: 1px dotted var(--text); outline-offset: -3px; box-shadow: none; }

/* Emphasized */
.btn-primary-pavana { background: #0a6ed1; color: #fff; border: 1px solid #0a6ed1; }
.btn-primary-pavana:hover { background: #085caf; border-color: #085caf; color: #fff; }
.btn-primary-pavana:active { background: #0854a0; border-color: #0854a0; }
/* Standard: white with blue border */
.btn-secondary-pavana, .btn-outline-pavana {
    background: #fff; color: var(--hz-btn-text); border: 1px solid var(--hz-btn-border);
}
.btn-secondary-pavana:hover, .btn-outline-pavana:hover { background: #ebf5fe; color: var(--hz-btn-text); border-color: var(--hz-btn-border); }
.btn-success-pavana { background: #fff; color: var(--hz-positive); border: 1px solid var(--hz-positive); }
.btn-success-pavana:hover { background: var(--hz-positive-bg); color: var(--hz-positive); }
.btn-danger-pavana { background: #fff; color: var(--hz-negative); border: 1px solid var(--hz-negative); }
.btn-danger-pavana:hover { background: var(--hz-negative-bg); color: var(--hz-negative); }
/* Transparent icon buttons (row actions) */
.btn-icon-pavana { background: transparent; border: 1px solid transparent; color: var(--hz-btn-text); border-radius: var(--radius-sm); }
.btn-icon-pavana:hover { background: #ebf5fe; border-color: transparent; color: var(--hz-btn-text); }
.btn-danger-icon { color: var(--hz-negative); border-color: transparent; }
.btn-danger-icon:hover { background: var(--hz-negative-bg); color: var(--hz-negative); border-color: transparent; }

/* Bootstrap buttons */
.btn-primary {
    --bs-btn-bg: #0a6ed1; --bs-btn-border-color: #0a6ed1;
    --bs-btn-hover-bg: #085caf; --bs-btn-hover-border-color: #085caf;
    --bs-btn-active-bg: #0854a0; --bs-btn-active-border-color: #0854a0;
    --bs-btn-disabled-bg: #9dc6ee; --bs-btn-disabled-border-color: #9dc6ee;
}
.btn-light, .btn-secondary, .btn-outline-primary, .btn-outline-secondary, .btn-outline-dark {
    --bs-btn-bg: #fff; --bs-btn-color: var(--hz-btn-text);
    --bs-btn-border-color: var(--hz-btn-border);
    --bs-btn-hover-bg: #ebf5fe; --bs-btn-hover-color: var(--hz-btn-text);
    --bs-btn-hover-border-color: var(--hz-btn-border);
    --bs-btn-active-bg: #e5f0fa; --bs-btn-active-color: var(--hz-btn-text);
    --bs-btn-active-border-color: var(--hz-btn-border);
    --bs-btn-disabled-color: var(--text-muted); --bs-btn-disabled-bg: #fff;
    --bs-btn-disabled-border-color: #bfbfbf;
}
.btn-success { --bs-btn-bg: #107e3e; --bs-btn-border-color: #107e3e; --bs-btn-hover-bg: #0d6a34; --bs-btn-hover-border-color: #0d6a34; --bs-btn-active-bg: #0b5a2c; --bs-btn-active-border-color: #0b5a2c; }
.btn-danger  { --bs-btn-bg: #bb0000; --bs-btn-border-color: #bb0000; --bs-btn-hover-bg: #a20000; --bs-btn-hover-border-color: #a20000; --bs-btn-active-bg: #8a0000; --bs-btn-active-border-color: #8a0000; }
.btn-warning { --bs-btn-bg: #e9730c; --bs-btn-border-color: #e9730c; --bs-btn-color: #fff; --bs-btn-hover-bg: #d0660a; --bs-btn-hover-border-color: #d0660a; --bs-btn-hover-color: #fff; }
.btn-outline-danger  { --bs-btn-bg: #fff; --bs-btn-color: #bb0000; --bs-btn-border-color: #bb0000; --bs-btn-hover-bg: #ffebeb; --bs-btn-hover-color: #bb0000; --bs-btn-hover-border-color: #bb0000; }
.btn-outline-success { --bs-btn-bg: #fff; --bs-btn-color: #107e3e; --bs-btn-border-color: #107e3e; --bs-btn-hover-bg: #f1fdf6; --bs-btn-hover-color: #107e3e; --bs-btn-hover-border-color: #107e3e; }
.btn-outline-warning { --bs-btn-bg: #fff; --bs-btn-color: #e9730c; --bs-btn-border-color: #e9730c; --bs-btn-hover-bg: #fef7f1; --bs-btn-hover-color: #e9730c; --bs-btn-hover-border-color: #e9730c; }
.btn-outline-info    { --bs-btn-bg: #fff; --bs-btn-color: var(--hz-btn-text); --bs-btn-border-color: var(--hz-btn-border); --bs-btn-hover-bg: #ebf5fe; --bs-btn-hover-color: var(--hz-btn-text); --bs-btn-hover-border-color: var(--hz-btn-border); }

/* ============================================================ */
/* 8. Fields — boxed white inputs (sapField, Quartz Light)      */
/* ============================================================ */
.pavana-input, .pavana-select-f, .pavana-textarea, .pavana-select,
.li-table .li-input, .li-table input, .li-table select,
.form-control, .form-select, textarea.form-control {
    background-color: #fff;
    border: 1px solid var(--hz-field-border);
    border-radius: var(--hz-radius-field);
    color: var(--text);
    box-shadow: none;
}
.pavana-input:hover, .pavana-select-f:hover, .pavana-textarea:hover,
.pavana-select:hover, .li-table .li-input:hover,
.form-control:hover, .form-select:hover {
    background-color: #fff;
    border-color: #0854a0;
}
.pavana-input:focus, .pavana-select-f:focus, .pavana-textarea:focus,
.pavana-select:focus, .li-table .li-input:focus, .li-table input:focus, .li-table select:focus,
.form-control:focus, .form-select:focus {
    background-color: #fff;
    border: 1px solid #0854a0;
    box-shadow: 0 0 0 1px #0854a0;
    outline: 0;
}
.pavana-input:disabled, .pavana-input[readonly],
.pavana-select-f:disabled, .pavana-textarea[readonly],
.form-control:disabled, .form-control[readonly], .form-select:disabled {
    background-color: #f2f2f2;
    border-style: solid;
    border-color: #bfbfbf;
    color: var(--text);
    opacity: 1;
}
.pavana-label { color: var(--text-muted); font-weight: 400; font-size: .78rem; text-transform: none; letter-spacing: 0; }
.form-label { color: var(--text-muted); font-weight: 400; }
/* Plain caret for selects, Fiori blue */
.pavana-select, .pavana-select-f, .form-select {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%230854a0' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 6l4 4 4-4'/%3E%3C/svg%3E");
    background-size: .85rem;
    background-position: right .5rem center;
}
input[type="date"].pavana-input, input[type="date"].form-control,
input[type="datetime-local"].pavana-input, input[type="datetime-local"].form-control {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%230854a0' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 0a.5.5 0 0 1 .5.5V1h8V.5a.5.5 0 0 1 1 0V1h1a2 2 0 0 1 2 2v11a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V3a2 2 0 0 1 2-2h1V.5a.5.5 0 0 1 .5-.5zM1 4v10a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V4H1z'/%3E%3C/svg%3E");
}
input[type="checkbox"], input[type="radio"] { accent-color: #0a6ed1; }
.form-check-input:checked { background-color: #0a6ed1; border-color: #0a6ed1; }

.pavana-search { background: #fff; border: 1px solid var(--hz-field-border); border-radius: var(--hz-radius-field); }
.pavana-search:hover { border-color: #0854a0; }
.pavana-search:focus-within { border-color: #0854a0; box-shadow: 0 0 0 1px #0854a0; }
.pavana-search i { color: var(--hz-btn-text); }

/* ============================================================ */
/* 9. Tables — Ariba list: grey header row, hairline rows       */
/* ============================================================ */
.pavana-table thead th, .li-table thead th {
    background: #f7f7f7;
    font-weight: 700;
    font-size: .72rem;
    color: var(--text);
    text-transform: none;
    letter-spacing: 0;
    border-bottom: 1px solid var(--ar-panel-border);
}
.pavana-table tbody tr, .li-table tbody tr { border-bottom: 1px solid var(--border); }
.pavana-table tbody tr:hover { background: #f5f5f5; }
.pavana-table .td-mono { color: var(--hz-btn-text); font-weight: 400; font-size: .74rem; }
.pavana-table .td-value { color: var(--text); font-weight: 400; }
.li-total-bar { background: #f7f7f7; border: 1px solid var(--ar-panel-border); border-radius: var(--radius-sm); }

.table { --bs-table-hover-bg: #f5f5f5; --bs-table-border-color: var(--border); }
.table > thead th { background: #f7f7f7; font-weight: 700; color: var(--text); border-bottom: 1px solid var(--ar-panel-border); }
.pagination {
    --bs-pagination-color: var(--hz-btn-text);
    --bs-pagination-border-color: var(--ar-panel-border);
    --bs-pagination-hover-bg: #ebf5fe;
    --bs-pagination-hover-color: var(--hz-btn-text);
    --bs-pagination-active-bg: #0a6ed1;
    --bs-pagination-active-border-color: #0a6ed1;
    --bs-pagination-border-radius: var(--radius-sm);
}

/* ============================================================ */
/* 10. Tabs — Fiori 3 icon tab bar                              */
/* ============================================================ */
.pavana-tabs { border-bottom: 1px solid var(--ar-panel-border); }
.pavana-tab { color: var(--text-muted); font-weight: 400; border-bottom: 0.1875rem solid transparent; border-radius: 0; }
.pavana-tab:hover { color: var(--hz-btn-text); background: transparent; border-bottom-color: transparent; }
.pavana-tab.active { color: var(--hz-btn-text); border-bottom-color: #0854a0; font-weight: 600; }
.nav-tabs { border-bottom: 1px solid var(--ar-panel-border); }
.nav-tabs .nav-link { color: var(--text-muted); border-bottom: 0.1875rem solid transparent; }
.nav-tabs .nav-link:hover { color: var(--hz-btn-text); border-bottom-color: transparent; }
.nav-tabs .nav-link.active { color: var(--hz-btn-text); border-bottom-color: #0854a0; font-weight: 600; }
.nav-pills .nav-link { color: var(--text); border-radius: var(--radius-sm); }
.nav-pills .nav-link.active { background: #0a6ed1; color: #fff; }

/* ============================================================ */
/* 11. Status — Fiori 3 ObjectStatus: coloured text, no chip    */
/* ============================================================ */
.badge-pavana, .pavana-badge { border-radius: var(--hz-radius-field); font-weight: 600; }
/* Positive */
.badge-approved, .badge-active, .badge-awarded, .badge-delivered,
.badge-paid, .badge-gr_completed, .badge-completed, .badge-validated
{ background: transparent; color: var(--hz-positive); border-color: transparent; padding-left: 0; padding-right: 0; }
/* Critical */
.badge-pending, .badge-under_review, .badge-partial,
.badge-pending_approval, .badge-flagged
{ background: transparent; color: var(--hz-critical); border-color: transparent; padding-left: 0; padding-right: 0; }
/* Negative */
.badge-rejected, .badge-validation_failed
{ background: transparent; color: var(--hz-negative); border-color: transparent; padding-left: 0; padding-right: 0; }
/* Informative */
.badge-confirmed, .badge-published, .badge-submitted, .badge-po_raised,
.badge-sent, .badge-in_transit, .badge-in-transit,
.badge-payment_initiated, .badge-ocr_processing, .badge-evaluated
{ background: transparent; color: var(--hz-informative); border-color: transparent; padding-left: 0; padding-right: 0; }
/* Neutral */
.badge-draft, .badge-cancelled, .badge-registered
{ background: transparent; color: var(--hz-neutral); border-color: transparent; padding-left: 0; padding-right: 0; }

.dot-approved,.dot-active,.dot-delivered,.dot-paid,.dot-gr_completed,.dot-awarded,
.dot-po_raised,.dot-completed { background: #107e3e; }
.dot-pending,.dot-submitted,.dot-under_review,.dot-pending_approval { background: #e9730c; }
.dot-rejected,.dot-cancelled,.dot-flagged { background: #bb0000; }
.dot-draft,.dot-registered { background: #6a6d70; }
.dot-confirmed,.dot-published,.dot-sent,.dot-in_transit,
.dot-evaluated,.dot-payment_initiated,.dot-ocr_processing { background: #0a6ed1; }

.badge { border-radius: var(--hz-radius-field); font-weight: 600; }
.badge.text-bg-primary { background-color: #0a6ed1 !important; }
.badge.text-bg-success { background-color: #107e3e !important; }
.badge.text-bg-danger  { background-color: #bb0000 !important; }
.badge.text-bg-warning { background-color: #e9730c !important; color: #fff !important; }
.badge.text-bg-info    { background-color: #0a6ed1 !important; color: #fff !important; }

.priority-high, .priority-urgent { background: transparent; border-color: transparent; color: var(--hz-negative); }
.priority-medium { background: transparent; border-color: transparent; color: var(--hz-critical); }
.priority-low { background: transparent; border-color: transparent; color: var(--hz-neutral); }

.stat-bar { background: #e5e5e5; border-radius: 0; }
.stat-bar-fill { background: #0a6ed1; border-radius: 0; }
.stat-bar-fill.green { background: #107e3e; }
.stat-bar-fill.amber { background: #e9730c; }
.stat-bar-fill.red { background: #bb0000; }

/* ============================================================ */
/* 12. Message strips                                           */
/* ============================================================ */
.pavana-alert, .alert { border-radius: var(--radius-sm); border: 1px solid; color: var(--text); }
.pavana-alert-success, .alert-success, .pavana-alert.alert-success { background: var(--hz-positive-bg); border-color: #107e3e; color: var(--text); }
.pavana-alert-error, .pavana-alert-danger, .alert-danger, .pavana-alert.alert-error { background: var(--hz-negative-bg); border-color: #bb0000; color: var(--text); }
.pavana-alert-warning, .alert-warning, .pavana-alert.alert-warning { background: var(--hz-critical-bg); border-color: #e9730c; color: var(--text); }
.pavana-alert-info, .alert-info, .alert-primary, .pavana-alert.alert-info { background: var(--hz-informative-bg); border-color: #0a6ed1; color: var(--text); }
.pavana-alert.alert-success .alert-icon { color: #107e3e; }
.pavana-alert.alert-error .alert-icon { color: #bb0000; }
.pavana-alert.alert-warning .alert-icon { color: #e9730c; }
.pavana-alert.alert-info .alert-icon { color: #0a6ed1; }
.pavana-alert .alert-close { color: var(--text); }

/* ============================================================ */
/* 13. Dialogs — Fiori 3 dialog                                 */
/* ============================================================ */
.pavana-modal { border: 0; border-radius: var(--radius); box-shadow: var(--shadow-lg); }
.pavana-modal-backdrop { background: rgba(0,0,0,.6); }
.pavana-modal-header {
    background: #fff;
    color: var(--text);
    border-bottom: 1px solid var(--ar-panel-border);
    border-radius: var(--radius) var(--radius) 0 0;
}
.pavana-modal-header h3 { color: var(--text); font-weight: 400; font-size: 1rem; }
.pavana-modal-header i { color: var(--hz-shell-icon); }
.pavana-modal-close { background: transparent; color: var(--hz-btn-text); border-radius: var(--radius-sm); }
.pavana-modal-close:hover { background: #ebf5fe; color: var(--hz-btn-text); }
.pavana-modal-footer { border-top: 1px solid var(--ar-panel-border); background: #fff; }

.modal-content { border: 0; border-radius: var(--radius); box-shadow: var(--shadow-lg); }
.modal-header { border-bottom: 1px solid var(--ar-panel-border); }
.modal-header .modal-title { font-weight: 400; }
.modal-footer { border-top: 1px solid var(--ar-panel-border); }
.dropdown-menu { border-color: var(--ar-panel-border); border-radius: var(--radius-sm); box-shadow: var(--shadow); }
.dropdown-item:hover { background: #f5f5f5; color: var(--hz-btn-text); }

/* Centred slide-over dialogs (horizon.css §21) pick up the square radius */
body .va-so-panel, body .rfq-so-panel, body .auc-so-panel,
body .vr-modal-backdrop > .vr-slideover, body .va-modal-backdrop > .va-slideover { border-radius: var(--radius); }
body .va-so-backdrop, body .rfq-so-backdrop, body .auc-so-backdrop,
body .vr-modal-backdrop, body .va-modal-backdrop { background: rgba(0,0,0,.6); }

/* ============================================================ */
/* 14. Process flow, empty states, misc                         */
/* ============================================================ */
.lifecycle-step { border-radius: var(--hz-radius-field); font-weight: 600; }
.lifecycle-step.done { background: var(--hz-positive-bg); color: var(--hz-positive); border: 1px solid #107e3e; }
.lifecycle-step.current { background: #0a6ed1; color: #fff; border: 1px solid #0a6ed1; }
.lifecycle-step.todo { background: #fff; color: var(--text-muted); border: 1px solid #bfbfbf; }
.pavana-empty i { color: var(--hz-shell-icon); opacity: .4; }
:focus-visible { outline-color: #0854a0; }
::-webkit-scrollbar-thumb { background: #bfbfbf; border-radius: 0.25rem; }
::-webkit-scrollbar-thumb:hover { background: #a6a6a6; }
#app-copyright-footer { background: #fff; border-top: 1px solid var(--ar-panel-border); color: var(--text-muted); }

/* Chat page fills the viewport under shell + menubar + page header */
@media (min-width: 1025px) {
    .chat-wrap { height: calc(100vh - 224px); }
}

/* ============================================================ */
/* 15. Login / auth pages                                       */
/* ============================================================ */
.auth-root {
    --primary: #354a5f;
    --primary-mid: #475e75;
    --accent: #0a6ed1;
    --accent-light: #085caf;
    --amber: #e9730c;
    --border: #d9d9d9;
    --text: #32363a;
    --text-muted: #6a6d70;
    --bg: #f7f7f7;
}
.auth-hero:has(.hero-logo img) {
    background: #f7f7f7;
    border-right: 1px solid #d9d9d9;
}
.auth-hero:has(.hero-logo img) .hero-tagline span { color: #0a6ed1; }
.auth-hero:has(.hero-logo img) .hero-pill { border-radius: var(--radius-sm); border-color: #bfbfbf; }
.auth-hero:has(.hero-logo img) .hero-stats { border-radius: var(--radius); border-color: #d9d9d9; background: #fff; }
.auth-hero:has(.hero-logo-mark) {
    background: linear-gradient(160deg, #354a5f 0%, #2b3d4f 60%, #1f2d3b 100%);
}
.auth-card-inner { border-radius: var(--radius); border: 1px solid #d9d9d9; box-shadow: var(--shadow); }
.auth-heading { font-weight: 400; font-size: 1.5rem; }
.auth-field label { color: var(--text-muted); font-weight: 400; }
.auth-input-wrap input {
    background: #fff;
    border: 1px solid #89919a;
    border-radius: var(--hz-radius-field);
}
.auth-input-wrap input:hover { border-color: #0854a0; }
.auth-input-wrap input:focus {
    background: #fff;
    border: 1px solid #0854a0;
    box-shadow: 0 0 0 1px #0854a0;
}
.auth-input-wrap .auth-icon, .auth-input-wrap .toggle-pwd { color: #6a6d70; }
.auth-btn { background: #0a6ed1; border-radius: var(--radius-sm); font-weight: 400; font-size: .95rem; }
.auth-btn:hover { background: #085caf; }
.auth-footer a, .demo-chip:hover { color: #0854a0; }
.demo-chip { border: 1px solid #89919a; border-radius: var(--radius-sm); }
.demo-chip:hover { border-color: #0854a0; background: #ebf5fe; }
.auth-mobile-logo-icon { background: #0a6ed1; border-radius: var(--radius-sm); }

/* ============================================================ */
/* 16. Page-level harmonisation                                 */
/*     Page <style> blocks arrive via @stack('styles') after    */
/*     this file, so these are prefixed with .pavana-content   */
/*     to out-specify them.                                     */
/* ============================================================ */
/* Dashboard module switcher → Fiori 3 segmented buttons */
.pavana-content .module-pill {
    border: 1px solid #bfbfbf; border-radius: var(--radius-sm);
    font-weight: 400; color: var(--text); background: #fff; box-shadow: none;
}
.pavana-content .module-pill i { background: transparent !important; color: var(--hz-btn-text) !important; font-size: .7rem; }
.pavana-content .module-pill:not(.active):hover { border-color: #0854a0; color: var(--hz-btn-text); box-shadow: none; }
.pavana-content .module-pill.active { background: #0a6ed1; border-color: #0a6ed1; color: #fff; box-shadow: none; font-weight: 600; }
.pavana-content .module-pill.active i { color: #fff !important; }
.pavana-content .db-section-title { font-size: .9rem; font-weight: 700; }
.pavana-content .db-section-title i { color: var(--hz-shell-icon); }

/* Section captions inside forms/panels: bold sentence case, no tracking */
.pavana-content .sect-header,
.pavana-content .detail-section-title { text-transform: none; letter-spacing: 0; font-size: .85rem; color: var(--text); }
.pavana-content .sect-header i { color: var(--hz-shell-icon); }

/* Vendor KPI tiles */
.pavana-content .v-kpi { border-radius: var(--radius); border: 1px solid var(--ar-panel-border); }
.pavana-content .v-kpi.active-filter { border-color: #0a6ed1; box-shadow: 0 0 0 1px #0a6ed1; }
.pavana-content .v-kpi-val { font-weight: 300; }
.pavana-content .v-kpi-label { text-transform: none; letter-spacing: 0; font-weight: 400; font-size: .76rem; }

/* Configuration side menu → Fiori 3 side navigation (selected = light blue) */
.pavana-content .config-nav-item { border-radius: 0; color: var(--text); font-weight: 400; }
.pavana-content .config-nav-item:hover { background: #f5f5f5; color: var(--hz-btn-text); }
.pavana-content .config-nav-item.active { background: #e5f0fa; color: var(--hz-btn-text) !important; box-shadow: inset 0.1875rem 0 0 #0a6ed1; font-weight: 600; }
.pavana-content .config-nav-item.active i { color: var(--hz-btn-text) !important; }

/* Generic page tab strips (pdt-tab, vdt-tab, uct-tab …) already read
   var(--accent); make sure any leftover gradients go flat. */
.pavana-content [class$="-tab"].active { background: transparent; }

/* ============================================================ */
/* 17. Login page (login.blade.php ships its own <style>;      */
/*     this file loads after it, so plain selectors win)        */
/* ============================================================ */
.auth-card { border-radius: var(--radius); border: 1px solid #d9d9d9; box-shadow: var(--shadow); padding: 30px 34px 26px; }
.auth-greeting .greet-badge {
    background: transparent; color: var(--text-muted);
    padding: 0; border-radius: 0; font-weight: 400; letter-spacing: .04em; margin-bottom: 8px;
}
.auth-greeting h1 { font-family: var(--hz-font); font-weight: 400; font-size: 1.5rem; letter-spacing: 0; color: var(--text); }
.auth-greeting p { color: var(--text-muted); }
.auth-field label { text-transform: none; letter-spacing: 0; font-weight: 400; font-size: .8rem; color: var(--text-muted); }
.auth-field label::after { content: ":"; }
.auth-row a { color: #0854a0; font-weight: 400; }
.auth-submit {
    background: #0a6ed1; border: 1px solid #0a6ed1; border-radius: var(--radius-sm);
    box-shadow: none; font-family: var(--hz-font); font-weight: 400; font-size: .95rem; letter-spacing: 0;
    padding: 11px;
}
.auth-submit:hover { background: #085caf; border-color: #085caf; filter: none; box-shadow: none; }
.auth-secure-note i { color: #107e3e; }
.auth-error { border-radius: var(--radius-sm); background: #ffebeb; border-color: #bb0000; color: #32363a; }
.hero-tagline { font-family: var(--hz-font); font-weight: 400; letter-spacing: 0; }
.hero-tagline span { font-weight: 600; }
.hero-logo img { filter: none !important; }

/* ============================================================ */
/* 18. Second pass — page components                            */
/*     The first pass restyled the shell and the shared          */
/*     components. This pass reaches the components each page   */
/*     defines in its own <style> block (KPI tiles, pill chips, */
/*     boxed row buttons, uppercase captions, gradients).       */
/*     Page styles load after this file, so every rule here is  */
/*     prefixed "body .pavana-content" (0,2,1) to beat the      */
/*     two-class page selectors, and uses !important only where */
/*     the page sets an inline style attribute.                 */
/* ============================================================ */

/* ---- 18.1 KPI / numeric tiles ------------------------------ */
/* Fiori numeric tiles are flat white with a hairline border; no colour stripe */
body .pavana-content .rfq-kpi, body .pavana-content .auc-kpi, body .pavana-content .va-kpi,
body .pavana-content .cm-kpi, body .pavana-content .qm-kpi, body .pavana-content .role-kpi,
body .pavana-content .inv-kpi, body .pavana-content .sc-kpi, body .pavana-content .v-kpi,
body .pavana-content .slp-kpi, body .pavana-content .kpit, body .pavana-content .ad-kpi,
body .pavana-content .ar-kpi, body .pavana-content .kpi-card, body .pavana-content .vd-kpi,
body .pavana-content .vasn-kpi, body .pavana-content .vpo-kpi, body .pavana-content .vsc-kpi,
body .pavana-content .pavana-kpi-card {
    border-radius: var(--radius);
    border: 1px solid var(--ar-panel-border) !important;   /* !important: reports/users set the stripe inline */
    box-shadow: none;
}
body .pavana-content .rfq-kpi:hover, body .pavana-content .auc-kpi:hover, body .pavana-content .va-kpi:hover,
body .pavana-content .cm-kpi:hover, body .pavana-content .qm-kpi:hover, body .pavana-content .role-kpi:hover,
body .pavana-content .v-kpi:hover, body .pavana-content .kpit:hover, body .pavana-content .kpi-card:hover { box-shadow: var(--shadow-sm); }
body .pavana-content .ar-kpi::after { display: none; }
body .pavana-content .v-kpi.active-filter { border-color: #0a6ed1 !important; box-shadow: 0 0 0 1px #0a6ed1; }
body .pavana-content .role-kpi[style*="border-left"] { border-left: 1px solid var(--ar-panel-border) !important; }

/* Tile icons: monochrome Fiori blue on transparent (pages set pastel colours inline) */
body .pavana-content .rfq-kpi-icon, body .pavana-content .auc-kpi-icon, body .pavana-content .va-kpi-icon,
body .pavana-content .cm-kpi-icon, body .pavana-content .qm-kpi-icon, body .pavana-content .role-kpi-icon,
body .pavana-content .kpi-icon-wrap, body .pavana-content .v-kpi-icon, body .pavana-content .vd-kpi-icon,
body .pavana-content .ai-insight-icon, body .pavana-content .vasn-attach-icon, body .pavana-content .vpo-attach-icon,
body .pavana-content .integration-logo, body .pavana-content .smtp-provider-card .prov-icon,
body .pavana-content .vnd-step-icon, body .pavana-content .vs-dist-icon, body .pavana-content .vs-dist-btn i.dist-icon {
    background: transparent !important;
    color: #0854a0 !important;
    border-radius: var(--radius-sm);
    border-color: var(--ar-panel-border) !important;
}
body .pavana-content .vnd-step-icon { background: #fff !important; border: 1px solid var(--ar-panel-border) !important; }

/* Tile captions: sentence case, regular weight; values light like Fiori numeric content */
body .pavana-content .kpit-label, body .pavana-content .inv-kpi .lbl, body .pavana-content .sc-kpi .lbl,
body .pavana-content .v-kpi-label, body .pavana-content .slp-kpi-label, body .pavana-content .ad-kpi .l,
body .pavana-content .pavana-kpi-label, body .pavana-content .vd-kpi-label, body .pavana-content .vm-kpi-label,
body .pavana-content .vasn-kpi-label, body .pavana-content .vpo-kpi-label, body .pavana-content .vsc-kpi-label,
body .pavana-content .ar-kpi-label, body .pavana-content .live-stat-label, body .pavana-content .va-bid-stat-label,
body .pavana-content .va-countdown-label {
    text-transform: none; letter-spacing: 0; font-weight: 400; color: var(--text-muted);
}
body .pavana-content .v-kpi-val, body .pavana-content .slp-kpi-val, body .pavana-content .inv-kpi .val,
body .pavana-content .sc-kpi .val, body .pavana-content .ad-kpi .v, body .pavana-content .pavana-kpi-value,
body .pavana-content .ar-kpi-val, body .pavana-content .kpit-val, body .pavana-content .kpit-value { font-weight: 300; }

/* ---- 18.2 Row action buttons: transparent icon buttons ------ */
/* Pages pass border-color / color inline (red trash, orange re-quote, purple reassign) */
body .pavana-content .btn-icon-pavana { border-color: transparent !important; background: transparent; }
body .pavana-content .btn-icon-pavana:hover { background: #ebf5fe; }
body .pavana-content .btn-icon-pavana[style*="#dc2626"], body .pavana-content .btn-icon-pavana[style*="#ef4444"],
body .pavana-content .btn-icon-pavana[style*="#b91c1c"], body .pavana-content .btn-icon-pavana[style*="#991b1b"] { color: #bb0000 !important; }
body .pavana-content .btn-icon-pavana[style*="#dc2626"]:hover, body .pavana-content .btn-icon-pavana[style*="#ef4444"]:hover { background: var(--hz-negative-bg); }
body .pavana-content .btn-icon-pavana[style*="#d97706"], body .pavana-content .btn-icon-pavana[style*="#f7941d"],
body .pavana-content .btn-icon-pavana[style*="#f59e0b"] { color: #e9730c !important; }
body .pavana-content .btn-icon-pavana[style*="#7c3aed"], body .pavana-content .btn-icon-pavana[style*="#8b5cf6"],
body .pavana-content .btn-icon-pavana[style*="#6366f1"], body .pavana-content .btn-icon-pavana[style*="#0ea5e9"],
body .pavana-content .btn-icon-pavana[style*="#2563eb"] { color: #0854a0 !important; }
/* Emphasised buttons the pages tint purple/orange inline → brand blue */
body .pavana-content .btn-primary-pavana[style*="#7c3aed"], body .pavana-content .btn-primary-pavana[style*="#8b5cf6"],
body .pavana-content .btn-primary-pavana[style*="#6366f1"], body .pavana-content .btn-primary-pavana[style*="#4f46e5"],
body .pavana-content .btn-primary-pavana[style*="#f7941d"], body .pavana-content .btn-primary-pavana[style*="#0ea5e9"],
body .pavana-content .btn-primary-pavana[style*="#059669"], body .pavana-content .btn-primary-pavana[style*="#10b981"] {
    background: #0a6ed1 !important; border-color: #0a6ed1 !important; color: #fff !important;
}

/* ---- 18.3 Status chips → Fiori ObjectStatus (coloured text) -- */
body .pavana-content .badge-forward, body .pavana-content .badge-reverse, body .pavana-content .badge-dutch, body .pavana-content .badge-japanese,
body .pavana-content .badge-pending_approval, body .pavana-content .badge-published, body .pavana-content .badge-live,
body .pavana-content .badge-closed, body .pavana-content .badge-awarded, body .pavana-content .badge-cancelled,
body .pavana-content .badge-submitted, body .pavana-content .badge-under_review, body .pavana-content .badge-approved, body .pavana-content .badge-rejected,
body .pavana-content .vs-invited, body .pavana-content .vs-accepted, body .pavana-content .vs-declined,
body .pavana-content .vs-participating, body .pavana-content .vs-bidding,
body .pavana-content .savings-badge,
body .pavana-content .asn-pill, body .pavana-content .vasn-pill, body .pavana-content .vpo-pill,
body .pavana-content .vsc-pill, body .pavana-content .sc-pill, body .pavana-content .sc-mv-badge,
body .pavana-content [class*="badge-qm-"], body .pavana-content [class*="badge-ud-"], body .pavana-content [class*="badge-sev-"],
body .pavana-content [class*="badge-type-"], body .pavana-content .grade-badge,
body .pavana-content .slp-chip, body .pavana-content .ps-badge, body .pavana-content .cm-chip,
body .pavana-content [class*="cal-badge-"],
body .pavana-content .act-CREATE, body .pavana-content .act-UPDATE, body .pavana-content .act-DELETE,
body .pavana-content .act-LOGIN, body .pavana-content .act-LOGOUT, body .pavana-content .act-FAILED_LOGIN,
body .pavana-content .act-APPROVE, body .pavana-content .act-AWARD, body .pavana-content .act-COMPLETE,
body .pavana-content .act-REJECT, body .pavana-content .act-CANCEL, body .pavana-content .act-SUBMIT, body .pavana-content .act-EXPORT,
body .pavana-content [class*="va-badge-"], body .pavana-content [class*="vps-badge-"], body .pavana-content [class*="vp-status-"],
body .pavana-content [class*="asm-status-"], body .pavana-content .vr-open-badge, body .pavana-content .vr-invited-badge,
body .pavana-content .vd-badge-best, body .pavana-content .vd-ticket-type, body .pavana-content .vd-due-pill,
body .pavana-content .vd-kpi-badge, body .pavana-content .badge-warn, body .pavana-content .badge-info,
body .pavana-content .trend-up, body .pavana-content .trend-dn, body .pavana-content .vd-trend,
body .pavana-content .ob-badge-success, body .pavana-content .smtp-status-pill {
    background: transparent !important;
    border-color: transparent !important;
    border-radius: 0;
    padding-left: 0; padding-right: 0;
    font-weight: 600;
    text-transform: none;
    letter-spacing: 0;
    box-shadow: none;
}
body .pavana-content .grade-badge { width: auto; height: auto; border: 0 !important; font-size: .8rem; }
body .pavana-content .grade-badge-lg { font-size: 1.2rem; }
/* Positive */
body .pavana-content .badge-live, body .pavana-content .badge-awarded, body .pavana-content .badge-approved,
body .pavana-content .vs-accepted, body .pavana-content .savings-badge.positive,
body .pavana-content .badge-qm-completed, body .pavana-content .badge-ud-accept, body .pavana-content .badge-sev-low,
body .pavana-content .pill-delivered, body .pavana-content .pill-gr_completed, body .pavana-content .pill-approved,
body .pavana-content .pill-completed, body .pavana-content .pill-fully_delivered, body .pavana-content .sc-pill-fully_delivered,
body .pavana-content .sc-mv-101, body .pavana-content .slp-chip.qualified, body .pavana-content .ps-badge-green,
body .pavana-content .act-CREATE, body .pavana-content .act-APPROVE, body .pavana-content .act-AWARD, body .pavana-content .act-COMPLETE,
body .pavana-content .va-badge-live, body .pavana-content .va-badge-won, body .pavana-content .vps-badge-green,
body .pavana-content .vp-status-active, body .pavana-content .asm-status-approved, body .pavana-content .vr-open-badge,
body .pavana-content .vd-badge-best, body .pavana-content .trend-up, body .pavana-content .vd-trend.up,
body .pavana-content .grade-a, body .pavana-content .cal-badge-success, body .pavana-content .ob-badge-success,
body .pavana-content .badge-success, body .pavana-content .smtp-status-pill.pill-active { color: var(--hz-positive) !important; }
/* Critical */
body .pavana-content .badge-pending_approval, body .pavana-content .badge-under_review,
body .pavana-content .vs-participating, body .pavana-content .vs-bidding,
body .pavana-content .badge-qm-pending, body .pavana-content .badge-ud-conditional,
body .pavana-content .badge-sev-medium, body .pavana-content .badge-sev-high,
body .pavana-content .pill-dispatched, body .pavana-content .pill-pending, body .pavana-content .pill-partial,
body .pavana-content .pill-partially_delivered, body .pavana-content .sc-pill-partially_delivered, body .pavana-content .sc-mv-543,
body .pavana-content .slp-chip.preferred, body .pavana-content .slp-chip.restricted, body .pavana-content .ps-badge-yellow,
body .pavana-content .act-FAILED_LOGIN, body .pavana-content .va-badge-awarded, body .pavana-content .vps-badge-yellow,
body .pavana-content .vp-status-registered, body .pavana-content .asm-status-draft,
body .pavana-content .vd-ticket-type.mismatch, body .pavana-content .vd-due-pill, body .pavana-content .trend-dn,
body .pavana-content .grade-c, body .pavana-content .grade-d, body .pavana-content .cal-badge-warning,
body .pavana-content .badge-warn { color: var(--hz-critical) !important; }
/* Negative */
body .pavana-content .badge-cancelled, body .pavana-content .badge-rejected, body .pavana-content .vs-declined,
body .pavana-content .savings-badge.negative, body .pavana-content .badge-ud-reject, body .pavana-content .badge-sev-critical,
body .pavana-content .pill-rejected, body .pavana-content .pill-cancelled,
body .pavana-content .slp-chip.disqualified, body .pavana-content .slp-chip.phased_out, body .pavana-content .ps-badge-red,
body .pavana-content .act-DELETE, body .pavana-content .act-REJECT, body .pavana-content .act-CANCEL,
body .pavana-content .va-badge-declined, body .pavana-content .vps-badge-red, body .pavana-content .asm-status-rejected,
body .pavana-content .vd-ticket-type.complaint, body .pavana-content .vd-trend.down, body .pavana-content .grade-f,
body .pavana-content .cal-badge-danger { color: var(--hz-negative) !important; }
/* Informative */
body .pavana-content .badge-published, body .pavana-content .badge-submitted, body .pavana-content .vs-invited,
body .pavana-content .badge-qm-in_progress, body .pavana-content .pill-created, body .pavana-content .pill-submitted,
body .pavana-content .pill-in_transit, body .pavana-content .pill-confirmed, body .pavana-content .pill-sent,
body .pavana-content .pill-open, body .pavana-content .sc-pill-open, body .pavana-content .sc-mv-541,
body .pavana-content .slp-chip.registered, body .pavana-content .slp-chip.core, body .pavana-content .slp-chip.strategic,
body .pavana-content .ps-badge-blue, body .pavana-content .act-UPDATE, body .pavana-content .act-LOGIN,
body .pavana-content .act-LOGOUT, body .pavana-content .act-SUBMIT, body .pavana-content .act-EXPORT,
body .pavana-content .va-badge-invited, body .pavana-content .va-badge-accepted, body .pavana-content .vps-badge-blue,
body .pavana-content .vp-status-submitted, body .pavana-content .vp-status-onboarding_initiated,
body .pavana-content .asm-status-submitted, body .pavana-content .asm-status-under_review, body .pavana-content .vr-invited-badge,
body .pavana-content .grade-b, body .pavana-content .cal-badge-info, body .pavana-content .badge-info { color: var(--hz-informative) !important; }
/* Neutral (types, closed, draft) */
body .pavana-content .badge-forward, body .pavana-content .badge-reverse, body .pavana-content .badge-dutch,
body .pavana-content .badge-japanese, body .pavana-content [class*="badge-type-"], body .pavana-content .badge-closed,
body .pavana-content .ps-badge-gray, body .pavana-content .cm-chip, body .pavana-content .vd-kpi-badge { color: var(--text) !important; font-weight: 400; }
/* Chips that carry an inline purple "QC" style on the ASN list */
body .pavana-content .asn-pill[style*="#7c3aed"] { color: #0854a0 !important; border: 1px solid #0854a0 !important; border-radius: var(--hz-radius-field); padding: 1px 6px !important; background: #fff !important; }

/* Selection tokens (vendor chips, PR chips): Fiori sap.m.Token */
body .pavana-content .vs-chip, body .pavana-content .vs-invite-chip, body .pavana-content .pr-chip,
body .pavana-content .rfq-pr-chip, body .pavana-content .vnd-chip, body .pavana-content .ref-chip,
body .pavana-content .auc-vendor-chip, body .pavana-content .ob-multi-tag, body .pavana-content .vpp-tag,
body .pavana-content .vasn-att-chip, body .pavana-content .asm-card-hdr-badge {
    background: #fff !important; border: 1px solid #bfbfbf !important; color: var(--text) !important;
    border-radius: var(--hz-radius-field); font-weight: 400; text-transform: none; letter-spacing: 0;
}
body .pavana-content .vnd-chip-accent { border-color: #0854a0 !important; color: #0854a0 !important; }
body .pavana-content .vnd-chip-accent:hover { background: #ebf5fe !important; }
body .pavana-content .vs-chip-av, body .pavana-content .vs-chip .vs-chip-av, body .pavana-content .auc-vendor-chip .chip-av,
body .pavana-content .vs-avatar, body .pavana-content .vs-db-avatar, body .pavana-content .qc-avatar,
body .pavana-content .bv-vendor-avatar { background: #ebf5fe !important; color: #0854a0 !important; background-image: none !important; }

/* Vendor status filter chips (vendors list): neutral, active = brand blue */
body .pavana-content .vendor-tab[data-vm-status] {
    background: #fff; border: 1px solid #bfbfbf; color: var(--text); border-radius: var(--radius-sm); font-weight: 400;
}
body .pavana-content .vendor-tab[data-vm-status]:hover { border-color: #0854a0; color: #0854a0; }
body .pavana-content .vendor-tab[data-vm-status].active { background: #0a6ed1; border-color: #0a6ed1; color: #fff; font-weight: 600; }
body .pavana-content .vendor-tab[data-vm-status] .vtab-badge { background: rgba(0,0,0,.06); color: inherit; border-radius: var(--hz-radius-field); }
body .pavana-content .vendor-tab[data-vm-status].active .vtab-badge { background: rgba(255,255,255,.22); color: #fff; }

/* Tab counters */
body .pavana-content .sc-tab .cnt, body .pavana-content .vasn-tab .cnt, body .pavana-content .vpo-tab .cnt,
body .pavana-content .vsc-tab .cnt, body .pavana-content .va-tab .badge, body .pavana-content .vr-tab .badge,
body .pavana-content .vtab-badge, body .pavana-content .bv-panel-title .bv-count, body .pavana-content .sc-alerts-badge,
body .pavana-content .chat-room-unread, body .pavana-content .chat-live-badge { border-radius: var(--hz-radius-field); }

/* Rank badges (auction matrices): flat */
body .pavana-content .rank-badge, body .pavana-content .va-rank-badge, body .pavana-content .va-card-rank .rank-num,
body .pavana-content .vendor-matrix .rank-badge {
    background: #f5f5f5 !important; background-image: none !important; color: var(--text) !important;
    border: 1px solid var(--ar-panel-border); box-shadow: none !important;
}
body .pavana-content .rank-badge.rank-1, body .pavana-content .rank-badge.gold, body .pavana-content .va-rank-1 { background: #ebf5fe !important; background-image: none !important; color: #0854a0 !important; border-color: #0854a0 !important; }
body .pavana-content .rank-table tr.rank-1, body .pavana-content .vendor-matrix .rank-1 { background: #f7f7f7 !important; }

/* ---- 18.4 Captions, labels, table headers: sentence case ---- */
body .pavana-content .sect-header, body .pavana-content .cf-section, body .pavana-content .smtp-section-hdr,
body .pavana-content .det-card-head, body .pavana-content .asn-section-title, body .pavana-content .sc-section-title,
body .pavana-content .va-section, body .pavana-content .vp-section, body .pavana-content .vr-section,
body .pavana-content .asm-section, body .pavana-content .ob-section, body .pavana-content .vasn-section-title,
body .pavana-content .vpo-section-title, body .pavana-content .vsc-section-title, body .pavana-content .perm-group-header,
body .pavana-content .review-group-hdr, body .pavana-content .vd-rm-header, body .pavana-content .live-chart-title,
body .pavana-content .live-charts-toggle, body .pavana-content .live-vendor-toggle h4, body .pavana-content .aud-cat,
body .pavana-content .ai-response-type, body .pavana-content .live-agent-tag, body .pavana-content .contact-card-title,
body .pavana-content .ob-sidebar-label, body .pavana-content .vasn-att-type, body .pavana-content .ps-chain-node-label,
body .pavana-content .vd-flow-label, body .pavana-content .flow-phase-label, body .pavana-content .po-schedule-label,
body .pavana-content .pr-toggle-btn, body .pavana-content .ob-badge-primary, body .pavana-content .ob-step-badge,
body .pavana-content .ob-header-badge, body .pavana-content .hero-stat-lbl {
    text-transform: none; letter-spacing: 0;
}
body .pavana-content .cf-section, body .pavana-content .smtp-section-hdr, body .pavana-content .det-card-head,
body .pavana-content .asn-section-title, body .pavana-content .sc-section-title, body .pavana-content .va-section,
body .pavana-content .vp-section, body .pavana-content .vr-section, body .pavana-content .asm-section,
body .pavana-content .vasn-section-title, body .pavana-content .vpo-section-title, body .pavana-content .vsc-section-title,
body .pavana-content .perm-group-header { font-size: .85rem; font-weight: 700; color: var(--text); }
body .pavana-content .cf-section i, body .pavana-content .smtp-section-hdr i, body .pavana-content .asn-section-title i,
body .pavana-content .sc-section-title i, body .pavana-content .va-section i, body .pavana-content .vp-section i,
body .pavana-content .vasn-section-title i, body .pavana-content .vpo-section-title i, body .pavana-content .vsc-section-title i { color: var(--hz-shell-icon); }

/* Form / detail labels (Fiori: muted sentence case, followed by a colon) */
body .pavana-content .field-item .fi-label, body .pavana-content .asn-detail-field label,
body .pavana-content .sc-detail-field label, body .pavana-content .vasn-detail-field label,
body .pavana-content .vpo-detail-field label, body .pavana-content .vsc-detail-field label,
body .pavana-content .vd-field .vd-label, body .pavana-content .auc-info-item .info-label,
body .pavana-content .va-info-item .info-label, body .pavana-content .ocr-field label,
body .pavana-content .ar-fg label, body .pavana-content .vm-vd-field .vm-vd-label, body .pavana-content .ob-label,
body .pavana-content .slp-score-cell .l, body .pavana-content .vd-rm-row-label, body .pavana-content .pavana-label {
    text-transform: none; letter-spacing: 0; font-weight: 400; color: var(--text-muted);
}

/* Every table header row: grey, bold, sentence case (pages redefine `th` per table) */
body .pavana-content table thead th, body .pavana-content table > tr:first-child > th {
    text-transform: none; letter-spacing: 0;
    background: #f7f7f7; color: var(--text); font-weight: 700;
    border-bottom: 1px solid var(--ar-panel-border);
}
body .pavana-content .vasn-table thead th:first-child, body .pavana-content .vpo-table thead th:first-child,
body .pavana-content .vr-rfq-table thead th:first-child, body .pavana-content .vr-quote-table thead th:first-child,
body .pavana-content .vsc-table thead th:first-child { border-radius: 0; }
/* Tinted matrix / comparison headers → neutral */
body .pavana-content .ia-table th, body .pavana-content .ia-table th:first-child, body .pavana-content .rfq-li-table th,
body .pavana-content .rfq-li-preview-header, body .pavana-content .vr-items-inner thead th { background: #f7f7f7 !important; color: var(--text) !important; }
body .pavana-content .ia-table td, body .pavana-content .ia-table td:first-child, body .pavana-content .rfq-li-preview { background: #fff !important; }

/* ---- 18.5 Panels: 4px corners, no gradients ----------------- */
body .pavana-content .det-card, body .pavana-content .cm-chart-card, body .pavana-content .rpt-card,
body .pavana-content .qm-chart-card, body .pavana-content .auc-chart-card, body .pavana-content .ar-card,
body .pavana-content .ar-tw, body .pavana-content .cockpit-panel, body .pavana-content .sc-alerts,
body .pavana-content .vs-panel, body .pavana-content .vs-db-panel, body .pavana-content .vs-db-picker,
body .pavana-content .quote-card, body .pavana-content .pr-selector-box, body .pavana-content .integration-card,
body .pavana-content .approval-rule, body .pavana-content .email-tpl-item, body .pavana-content .smtp-provider-card,
body .pavana-content .perm-group, body .pavana-content .bv-vendor-card, body .pavana-content .lot-table,
body .pavana-content .vd-chart-card, body .pavana-content .va-card, body .pavana-content .vp-header-card,
body .pavana-content .vp-tab-bar, body .pavana-content .asm-panel, body .pavana-content .asm-card,
body .pavana-content .asm-review-card, body .pavana-content .asm-upload-zone, body .pavana-content .vr-rfq-wrap,
body .pavana-content .vr-quote-wrap, body .pavana-content .vasn-attach-card, body .pavana-content .vpo-attach-card,
body .pavana-content .ingest-dropzone, body .pavana-content .vm-alert-panel, body .pavana-content .ai-panel,
body .pavana-content .vs-ai-panel, body .pavana-content .ext-banner, body .pavana-content .va-bid-panel,
body .pavana-content .va-autobid-panel, body .pavana-content .va-winner-banner, body .pavana-content .va-toast,
body .pavana-content .vs-dist-btn, body .pavana-content .vs-vendor-btn, body .pavana-content .vs-broadcast-banner,
body .pavana-content .pr-sel-bar, body .pavana-content .auc-toggle, body .pavana-content .chart-filter-btn,
body .pavana-content .mode-toggle, body .pavana-content .vk-confirm-box, body .pavana-content .vk-prompt-box,
body .pavana-content .vk-confirm-icon, body .pavana-content .vk-prompt-icon, body .pavana-content .kpi-alerts-body .alert-item,
body .pavana-content .vd-insight, body .pavana-content .cm-alert, body .pavana-content .qm-alert,
body .pavana-content .va-bid-input, body .pavana-content .va-bid-btn, body .pavana-content .va-bid-confirm,
body .pavana-content .ob-card, body .pavana-content .ob-nav, body .pavana-content .review-group,
body .pavana-content .flow-phase-steps, body .pavana-content .vp-avatar, body .pavana-content .vp-avatar img {
    border-radius: var(--radius);
}
body .pavana-content .ai-panel, body .pavana-content .vs-ai-panel, body .pavana-content .vs-panel,
body .pavana-content .ext-banner, body .pavana-content .va-bid-panel, body .pavana-content .va-winner-banner,
body .pavana-content .vd-insight, body .pavana-content .vnd-appr-banner, body .pavana-content .live-modal-header,
body .pavana-content .live-lines-table tr.grand-total-row, body .pavana-content .vd-vendor-pill,
body .pavana-content .vp-avatar, body .pavana-content .ob-card-header {
    background-image: none !important;
    background-color: #f7f7f7 !important;
    border: 1px solid var(--ar-panel-border) !important;
}
body .pavana-content .live-modal-header { background-color: #fff !important; border-width: 0 0 1px !important; color: var(--text); }
body .pavana-content .vnd-appr-banner { background-color: #fff !important; }
body .pavana-content .va-toast, body .pavana-content .va-toast-outbid, body .pavana-content .va-toast-extended,
body .pavana-content .va-toast-closed, body .pavana-content .va-toast-success { background-image: none !important; background-color: #354a5f !important; color: #fff; }
body .pavana-content .va-badge-won { background-image: none !important; }
/* Page sub-tab strips that still paint a gradient on hover */
body .pavana-content .vdt-tab:hover, body .pavana-content .vp-tab:hover:not(.active),
body .pavana-content .vdt-tab.active, body .pavana-content .vp-tab.active { background: transparent; color: #0854a0; }
/* Modal / dialog containers defined per page */
body .pavana-modal-content, body .live-modal, body .bh-modal, body .pavana-content .chat-notif-dropdown,
body .mat-pick-dd, body .vm-alert-panel { border-radius: var(--radius) !important; }
body .mat-pick-dd .mp-item:hover, body .mat-pick-dd .mp-item.active { background: #f5f5f5; }
/* Selected / hover tints → Fiori list selection colour */
body .pavana-content .email-tpl-item.selected, body .pavana-content .smtp-provider-card.active,
body .pavana-content .smtp-provider-card:hover, body .pavana-content .vs-vendor-card.selected,
body .pavana-content .vs-vendor-btn.selected, body .pavana-content .vs-dist-btn.active,
body .pavana-content .vs-db-item.sel, body .pavana-content .pr-selector-item.selected,
body .pavana-content tr.pr-row-selected > td, body .pavana-content .pr-schedule-table tbody tr:hover td,
body .pavana-content .vasn-row:hover td, body .pavana-content .vpo-row:hover td, body .pavana-content .vsc-row:hover td,
body .pavana-content .ob-checkbox-item.checked, body .pavana-content .vp-cert-card.cert-checked,
body .pavana-content .sapcol, body .pavana-content .vr-items-inner tbody tr:hover td { background: #e5f0fa !important; border-left-color: #0a6ed1; }
body .pavana-content .smtp-provider-card.active { border-color: #0a6ed1 !important; box-shadow: none; }
body .pavana-content .vs-vendor-card.selected { border-left: 3px solid #0a6ed1; }
/* Info / warning boxes inside pages */
body .pavana-content .smtp-info-box.info, body .pavana-content .sc-alert-item.info, body .pavana-content .vd-insight,
body .pavana-content .alert-info .alert-icon, body .pavana-content .ob-draft-reminder { background: var(--hz-informative-bg) !important; border-color: #0a6ed1 !important; }
body .pavana-content .smtp-info-box.warn, body .pavana-content .sc-alert-item.warning, body .pavana-content .cm-alert,
body .pavana-content .qm-alert-warn, body .pavana-content .risk-medium, body .pavana-content .alert-warning .alert-icon,
body .pavana-content .sc-alerts-header, body .pavana-content .sc-alerts-header:hover { background: var(--hz-critical-bg) !important; border-color: #e9730c !important; }
body .pavana-content .qm-alert { background: var(--hz-negative-bg) !important; border-color: #bb0000 !important; border-left-width: 1px; }
body .pavana-content .risk-low, body .pavana-content .smtp-test-result.result-ok, body .pavana-content .vs-broadcast-banner,
body .pavana-content .bid-entry.new-bid, body .pavana-content .vp-doc-uploaded { background: var(--hz-positive-bg) !important; border-color: #107e3e !important; }
/* Toggle switches (config, users) */
body .pavana-content .toggle-slider { background: #bfbfbf; }
body .pavana-content input:checked + .toggle-slider { background: #0a6ed1; }

/* ---- 18.6 Dashboard: procurement pipeline ------------------- */
body .pavana-content .flow-icon {
    background: #fff !important; color: #0854a0 !important;
    border: 1px solid var(--ar-panel-border); border-radius: var(--radius-sm);
}
body .pavana-content .flow-step:hover .flow-icon { transform: none; border-color: #0854a0; }
body .pavana-content .flow-phase-label { background: transparent !important; color: var(--text) !important; font-weight: 700; font-size: .7rem; }
body .pavana-content .flow-phase-label i { color: var(--hz-shell-icon) !important; }
body .pavana-content .flow-phase-arrow { color: var(--hz-shell-icon); opacity: .6; }
body .pavana-content .flow-count { font-weight: 400; font-size: 1rem; }
body .pavana-content .kpit-dot { display: none; }
body .pavana-content .vendor-bar, body .pavana-content .budget-bar-wrap, body .pavana-content .vs-sbar-track,
body .pavana-content .score-bar-track, body .pavana-content .vd-metric-bar-track, body .pavana-content .ai-confidence-bar,
body .pavana-content .pwd-strength-bar { background: #e5e5e5 !important; border-radius: 0; }
body .pavana-content .vendor-bar > div, body .pavana-content .vendor-bar span { background: #0a6ed1 !important; border-radius: 0; }

/* ---- 18.7 Lifecycle / step indicators ----------------------- */
body .pavana-content .asn-lc-step, body .pavana-content .vasn-lc-step {
    border-radius: var(--hz-radius-field); background: #fff !important; border: 1px solid #bfbfbf; color: var(--text-muted);
}
body .pavana-content .asn-lc-step.done, body .pavana-content .vasn-lc-step.done { color: var(--hz-positive); border-color: #107e3e; }
body .pavana-content .asn-lc-step.active, body .pavana-content .vasn-lc-step.active { background: #0a6ed1 !important; color: #fff; border-color: #0a6ed1; }
body .pavana-content .asn-lc-step.rejected, body .pavana-content .vasn-lc-step.rejected { color: var(--hz-negative); border-color: #bb0000; }
body .pavana-content .auc-wiz-step.completed { background: var(--hz-positive-bg) !important; }
body .pavana-content .auc-wiz-step .step-num, body .pavana-content .asm-step-circle { background: #fff; border: 1px solid #89919a; color: var(--text); }

/* Chat page: avatars in Fiori blue */
body .pavana-content .chat-room-item.active { background: #e5f0fa; border-left: 3px solid #0a6ed1; }

/* ---- 18.8 Inline-styled accents rendered by page scripts --- */
/* Payments tile top stripe, vendor tile bottom stripe */
body .pavana-content .kpi-bar { display: none; }
body .pavana-content .vd-bar-accent { display: none; }
/* Section-header icon tiles (vendor dashboard) painted with inline gradients */
body .pavana-content .vd-icon[style] { background: transparent !important; background-image: none !important; color: #0854a0 !important; }
body .pavana-content .vd-insight i { color: #0854a0; }
body .pavana-content .vd-insight-text { color: var(--text); font-weight: 400; }
/* Config → contract lifecycle stage tiles (inline 14px radius, tinted border) */
body .pavana-content div[style*="border-radius:14px"][style*="border:2px solid"] {
    background: #fff !important; border: 1px solid var(--ar-panel-border) !important; border-radius: var(--radius) !important;
}
body .pavana-content div[style*="border-radius:14px"][style*="border:2px solid"] i { color: #0854a0 !important; }
/* Inline pill badges (group / flow chips in config tables) */
body .pavana-content span[style*="border-radius:100px"] { border-radius: var(--hz-radius-field) !important; background: transparent !important; padding-left: 0 !important; padding-right: 0 !important; }
body .pavana-content span[style*="border-radius:6px"][style*="background:var(--bg)"] { border-radius: var(--hz-radius-field) !important; }
/* Standard buttons the pages tint inline (Invite Vendor etc.) */
body .pavana-content .btn-pavana[style*="#8b5cf6"], body .pavana-content .btn-pavana[style*="#7c3aed"],
body .pavana-content .btn-pavana[style*="#6366f1"], body .pavana-content .btn-pavana[style*="#4f46e5"],
body .pavana-content .btn-pavana[style*="#f7941d"], body .pavana-content .btn-pavana[style*="#0ea5e9"] {
    background: #0a6ed1 !important; border-color: #0a6ed1 !important; color: #fff !important;
}
body .pavana-modal-header i[style*="#8b5cf6"], body .pavana-modal-header i[style*="#7c3aed"] { color: var(--hz-shell-icon) !important; }
/* Page-level redefinitions of the shared status classes */
body .pavana-content .badge-draft, body .pavana-content .badge-expired, body .pavana-content .badge-danger,
body .pavana-content .badge-pending, body .pavana-content .badge-active, body .pavana-content .badge-completed {
    background: transparent !important; border-color: transparent !important; border-radius: 0;
    padding-left: 0; padding-right: 0; font-weight: 600; text-transform: none; letter-spacing: 0;
}
body .pavana-content .badge-draft { color: var(--hz-neutral) !important; font-weight: 400; }
body .pavana-content .badge-expired, body .pavana-content .badge-danger { color: var(--hz-negative) !important; }
body .pavana-content .badge-pending { color: var(--hz-critical) !important; }
body .pavana-content .badge-active, body .pavana-content .badge-completed { color: var(--hz-positive) !important; }

/* ============================================================ */
/* 19. Ariba comparison pass                                    */
/*     Side-by-side with SAP Ariba (Fiori 3 Quartz Light):      */
/*     document numbers in the UI font, text-only sub-tabs,     */
/*     Fiori list density, flat login page.                     */
/* ============================================================ */
/* Ariba never uses a monospace face for document / material numbers */
body .pavana-content .td-mono, body .pavana-content .po-num, body .pavana-content .poi-label,
body .pavana-content .pr-schedule-table td.mono,
body .pavana-content [style*="font-family:monospace"], body .pavana-content [style*="font-family: monospace"],
body .pavana-modal [style*="font-family:monospace"] {
    font-family: var(--hz-font) !important;
    font-weight: 600;
}
body .pavana-content .pavana-table .td-mono { font-size: inherit; }
body .pavana-content [style*="color:#7c3aed"], body .pavana-content [style*="color: #7c3aed"],
body .pavana-content [style*="color:#1d4ed8"] { color: #0854a0 !important; }

/* Sub-tabs are text only (ariba-ui.js adds .ar-tab-txt to tabs that have a label) */
body .ar-tab-txt > i:first-child { display: none !important; }

/* Fiori list density: 0.8rem cells, 2.25rem-ish rows (pavana.css ships 0.72rem) */
body .pavana-content .pavana-table { font-size: .8rem; }
body .pavana-content .pavana-table thead th { font-size: .78rem; padding: 9px 12px; }
body .pavana-content .pavana-table td { padding: 9px 12px; }

/* Login: Ariba's sign-in page is flat white — drop the grid, glows and blobs */
.hero-grid, .hero-glow-blue, .hero-glow-amber, .hero-glow, .hero-dots, .panel-blob-a, .panel-blob-b { display: none !important; }
.auth-hero:has(.hero-logo img) { background: #fff; }
.auth-greeting .greet-badge i { display: none; }

/* ============================================================ */
/* 20. Fourth pass — Ariba parity sweep                          */
/*     Shell: transparent shell buttons. Home: module switcher  */
/*     as a text tab strip. Lists: plain-weight cells, blue     */
/*     row actions, no boxed doc-type chips. Dialog labels in   */
/*     sentence case. Login page without marketing widgets.    */
/*     Ariba-style footer, dark message toasts, dotted focus.  */
/* ============================================================ */

/* ---- 20.1 Shell bar ---------------------------------------- */
/* Every control in the Fiori shell is a transparent icon button */
#fw-chat-fab { border-color: transparent; }
#fw-chat-fab:hover { border-color: transparent; }
.topbar-logout span { font-size: .8rem; }
.user-chip .fa-pen { display: none; }

/* ---- 20.2 Home: module switcher → Fiori icon tab bar ------- */
body .pavana-content #module-pills {
    display: flex; flex-wrap: wrap; gap: 0;
    border-bottom: 1px solid var(--ar-panel-border);
    margin-bottom: 16px;
}
body .pavana-content .module-pill {
    border: 0; border-bottom: 0.1875rem solid transparent; border-radius: 0;
    background: transparent; box-shadow: none;
    padding: 8px 14px; font-size: .8rem; font-weight: 400; color: var(--text-muted);
    white-space: nowrap;
}
body .pavana-content .module-pill i { display: none; }
body .pavana-content .module-pill:not(.active):hover { color: var(--hz-btn-text); border-color: transparent; background: transparent; box-shadow: none; }
body .pavana-content .module-pill.active { background: transparent; color: var(--hz-btn-text); border-bottom-color: #0854a0; font-weight: 600; }

/* Vendor dashboard section switcher: same treatment */
body .pavana-content .vd-nav-pill {
    border: 0; border-bottom: 0.1875rem solid transparent; border-radius: 0;
    background: transparent; padding: 8px 14px; font-size: .8rem; font-weight: 400; color: var(--text-muted);
}
body .pavana-content .vd-nav-pill > i:first-child { display: none; }
body .pavana-content .vd-nav-pill:not(.active):hover { color: var(--hz-btn-text); border-color: transparent; }
body .pavana-content .vd-nav-pill.active { background: transparent; color: var(--hz-btn-text); border-bottom-color: #0854a0; font-weight: 600; }
body .pavana-content .vd-nav-pill.active ~ .vd-nav-pill, body .pavana-content .vd-nav-pill { box-shadow: none; }

/* Home alert list: neutral icon wells, semantic colour on the glyph only */
body .pavana-content .alert-icon { background: transparent !important; border-radius: 0; }
body .pavana-content .alert-danger .alert-icon { color: var(--hz-negative); }
body .pavana-content .alert-warning .alert-icon { color: var(--hz-critical); }
body .pavana-content .alert-info .alert-icon { color: var(--hz-informative); }

/* ---- 20.3 Lists: Ariba cells are regular weight ------------ */
/* Only the header row and footer totals are bold; document numbers are plain links. */
body .pavana-content .pavana-table tbody td > strong,
body .pavana-content .pavana-table tbody td > b,
body .pavana-content .pavana-table tbody td > a,
body .pavana-content .pavana-table tbody td > span[style*="font-weight:6"],
body .pavana-content .pavana-table tbody td > span[style*="font-weight:7"],
body .pavana-content .pavana-table tbody td > span[style*="font-weight:5"],
body .pavana-content .pavana-table tbody td > div[style*="font-weight:6"],
body .pavana-content .pavana-table tbody td > div[style*="font-weight:7"],
body .pavana-content .pavana-table tbody td > div[style*="font-weight:5"],
body .pavana-content .pavana-table tbody td[style*="font-weight:6"],
body .pavana-content .pavana-table tbody td[style*="font-weight:7"],
body .pavana-content .pavana-table tbody td[style*="font-weight:5"],
body .pavana-content .pavana-table tbody td > .td-value,
body .pavana-content .pavana-table tbody td > .td-mono,
body .pavana-content .pavana-table tbody td > .td-name,
body .pavana-content .pavana-table tbody td > .td-title,
body .pavana-content .pavana-table tbody td > .fw-bold,
body .pavana-content .pavana-table tbody td > .fw-semibold,
body .pavana-content .pavana-table tbody td > .font-semibold { font-weight: 400 !important; }
body .pavana-content .pavana-table tbody td > a,
body .pavana-content .pavana-table tbody td > span[style*="color:var(--accent)"],
body .pavana-content .pavana-table tbody td > span[style*="color: var(--accent)"] { color: var(--hz-btn-text) !important; }
body .pavana-content .pavana-table tbody td > a:hover { text-decoration: underline; }
body .pavana-content .pavana-table tbody td { font-size: .8rem; }

/* Boxed monospace chips (PO doc type "NB") → plain text */
body .pavana-content .pavana-table td > span[style*="font-family:monospace"],
body .pavana-content .pavana-table td > span[style*="font-family: monospace"] {
    background: transparent !important; border: 0 !important; padding: 0 !important;
    font-size: inherit !important; font-weight: 400 !important;
}

/* Row actions: a single blue icon family; only delete keeps the negative colour */
body .pavana-content .btn-icon-pavana { color: var(--hz-btn-text); }
body .pavana-content .btn-icon-pavana[style*="#d97706"], body .pavana-content .btn-icon-pavana[style*="#f7941d"],
body .pavana-content .btn-icon-pavana[style*="#f59e0b"], body .pavana-content .btn-icon-pavana[style*="#059669"],
body .pavana-content .btn-icon-pavana[style*="#10b981"], body .pavana-content .btn-icon-pavana[style*="#16a34a"],
body .pavana-content .btn-icon-pavana[style*="#0284c7"], body .pavana-content .btn-icon-pavana[style*="#7dd3fc"] { color: var(--hz-btn-text) !important; }
body .pavana-content .btn-icon-pavana.btn-danger-icon,
body .pavana-content .btn-icon-pavana[style*="#fca5a5"] { color: #bb0000 !important; }

/* Standard buttons inside a list row (e.g. "Manage") → Fiori default button */
body .pavana-content .pavana-table .btn-pavana:not(.btn-primary-pavana):not(.btn-danger-pavana):not(.btn-icon-pavana) {
    background: #fff; border: 1px solid var(--hz-btn-border); color: var(--hz-btn-text); font-weight: 400;
}
body .pavana-content .pavana-table .btn-pavana:not(.btn-primary-pavana):not(.btn-danger-pavana):not(.btn-icon-pavana):hover { background: #ebf5fe; }

/* ---- 20.4 Dialog / detail labels: sentence case ------------ */
body .pavana-content .detail-field label, body .pavana-modal .detail-field label,
body .pavana-content .detail-field > label, body .pavana-modal .detail-field > label,
body .pavana-modal .kv-label, body .pavana-content .kv-label,
body .pavana-modal .dl-label, body .pavana-content .dl-label {
    text-transform: none !important; letter-spacing: 0 !important; font-weight: 400 !important;
    font-size: .74rem !important; color: var(--text-muted) !important;
}
body .pavana-modal .detail-field > span, body .pavana-content .detail-field > span { font-size: .84rem; }
body .pavana-modal .detail-field .td-value[style*="font-weight:700"] { font-weight: 400 !important; font-size: 1rem !important; }

/* Panel titles are text-only in Ariba: hide the leading decorative glyph */
body .pavana-card-header > i:first-child, body .pavana-card-header > h2 > i:first-child, body .pavana-card-header > h3 > i:first-child,
body .pavana-content .db-section-title > i:first-child, body .pavana-content .sect-header > i:first-child,
body .pavana-content .detail-section-title > i:first-child, body .pavana-modal .detail-section-title > i:first-child,
body .pavana-modal-header > h3 > i:first-child, body .pavana-modal-header > i:first-child,
body .pavana-modal .modal-title > i:first-child { display: none; }

/* ---- 20.5 Login page: Ariba's sign-in is a plain form ------ */
.auth-hero .hero-pills, .auth-hero .hero-stats { display: none !important; }
.auth-greeting .greet-badge { display: none !important; }
.auth-input-wrap .field-icon { display: none !important; }
.auth-input-wrap input { padding-left: 10px !important; }
.auth-input-wrap input::placeholder { color: #8c8c8c; }
.auth-secure-note { display: none !important; }
.hero-desc { max-width: 440px; }

/* ---- 20.6 Footer: Ariba's copyright strip ------------------ */
#app-copyright-footer {
    text-align: left !important;
    padding: 10px 24px !important;
    font-size: .72rem !important;
    color: var(--text-muted) !important;
    background: #f7f7f7 !important;
    border-top: 1px solid var(--ar-panel-border) !important;
}
#app-copyright-footer a { color: var(--hz-btn-text); font-weight: 400; }
#app-copyright-footer a:hover { text-decoration: underline; }

/* ---- 20.7 Message toast (Fiori 3: dark, no semantic fills) - */
#pavana-toast-container > div {
    background: #32363a !important; border: 1px solid transparent !important;
    border-radius: var(--radius-sm) !important; color: #fff !important;
    font-weight: 400 !important; box-shadow: var(--shadow-lg) !important;
}

/* ---- 20.8 Keyboard focus: Fiori dotted outline ------------- */
body .pavana-content button:focus-visible, body .pavana-modal button:focus-visible,
body .pavana-content a:focus-visible, .pavana-sidebar .nav-item:focus-visible, .topbar-btn:focus-visible,
.topbar-logout:focus-visible, #fw-chat-fab:focus-visible {
    outline: 1px dotted var(--text); outline-offset: -3px; box-shadow: none;
}
.btn-primary-pavana:focus-visible, .topbar-btn:focus-visible, .topbar-logout:focus-visible, #fw-chat-fab:focus-visible,
.pavana-sidebar .nav-item:focus-visible { outline-color: #fff; }
@media (min-width: 1025px) { .pavana-sidebar .nav-item:focus-visible { outline-color: var(--text); } }

/* ---- 20.9 Status text: page scripts occasionally print the raw enum
        ("po_created", "under_review"); ariba-ui.js rewrites those to
        "PO created" / "Under review". Nothing to do in CSS except make
        sure no chip re-uppercases them. ---------------------- */
body .pavana-content .aud-sev, body .pavana-content .sap-status-label { text-transform: none; }

/* Status values the shared APP.badge() helper emits that had no colour mapping yet */
body .pavana-content .badge-partially_delivered, body .pavana-content .badge-partial, body .pavana-content .badge-on_hold,
body .pavana-content .badge-in_progress, body .pavana-content .badge-pending { color: var(--hz-critical) !important; }
body .pavana-content .badge-payment_processing, body .pavana-content .badge-po_created, body .pavana-content .badge-ordered,
body .pavana-content .badge-open { color: var(--hz-informative) !important; }
body .pavana-content .badge-p365 { background: transparent; border-color: transparent; padding-left: 0; padding-right: 0; font-size: .76rem; font-weight: 600; }
body .pavana-content .badge-p365.badge-draft, body .pavana-content .badge-p365.badge-closed { color: var(--hz-neutral); }
/* Invoice list: 3-way match result printed as the raw value */
body .pavana-content .pavana-table td > span[style*="color:#107e3e"] { color: var(--hz-positive) !important; }

/* ============================================================ */
/* 21. Forms, fields & display — aligned with the eximin portal  */
/*     (/var/www/html/eximin horizon.css §7/§18 and its SAP      */
/*     reference Add.png): filled light field body with an       */
/*     underline only, blue underline on focus, value-help and   */
/*     calendar glyphs inside the field, "Label:*" required      */
/*     marker after the colon, read-only values with a dashed    */
/*     underline, transparent Cancel in dialog footers.          */
/* ============================================================ */
:root {
    --ar-field-bg: #f2f3f5;          /* sapField_Background (filled) */
    --ar-field-bg-hover: #e9ebee;
    --ar-field-border: #556b82;      /* sapField_BorderColor */
    --ar-field-icon: #475e75;        /* slate glyphs inside fields */
    --ar-field-focus: #0a6ed1;
}

/* ---- 21.1 Field body ---------------------------------------- */
body .pavana-input, body .pavana-select-f, body .pavana-textarea, body .pavana-select,
body .li-table .li-input, body .li-table input, body .li-table select,
body .form-control, body .form-select, body textarea.form-control,
body .pavana-content input[type="text"].ar-field, body .pavana-search {
    background-color: var(--ar-field-bg);
    border: 0;
    border-bottom: 1px solid var(--ar-field-border);
    border-radius: .25rem .25rem 0 0;
    box-shadow: none;
    color: var(--text);
    font-size: .85rem;
}
body .pavana-input, body .pavana-select-f, body .pavana-textarea, body .pavana-select { padding: 7px 10px; }
body .pavana-input:hover, body .pavana-select-f:hover, body .pavana-textarea:hover, body .pavana-select:hover,
body .li-table .li-input:hover, body .li-table input:hover, body .li-table select:hover,
body .form-control:hover, body .form-select:hover, body .pavana-search:hover {
    background-color: var(--ar-field-bg-hover);
    border-color: transparent;
    border-bottom-color: var(--ar-field-focus);
}
body .pavana-input:focus, body .pavana-select-f:focus, body .pavana-textarea:focus, body .pavana-select:focus,
body .li-table .li-input:focus, body .li-table input:focus, body .li-table select:focus,
body .form-control:focus, body .form-select:focus, body .pavana-search:focus-within {
    background-color: var(--ar-field-bg);
    border: 0;
    border-bottom: 1px solid var(--ar-field-focus);
    box-shadow: inset 0 -1px 0 var(--ar-field-focus);
    outline: 0;
}
body .pavana-search input { background: transparent; border: 0; box-shadow: none; font-size: .85rem; }
body .pavana-search input:focus { box-shadow: none; }
body .pavana-search i { color: var(--ar-field-icon); }
/* Placeholders are italic in the SAP reference ("MM/dd/yyyy") */
body .pavana-input::placeholder, body .pavana-textarea::placeholder, body .form-control::placeholder,
body .pavana-search input::placeholder, body .li-table input::placeholder { color: #6a6d70; font-style: italic; }
/* Read-only / disabled: plain value on a dashed underline (Add.png "Address") */
body .pavana-input:disabled, body .pavana-input[readonly], body .pavana-textarea[readonly], body .pavana-textarea:disabled,
body .pavana-select-f:disabled, body .pavana-select:disabled,
body .form-control:disabled, body .form-control[readonly], body .form-select:disabled {
    background-color: transparent;
    border: 0;
    border-bottom: 1px dashed #8c8c8c;
    border-radius: 0;
    color: var(--text);
    opacity: 1;
    background-image: none;
}
/* Validation: red underline instead of a red box */
body .pavana-input.is-invalid, body .pavana-select-f.is-invalid, body .pavana-textarea.is-invalid,
body .form-control.is-invalid, body .form-select.is-invalid,
body .pavana-input[style*="border-color:#ef4444"], body .pavana-input[style*="border-color: #ef4444"],
body .pavana-input[style*="border-color:#dc2626"], body .pavana-select-f[style*="border-color:#ef4444"] {
    border: 0 !important;
    border-bottom: 1px solid #bb0000 !important;
    box-shadow: inset 0 -1px 0 #bb0000 !important;
    background-image: none !important;
}

/* ---- 21.2 Glyphs inside the field ----------------------------- */
/* Every dropdown carries the value-help (overlapping squares) glyph, as in eximin */
body .pavana-select, body .pavana-select-f, body .form-select, body .li-table select {
    -webkit-appearance: none;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23475e75' stroke-width='1.3'%3E%3Crect x='5.5' y='5.5' width='8' height='8' rx='1'/%3E%3Cpath d='M10.5 2.5h-7a1 1 0 0 0-1 1v7'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right .6rem center;
    background-size: .8rem;
    padding-right: 2rem;
}
body .pavana-select-f[multiple], body .form-select[multiple], body .pavana-select-f[size] { background-image: none; padding-right: 10px; }
/* Dates: small slate calendar glyph; the native picker sits invisibly on top of it */
body input[type="date"].pavana-input, body input[type="date"].form-control,
body input[type="datetime-local"].pavana-input, body input[type="datetime-local"].form-control,
body input[type="month"].pavana-input, body .li-table input[type="date"] {
    padding-right: 2.1rem;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23475e75' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 0a.5.5 0 0 1 .5.5V1h8V.5a.5.5 0 0 1 1 0V1h1a2 2 0 0 1 2 2v11a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V3a2 2 0 0 1 2-2h1V.5a.5.5 0 0 1 .5-.5zM1 4v10a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V4H1z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right .6rem center;
    background-size: .75rem;
}
body input[type="date"]::-webkit-calendar-picker-indicator,
body input[type="datetime-local"]::-webkit-calendar-picker-indicator,
body input[type="month"]::-webkit-calendar-picker-indicator {
    opacity: 0; margin: 0; padding: 0; width: 1.4rem; height: 1.4rem; margin-right: -.4rem; cursor: pointer;
}
body input[type="number"].pavana-input { -moz-appearance: textfield; }

/* ---- 21.3 Labels: quiet, "Label:*" ---------------------------- */
body .pavana-label, body .form-label, body .pavana-modal .pavana-label {
    font-size: .8125rem; font-weight: 400; color: var(--text-muted);
    text-transform: none; letter-spacing: 0; margin-bottom: 3px;
}
body .pavana-label > i, body .form-label > i { display: none; }        /* no label-side icons */
body .pavana-label::after, body .form-label::after { content: ":"; }
body .pavana-label:has(.ar-req)::after, body .form-label:has(.ar-req)::after { content: ""; }
body .ar-req { color: #bb0000; font-weight: 600; margin-left: 1px; }
body .ar-req::before { content: ":"; color: var(--text-muted); font-weight: 400; margin-right: 1px; }

/* ---- 21.4 Form sections & display ----------------------------- */
/* Group headings inside a form: dark semibold over a hairline (Add.png "Contract Data") */
body .pavana-content .detail-section-title, body .pavana-modal .detail-section-title,
body .pavana-content .sect-header, body .pavana-modal .sect-header,
body .pavana-content .form-section-title, body .pavana-modal .form-section-title,
body .pavana-modal .modal-section-title {
    color: var(--text); font-weight: 700; font-size: .875rem; text-transform: none; letter-spacing: 0;
    border-bottom: 1px solid var(--ar-panel-border); padding-bottom: 6px; margin-bottom: 12px;
}
/* Read-only detail values: regular text under a quiet label */
body .pavana-content .detail-field > span, body .pavana-modal .detail-field > span,
body .pavana-content .detail-field > div, body .pavana-modal .detail-field > div { font-size: .85rem; color: var(--text); }
/* Field help / hint text */
body .pavana-content .form-text, body .pavana-modal .form-text,
body .pavana-content .field-hint, body .pavana-modal .field-hint { font-size: .74rem; color: var(--text-muted); }

/* ---- 21.5 Dialog footers: emphasized action + transparent Cancel ---- */
body .pavana-modal-footer .btn-pavana:not(.btn-primary-pavana):not(.btn-danger-pavana):not(.btn-success-pavana),
body .modal-footer .btn:not(.btn-primary):not(.btn-danger):not(.btn-success) {
    background: transparent; border-color: transparent; color: var(--hz-btn-text); box-shadow: none;
}
body .pavana-modal-footer .btn-pavana:not(.btn-primary-pavana):not(.btn-danger-pavana):not(.btn-success-pavana):hover,
body .modal-footer .btn:not(.btn-primary):not(.btn-danger):not(.btn-success):hover { background: #ebf5fe; border-color: transparent; }

/* ============================================================ */
/* 22. Shell bar carries the login-page logo                    */
/*     The full-colour Pavana wordmark needs a light ground,    */
/*     so the shell follows the eximin / S/4HANA reference:      */
/*     flat white bar, hairline below, dark text, slate icons.   */
/* ============================================================ */
:root {
    --ar-shell-bg: #ffffff;
    --ar-shell-text: #32363a;
    --ar-shell-hover: #f5f5f5;
    --ar-shell-icon: #475e75;
}
.pavana-topbar { border-bottom: 1px solid var(--ar-panel-border); box-shadow: none; }
@media (min-width: 1025px) {
    .pavana-topbar { box-shadow: 0 1px 0 var(--ar-panel-border); }
    .pavana-sidebar { border-top: 0; box-shadow: inset 0 -1px 0 var(--ar-panel-border); }
}
.ar-shell-brand img { height: 36px; width: auto; max-width: 160px; }
.ar-shell-brand-name { display: none; }               /* the wordmark is in the image */
.topbar-btn, .topbar-hamburger, .topbar-hamburger:hover, .topbar-logout { color: var(--ar-shell-icon); }
.topbar-btn:hover, .topbar-logout:hover, .topbar-hamburger:hover { background: var(--ar-shell-hover); color: var(--hz-btn-text); }
.topbar-divider { background: var(--ar-panel-border); }
.topbar-notif-dot { border-color: #fff; }
.user-info-name { color: var(--text); }
.user-info-role { color: var(--text-muted); }
.user-avatar { background: #ebf5fe; color: #0854a0; }
#fw-chat-fab { color: var(--ar-shell-icon); }
#fw-chat-fab:hover { color: var(--hz-btn-text); background: var(--ar-shell-hover); }
.btn-primary-pavana:focus-visible { outline-color: #fff; }
.topbar-btn:focus-visible, .topbar-logout:focus-visible, #fw-chat-fab:focus-visible,
.pavana-sidebar .nav-item:focus-visible { outline-color: var(--text); }
/* Off-canvas drawer header (≤1024px) shows the same logo */
.sidebar-header img, .sidebar-logo img { height: 34px; width: auto; max-width: 150px; }

/* ============================================================ */
/* 23. Menu items — eximin launchpad look                       */
/*     Reference: /var/www/html/eximin horizon.css §"spaces"    */
/*     (.ex-space-link / .ex-space-item, menu.png, Dashboard.png)*/
/*     Tabs: bold dark labels with slate icons; hover = blue     */
/*     text on the standard grey button hover ground + the 3px  */
/*     blue underline (the active tab keeps it). Drop-down items:*/
/*     slate icon, hover = grey ground, blue text and a thin     */
/*     blue line under the words only (never the icon); active  */
/*     = Fiori list selection (light blue, inset blue left bar). */
/* ============================================================ */
:root {
    --ar-nav-underline: #0070f2;      /* sapBrandColor */
    --ar-nav-icon: #475e75;           /* sapShell_InteractiveTextColor */
    --ar-nav-icon-active: #0064d9;    /* sapButton_TextColor */
    --ar-nav-hover-bg: #eaecee;       /* standard button hover */
    --ar-nav-selected-bg: #ebf8ff;    /* sapList_SelectionBackgroundColor */
}
@media (min-width: 1025px) {
    /* --- top-level tabs --- */
    .sidebar-nav > .nav-item,
    .sidebar-nav .nav-parent-toggle {
        position: relative;
        font-weight: 600;
        color: var(--text);
        border-bottom-color: transparent;
        border-radius: 0;
        transition: color .12s, background .12s, border-bottom-color .12s;
    }
    .sidebar-nav > .nav-item:hover,
    .sidebar-nav .nav-parent-toggle:hover,
    .sidebar-nav .nav-parent:hover > .nav-parent-toggle,
    .sidebar-nav > .nav-item:focus-visible,
    .sidebar-nav .nav-parent-toggle:focus-visible {
        color: var(--ar-nav-icon-active);
        background: var(--ar-nav-hover-bg);
        border-bottom-color: var(--ar-nav-underline);
    }
    .sidebar-nav > .nav-item.active,
    .sidebar-nav .nav-parent-toggle.active,
    .sidebar-nav .nav-parent:hover > .nav-parent-toggle.active {
        color: var(--ar-nav-icon-active);
        font-weight: 700;
        border-bottom-color: var(--ar-nav-underline);
    }

    /* --- icons: clear, monochrome slate; blue on hover/active --- */
    .sidebar-nav .nav-icon {
        display: inline-flex !important;
        align-items: center; justify-content: center;
        width: 18px; height: 18px;
        margin: 0;
        font-size: .9rem;
        line-height: 1;
        color: var(--ar-nav-icon) !important;
        background: transparent !important;
        transition: color .12s;
    }
    .sidebar-nav > .nav-item,
    .sidebar-nav .nav-parent-toggle { gap: 8px; }
    .sidebar-nav > .nav-item:hover .nav-icon,
    .sidebar-nav .nav-parent-toggle:hover .nav-icon,
    .sidebar-nav .nav-parent:hover > .nav-parent-toggle .nav-icon,
    .sidebar-nav > .nav-item.active .nav-icon,
    .sidebar-nav .nav-parent-toggle.active .nav-icon { color: var(--ar-nav-icon-active) !important; }
    /* caret separated from the label by a hairline, like "Purchasing | ⌄" */
    .sidebar-nav .nav-parent-toggle .nav-chevron {
        margin-left: 4px; padding-left: 8px;
        border-left: 1px solid var(--ar-panel-border);
        height: 16px; display: inline-flex !important; align-items: center;
        color: var(--ar-nav-icon);
    }

    /* --- drop-down panel --- */
    .nav-submenu { padding: 8px 6px; min-width: 16rem; }
    .nav-submenu-caption {
        font-size: .85rem; font-weight: 700; letter-spacing: 0; text-transform: none;
        color: var(--ar-nav-icon-active); padding: 6px 12px 4px;
    }
    .nav-submenu .nav-item {
        padding: 6px 12px;
        gap: 10px;
        border: 0;
        border-radius: 6px;
        font-size: .82rem;
        font-weight: 500;
        color: var(--text);
        box-shadow: none;
        transition: background .12s, color .12s;
    }
    .nav-submenu .nav-item .nav-icon {
        width: 18px; height: 18px;
        font-size: .9rem;
        color: var(--ar-nav-icon) !important;
    }
    /* hover: grey ground, blue text, thin blue line under the words only
       (text-decoration never reaches the inline-block icon/badge) */
    .nav-submenu .nav-item:hover,
    .nav-submenu .nav-item:focus-visible {
        background: var(--ar-nav-hover-bg);
        color: var(--ar-nav-icon-active);
        text-decoration: underline;
        text-decoration-thickness: 1px;
        text-underline-offset: .25em;
        text-decoration-color: var(--ar-nav-icon-active);
        box-shadow: none;
    }
    .nav-submenu .nav-item:hover .nav-icon { color: var(--ar-nav-icon-active) !important; }
    /* active: Fiori list selection */
    .nav-submenu .nav-item.active {
        background: var(--ar-nav-selected-bg);
        color: var(--ar-nav-icon-active);
        font-weight: 700;
        box-shadow: inset 0.1875rem 0 0 var(--ar-nav-underline);
    }
    .nav-submenu .nav-item.active .nav-icon { color: var(--ar-nav-icon-active) !important; }
}
/* Drawer (≤1024px): same icon treatment; hover = grey ground + blue text with the word underline */
@media (max-width: 1024px) {
    .sidebar-nav .nav-icon { color: var(--ar-nav-icon) !important; font-size: .82rem; width: 18px; }
    .sidebar-nav .nav-item:hover, .sidebar-nav .nav-parent-toggle:hover {
        background: var(--ar-nav-hover-bg); color: var(--ar-nav-icon-active);
        text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .25em;
    }
    .sidebar-nav .nav-item:hover .nav-icon,
    .sidebar-nav .nav-parent-toggle:hover .nav-icon,
    .sidebar-nav .nav-item.active .nav-icon,
    .sidebar-nav .nav-parent-toggle.active .nav-icon { color: var(--ar-nav-icon-active) !important; }
    .sidebar-nav .nav-item.active { background: var(--ar-nav-selected-bg); box-shadow: inset 0.1875rem 0 0 var(--ar-nav-underline); }
}

/* In-page tab strips: blue underline on mouse over */
.nav-tabs .nav-link:hover,
.pavana-tab:hover,
.pavana-content .config-nav-item:hover {
    color: var(--hz-btn-text);
    border-bottom-color: var(--ar-nav-underline);
}
.pavana-content .config-nav-item { border-bottom: 0.1875rem solid transparent; }
.pavana-content .config-nav-item:hover i,
.pavana-content .config-nav-item.active i { color: var(--ar-nav-icon-active) !important; }
body .pavana-content .module-pill:not(.active):hover,
body .pavana-content .vd-nav-pill:not(.active):hover,
body .pavana-content .ar-tab-txt:not(.active):hover {
    color: var(--hz-btn-text);
    border-bottom-color: var(--ar-nav-underline);
    background: transparent;
}

/* ============================================================ */
/* 24. Type scale — SAP Ariba (compact), same "72" family        */
/*     The eximin/S4HANA scale (16px root, .875rem body) read    */
/*     too large for this portal; Ariba's shell runs a 13px      */
/*     body with 12px labels/table text and quiet 18px titles.   */
/*     Weights follow the reference: 600 title/tabs/buttons/card */
/*     headers, 400 muted table headers, 300 KPI numerals.       */
/* ============================================================ */
:root {
    --ar-fs-body: 13px;       /* Ariba body / table row text */
    --ar-fs-title: 18px;      /* page title, 600 */
    --ar-fs-sub: 12px;        /* page subtitle */
    --ar-fs-tab: 13px;        /* tab strips, 600 */
    --ar-fs-menu: 13px;       /* menubar tabs, 600 */
    --ar-fs-menu-item: 12.5px;/* drop-down items, 500 */
    --ar-fs-caption: 12px;    /* drop-down group captions, 700 */
    --ar-fs-label: 12px;      /* field labels, 400 muted */
    --ar-fs-th: 11.5px;       /* table headers, 400 muted */
    --ar-fs-td: 12.5px;       /* table cells */
    --ar-fs-btn: 12.5px;      /* buttons, 600 */
    --ar-fs-btn-sm: 11.5px;   /* small buttons */
    --ar-fs-kpi-title: 12px;  /* KPI tile title, 600 */
    --ar-fs-kpi-value: 20px;  /* KPI numeral, 300 */
    --ar-fs-kpi-sub: 11px;    /* KPI sub text */
    --ar-fs-modal: 15px;      /* dialog title, 600 */
    --ar-fs-section: 13.5px;  /* section titles, 700 */
    --ar-fs-small: 11.5px;    /* meta / chips */
}
body, body .pavana-content { font-size: var(--ar-fs-body); line-height: 1.5; }
body .pavana-content p, body .pavana-content td, body .pavana-content li,
body .pavana-content .detail-field span { font-size: inherit; }

/* Page header */
body .pavana-content .ar-page-title, body .pavana-content .page-title,
body .pavana-content .page-header h1, body .pavana-content .page-header h2 {
    font-size: var(--ar-fs-title); font-weight: 600; line-height: 1.25; color: var(--text);
}
body .pavana-content .ar-page-sub, body .pavana-content .page-subtitle,
body .pavana-content .page-header p { font-size: var(--ar-fs-sub); color: var(--text-muted); }

/* Card / panel / section headings */
body .pavana-content .pavana-card-header h2, body .pavana-content .pavana-card-header h3,
body .pavana-content .card-header, body .pavana-content .card-title {
    font-size: var(--ar-fs-body); font-weight: 600; color: var(--text);
}
body .pavana-content .db-section-title, body .pavana-content .detail-section-title,
body .pavana-content .form-section-title { font-size: var(--ar-fs-section); font-weight: 700; color: var(--text); }

/* Tab strips */
body .pavana-content .pavana-tab, body .pavana-content .nav-tabs .nav-link,
body .pavana-content .module-pill, body .pavana-content .vd-nav-pill, body .pavana-content .ar-tab-txt,
body .pavana-content .config-nav-item {
    font-size: var(--ar-fs-tab); font-weight: 600; padding: 7px 12px;
}

/* Shell menubar (desktop) and drop-downs */
@media (min-width: 1025px) {
    .sidebar-nav > .nav-item, .sidebar-nav .nav-parent-toggle { font-size: var(--ar-fs-menu); padding: 0 14px; }
    .nav-submenu .nav-item { font-size: var(--ar-fs-menu-item); }
    .nav-submenu-caption { font-size: var(--ar-fs-caption); }
}
@media (max-width: 1024px) { .sidebar-nav .nav-item, .sidebar-nav .nav-parent-toggle { font-size: var(--ar-fs-menu-item); } }
.user-info-name { font-size: var(--ar-fs-small); font-weight: 600; }
.user-info-role { font-size: 11.5px; }
.topbar-logout, .topbar-logout span { font-size: var(--ar-fs-small); }

/* Tables — Fiori responsive table: quiet 400 muted header, hairline only */
body .pavana-content .pavana-table, body .pavana-content .li-table, body .pavana-content .table { font-size: var(--ar-fs-td); }
body .pavana-content .pavana-table thead th, body .pavana-content .li-table thead th,
body .pavana-content .table > thead th, body .pavana-content table thead th {
    font-size: var(--ar-fs-th); font-weight: 400; color: var(--text-muted);
    background: transparent; text-transform: none; letter-spacing: 0;
    border-bottom: 1px solid var(--ar-panel-border);
}
body .pavana-content .pavana-table tbody td, body .pavana-content .li-table tbody td { padding: 8px 12px; }
body .pavana-content .pavana-table .td-mono { font-size: inherit; }

/* Buttons — Fiori standard / emphasized, 600 */
body .pavana-content .btn-pavana, body .pavana-content .btn,
body .pavana-content .btn-primary-pavana, body .pavana-content .btn-secondary-pavana,
.modal .btn, .modal .btn-pavana, .pavana-modal .btn-pavana {
    font-size: var(--ar-fs-btn); font-weight: 600; line-height: 1.35; padding: 5px 12px;
}
body .pavana-content .btn-sm-pavana, body .pavana-content .btn-sm,
.modal .btn-sm, .pavana-modal .btn-sm-pavana { font-size: var(--ar-fs-btn-sm); padding: 4px 10px; }

/* Forms — labels .8125rem 400 muted, inputs at body size */
body .pavana-content .pavana-label, body .pavana-content .form-label, body .pavana-content .detail-field label,
.modal .pavana-label, .modal .form-label, .pavana-modal .pavana-label, .pavana-modal .form-label,
.pavana-modal .detail-field label { font-size: var(--ar-fs-label); font-weight: 400; color: var(--text-muted); }
body .pavana-content .pavana-input, body .pavana-content .pavana-select, body .pavana-content .pavana-select-f,
body .pavana-content .pavana-textarea, body .pavana-content .form-control, body .pavana-content .form-select,
.modal .pavana-input, .modal .pavana-select, .modal .pavana-select-f, .modal .pavana-textarea,
.modal .form-control, .modal .form-select,
.pavana-modal .pavana-input, .pavana-modal .pavana-select, .pavana-modal .pavana-select-f, .pavana-modal .pavana-textarea,
.pavana-modal .form-control, .pavana-modal .form-select,
body .pavana-content .pavana-search input { font-size: var(--ar-fs-body); }
body .pavana-content .detail-field span, body .pavana-content .detail-field .value { font-size: var(--ar-fs-body); }

/* KPI / insight tiles: dark 600 title, muted sub, large LIGHT numeral */
body .pavana-content .kpi-label, body .pavana-content .v-kpi-label { font-size: var(--ar-fs-kpi-title); font-weight: 700; color: #0854a0; }
body .pavana-content .kpi-value, body .pavana-content .v-kpi-val { font-size: var(--ar-fs-kpi-value); font-weight: 300; line-height: 1.15; }
body .pavana-content .kpi-sub, body .pavana-content .kpi-trend { font-size: var(--ar-fs-kpi-sub); }

/* Dialog titles */
.pavana-modal-header h3, .modal-header .modal-title, .modal-title { font-size: var(--ar-fs-modal); font-weight: 600; color: var(--text); }

/* Status text / badges / meta */
body .pavana-content .badge-pavana, body .pavana-content .pavana-badge, body .pavana-content .badge { font-size: var(--ar-fs-small); }
body .pavana-content small, body .pavana-content .text-muted, body .pavana-content .meta { font-size: var(--ar-fs-small); }

/* Headings keep Horizon's 600 (page title above is the one 700 exception) */
body .pavana-content h1, body .pavana-content h2, body .pavana-content h3,
body .pavana-content h4, body .pavana-content h5, body .pavana-content h6 { font-weight: 600; }

/* ---- 24.1 Page-level components that set their own tiny sizes ---- */
/* Table cells (§19/§20 set .8rem on tbody td; pages set .72rem) */
body .pavana-content table tbody td, body .pavana-content .pavana-table tbody td,
body .pavana-content .li-table tbody td { font-size: var(--ar-fs-td); }
body .pavana-content table tbody td small, body .pavana-content table tbody td .td-sub,
body .pavana-content table tbody td div[style*="font-size"] { font-size: var(--ar-fs-small) !important; }

/* KPI / insight tiles on every page: dark 600 title, light 300 numeral, muted sub */
body .pavana-content .kpit-label, body .pavana-content .kpi-label, body .pavana-content [class*="kpi-label"],
body .pavana-content [class*="kpi-title"], body .pavana-content [class*="stat-label"] {
    font-size: var(--ar-fs-kpi-title); font-weight: 700; color: #0854a0;   /* SAP Ariba blue, bold (user 2026-09-10) */
    text-transform: none; letter-spacing: 0;
}
body .pavana-content .kpit-value, body .pavana-content .kpi-value, body .pavana-content [class*="kpi-val"],
body .pavana-content [class*="stat-value"], body .pavana-content [class*="kpi-value"] {
    font-size: var(--ar-fs-kpi-value) !important; font-weight: 300; line-height: 1.15; color: var(--text);
}
body .pavana-content .kpit-sub, body .pavana-content .kpi-sub, body .pavana-content [class*="kpi-sub"],
body .pavana-content .kpit-delta, body .pavana-content [class*="kpi-delta"] { font-size: var(--ar-fs-kpi-sub); }
body .pavana-content .kpi-alerts-header { font-size: var(--ar-fs-body); font-weight: 600; }
body .pavana-content .kpi-alerts-body .alert-item { font-size: var(--ar-fs-small); }
body .pavana-content .kpi-alerts-body .alert-item div[style*="font-weight:700"] { font-size: var(--ar-fs-small) !important; font-weight: 600 !important; }
body .pavana-content .kpi-alerts-body .alert-item div[style*="font-size:.72rem"] { font-size: 11.5px !important; }

/* Filter-bar and field labels: .8125rem, 400, muted, sentence case */
body .pavana-content [class*="filter-label"], body .pavana-content .aud-f label,
body .pavana-content .db-filter-label, body .pavana-content [class*="-label"]:not([class*="kpi"]):not([class*="stat"]):not(.flow-label):not([class*="ring-label"]),
.pavana-modal [class*="-label"]:not([class*="kpi"]), .modal [class*="-label"]:not([class*="kpi"]) {
    font-size: var(--ar-fs-label); font-weight: 400; color: var(--text-muted);
    text-transform: none; letter-spacing: 0;
}
body .pavana-content .flow-label, body .pavana-content [class*="flow-label"] { font-size: 11.5px; text-transform: none; letter-spacing: 0; }
/* Field values next to those labels sit at body size */
body .pavana-content [class*="-value"]:not([class*="kpi"]):not([class*="stat"]),
.pavana-modal [class*="-value"]:not([class*="kpi"]), .modal [class*="-value"]:not([class*="kpi"]) { font-size: var(--ar-fs-body); }

/* Buttons that carry an inline font-size from page scripts */
body .pavana-content .btn-pavana[style*="font-size"], body .pavana-content .btn-sm-pavana[style*="font-size"] { font-size: var(--ar-fs-btn-sm) !important; }
body .pavana-content .btn-icon-pavana { font-size: var(--ar-fs-body); }
/* Status text, chips and inline-sized spans inside table cells */
body .pavana-content table tbody td span[style*="font-size"], body .pavana-content table tbody td small,
body .pavana-content table tbody td [class*="status"], body .pavana-content table tbody td [class*="chip"],
body .pavana-content table tbody td [class*="pill"], body .pavana-content table tbody td [class*="badge"] { font-size: var(--ar-fs-small) !important; }
/* Card / panel headers that pages name differently */
body .pavana-content [class*="card-header"], body .pavana-content [class*="panel-head"],
body .pavana-content [class*="section-head"], body .pavana-content [class*="card-title"] { font-size: var(--ar-fs-body); font-weight: 600; color: var(--text); }
body .pavana-content [class*="card-header"] h1, body .pavana-content [class*="card-header"] h2,
body .pavana-content [class*="card-header"] h3, body .pavana-content [class*="card-header"] h4 { font-size: var(--ar-fs-body); font-weight: 600; }

/* ============================================================ */
/* 25. Phone / tablet refinements                               */
/* ============================================================ */
/* Long currency numerals (₹46,14,55,919) must shrink and wrap inside
   two-column KPI tiles instead of spilling past the card edge. */
body .pavana-content .kpit-value, body .pavana-content .kpi-value, body .pavana-content [class*="kpi-val"],
body .pavana-content [class*="stat-value"], body .pavana-content [class*="kpi-value"] {
    min-width: 0; max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
body .pavana-content [class*="kpi"] > div, body .pavana-content [class*="kpi"] > a { min-width: 0; }
@media (max-width: 640px) {
    body .pavana-content .kpit-value, body .pavana-content .kpi-value, body .pavana-content [class*="kpi-val"],
    body .pavana-content [class*="stat-value"], body .pavana-content [class*="kpi-value"] {
        font-size: clamp(15px, 4.6vw, 20px) !important;
    }
    body .pavana-content .ar-page-title { font-size: 17px; }
    body .pavana-content .pavana-tab, body .pavana-content .nav-tabs .nav-link,
    body .pavana-content .module-pill, body .pavana-content .vd-nav-pill, body .pavana-content .ar-tab-txt { padding: 7px 10px; }
}
@media (max-width: 480px) {
    /* Tiles that hold long currency figures (Payment Status #kpiCards, Contracts,
       Quality, Reports) go single-column on phones so the number never truncates;
       the dashboard's short-figure tiles keep two columns. */
    body .pavana-content #kpiCards, body .pavana-content [id*="kpiCards"],
    body .pavana-content [class*="kpi-cards"], body .pavana-content [class*="kpi-grid"]:not(.kpit-grid) { grid-template-columns: 1fr !important; }
    body .pavana-content #kpiCards .kpi-value, body .pavana-content [id*="kpiCards"] .kpi-value { font-size: 20px !important; }
}

/* ============================================================ */
/* 26. Tenth pass — Fiori 3 "Quartz Light" ground truth          */
/*     Every value in this section is the published SAP theme    */
/*     parameter (@sap-theming/theming-base-content, theme       */
/*     sap_fiori_3 — the design system SAP Ariba renders with),  */
/*     so anything the earlier passes approximated by eye is     */
/*     corrected here: text colour, list header/hover/selection, */
/*     card elevation, page header band, boxed fields, shell     */
/*     bar with an avatar menu instead of a name + Logout chip.  */
/* ============================================================ */

/* ---- 26.1 Corrected theme tokens ---------------------------- */
:root {
    --text: #232629;                 /* sapTextColor / sapTitleColor  (was #32363a, Belize) */
    --text-dark: #232629;
    --text-heading: #232629;
    --hz-critical: #df6e0c;          /* sapCriticalColor */
    --warning: #df6e0c;
    --ar-list-header-bg: #f2f2f2;    /* sapList_HeaderBackground */
    --ar-list-hover: #ededed;        /* sapList_Hover_Background */
    --ar-list-sel: #e5f0fa;          /* sapList_SelectionBackgroundColor */
    --ar-list-sel-hover: #d8e9f8;    /* sapList_Hover_SelectionBackground */
    --ar-link: #0a6ed1;              /* sapLinkColor */
    --ar-readonly-bg: #f8f8f8;       /* sapField_ReadOnly_Background */
    --ar-placeholder: #74777a;       /* sapField_PlaceholderTextColor */
    --ar-shadow-0: 0 0 0 .0625rem rgba(0,0,0,.1), 0 .125rem .5rem 0 rgba(0,0,0,.1);   /* sapContent_Shadow0 */
    --ar-shadow-2: 0 0 0 .0625rem rgba(0,0,0,.42), 0 .625rem 1.875rem 0 rgba(0,0,0,.3); /* sapContent_Shadow2 */
    --shadow: var(--ar-shadow-0);
    --shadow-lg: var(--ar-shadow-2);
    --ar-content-pad: 24px;          /* mirrors .pavana-content side padding */
}
body { color: var(--text); }
body .pavana-content h1, body .pavana-content h2, body .pavana-content h3,
body .pavana-content h4, body .pavana-content h5 { color: var(--text); }

/* Text links use sapLinkColor; buttons keep sapButton_TextColor (#0854a0) */
body .pavana-content a:not([class*="btn"]):not(.nav-link):not(.nav-item):not(.page-link):not(.pavana-tab):not(.module-pill):not(.vd-nav-pill) { color: var(--ar-link); }

/* ---- 26.2 Page header = Fiori dynamic page header ------------ */
/*     White band across the full content width, hairline below,  */
/*     the grey sapBackgroundColor canvas starts underneath.      */
body .pavana-content .ar-page-header {
    background: #fff;
    margin: 0 calc(-1 * var(--ar-content-pad)) 16px;
    padding: 13px var(--ar-content-pad) 11px;
    border-bottom: 1px solid var(--ar-panel-border);
    box-shadow: 0 .125rem .25rem -.125rem rgba(0,0,0,.06);
}

/* ---- 26.3 Cards / tiles / panels = Fiori elevation ------------ */
/*     sapTile_BorderColor is transparent; depth comes from       */
/*     sapContent_Shadow0, never from a hairline box.             */
body .pavana-content .pavana-card,
body .pavana-content .kpit,
body .pavana-content .vd-kpi,
body .pavana-content .vd-section,
body .pavana-content .kpi-alerts-panel,
body .pavana-content .db-filter-bar,
body .pavana-content .vd-filter-bar,
body .pavana-content .pavana-panel,
body .pavana-content [class*="kpi-card"],
body .pavana-content [class*="stat-card"],
body .pavana-content [class*="-tile"] {
    border: 0;
    border-radius: .25rem;
    box-shadow: var(--ar-shadow-0);
}
body .pavana-content .kpit:hover,
body .pavana-content .vd-kpi:hover,
body .pavana-content [class*="kpi-card"]:hover {
    box-shadow: 0 0 0 .0625rem rgba(0,0,0,.15), 0 .25rem .75rem 0 rgba(0,0,0,.14);
}

/* ---- 26.4 Tables = sap.m.Table --------------------------------- */
body .pavana-content table thead th,
body .pavana-content .pavana-table thead th,
body .pavana-content .li-table thead th,
body .pavana-content .table > thead th,
body .pavana-content .table > thead > tr > th {
    background: var(--ar-list-header-bg);
    color: var(--text);
    font-weight: 400;
    font-size: var(--ar-fs-td);
    text-transform: none;
    letter-spacing: 0;
    border-top: 0;
    border-bottom: 1px solid var(--border);
}
body .pavana-content table tbody tr { border-bottom: 1px solid var(--border); }
body .pavana-content table tbody tr:hover,
body .pavana-content .pavana-table tbody tr:hover,
body .pavana-content .table tbody tr:hover { background: var(--ar-list-hover); }
body .pavana-content table tbody tr.selected,
body .pavana-content table tbody tr.is-selected,
body .pavana-content table tbody tr.table-active { background: var(--ar-list-sel); }
body .pavana-content table tbody tr.selected:hover { background: var(--ar-list-sel-hover); }
body .pavana-content .pavana-table-wrap { border-radius: .25rem; }
/* The table sits directly on the card — no double border between them */
body .pavana-content .pavana-card > .pavana-table-wrap { border: 0; }

/* ---- 26.5 Table toolbar — actions sit on the right ------------- */
/*     Fiori puts the search/filters at the start of the toolbar   */
/*     and every action (and the item count) at the far end.       */
body .pavana-content .pavana-action-bar { align-items: center; }
body .pavana-content .pavana-action-bar::after { content: ""; flex: 1 1 auto; order: 9; }
body .pavana-content .pavana-action-bar > .ms-auto,
body .pavana-content .pavana-action-bar > .ml-auto { order: 10; margin-left: 0 !important; }
body .pavana-content .pavana-action-bar > .btn-icon-pavana { order: 11; }
body .pavana-content .pavana-action-bar > .btn-pavana,
body .pavana-content .pavana-action-bar > .btn,
body .pavana-content .pavana-action-bar > a.btn-pavana { order: 12; margin-left: 6px; }
body .pavana-content .pavana-action-bar > .pavana-search,
body .pavana-content .pavana-action-bar > .pavana-select,
body .pavana-content .pavana-action-bar > .pavana-select-f,
body .pavana-content .pavana-action-bar > select,
body .pavana-content .pavana-action-bar > input { order: 1; }
@media (max-width: 768px) {
    /* Wrapped toolbars read better in source order on phones */
    body .pavana-content .pavana-action-bar::after { display: none; }
    body .pavana-content .pavana-action-bar > .btn-pavana,
    body .pavana-content .pavana-action-bar > .btn { order: 0; margin-left: 0; }
}

/* ---- 26.6 Buttons — sapButton_Emphasized is bold --------------- */
body .btn-primary-pavana, body .pavana-content .btn-primary-pavana,
body .btn-primary, body .pavana-content .btn-primary { font-weight: 700; }
body .pavana-content .btn-pavana:not(.btn-primary-pavana),
body .pavana-content .btn-sm-pavana:not(.btn-primary-pavana) { font-weight: 400; }

/* ---- 26.7 Fields — Fiori 3 boxed white input ------------------- */
/*     sapField_Background #fff, sapField_BorderColor #89919a,     */
/*     .125rem corners. (Add class "ar-fields-filled" to <body>    */
/*     to fall back to the filled S/4HANA field body of §21.)      */
body:not(.ar-fields-filled) .pavana-input,
body:not(.ar-fields-filled) .pavana-select-f,
body:not(.ar-fields-filled) .pavana-textarea,
body:not(.ar-fields-filled) .pavana-select,
body:not(.ar-fields-filled) .li-table .li-input,
body:not(.ar-fields-filled) .li-table input,
body:not(.ar-fields-filled) .li-table select,
body:not(.ar-fields-filled) .form-control,
body:not(.ar-fields-filled) .form-select,
body:not(.ar-fields-filled) textarea.form-control,
body:not(.ar-fields-filled) .pavana-search {
    background-color: var(--hz-field-bg);
    border: 1px solid var(--hz-field-border);
    border-radius: var(--hz-radius-field);
    box-shadow: none;
    color: var(--text);
}
body:not(.ar-fields-filled) .pavana-input:hover,
body:not(.ar-fields-filled) .pavana-select-f:hover,
body:not(.ar-fields-filled) .pavana-textarea:hover,
body:not(.ar-fields-filled) .pavana-select:hover,
body:not(.ar-fields-filled) .li-table .li-input:hover,
body:not(.ar-fields-filled) .li-table input:hover,
body:not(.ar-fields-filled) .li-table select:hover,
body:not(.ar-fields-filled) .form-control:hover,
body:not(.ar-fields-filled) .form-select:hover,
body:not(.ar-fields-filled) .pavana-search:hover {
    background-color: #fff;
    border: 1px solid var(--hz-btn-text);
}
body:not(.ar-fields-filled) .pavana-input:focus,
body:not(.ar-fields-filled) .pavana-select-f:focus,
body:not(.ar-fields-filled) .pavana-textarea:focus,
body:not(.ar-fields-filled) .pavana-select:focus,
body:not(.ar-fields-filled) .li-table .li-input:focus,
body:not(.ar-fields-filled) .li-table input:focus,
body:not(.ar-fields-filled) .li-table select:focus,
body:not(.ar-fields-filled) .form-control:focus,
body:not(.ar-fields-filled) .form-select:focus,
body:not(.ar-fields-filled) .pavana-search:focus-within {
    background-color: #fff;
    border: 1px solid var(--hz-btn-text);
    box-shadow: 0 0 0 .0625rem var(--hz-btn-text);
    outline: 0;
}
body:not(.ar-fields-filled) .pavana-input::placeholder,
body:not(.ar-fields-filled) .pavana-textarea::placeholder,
body:not(.ar-fields-filled) .form-control::placeholder,
body:not(.ar-fields-filled) .pavana-search input::placeholder,
body:not(.ar-fields-filled) .li-table input::placeholder { color: var(--ar-placeholder); font-style: normal; }
body:not(.ar-fields-filled) .pavana-input:disabled,
body:not(.ar-fields-filled) .pavana-input[readonly],
body:not(.ar-fields-filled) .pavana-textarea[readonly],
body:not(.ar-fields-filled) .pavana-textarea:disabled,
body:not(.ar-fields-filled) .pavana-select-f:disabled,
body:not(.ar-fields-filled) .pavana-select:disabled,
body:not(.ar-fields-filled) .form-control:disabled,
body:not(.ar-fields-filled) .form-control[readonly],
body:not(.ar-fields-filled) .form-select:disabled {
    background-color: var(--ar-readonly-bg);
    border: 1px solid var(--hz-field-border);
    border-radius: var(--hz-radius-field);
    color: var(--text);
    opacity: 1;
}
body:not(.ar-fields-filled) .pavana-input.is-invalid,
body:not(.ar-fields-filled) .pavana-select-f.is-invalid,
body:not(.ar-fields-filled) .pavana-textarea.is-invalid,
body:not(.ar-fields-filled) .form-control.is-invalid,
body:not(.ar-fields-filled) .form-select.is-invalid,
body:not(.ar-fields-filled) .pavana-input[style*="border-color:#ef4444"],
body:not(.ar-fields-filled) .pavana-input[style*="border-color: #ef4444"],
body:not(.ar-fields-filled) .pavana-input[style*="border-color:#dc2626"],
body:not(.ar-fields-filled) .pavana-select-f[style*="border-color:#ef4444"] {
    border: .125rem solid var(--hz-negative) !important;
    box-shadow: none !important;
    background-color: #fff !important;
}
body:not(.ar-fields-filled) .pavana-search { padding-right: 4px; }
body:not(.ar-fields-filled) .pavana-search input { background: transparent; border: 0; box-shadow: none; }
body:not(.ar-fields-filled) .pavana-search i { color: var(--hz-btn-text); }

/* ---- 26.8 Shell bar — Fiori 3 ShellBar ------------------------- */
/*     Right-hand group is icon buttons plus one avatar; the name, */
/*     role and Sign Out live in the avatar popover, as in Ariba.  */
.pavana-topbar { padding: 0 8px 0 16px; }
.topbar-actions { position: relative; gap: 2px; }
.topbar-divider { display: none; }
.user-chip, .topbar-logout { display: none !important; }
.ar-shell-btn {
    width: 36px; height: 36px; padding: 0;
    display: inline-flex; align-items: center; justify-content: center;
    background: transparent; border: 0; border-radius: .25rem;
    color: var(--ar-shell-icon); cursor: pointer; position: relative;
}
.ar-shell-btn:hover { background: #f2f2f2; color: var(--hz-btn-text); }
.ar-shell-btn:focus-visible { outline: 1px dotted var(--text); outline-offset: -3px; }
.ar-avatar {
    width: 32px; height: 32px; border-radius: 50%;
    background: #ebf5fe; color: #0854a0;
    font-size: 12px; font-weight: 700; letter-spacing: .02em;
    display: flex; align-items: center; justify-content: center;
}
.ar-shell-btn[aria-expanded="true"] { background: #ebf5fe; }
.ar-user-menu {
    position: absolute; top: 100%; right: 0; margin-top: 2px;
    min-width: 248px; background: #fff;
    border: 1px solid var(--ar-panel-border); border-radius: .25rem;
    box-shadow: var(--ar-shadow-2); z-index: 600; overflow: hidden;
}
.ar-user-menu[hidden] { display: none; }
.ar-um-head { display: flex; align-items: center; gap: 10px; padding: 12px 14px; border-bottom: 1px solid var(--border); }
.ar-um-head .ar-avatar { width: 40px; height: 40px; font-size: 14px; }
.ar-um-name { font-size: 13px; font-weight: 700; color: var(--text); line-height: 1.3; }
.ar-um-role { font-size: 12px; color: var(--text-muted); }
.ar-um-item {
    display: flex; align-items: center; gap: 10px; width: 100%;
    padding: 9px 14px; background: transparent; border: 0;
    font-family: inherit; font-size: 12.5px; color: var(--text);
    text-align: left; cursor: pointer;
}
.ar-um-item:hover { background: #ebf5fe; color: var(--hz-btn-text); }
.ar-um-item i { width: 16px; text-align: center; color: var(--hz-btn-text); }
.ar-um-sep { height: 1px; background: var(--border); margin: 2px 0; }

/* Chat moves out of the middle of the shell into the right icon group */
@media (min-width: 1025px) {
    #fw-chat-fab {
        left: auto !important; right: 88px !important; top: 4px !important;
        transform: none !important;
        width: 36px; height: 36px; padding: 0; gap: 0;
        border: 0; border-radius: .25rem; background: transparent;
        box-shadow: none; color: var(--ar-shell-icon);
    }
    #fw-chat-fab:hover { transform: none !important; background: #f2f2f2; color: var(--hz-btn-text); box-shadow: none; }
    #fw-chat-fab .chat-btn-label { display: none; }
    #fw-chat-badge { position: absolute; top: 1px; right: 1px; }
}

/* ---- 26.9 Fiori scrollbars ------------------------------------- */
* { scrollbar-width: thin; scrollbar-color: #949494 #f7f7f7; }
::-webkit-scrollbar { width: .75rem; height: .75rem; }
::-webkit-scrollbar-track { background: #f7f7f7; }
::-webkit-scrollbar-thumb { background: #949494; border: .1875rem solid #f7f7f7; border-radius: .375rem; }
::-webkit-scrollbar-thumb:hover { background: #6a6d70; }

/* ---- 26.10 Phone / tablet: keep the header band full-bleed ----- */
/*  matches the .pavana-content side padding set by responsive.css  */
@media (max-width: 1024px) { :root { --ar-content-pad: 18px; } }
@media (max-width: 640px)  { :root { --ar-content-pad: 10px; } }
@media (max-width: 399px)  { :root { --ar-content-pad: 6px; } }

/* ---- 26.11 One emphasized action per toolbar ------------------- */
/*     Fiori allows a single emphasized (solid blue) button in a    */
/*     toolbar; every further action is a default button — white    */
/*     with a blue border. Pages that render two solid buttons      */
/*     side by side are demoted here rather than per page.          */
body .pavana-content .pavana-action-bar .btn-primary-pavana ~ .btn-primary-pavana,
body .pavana-content .db-filter-bar .btn-primary-pavana ~ .btn-primary-pavana,
body .pavana-content .vd-filter-bar .btn-primary-pavana ~ .btn-primary-pavana,
body .pavana-content .pavana-action-bar .btn-primary ~ .btn-primary {
    background: #fff;
    color: var(--hz-btn-text);
    border: 1px solid var(--hz-btn-border);
    font-weight: 400;
}
body .pavana-content .pavana-action-bar .btn-primary-pavana ~ .btn-primary-pavana:hover,
body .pavana-content .db-filter-bar .btn-primary-pavana ~ .btn-primary-pavana:hover,
body .pavana-content .vd-filter-bar .btn-primary-pavana ~ .btn-primary-pavana:hover,
body .pavana-content .pavana-action-bar .btn-primary ~ .btn-primary:hover {
    background: #ebf5fe;
    color: var(--hz-btn-text);
    border-color: var(--hz-btn-border);
}

/* ---- 26.12 Row actions are transparent blue icon buttons ------- */
/*     In a Fiori table the row actions all use sapButton_Lite:     */
/*     blue glyph, no box. Destructive actions turn red on hover    */
/*     instead of shouting from the list. Inline red styles from    */
/*     the page scripts are neutralised the same way.               */
body .pavana-content table .btn-danger-icon,
body .pavana-content table .btn-icon-pavana.btn-danger-icon,
body .pavana-content table .btn-icon-pavana[style*="#dc2626"],
body .pavana-content table .btn-icon-pavana[style*="#ef4444"],
body .pavana-content table .btn-icon-pavana[style*="#bb0000"],
body .pavana-content table .btn-icon-pavana[style*="color:#b91c1c"] {
    color: var(--hz-btn-text) !important;
    background: transparent;
    border-color: transparent;
}
body .pavana-content table .btn-danger-icon:hover,
body .pavana-content table .btn-icon-pavana.btn-danger-icon:hover,
body .pavana-content table .btn-icon-pavana[style*="#dc2626"]:hover,
body .pavana-content table .btn-icon-pavana[style*="#ef4444"]:hover,
body .pavana-content table .btn-icon-pavana[style*="#bb0000"]:hover,
body .pavana-content table .btn-icon-pavana[style*="color:#b91c1c"]:hover {
    color: var(--hz-negative) !important;
    background: var(--hz-negative-bg);
}

/* ---- 26.13 Numeric columns are right-aligned (SAP convention) -- */
/*     ariba-ui.js part 6 tags amount/quantity columns with .ar-num */
body .pavana-content table th.ar-num,
body .pavana-content table td.ar-num { text-align: right; }
body .pavana-content table td.ar-num .td-value,
body .pavana-content table td.ar-num > div { text-align: right; }

/* ---- 26.14 ObjectStatus for raw enum status cells -------------- */
/*     ariba-ui.js part 6 wraps status columns that still print the */
/*     database value; these are the Fiori semantic colours.        */
body .pavana-content .ar-os {
    font-weight: 600;
    background: transparent;
    border: 0;
    padding: 0;
    border-radius: 0;
    box-shadow: none;
}
body .pavana-content .ar-os-positive { color: var(--hz-positive) !important; }
body .pavana-content .ar-os-critical { color: var(--hz-critical) !important; }
body .pavana-content .ar-os-negative { color: var(--hz-negative) !important; }
body .pavana-content .ar-os-informative { color: var(--hz-informative) !important; }
body .pavana-content .ar-os-neutral { color: var(--hz-neutral) !important; }

/* ---- 26.15 Every dropdown carries the SAP value-help glyph ------ */
/*     Some pages build selects with the plain .pavana-input class, */
/*     which left the native OS arrow showing next to SAP-styled     */
/*     fields; this catches them all.                                */
body .pavana-content select:not([multiple]):not([size]) {
    -webkit-appearance: none;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23475e75' stroke-width='1.3'%3E%3Crect x='5.5' y='5.5' width='8' height='8' rx='1'/%3E%3Cpath d='M10.5 2.5h-7a1 1 0 0 0-1 1v7'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right .6rem center;
    background-size: .8rem;
    padding-right: 2rem;
}