:root {
    --app-font: "Aptos", "Segoe UI Variable Text", "Segoe UI Variable", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --navy-950: #061524;
    --navy-900: #0a2540;
    --navy-800: #123d61;
    --blue-700: #0f4fd1;
    --blue-600: #1463ff;
    --blue-500: #2878ff;
    --blue-100: #e0ebff;
    --teal-600: #008c82;
    --teal-500: #00a99d;
    --amber-500: #f59e0b;
    --slate-900: #132238;
    --slate-700: #41536d;
    --slate-500: #718197;
    --slate-300: #cbd5e1;
    --slate-200: #e5eaf1;
    --slate-100: #f1f5f9;
    --page: #f2f6fb;
    --surface: #ffffff;
    --success: #0f9f6e;
    --danger: #dc3545;
    --sidebar-width: 260px;
    --sidebar-collapsed: 74px;
    --radius: 14px;
    --shadow-sm: 0 2px 10px rgba(15, 32, 58, .045);
    --shadow-md: 0 10px 30px rgba(15, 32, 58, .08);
}

/* Settings cockpit refinements */
.settings-command-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.settings-command-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    min-width: 0;
    padding: 14px;
    border: 1px solid #dfe8f2;
    border-radius: 8px;
    background: linear-gradient(180deg, #fff, #f9fbfd);
    box-shadow: 0 10px 26px rgba(15, 32, 58, .05);
}

.settings-command-card > span {
    display: grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border-radius: 8px;
    color: #0f766e;
    background: #e4f6f3;
}

.settings-command-card > div {
    min-width: 0;
}

.settings-command-card strong,
.settings-command-card small {
    display: block;
    min-width: 0;
    overflow-wrap: anywhere;
}

.settings-command-card strong {
    color: #102033;
    font-size: .9rem;
    font-weight: 850;
}

.settings-command-card small {
    margin-top: 2px;
    color: #64748b;
    font-size: .74rem;
}

.settings-command-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
}

.settings-command-actions .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 34px;
    min-height: 32px;
    padding-inline: 9px;
}

.settings-checklist {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 12px;
    border: 1px solid #dfe8f2;
    border-radius: 8px;
    background: #f8fafc;
}

.settings-checklist span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
    padding: 6px 9px;
    border-radius: 999px;
    font-size: .76rem;
    font-weight: 780;
    overflow-wrap: anywhere;
}

.settings-checklist .is-ok {
    color: #0f766e;
    background: #e4f6f3;
}

.settings-checklist .is-pending {
    color: #92400e;
    background: #fff3d7;
}

.settings-link-input .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
}

.settings-brand-save {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 12px;
}

@media (max-width: 1199.98px) {
    .settings-command-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 575.98px) {
    .settings-command-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .settings-command-card {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .settings-command-actions {
        grid-column: 1 / -1;
        justify-content: stretch;
    }

    .settings-command-actions .btn,
    .settings-link-input .btn {
        flex: 1 1 auto;
    }

    .settings-link-input {
        align-items: stretch;
        flex-direction: column;
    }

    .settings-link-input > .form-control,
    .settings-link-input > .btn {
        width: 100%;
        border-radius: 8px !important;
    }
}


* { box-sizing: border-box; }
html { min-height: 100%; }
body {
    min-height: 100vh;
    margin: 0;
    background: var(--page);
    color: var(--slate-900);
    font-family: var(--app-font);
    font-size: .9rem;
    line-height: 1.46;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}
button,
input,
select,
textarea,
.tooltip,
.popover,
.dropdown-menu { font-family: var(--app-font); }
img, svg, video, canvas { max-width: 100%; }
input, select, textarea, button { max-width: 100%; }
a { color: var(--blue-600); }
a:hover { color: #1d4ed8; }

/* Sidebar */
.sidebar { 
    position: fixed;
    inset: 0 auto 0 0;
    z-index: 1040;
    display: flex;
    width: var(--sidebar-width);
    flex-direction: column;
    align-items: stretch;
    padding: 22px 16px 16px;
    overflow: hidden;
    color: #fff;
    background:
        radial-gradient(circle at 10% 0, rgba(59, 130, 246, .22), transparent 28%),
        linear-gradient(180deg, var(--navy-900), var(--navy-950));
    box-shadow: 8px 0 28px rgba(7, 20, 38, .12);
    transition: transform .25s ease;
}
.brand {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 5px;
    padding: 0 7px 24px;
    color: #fff;
    text-decoration: none;
}
.brand:hover { color: #fff; }
.brand-logo {
    width: min(224px, 100%);
    height: 90px;
    flex: 0 0 auto;
    object-fit: contain;
    object-position: left center;
    filter: drop-shadow(0 14px 20px rgba(0, 0, 0, .26));
}
.brand-logo-symbol {
    display: none;
    width: 56px;
    height: 56px;
    object-fit: contain;
    filter: drop-shadow(0 12px 18px rgba(0, 0, 0, .28));
}
.sidebar nav.sidebar-nav { display: grid !important; width: 100%; grid-auto-flow: row !important; grid-template-columns: minmax(0, 1fr) !important; align-items: stretch; gap: 0; padding: 2px 2px 10px 0; overflow-x: hidden; overflow-y: auto; scrollbar-width: thin; scrollbar-color: rgba(255,255,255,.13) transparent; }
.sidebar-section { position: relative; display: grid !important; width: 100%; min-width: 0; grid-auto-flow: row !important; grid-template-columns: minmax(0, 1fr) !important; align-items: stretch; padding: 3px 0 7px; }
.sidebar-section + .sidebar-section { margin-top: 5px; border-top: 1px solid rgba(255,255,255,.055); }
.sidebar .nav-link {
    position: relative;
    display: flex;
    width: 100%;
    flex: 0 0 auto;
    flex-direction: row;
    min-height: 43px;
    align-items: center;
    gap: 11px;
    margin: 2px 0;
    padding: 9px 11px;
    border-radius: 10px;
    color: #aebdd0;
    font-size: .81rem;
    font-weight: 500;
    transition: color .18s, background .18s, transform .18s;
}
.sidebar-section > .nav-link { display: flex !important; float: none !important; clear: both; }
.sidebar-section > .nav-link + .nav-link { margin-top: 2px; }
.sidebar .nav-link:hover { color: #fff; background: rgba(255, 255, 255, .075); transform: translateX(2px); }
.sidebar .nav-link.active { color: #fff; background: linear-gradient(90deg, rgba(37,99,235,.34), rgba(37,99,235,.12)); }
.sidebar .nav-link.active::before { position: absolute; inset: 9px auto 9px 0; width: 3px; border-radius: 0 5px 5px 0; background: #60a5fa; content: ""; }
.sidebar .nav-link i { width: 20px; color: #8297b2; font-size: 1.06rem; text-align: center; }
.sidebar .nav-link.active i, .sidebar .nav-link:hover i { color: #fff; }
.nav-label { display: flex; align-items: center; gap: 8px; padding: 12px 11px 6px; color: #607793; font-size: .58rem; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.nav-label::after { height: 1px; flex: 1; background: rgba(255,255,255,.055); content: ""; }
.workflow-step { display: grid; width: 18px; height: 18px; flex: 0 0 18px; place-items: center; border: 1px solid rgba(137,167,204,.24); border-radius: 50%; color: #7890ab; background: rgba(255,255,255,.035); font-size: .55rem; font-weight: 800; }
.sidebar-workflow .nav-link.active .workflow-step, .sidebar-workflow .nav-link:hover .workflow-step { border-color: rgba(147,197,253,.48); color: #dbeafe; background: rgba(59,130,246,.22); }
.nav-counter { min-width: 22px; margin-left: auto; padding: 2px 6px; border-radius: 9px; color: #b8d7ff; background: rgba(37,99,235,.22); font-size: .57rem; font-weight: 800; text-align: center; }
.nav-counter-danger { color: #fecaca; background: rgba(220,53,69,.22); }
.sidebar-user {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: auto;
    padding: 15px 10px 10px;
    border-top: 1px solid rgba(255, 255, 255, .08);
}
.sidebar-avatar, .topbar-avatar {
    display: grid;
    flex: 0 0 auto;
    place-items: center;
    border-radius: 50%;
    color: #fff;
    background: linear-gradient(145deg, #3b82f6, #1d4ed8);
    font-weight: 800;
}
.sidebar-avatar { width: 36px; height: 36px; font-size: .78rem; }
.sidebar-user-copy { min-width: 0; flex: 1; }
.sidebar-user-copy strong { display: block; overflow: hidden; color: #edf4ff; font-size: .8rem; text-overflow: ellipsis; white-space: nowrap; }
.sidebar-user-copy small { color: #748aa5; font-size: .68rem; text-transform: capitalize; }
.logout-link { display: grid; width: 34px; height: 34px; place-items: center; border-radius: 9px; color: #8fa2ba; text-decoration: none; }
.logout-link:hover { color: #fff; background: rgba(220, 53, 69, .18); }
.sidebar-overlay { display: none; }

body.sidebar-collapsed .sidebar { width: var(--sidebar-collapsed); padding-right: 12px; padding-left: 12px; }
body.sidebar-collapsed .main-content { margin-left: var(--sidebar-collapsed); }
body.sidebar-collapsed .brand { justify-content: center; padding-right: 0; padding-left: 0; }
body.sidebar-collapsed .brand-logo { display: none; }
body.sidebar-collapsed .brand-logo-symbol { display: block; }
body.sidebar-collapsed .brand > span:last-child,
body.sidebar-collapsed .sidebar .nav-link > span:not(.workflow-step),
body.sidebar-collapsed .nav-label,
body.sidebar-collapsed .sidebar-user-copy,
body.sidebar-collapsed .workflow-step,
body.sidebar-collapsed .nav-counter { display: none; }
body.sidebar-collapsed .sidebar-section + .sidebar-section { margin-top: 4px; border-top-color: rgba(255,255,255,.08); }
body.sidebar-collapsed .sidebar .nav-link { justify-content: center; gap: 0; padding-right: 0; padding-left: 0; }
body.sidebar-collapsed .sidebar-nav,
body.sidebar-collapsed .sidebar-section { flex-direction: column; align-items: stretch; }
body.sidebar-collapsed .sidebar .nav-link { width: 100%; flex-direction: row; }
body.sidebar-collapsed .sidebar .nav-link i { width: auto; font-size: 1.14rem; }
body.sidebar-collapsed .sidebar-user { justify-content: center; padding-right: 0; padding-left: 0; }
body.sidebar-collapsed .sidebar-avatar { display: none; }
body.sidebar-collapsed .logout-link { width: 42px; }

/* Main shell */
.main-content { min-height: 100vh; margin-left: var(--sidebar-width); transition: margin-left .25s ease; }
.topbar {
    position: sticky;
    top: 0;
    z-index: 1020;
    min-height: 78px;
    padding: 12px 28px;
    border-bottom: 1px solid rgba(226, 232, 240, .88);
    background: rgba(255, 255, 255, .9);
    box-shadow: 0 1px 8px rgba(15, 32, 58, .025);
    backdrop-filter: blur(14px);
}
.shell-toggle { display: grid; width: 39px; height: 39px; flex: 0 0 39px; place-items: center; border: 1px solid #dce4ee; border-radius: 10px; color: #506179; background: #fff; font-size: 1.25rem; transition: .18s; }
.shell-toggle:hover { border-color: #c8d5e5; color: var(--blue-600); background: #f7faff; box-shadow: 0 4px 12px rgba(15,32,58,.07); }
.topbar-title { margin: 0; color: var(--slate-900); font-size: 1.18rem; font-weight: 780; letter-spacing: 0; }
.topbar-kicker { display: flex; align-items: center; gap: 6px; margin-top: 3px; color: var(--slate-500); font-size: .74rem; }
.topbar-kicker i { color: var(--blue-500); }
.topbar-actions { display: flex; align-items: center; gap: 12px; }
.topbar-actions, .topbar .dropdown, .user-menu { min-width: 0; }
.quick-command { min-height: 38px; align-items: center; gap: 8px; padding: 0 12px; border: 1px solid #dbe4ee; border-radius: 10px; color: #607086; background: #fff; font-size: .72rem; font-weight: 700; transition: .18s; }
.quick-command:hover { border-color: #bfd0e3; color: var(--blue-600); background: #f8fbff; }
.quick-command kbd { padding: 3px 6px; border: 1px solid #d7e0ea; border-bottom-width: 2px; border-radius: 5px; color: #7b899a; background: #f5f7fa; box-shadow: none; font-family: inherit; font-size: .58rem; }
.topbar-date { display: flex; align-items: center; gap: 7px; padding: 8px 11px; border: 1px solid var(--slate-200); border-radius: 10px; color: var(--slate-700); background: #fff; font-size: .76rem; }
.user-menu { display: flex; align-items: center; gap: 9px; padding: 5px 6px 5px 5px; border: 0; border-radius: 12px; color: var(--slate-900); background: transparent; text-align: left; }
.user-menu:hover { background: var(--slate-100); }
.user-menu.dropdown-toggle::after { display: none; }
.topbar-avatar { width: 38px; height: 38px; font-size: .78rem; }
.user-menu-copy strong { display: block; max-width: 160px; overflow: hidden; font-size: .8rem; text-overflow: ellipsis; white-space: nowrap; }
.user-menu-copy small { display: block; color: var(--slate-500); font-size: .68rem; text-transform: capitalize; }
.content-wrap { width: 100%; min-height: calc(100vh - 128px); min-width: 0; padding: 26px 28px; }

.store-operation-intro { position: relative; display: flex; min-height: 112px; align-items: center; justify-content: space-between; gap: 18px; overflow: hidden; padding: 18px 22px; border: 1px solid rgba(23, 107, 135, .28); border-radius: 12px; color: #fff; background: radial-gradient(circle at 92% 8%, rgba(125, 211, 252, .28), transparent 28%), linear-gradient(135deg, #0f536b 0%, #176b87 47%, #0f766e 100%); box-shadow: 0 14px 32px rgba(15, 32, 58, .13); }
.store-operation-intro::before { position: absolute; inset: -70px -48px auto auto; width: 170px; height: 170px; border-radius: 50%; background: rgba(255, 255, 255, .11); content: ""; pointer-events: none; }
.store-operation-intro::after { position: absolute; inset: auto auto -90px -70px; width: 210px; height: 210px; border-radius: 50%; background: rgba(255, 255, 255, .07); content: ""; pointer-events: none; }
.store-operation-intro > * { position: relative; z-index: 1; }
.store-operation-eyebrow { display: inline-flex; align-items: center; gap: 7px; margin-bottom: 7px; padding: 5px 9px; border: 1px solid rgba(255,255,255,.22); border-radius: 999px; color: #e0f7ff; background: rgba(255,255,255,.12); font-size: .66rem; font-weight: 800; text-transform: uppercase; backdrop-filter: blur(8px); }
.store-operation-intro h2 { margin: 0 0 3px; font-size: 1.42rem; font-weight: 850; letter-spacing: 0; }
.store-operation-intro p { margin: 0; color: #dff7ff; font-size: .82rem; }
.store-operation-summary { display: grid; min-width: 270px; gap: 8px; grid-template-columns: repeat(2, minmax(118px, 1fr)); }
.store-operation-summary > div { padding: 10px 12px; border: 1px solid rgba(255,255,255,.2); border-radius: 10px; background: rgba(255,255,255,.13); box-shadow: inset 0 1px 0 rgba(255,255,255,.16); backdrop-filter: blur(10px); }
.store-operation-summary span { display: block; color: #c9f2ff; font-size: .64rem; font-weight: 750; text-transform: uppercase; }
.store-operation-summary strong { display: block; margin-top: 3px; color: #fff; font-size: 1.22rem; font-weight: 850; }
.store-operation-summary strong.text-success { color: #bbf7d0 !important; }
.store-operation-summary strong.text-secondary { color: #dbeafe !important; }
.store-operation-section { margin-top: 18px; }
.store-operation-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin-bottom: 13px; }
.store-operation-heading h2 { margin: 0 0 3px; color: #15283e; font-size: 1rem; font-weight: 850; }
.store-operation-heading p { margin: 0; color: #718196; font-size: .82rem; }
.store-shortcut-grid { display: grid; gap: 12px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.store-shortcut { position: relative; display: grid; min-height: 76px; min-width: 0; align-items: center; gap: 12px; overflow: hidden; padding: 13px 16px; border: 1px solid #dce5ef; border-radius: 12px; color: #15283e; background: linear-gradient(180deg, #fff, #f8fbfd); box-shadow: 0 10px 24px rgba(15, 32, 58, .055); grid-template-columns: 38px minmax(0, 1fr); text-decoration: none; transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease; }
.store-shortcut::before { position: absolute; inset: 0 auto 0 0; width: 4px; background: #176b87; content: ""; opacity: .8; }
.store-shortcut:hover { transform: translateY(-2px); border-color: #9db9c7; color: #10243a; box-shadow: 0 16px 34px rgba(15, 32, 58, .11); }
.store-shortcut.is-primary { border-color: #176b87; color: #fff; background: linear-gradient(135deg, #176b87, #0f766e); box-shadow: 0 15px 34px rgba(23, 107, 135, .24); }
.store-shortcut.is-primary::before { background: rgba(255,255,255,.45); }
.store-shortcut.is-primary:hover { border-color: #0f536b; color: #fff; background: linear-gradient(135deg, #0f536b, #0f6f67); }
.store-shortcut-icon { display: grid; width: 38px; height: 38px; border-radius: 8px; color: #176b87; background: #e8f3f6; font-size: 1rem; place-items: center; }
.store-shortcut.is-primary .store-shortcut-icon { color: #fff; background: rgba(255,255,255,.16); }
.store-shortcut-copy { min-width: 0; }
.store-shortcut-copy strong, .store-shortcut-copy small { display: block; }
.store-shortcut-copy strong { margin-bottom: 3px; font-size: .9rem; font-weight: 850; }
.store-shortcut-copy small { color: #738297; font-size: .71rem; line-height: 1.35; }
.store-shortcut.is-primary .store-shortcut-copy small { color: #d8edf3; }
.store-operation-table { border: 1px solid #dce5ef; border-radius: 8px; background: #fff; box-shadow: 0 9px 25px rgba(15, 32, 58, .045); }
.order-item.order-tracked-item { padding: 12px; border: 1px solid #b9d8e3; border-radius: 8px; background: #f7fcfd; }
.order-item.order-tracked-item.is-grade { border-left: 4px solid #176b87; }
.order-item.order-tracked-item.is-piece { border-left: 4px solid #62758a; }
.order-unit-context { display: flex; align-items: center; gap: 8px; color: #53677c; font-size: .76rem; }
.order-unit-context[hidden] { display: none; }
.order-unit-context i { display: grid; width: 27px; height: 27px; border-radius: 6px; color: #176b87; background: #e5f2f5; place-items: center; }
.order-unit-context strong { color: #18314a; }
.order-unit-context span { padding-left: 8px; border-left: 1px solid #cedae4; }
.store-tool-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 14px; }
.store-tool-header > div { display: flex; align-items: baseline; gap: 7px; color: #63758a; }
.store-tool-header > div span { color: #13283f; font-size: 1.25rem; font-weight: 850; }
.label-check-console { padding: 22px; border: 1px solid #dce5ef; border-left: 4px solid #176b87; border-radius: 8px; background: #fff; box-shadow: 0 14px 36px rgba(15, 32, 58, .07); }
.label-check-heading { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 16px; }
.label-check-heading > span { color: #176b87; font-size: .74rem; font-weight: 850; text-transform: uppercase; }
.label-check-form { display: grid; align-items: center; gap: 10px; grid-template-columns: 32px minmax(0, 1fr) auto auto; }
.label-check-form > i { color: #176b87; font-size: 1.4rem; text-align: center; }
.label-check-form .form-control { min-height: 48px; font-size: 1rem; font-weight: 750; }
.kwn-camera-scanner-modal .modal-content { border-radius: 12px; overflow: hidden; }
.kwn-camera-scanner-video { display: block; width: 100%; aspect-ratio: 4 / 3; border-radius: 10px; background: #07111f; object-fit: cover; }
.kwn-camera-scanner-status { display: flex; align-items: center; gap: 8px; margin-top: 10px; padding: 10px 12px; border: 1px solid #d9e5ef; border-radius: 8px; color: #274057; background: #f8fbff; font-size: .82rem; font-weight: 720; }
.kwn-camera-scanner-status i { color: #0f766e; }
.label-check-result { display: grid; align-items: stretch; gap: 0; margin-top: 16px; overflow: hidden; border: 1px solid #d9e5e3; border-radius: 8px; background: #fff; box-shadow: 0 14px 36px rgba(15, 32, 58, .065); grid-template-columns: 190px minmax(230px, .9fr) minmax(360px, 1.4fr); }
.label-check-status { display: flex; align-items: center; justify-content: center; padding: 24px; color: #fff; background: #16745f; flex-direction: column; text-align: center; }
.label-check-status.is-success { background: #16745f; }
.label-check-status.is-danger { background: #b42318; }
.label-check-status.is-warning { color: #1f2937; background: #fbbf24; }
.label-check-status.is-secondary { background: #64748b; }
.label-check-status i { margin-bottom: 9px; font-size: 1.55rem; }
.label-check-status span { font-size: .68rem; font-weight: 800; text-transform: uppercase; }
.label-check-status strong { margin-top: 4px; font-size: 1.05rem; overflow-wrap: anywhere; }
.label-check-product { display: flex; justify-content: center; padding: 24px; border-right: 1px solid #e2e8ef; flex-direction: column; }
.label-check-product > span { color: #176b87; font-size: .68rem; font-weight: 850; text-transform: uppercase; }
.label-check-product h2 { margin: 5px 0; color: #10243a; font-size: 1.25rem; font-weight: 850; letter-spacing: 0; }
.label-check-product p { margin: 0; color: #6d7e91; font-size: .8rem; }
.label-check-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.label-check-facts > div { display: flex; justify-content: center; min-width: 0; padding: 15px 18px; border-bottom: 1px solid #e2e8ef; flex-direction: column; }
.label-check-facts > div:nth-child(odd) { border-right: 1px solid #e2e8ef; }
.label-check-facts > div:nth-last-child(-n+2) { border-bottom: 0; }
.label-check-facts span { color: #78889b; font-size: .66rem; font-weight: 800; text-transform: uppercase; }
.label-check-facts strong { margin-top: 3px; color: #1c3047; font-size: .84rem; overflow-wrap: anywhere; }
.label-check-empty { display: flex; min-height: 260px; align-items: center; justify-content: center; color: #7a899a; flex-direction: column; text-align: center; }
.label-check-empty i { margin-bottom: 10px; color: #9db0c0; font-size: 2.2rem; }
.label-check-empty strong { color: #31465d; }
.label-check-empty span { margin-top: 3px; font-size: .82rem; }
.label-piece-grid { display: grid; gap: 8px; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); }
.label-piece-grid > div { display: grid; align-items: center; gap: 8px; padding: 11px 12px; border: 1px solid #dce5ef; border-radius: 7px; color: #294158; background: #f8fafc; grid-template-columns: 22px minmax(0, 1fr) auto; }
.label-piece-grid > div.is-available i { color: #16806a; }
.label-piece-grid > div.is-unavailable { opacity: .55; }
.label-piece-grid span { color: #718196; font-size: .72rem; }
.app-footer { display: flex; justify-content: flex-end; padding: 12px 30px 20px; color: #8a97a9; font-size: .74rem; }

/* Components */
.card { border: 1px solid rgba(218, 227, 238, .96); border-radius: 10px; background: var(--surface); box-shadow: var(--shadow-sm); }
.card-body { padding: 1.25rem; }
.card:hover { border-color: #dce3ed; }
.row > * { min-width: 0; }
.section-heading { margin: 0; font-size: .94rem; font-weight: 750; letter-spacing: -.015em; }
.section-description { margin: 4px 0 0; color: var(--slate-500); font-size: .76rem; }
.btn { display: inline-flex; min-height: 40px; align-items: center; justify-content: center; gap: 7px; padding: .58rem .95rem; border-radius: 9px; font-size: .8rem; font-weight: 750; letter-spacing: -.005em; line-height: 1.15; white-space: nowrap; transition: background-color .16s, border-color .16s, color .16s, box-shadow .16s, transform .16s; }
.btn > i,
.badge > i,
.record-count > i,
.empty-state > i,
.dashboard-eyebrow > i,
.operation-eyebrow > i,
.topbar-kicker > i { display: inline-grid; line-height: 1; place-items: center; }
.btn:hover { transform: translateY(-1px); }
.btn:focus-visible { outline: 0; box-shadow: 0 0 0 .22rem rgba(37, 99, 235, .18); }
.btn:active { transform: translateY(0); }
.btn:disabled, .btn.disabled { transform: none; opacity: .64; box-shadow: none; }
.btn-sm { min-height: 32px; padding: .42rem .68rem; border-radius: 8px; font-size: .74rem; }
.btn-primary { border-color: var(--blue-600); background: linear-gradient(180deg, #2878ff, #1463ff); box-shadow: 0 7px 16px rgba(37, 99, 235, .18); }
.btn-primary:hover, .btn-primary:focus { border-color: #1d4ed8; background: #1d4ed8; }
.btn-danger { border-color: #dc3545; background: linear-gradient(180deg, #ef5160, #dc3545); box-shadow: 0 7px 16px rgba(220, 53, 69, .14); }
.btn-danger:hover, .btn-danger:focus { border-color: #b42334; background: #b42334; }
.btn-warning { border-color: #f59e0b; color: #3a2805; background: linear-gradient(180deg, #fbbf24, #f59e0b); box-shadow: 0 7px 16px rgba(245, 158, 11, .14); }
.btn-warning:hover, .btn-warning:focus { border-color: #d97706; color: #261803; background: #d97706; }
.btn-outline-primary { border-color: #b8cff8; color: #1d4ed8; background: #f7fbff; }
.btn-outline-primary:hover, .btn-outline-primary:focus { border-color: var(--blue-600); color: #fff; background: var(--blue-600); box-shadow: 0 6px 15px rgba(37, 99, 235, .16); }
.btn-outline-secondary { border-color: #d7dee8; color: #53637a; background: #fff; }
.btn-outline-secondary:hover, .btn-outline-secondary:focus { border-color: #cbd5e1; color: #243247; background: #f1f5f9; box-shadow: 0 6px 15px rgba(65, 83, 109, .08); }
.btn-outline-warning { border-color: #f7d794; color: #9a5f00; background: #fffbeb; }
.btn-outline-warning:hover, .btn-outline-warning:focus { border-color: #f59e0b; color: #3a2805; background: #fef3c7; box-shadow: 0 6px 15px rgba(245, 158, 11, .12); }
.btn-outline-success { border-color: #a9e5da; color: #047966; background: #f0fdfa; }
.btn-outline-success:hover, .btn-outline-success:focus { border-color: var(--teal-600); color: #fff; background: var(--teal-600); box-shadow: 0 6px 15px rgba(0, 140, 130, .12); }
.btn-outline-danger { border-color: #f1bdc4; color: #b42334; background: #fff8f9; }
.btn-outline-danger:hover, .btn-outline-danger:focus { border-color: var(--danger); color: #fff; background: var(--danger); box-shadow: 0 6px 15px rgba(220, 53, 69, .15); }
.form-label { margin-bottom: .42rem; color: #34465f; font-size: .73rem; font-weight: 750; letter-spacing: .005em; }
.form-control, .form-select { min-height: 42px; border-color: #d5dfeb; border-radius: 9px; color: var(--slate-900); background-color: #fff; font-size: .82rem; font-weight: 500; }
.form-control::placeholder { color: #a2adbc; }
.form-control:focus, .form-select:focus { border-color: #7aa2f7; box-shadow: 0 0 0 .22rem rgba(37, 99, 235, .11); }
textarea.form-control { min-height: 94px; }
.input-group .form-control { border-radius: 10px; }
.input-group-text { border-color: #d8e0ea; color: #7b889b; background: #f8fafc; }
.search-box { position: relative; width: min(100%, 340px); min-width: 0; }
.search-box > i { position: absolute; top: 50%; left: 14px; z-index: 4; color: #93a0b2; transform: translateY(-50%); }
.search-box .form-control { padding-right: 76px; padding-left: 40px; }
.search-clear { position: absolute; top: 50%; right: 42px; z-index: 5; display: none; width: 26px; height: 26px; padding: 0; border: 0; border-radius: 6px; color: #8491a2; background: transparent; transform: translateY(-50%); }
.search-clear:hover { color: var(--danger); background: #fff1f2; }
.search-box.has-value .search-clear { display: grid; place-items: center; }
.search-count { position: absolute; top: 50%; right: 10px; z-index: 4; min-width: 25px; padding: 2px 5px; border-radius: 5px; color: #718096; background: #edf2f7; font-size: .58rem; font-weight: 800; text-align: center; transform: translateY(-50%); }
.table-empty-filter { display: none; padding: 36px 18px; color: #8090a5; text-align: center; }
.table-empty-filter i { display: block; margin-bottom: 7px; font-size: 1.6rem; }
.entity-autocomplete { position: relative; min-width: 0; }
.entity-autocomplete > i { position: absolute; top: 50%; left: 12px; z-index: 4; color: #8ca0b7; transform: translateY(-50%); }
.entity-autocomplete-input { padding-right: 38px; padding-left: 36px; }
.entity-autocomplete-clear { position: absolute; top: 50%; right: 8px; z-index: 5; display: none; width: 26px; height: 26px; padding: 0; border: 0; border-radius: 7px; color: #8090a5; background: transparent; transform: translateY(-50%); place-items: center; }
.entity-autocomplete.has-value .entity-autocomplete-clear { display: grid; }
.entity-autocomplete-clear:hover { color: var(--slate-900); background: #eef3f8; }
.entity-autocomplete-original { position: absolute !important; width: 1px !important; height: 1px !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; }
.entity-autocomplete-list { position: absolute; right: 0; left: 0; z-index: 1080; display: none; max-height: 260px; margin-top: 6px; overflow: auto; padding: 6px; border: 1px solid #d5dfeb; border-radius: 10px; background: #fff; box-shadow: 0 18px 40px rgba(15,32,58,.16); }
.entity-autocomplete.is-open .entity-autocomplete-list { display: grid; gap: 4px; }
.entity-autocomplete-option { width: 100%; min-height: 34px; padding: 8px 10px; border: 0; border-radius: 8px; color: var(--slate-900); background: transparent; font-size: .78rem; font-weight: 700; text-align: left; }
.entity-autocomplete-option:hover, .entity-autocomplete-option.active { color: var(--blue-700); background: #eef5ff; }
.entity-autocomplete-empty { padding: 12px 10px; color: #8090a5; font-size: .76rem; text-align: center; }
.alert { border: 0; border-left: 4px solid currentColor; border-radius: 11px; box-shadow: var(--shadow-sm); font-size: .84rem; }
.badge { padding: .44em .68em; border-radius: 7px; font-size: .68rem; font-weight: 700; letter-spacing: .01em; }
.page-actions { display: flex; max-width: 100%; gap: 7px; flex-wrap: wrap; }
.page-actions .btn { min-height: 36px; padding: .4rem .75rem; }
.primary-action {
    min-height: 40px;
    font-weight: 850;
    box-shadow: 0 10px 22px rgba(37, 99, 235, .16);
}
.primary-action.btn-success { box-shadow: 0 10px 22px rgba(16, 185, 129, .16); }
.primary-action.btn-warning { box-shadow: 0 10px 22px rgba(245, 158, 11, .18); }
.primary-action.btn-danger { box-shadow: 0 10px 22px rgba(220, 38, 38, .16); }
.primary-action i:first-child { margin-right: .15rem; }
.page-actions .primary-action,
.product-overview-actions .primary-action,
.finance-overview-actions .primary-action,
.purchase-flow-shortcut-actions .primary-action,
.pdv-entry-actions .primary-action {
    order: -1;
}
.action-cell .primary-action,
.table .primary-action,
.btn-sm.primary-action {
    min-height: 32px;
    box-shadow: none;
}
.filter-action,
.product-filter-actions .btn:first-child,
.management-filter-actions .btn:first-child,
.finance-filter-actions .btn:first-child {
    font-weight: 780;
}
.empty-state { padding: 42px 20px; color: var(--slate-500); text-align: center; }

/* Tables */
.table-responsive { border-radius: 11px; }
.table { --bs-table-bg: transparent; margin-bottom: 0; color: var(--slate-700); }
.table > :not(caption) > * > * { padding: .78rem .76rem; border-bottom-color: #edf1f6; }
.table thead th { border-bottom-width: 1px; color: #708096; background: #f8fafc; font-size: .67rem; font-weight: 800; letter-spacing: .075em; text-transform: uppercase; white-space: nowrap; }
.table tbody td { vertical-align: middle; font-size: .78rem; }
.table tbody tr { transition: background .15s; }
.table tbody tr:hover { background: #f8fbff; }
.table tbody tr:last-child td { border-bottom: 0; }
.table code { padding: 3px 6px; border: 1px solid #dce8f8; border-radius: 6px; color: #2356a8; background: #f2f7ff; font-size: .72rem; }
.pagination-wrap { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 14px; padding-top: 12px; border-top: 1px solid #edf1f6; color: var(--slate-500); font-size: .74rem; font-weight: 700; }
.pagination-wrap .pagination { flex-wrap: wrap; justify-content: flex-end; gap: 4px; }
.pagination-wrap .page-link { min-width: 34px; border-color: #dce4ee; border-radius: 8px; color: #52657d; text-align: center; }
.pagination-wrap .page-item.active .page-link { border-color: var(--blue-600); background: var(--blue-600); }
.pagination-wrap .page-item.disabled .page-link { color: #a7b2c0; background: #f8fafc; }

/* Dashboard metrics */
.stat-card { position: relative; overflow: hidden; transition: transform .2s, box-shadow .2s; }
.stat-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); }
.stat-card::after { position: absolute; inset: auto 0 0; height: 3px; background: var(--stat-color, var(--blue-500)); content: ""; }
.stat-card .card-body { display: flex; min-height: 125px; align-items: center; justify-content: space-between; gap: 10px; }
.stat-card .card-body > div:first-child { min-width: 0; flex: 1 1 auto; }
.stat-label { color: var(--slate-500); font-size: .72rem; font-weight: 650; }
.stat-value { margin-top: 5px; overflow-wrap: anywhere; font-size: 1.72rem; font-weight: 780; letter-spacing: -.04em; line-height: 1; }
.stat-meta { display: none; }
.stat-icon { display: grid; width: 48px; height: 48px; flex: 0 0 48px; place-items: center; border-radius: 14px; font-size: 1.25rem; }
.stat-icon > i { display: block; line-height: 1; }
.recent-order { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 2px; border-bottom: 1px solid #edf1f6; color: inherit; text-decoration: none; transition: padding .16s, background .16s; }
.recent-order:last-child { border-bottom: 0; }
.recent-order:hover { padding-right: 7px; padding-left: 7px; border-radius: 9px; color: inherit; background: #f8fbff; }
.order-item .item-total,
.order-item .pdv-item-total { min-width: 92px; white-space: nowrap; }

/* Operational screens */
.operation-hero {
    display: flex;
    align-items: stretch;
    justify-content: space-between;
    gap: 22px;
    margin-bottom: 18px;
    padding: 22px 24px;
    overflow: hidden;
    border: 1px solid rgba(187, 207, 234, .35);
    border-radius: 18px;
    color: #fff;
    background: linear-gradient(120deg, #0b2747, #155c9f);
    box-shadow: 0 16px 34px rgba(11, 31, 58, .14);
}
.operation-hero h2 { margin: 5px 0 7px; font-size: 1.3rem; font-weight: 800; letter-spacing: -.03em; }
.operation-hero p { max-width: 650px; margin: 0; color: #c7d8eb; font-size: .82rem; }
.operation-eyebrow { display: inline-flex; align-items: center; gap: 7px; color: #a8d1ff; font-size: .68rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.operation-summary-grid { display: grid; min-width: min(390px, 100%); gap: 10px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.operation-summary-grid > div { padding: 13px 14px; border: 1px solid rgba(255,255,255,.13); border-radius: 13px; background: rgba(255,255,255,.1); backdrop-filter: blur(6px); }
.operation-summary-grid span { display: block; color: #b8cde4; font-size: .62rem; font-weight: 800; text-transform: uppercase; }
.operation-summary-grid strong { display: block; margin-top: 5px; overflow-wrap: anywhere; color: #fff; font-size: 1.12rem; font-weight: 850; }
.stock-kpi-grid { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }
.stock-kpi { padding: 14px 16px; border: 1px solid #dfe8f2; border-radius: 14px; background: #fff; box-shadow: var(--shadow-sm); }
.stock-kpi span { color: var(--slate-500); font-size: .66rem; font-weight: 800; text-transform: uppercase; }
.stock-kpi strong { display: block; margin-top: 4px; color: var(--slate-900); font-size: 1.16rem; font-weight: 850; }
.stock-kpi small { display: block; margin-top: 4px; color: #8a98aa; font-size: .65rem; }
.stock-lot-label-panel { overflow: hidden; border: 1px solid #d7e5f3; border-radius: 12px; background: #fff; box-shadow: 0 10px 26px rgba(15, 32, 58, .055); }
.stock-lot-label-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 18px; border-bottom: 1px solid #e7eef6; background: #f8fbff; }
.stock-lot-label-head span { display: inline-flex; align-items: center; gap: 7px; color: var(--blue-600); font-size: .66rem; font-weight: 850; letter-spacing: .06em; text-transform: uppercase; }
.stock-lot-label-head h3 { margin: 5px 0 2px; color: var(--slate-900); font-size: 1.18rem; font-weight: 900; letter-spacing: -.02em; }
.stock-lot-label-head p { margin: 0; color: var(--slate-700); font-size: .84rem; font-weight: 750; }
.stock-lot-label-actions { display: flex; align-items: center; gap: 10px; white-space: nowrap; }
.stock-lot-label-actions strong { padding: 7px 10px; border: 1px solid #dbe7f3; border-radius: 999px; color: var(--slate-700); background: #fff; font-size: .72rem; }
.stock-lot-label-context { display: grid; gap: 10px; padding: 12px 18px; border-bottom: 1px solid #edf2f7; background: #fbfdff; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.stock-lot-label-context span { display: grid; min-width: 0; grid-template-columns: 24px minmax(0, 1fr); column-gap: 8px; align-items: center; color: var(--slate-700); font-size: .72rem; }
.stock-lot-label-context i { display: grid; width: 24px; height: 24px; border-radius: 7px; color: var(--blue-600); background: #eff6ff; place-items: center; grid-row: span 2; }
.stock-lot-label-context strong { display: block; color: var(--slate-500); font-size: .58rem; font-weight: 850; text-transform: uppercase; }
.stock-lot-label-summary { display: grid; gap: 10px; padding: 13px 18px; border-bottom: 1px solid #edf2f7; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.stock-lot-label-kpi { display: grid; gap: 4px; min-height: 90px; padding: 12px 13px; border: 1px solid #e1eaf4; border-left-width: 4px; border-radius: 8px; background: #f8fafc; }
.stock-lot-label-kpi span { display: inline-flex; align-items: center; gap: 7px; color: var(--slate-600); font-size: .64rem; font-weight: 900; text-transform: uppercase; }
.stock-lot-label-kpi strong { color: var(--slate-900); font-size: 1.45rem; font-weight: 900; line-height: 1; }
.stock-lot-label-kpi small { color: var(--slate-500); font-size: .68rem; line-height: 1.25; }
.stock-lot-label-kpi.is-danger { border-color: #fecaca; border-left-color: #dc2626; background: #fff7f7; }
.stock-lot-label-kpi.is-primary { border-color: #bfdbfe; border-left-color: #2563eb; background: #f5f9ff; }
.stock-lot-label-kpi.is-success { border-color: #bbf7d0; border-left-color: #16a34a; background: #f6fff9; }
.stock-lot-label-kpi.is-warning { border-color: #fde68a; border-left-color: #d97706; background: #fffbeb; }
.stock-lot-label-kpi.is-secondary { border-color: #d9e2ec; border-left-color: #64748b; background: #f8fafc; }
.stock-lot-label-groups { display: grid; gap: 14px; padding: 16px 18px 18px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.stock-lot-label-group { min-width: 0; overflow: hidden; border: 1px solid #e1eaf4; border-radius: 8px; background: #fff; box-shadow: none; }
.stock-lot-label-group header { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 11px 12px; border-bottom: 1px solid #eef3f8; background: #f8fafc; }
.stock-lot-label-group header .badge { display: inline-flex; align-items: center; gap: 6px; }
.stock-lot-label-group header strong { color: var(--slate-700); font-size: .72rem; }
.stock-lot-label-list { display: grid; max-height: 350px; overflow: auto; }
.stock-lot-label-item { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 11px 12px; border-bottom: 1px solid #f0f4f8; }
.stock-lot-label-item:last-child { border-bottom: 0; }
.stock-lot-label-item code { padding: 3px 7px; border: 1px solid #dbe7f3; border-radius: 8px; color: #0f3d5d; background: #f8fbff; font-size: .78rem; font-weight: 850; }
.stock-lot-label-item small { display: block; margin-top: 5px; color: var(--slate-500); font-size: .68rem; line-height: 1.35; }
.stock-lot-label-item small b { display: inline-block; margin-right: 5px; padding: 1px 5px; border-radius: 999px; color: #475569; background: #eef2f7; font-size: .56rem; }
.stock-lot-grade-button { width: 100%; border: 0; color: inherit; background: #fff; text-align: left; cursor: pointer; }
.stock-lot-grade-button:hover,
.stock-lot-grade-button:focus { background: #f6faff; outline: 0; box-shadow: inset 4px 0 0 var(--blue-600); }
.stock-lot-grade-button:focus-visible { outline: 3px solid rgba(37, 99, 235, .22); outline-offset: -3px; }
.stock-lot-modal-eyebrow { display: inline-flex; align-items: center; gap: 6px; color: var(--blue-600); font-size: .64rem; font-weight: 900; letter-spacing: .06em; text-transform: uppercase; }
.stock-lot-grade-modal .modal-header { align-items: flex-start; background: #f8fbff; }
.stock-lot-modal-pieces { display: grid; gap: 9px; }
.stock-lot-modal-piece { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 11px 12px; border: 1px solid #e4edf6; border-radius: 11px; background: #fff; }
.stock-lot-modal-piece code { padding: 3px 7px; border: 1px solid #dbe7f3; border-radius: 8px; color: #0f3d5d; background: #f8fbff; font-size: .8rem; font-weight: 850; }
.stock-lot-modal-piece small { display: block; margin-top: 5px; color: var(--slate-500); font-size: .7rem; }
.stock-lot-modal-piece small b { display: inline-block; margin-right: 5px; padding: 1px 5px; border-radius: 999px; color: #475569; background: #eef2f7; font-size: .58rem; }
.stock-lot-composition { display: flex; flex-wrap: wrap; gap: 6px; }
.stock-lot-composition span { display: inline-flex; min-height: 26px; align-items: center; gap: 5px; padding: 3px 7px; border: 1px solid #dbe7f3; border-radius: 7px; color: var(--slate-600); background: #f8fbff; font-size: .7rem; font-weight: 800; }
.stock-lot-composition strong { color: var(--slate-900); font-size: .78rem; }
.operation-tabs { gap: 7px; margin-bottom: 14px; padding: 7px; border: 1px solid #dfe8f2; border-radius: 14px; background: #fff; box-shadow: var(--shadow-sm); }
.operation-tabs .nav-link { display: inline-flex; min-height: 39px; align-items: center; gap: 7px; border-radius: 10px; color: #5f7188; font-size: .76rem; font-weight: 800; }
.operation-tabs .nav-link.active { color: #fff; background: var(--blue-600); box-shadow: 0 6px 14px rgba(37,99,235,.18); }
.inner-operation-tabs { width: fit-content; max-width: 100%; overflow-x: auto; flex-wrap: nowrap; }
.deposit-tab-content { min-height: 360px; }
.deposit-form-shell { max-width: 820px; }
.deposit-rule-strip { display: grid; gap: 10px; margin: 16px 0; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.deposit-rule-strip span { display: inline-flex; min-width: 0; min-height: 42px; align-items: center; justify-content: center; gap: 7px; padding: 8px 10px; border: 1px solid #dfe8f2; border-radius: 10px; background: #f8fafc; color: var(--slate-700); font-size: .72rem; font-weight: 800; text-align: center; }
.deposit-usage-grid { display: grid; gap: 12px; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.deposit-usage-item { display: grid; gap: 7px; min-height: 150px; padding: 15px; border: 1px solid #dfe8f2; border-radius: 10px; background: #fff; box-shadow: var(--shadow-sm); }
.deposit-usage-item i { display: grid; width: 36px; height: 36px; place-items: center; border-radius: 9px; background: #eff6ff; color: var(--blue-600); font-size: 1.05rem; }
.deposit-usage-item strong { color: var(--slate-900); font-size: .86rem; font-weight: 850; }
.deposit-usage-item span { color: var(--slate-500); font-size: .72rem; line-height: 1.45; }
.operation-tab-content { min-height: 330px; }
.operation-tab-content > .tab-pane > .card,
.operation-tab-content > .tab-pane > .row,
.operation-tab-content > .card,
.operation-tab-content > .row { margin-top: 2px; }
.operation-tab-content .card { border-color: rgba(208, 222, 239, .95); box-shadow: 0 12px 34px rgba(15,32,58,.055); }
.operation-tab-content .card-body { padding: 1.35rem; }
.operation-tab-content .table-responsive { border: 1px solid #e5ebf2; }
.operation-tab-content .form-actions { margin-top: 4px; }
.stock-kpi-grid { align-items: stretch; }
.stock-kpi { min-height: 108px; }
.stock-grade-dashboard {
    display: grid;
    gap: 12px;
    margin-bottom: 14px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}
.stock-grade-dashboard > div {
    min-height: 92px;
    padding: 15px;
    border: 1px solid #dfe8f2;
    border-radius: 14px;
    background: linear-gradient(180deg, #fff, #f8fbff);
    box-shadow: var(--shadow-sm);
}
.stock-grade-dashboard span,
.stock-grade-pill {
    color: var(--slate-500);
    font-size: .66rem;
    font-weight: 850;
    text-transform: uppercase;
}
.stock-grade-dashboard strong {
    display: block;
    margin-top: 6px;
    color: var(--slate-900);
    font-size: 1.18rem;
    font-weight: 850;
}
.stock-grade-dashboard small {
    display: block;
    margin-top: 5px;
    color: #718198;
    font-size: .68rem;
}
.stock-grade-section-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 14px;
}
.stock-grade-section-head .form-section-title {
    margin-bottom: 5px;
}
.stock-grade-section-head p {
    margin: 0;
    color: var(--slate-500);
    font-size: .78rem;
    line-height: 1.45;
}
.stock-grade-pill {
    display: inline-flex;
    min-height: 30px;
    align-items: center;
    padding: 6px 10px;
    border-radius: 999px;
    color: #145ef2;
    background: #eaf2ff;
    white-space: nowrap;
}
.stock-grade-form-grid {
    display: grid;
    align-items: end;
    gap: 12px;
    grid-template-columns: repeat(12, minmax(0, 1fr));
}
.stock-grade-form-grid > * {
    min-width: 0;
}
.stock-grade-form-grid .span-2 { grid-column: span 2; }
.stock-grade-form-grid .span-3 { grid-column: span 3; }
.stock-grade-form-grid .span-4 { grid-column: span 4; }
.stock-grade-form-grid .span-5 { grid-column: span 5; }
.stock-grade-form-grid .span-6 { grid-column: span 6; }
.stock-grade-form-grid .span-12 { grid-column: 1 / -1; }
.stock-grade-form-grid textarea {
    min-height: 96px;
    resize: vertical;
}
.stock-grade-scan-panel {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 10px;
    padding: 10px;
    border: 1px solid #dbeafe;
    border-radius: 12px;
    background: #f8fbff;
}
.stock-grade-scan-panel > i {
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    border-radius: 10px;
    background: #e0f2fe;
    color: #0369a1;
    font-size: 1.15rem;
}
.stock-grade-scan-panel .form-control {
    background: #fff;
}
.stock-grade-scan-status {
    display: block;
    min-height: 18px;
    margin-top: 6px;
    color: var(--slate-500);
    font-weight: 700;
}
.stock-grade-scan-status.is-success {
    color: #047857;
}
.stock-grade-scan-status.is-error {
    color: #b91c1c;
}
.stock-grade-camera-panel {
    display: grid;
    grid-template-columns: minmax(220px, 320px) minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    margin-top: 10px;
    padding: 12px;
    border: 1px solid #d1fae5;
    border-radius: 12px;
    background: #f0fdf4;
}
.stock-grade-camera-panel[hidden] {
    display: none;
}
.stock-grade-camera-panel video {
    width: 100%;
    aspect-ratio: 16 / 9;
    border-radius: 10px;
    background: #0f172a;
    object-fit: cover;
}
.stock-grade-camera-panel strong {
    display: block;
    color: var(--slate-900);
    font-size: .85rem;
}
.stock-grade-camera-panel small {
    display: block;
    color: var(--slate-600);
    font-weight: 700;
}
.stock-grade-camera-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    flex-wrap: wrap;
}
.stock-grade-piece-panel {
    display: grid;
    gap: 10px;
    margin-top: 14px;
}
.stock-grade-piece-toolbar {
    margin-bottom: 0 !important;
}
.stock-grade-tools {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    min-width: min(430px, 100%);
}
.stock-grade-search {
    position: relative;
    width: min(360px, 100%);
}
.stock-grade-search i {
    position: absolute;
    top: 50%;
    left: 12px;
    z-index: 1;
    color: var(--slate-500);
    transform: translateY(-50%);
}
.stock-grade-search .form-control {
    padding-left: 34px;
}
.stock-grade-selection-summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    min-height: 42px;
    padding: 9px 12px;
    border: 1px solid #dbeafe;
    border-radius: 10px;
    background: #f8fbff;
}
.stock-grade-selection-summary strong {
    color: var(--slate-900);
    font-size: .82rem;
}
.stock-grade-selection-summary span {
    color: var(--slate-500);
    font-size: .7rem;
    font-weight: 750;
    text-transform: none;
}
.stock-grade-selection-close {
    flex: 0 0 auto;
    align-self: center;
}
.stock-grade-selection-summary.is-warning {
    border-color: #f8d38d;
    background: #fffaf0;
}
.stock-grade-selection-summary.is-danger {
    border-color: #fecaca;
    background: #fff8f8;
}
.stock-grade-piece-table tr.is-selected {
    background: #f0fdfa;
}
.stock-grade-piece-table tr.is-hidden-by-filter {
    display: none;
}
.stock-location-list { display: flex; max-width: 360px; gap: 6px; flex-wrap: wrap; }
.stock-location-list span { display: inline-flex; align-items: center; gap: 5px; padding: 5px 7px; border: 1px solid #dfe8f2; border-radius: 8px; background: #f8fbff; color: var(--slate-700); font-size: .68rem; white-space: nowrap; }
.stock-location-list strong { color: var(--slate-900); font-weight: 850; }
.stock-premium-table { min-width: 1080px; }
.product-form-tabs { min-height: 190px; }
.product-filter-grid { display: grid; align-items: end; gap: 12px; grid-template-columns: repeat(12, minmax(0, 1fr)); }
.product-filter-grid > div { grid-column: span 2; min-width: 0; }
.product-filter-grid .span-4 { grid-column: span 4; }
.product-filter-actions { display: flex; gap: 8px; }
.product-filter-actions .btn { min-height: 38px; }
.product-premium-table { min-width: 1080px; }
.product-main-cell,
.product-stock-cell,
.product-price-cell,
.product-health-cell { display: grid; gap: 5px; min-width: 0; }
.product-main-cell strong,
.product-stock-cell strong,
.product-price-cell strong { color: var(--slate-900); font-size: .82rem; font-weight: 850; line-height: 1.25; }
.product-main-cell small,
.product-stock-cell small,
.product-price-cell small { color: var(--slate-500); font-size: .68rem; line-height: 1.35; }
.product-main-cell code { width: fit-content; }
.product-health-cell { align-content: start; grid-template-columns: repeat(2, minmax(0, max-content)); }
.product-health-cell .badge,
.product-price-cell .badge { width: fit-content; }
@media (max-width: 991.98px) {
    .store-shortcut-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .store-operation-intro { align-items: flex-start; flex-direction: column; padding: 16px 18px; }
    .store-operation-summary { width: 100%; min-width: 0; }
    .label-check-result { grid-template-columns: 150px minmax(0, 1fr); }
    .label-check-facts { grid-column: 1 / -1; border-top: 1px solid #e2e8ef; }
    .product-filter-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .product-filter-grid > div,
    .product-filter-grid .span-4 { grid-column: span 1; }
    .product-filter-actions { grid-column: 1 / -1; }
.purchase-preview-grid,
.purchase-receiving-summary,
.purchase-conference-stepper { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .purchase-flow-shortcut { align-items: stretch; flex-direction: column; }
    .purchase-flow-shortcut-actions { justify-content: flex-start; }
.purchase-form-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.purchase-form-grid > div,
.purchase-form-grid .span-3,
.purchase-form-grid .span-4,
.purchase-form-grid .span-5 { grid-column: span 1; }
.purchase-form-grid .span-12 { grid-column: 1 / -1; }
    .stock-lot-label-context { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .stock-lot-label-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .stock-lot-label-groups { grid-template-columns: 1fr; }
    .management-filter-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .management-filter-grid > div,
    .management-filter-grid .span-4 { grid-column: span 1; }
    .management-filter-actions { grid-column: 1 / -1; }
}
@media (max-width: 575.98px) {
    .store-operation-intro { min-height: 0; padding: 15px; }
    .store-operation-intro h2 { font-size: 1.28rem; }
    .store-operation-summary { grid-template-columns: 1fr 1fr; }
    .store-operation-summary > div { padding: 8px 10px; }
    .store-operation-summary strong { font-size: 1.08rem; }
    .store-shortcut-grid { grid-template-columns: 1fr; }
    .store-shortcut { min-height: 72px; }
    .label-check-console { padding: 16px; }
    .label-check-heading { align-items: flex-start; flex-direction: column; }
    .label-check-form { grid-template-columns: 1fr; }
    .label-check-form > i { display: none; }
    .label-check-form .btn { width: 100%; }
    .label-check-result { grid-template-columns: 1fr; }
    .label-check-status { min-height: 120px; }
    .label-check-product { border-right: 0; }
    .label-check-facts { grid-column: auto; grid-template-columns: 1fr; }
    .label-check-facts > div,
    .label-check-facts > div:nth-child(odd),
    .label-check-facts > div:nth-last-child(-n+2) { border-right: 0; border-bottom: 1px solid #e2e8ef; }
    .label-check-facts > div:last-child { border-bottom: 0; }
    .product-filter-grid { grid-template-columns: 1fr; }
    .product-filter-grid > div,
    .product-filter-grid .span-4,
    .product-filter-actions { grid-column: 1 / -1; }
    .product-filter-actions { flex-direction: column; }
.purchase-preview-grid,
.purchase-receiving-summary,
.purchase-conference-stepper,
.purchase-form-grid { grid-template-columns: 1fr; }
    .purchase-flow-shortcut-actions .btn,
    .purchase-flow-shortcut-actions form { width: 100%; }
.purchase-preview-grid > div,
.purchase-form-grid > div,
.purchase-form-grid .span-3,
.purchase-form-grid .span-4,
.purchase-form-grid .span-5,
.purchase-form-grid .span-12 { grid-column: 1 / -1; }
    .stock-location-list { max-width: none; }
    .stock-lot-label-head { align-items: stretch; flex-direction: column; }
    .stock-lot-label-actions { align-items: stretch; flex-direction: column; white-space: normal; }
    .stock-lot-label-context { grid-template-columns: 1fr; }
    .stock-lot-label-summary { grid-template-columns: 1fr; }
    .management-filter-grid { grid-template-columns: 1fr; }
    .management-filter-grid > div,
    .management-filter-grid .span-4,
    .management-filter-actions { grid-column: 1 / -1; }
    .management-filter-actions { flex-direction: column; }
}

/* Premium dashboard and PDV */
.dashboard-hero {
    position: relative;
    display: grid;
    align-items: stretch;
    gap: 24px;
    grid-template-columns: minmax(0, 1fr) minmax(190px, 250px);
    min-height: 210px;
    margin-bottom: 22px;
    padding: 28px;
    overflow: hidden;
    border: 1px solid rgba(153, 191, 244, .24);
    border-radius: 18px;
    color: #fff;
    background:
        radial-gradient(circle at 82% 16%, rgba(125, 211, 252, .22), transparent 26%),
        radial-gradient(circle at 10% 0, rgba(59, 130, 246, .28), transparent 28%),
        linear-gradient(135deg, #061524 0%, #0d3159 54%, #145a9a 100%);
    box-shadow: 0 24px 60px rgba(7, 20, 38, .2);
}
.dashboard-hero::before { position: absolute; inset: 16px; border: 1px solid rgba(255,255,255,.07); border-radius: 15px; pointer-events: none; content: ""; }
.dashboard-hero::after { position: absolute; top: -120px; right: -75px; width: 340px; height: 340px; border: 64px solid rgba(255,255,255,.055); border-radius: 50%; opacity: .9; content: ""; }
.dashboard-hero-main { position: relative; z-index: 1; display: flex; min-width: 0; flex-direction: column; justify-content: space-between; gap: 26px; }
.dashboard-hero-copy, .dashboard-quick-actions { position: relative; z-index: 1; }
.dashboard-eyebrow { display: inline-flex; align-items: center; gap: 8px; margin-bottom: 9px; color: #9dccff; font-size: .66rem; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
.dashboard-hero h2 { max-width: 700px; margin: 0 0 8px; font-size: clamp(1.55rem, 2.7vw, 2.15rem); font-weight: 850; letter-spacing: -.045em; }
.dashboard-hero p { max-width: 680px; margin: 0; color: #c7d8eb; line-height: 1.65; }
.dashboard-hero-status { display: grid; width: min(740px, 100%); gap: 10px; grid-template-columns: repeat(auto-fit, minmax(155px, 1fr)); }
.dashboard-hero-status > div { padding: 13px 14px; border: 1px solid rgba(255,255,255,.14); border-radius: 13px; background: rgba(255,255,255,.095); box-shadow: inset 0 1px 0 rgba(255,255,255,.08); backdrop-filter: blur(10px); }
.dashboard-hero-status span { display: block; color: #9fb7d3; font-size: .6rem; font-weight: 850; letter-spacing: .07em; text-transform: uppercase; }
.dashboard-hero-status strong { display: block; margin-top: 5px; color: #fff; font-size: 1.08rem; font-weight: 850; overflow-wrap: anywhere; }
.dashboard-quick-actions { display: flex; align-content: flex-start; align-items: stretch; width: 100%; max-width: 250px; flex-direction: column; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.dashboard-quick-actions .btn { justify-content: flex-start; min-height: 46px; padding-right: 15px; padding-left: 10px; border-color: rgba(255,255,255,.72); color: #09213b; background: linear-gradient(180deg, #fff, #eaf3ff); box-shadow: 0 12px 26px rgba(3, 11, 24, .24), inset 0 1px 0 rgba(255,255,255,.78); text-align: left; white-space: normal; backdrop-filter: blur(5px); }
.dashboard-quick-actions .btn i { display: inline-grid; width: 28px; height: 28px; flex: 0 0 28px; border-radius: 8px; color: var(--blue-600); background: rgba(37,99,235,.1); place-items: center; }
.dashboard-quick-actions .btn:hover, .dashboard-quick-actions .btn:focus { border-color: #fff; color: #061524; background: #fff; box-shadow: 0 16px 34px rgba(3, 11, 24, .3), 0 0 0 3px rgba(255,255,255,.08); }
.daily-action-board { padding: 1rem; border: 1px solid rgba(191, 205, 222, .8); border-radius: 8px; background: linear-gradient(180deg, #fff, #f8fafc); box-shadow: 0 16px 38px rgba(15, 32, 58, .08); }
.daily-action-heading { display: flex; align-items: center; justify-content: space-between; gap: .75rem; margin-bottom: .9rem; }
.daily-action-heading span { display: inline-flex; align-items: center; gap: .4rem; color: #2563eb; font-size: .66rem; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.daily-action-heading h2 { margin: .15rem 0 0; color: #0f172a; font-size: 1.02rem; font-weight: 850; }
.daily-action-grid { display: grid; gap: .8rem; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.daily-action-card { --daily-accent: #64748b; display: flex; min-height: 270px; flex-direction: column; gap: .85rem; padding: .95rem; border: 1px solid rgba(203, 213, 225, .95); border-top: 3px solid var(--daily-accent); border-radius: 8px; background: #fff; box-shadow: 0 10px 28px rgba(15, 23, 42, .06); }
.daily-action-card.is-danger { --daily-accent: #dc2626; }
.daily-action-card.is-warning { --daily-accent: #d97706; }
.daily-action-card.is-success { --daily-accent: #059669; }
.daily-action-card.is-primary { --daily-accent: #2563eb; }
.daily-action-card.is-neutral { --daily-accent: #64748b; }
.daily-action-top { display: grid; align-items: start; gap: .65rem; grid-template-columns: 38px minmax(0, 1fr); }
.daily-action-icon { display: inline-grid; width: 38px; height: 38px; border-radius: 8px; color: var(--daily-accent); background: color-mix(in srgb, var(--daily-accent) 12%, #fff); place-items: center; }
.daily-action-top h3 { margin: 0; color: #0f172a; font-size: .9rem; font-weight: 850; line-height: 1.25; }
.daily-action-top small { display: block; margin-top: .2rem; color: #64748b; font-size: .72rem; line-height: 1.35; }
.daily-action-value { color: #0f172a; font-size: clamp(1.45rem, 2vw, 1.9rem); font-weight: 900; line-height: 1; overflow-wrap: anywhere; }
.daily-action-list { display: grid; gap: .5rem; margin-top: -.1rem; }
.daily-action-list > div { display: grid; align-items: center; gap: .55rem; grid-template-columns: minmax(0, 1fr) auto; padding: .55rem .6rem; border: 1px solid #e2e8f0; border-radius: 8px; background: #f8fafc; }
.daily-action-list strong { display: block; color: #0f172a; font-size: .76rem; line-height: 1.25; overflow-wrap: anywhere; }
.daily-action-list small { display: block; margin-top: .12rem; color: #64748b; font-size: .66rem; line-height: 1.3; overflow-wrap: anywhere; }
.daily-action-list em { color: #334155; font-size: .72rem; font-style: normal; font-weight: 800; white-space: nowrap; }
.daily-action-empty { min-height: 41px; padding: .62rem .65rem; border: 1px dashed #cbd5e1; border-radius: 8px; color: #64748b; background: #f8fafc; font-size: .75rem; }
.daily-action-button { justify-content: space-between; width: 100%; margin-top: auto; border-color: color-mix(in srgb, var(--daily-accent) 36%, #cbd5e1); color: var(--daily-accent); background: color-mix(in srgb, var(--daily-accent) 8%, #fff); font-weight: 800; }
.daily-action-button:hover, .daily-action-button:focus { border-color: var(--daily-accent); color: #fff; background: var(--daily-accent); }
.permission-chip-list { display: flex; min-width: 0; gap: .35rem; flex-wrap: wrap; }
.permission-chip { display: inline-flex; align-items: center; min-height: 24px; padding: .2rem .48rem; border: 1px solid #dbe5f0; border-radius: 999px; color: #31506f; background: #f8fbff; font-size: .64rem; font-weight: 800; line-height: 1.15; }
.role-profile-card { display: grid; gap: .8rem; min-height: 100%; padding: .95rem; border: 1px solid #dbe5f0; border-radius: 8px; background: #fff; box-shadow: 0 10px 26px rgba(15, 32, 58, .055); }
.role-profile-card.is-recommended { border-color: #bfdbfe; box-shadow: 0 12px 30px rgba(37, 99, 235, .09); }
.role-profile-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: .75rem; }
.role-profile-heading strong { display: block; color: #102033; font-size: .9rem; font-weight: 900; }
.role-profile-heading p { margin: .22rem 0 0; color: #64748b; font-size: .72rem; line-height: 1.38; }
.role-profile-heading > span { flex: 0 0 auto; padding: .2rem .48rem; border-radius: 999px; color: #145ef2; background: #eaf2ff; font-size: .62rem; font-weight: 900; text-transform: uppercase; }
.role-permission-groups { display: grid; gap: .48rem; }
.role-permission-groups > div { display: grid; gap: .15rem; padding-top: .48rem; border-top: 1px solid #edf2f7; }
.role-permission-groups span { color: #102033; font-size: .68rem; font-weight: 900; }
.role-permission-groups small { color: #64748b; font-size: .68rem; line-height: 1.34; }
.dashboard-metrics { margin-top: -8px; }
.dashboard-stat-card { border-color: rgba(205, 218, 235, .82); background: linear-gradient(180deg, #fff, #fafdff); box-shadow: 0 14px 34px rgba(15, 32, 58, .07); }
.dashboard-stat-card::before { position: absolute; top: 14px; right: 14px; z-index: 0; width: 68px; height: 68px; border-radius: 50%; background: color-mix(in srgb, var(--stat-color, var(--blue-500)) 12%, transparent); content: ""; pointer-events: none; }
.dashboard-stat-card::after { height: 4px; }
.dashboard-stat-card .card-body { position: relative; z-index: 1; min-height: 136px; align-items: flex-start; }
.dashboard-stat-card .stat-icon { position: relative; z-index: 1; width: 50px; height: 50px; margin-left: 8px; border-radius: 16px; box-shadow: 0 10px 22px rgba(15,32,58,.07); }
.dashboard-stat-card .stat-value { font-size: 1.55rem; }
.dashboard-panel { border-color: rgba(210, 222, 238, .9); box-shadow: 0 16px 42px rgba(15, 32, 58, .065); }
.dashboard-panel .card-body { padding: 1.35rem; }
.management-strip { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.management-strip > div { min-width: 0; padding: 14px; border: 1px solid #dbe7f3; border-radius: 10px; background: #fff; box-shadow: 0 12px 30px rgba(15,32,58,.055); }
.management-strip span { display: block; color: var(--slate-500); font-size: .62rem; font-weight: 850; letter-spacing: .06em; text-transform: uppercase; }
.management-strip strong { display: block; margin-top: 5px; color: var(--slate-900); font-size: 1.18rem; font-weight: 850; overflow-wrap: anywhere; }
.management-strip small { display: block; margin-top: 3px; color: var(--slate-500); font-size: .66rem; }
.report-summary-strip { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }
.report-summary-strip > div { min-width: 0; padding: 13px; border: 1px solid #dbe7f3; border-radius: 10px; background: linear-gradient(180deg, #fff, #f8fbff); box-shadow: 0 10px 26px rgba(15,32,58,.045); }
.report-summary-strip span { display: block; color: var(--slate-500); font-size: .6rem; font-weight: 850; letter-spacing: .06em; text-transform: uppercase; }
.report-summary-strip strong { display: block; margin-top: 4px; color: var(--slate-900); font-size: 1.08rem; font-weight: 850; overflow-wrap: anywhere; }
.report-summary-strip small { display: block; margin-top: 2px; color: var(--slate-500); font-size: .64rem; }
.orders-panel .recent-order { margin: 0 -7px; padding-right: 9px; padding-left: 9px; border-radius: 10px; }
.orders-panel .recent-order:hover { background: #f3f8ff; box-shadow: inset 3px 0 0 var(--blue-500); }
.print-config-row { display: grid; gap: 10px; grid-template-columns: minmax(180px, 1.15fr) minmax(150px, 1fr) repeat(4, minmax(96px, .7fr)); align-items: end; padding: 12px; border: 1px solid #e0e9f4; border-radius: 10px; background: #f8fbff; }
.print-config-title { display: flex; min-height: 40px; align-items: center; gap: 9px; color: var(--slate-800); }
.print-config-title i { display: grid; width: 34px; height: 34px; place-items: center; border-radius: 8px; color: #047966; background: #dff7f3; }
.print-config-title strong { font-size: .85rem; }
.print-config-row input[readonly] { background: #eef4fa; color: #63748a; }
.settings-shell { display: grid; gap: 14px; }
.settings-hero { display: grid; align-items: stretch; gap: 18px; grid-template-columns: minmax(0, 1fr) minmax(260px, 360px); padding: 22px 24px; border: 1px solid #d9e6f4; border-radius: 14px; color: #fff; background: linear-gradient(135deg, #09213b, #155c9f); box-shadow: 0 16px 36px rgba(15, 32, 58, .14); }
.settings-eyebrow { display: inline-flex; align-items: center; gap: 8px; color: #b7dbff; font-size: .66rem; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.settings-hero h2 { max-width: 760px; margin: 6px 0 7px; color: #fff; font-size: clamp(1.25rem, 2.4vw, 1.75rem); font-weight: 850; letter-spacing: -.025em; }
.settings-hero p { max-width: 680px; margin: 0; color: #d5e6f6; font-size: .82rem; }
.settings-hero-metrics { display: grid; gap: 10px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.settings-hero-metrics > div { min-width: 0; padding: 12px; border: 1px solid rgba(255,255,255,.14); border-radius: 10px; background: rgba(255,255,255,.1); }
.settings-hero-metrics span { display: block; color: #b7cbe2; font-size: .6rem; font-weight: 850; letter-spacing: .06em; text-transform: uppercase; }
.settings-hero-metrics strong { display: block; margin-top: 5px; overflow-wrap: anywhere; color: #fff; font-size: 1.05rem; font-weight: 850; }
.settings-tabs { position: sticky; top: 76px; z-index: 20; overflow-x: auto; flex-wrap: nowrap; }
.settings-tabs .nav-link { white-space: nowrap; }
.settings-tab-content { min-height: 460px; }
.settings-panel { overflow: hidden; border: 1px solid #dfe8f2; border-radius: 12px; background: #fff; box-shadow: 0 14px 34px rgba(15,32,58,.06); }
.settings-panel-head { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 16px 18px; border-bottom: 1px solid #e8eef6; background: #f8fafc; }
.settings-panel-head h2 { margin: 0; color: var(--slate-900); font-size: 1rem; font-weight: 850; }
.settings-panel-head p { margin: 3px 0 0; color: var(--slate-500); font-size: .74rem; }
.settings-panel-head .btn { flex: 0 0 auto; }
.settings-form-grid { display: grid; gap: 14px; grid-template-columns: repeat(12, minmax(0, 1fr)); padding: 18px; }
.settings-form-grid.compact { padding: 0; gap: 10px; }
.settings-form-grid .span-2 { grid-column: span 2; }
.settings-form-grid .span-4 { grid-column: span 4; }
.settings-form-grid .span-5 { grid-column: span 5; }
.settings-form-grid .span-6 { grid-column: span 6; }
.settings-form-grid .span-8 { grid-column: span 8; }
.settings-form-grid .span-12 { grid-column: 1 / -1; }
.settings-terminal-list,
.settings-print-list { display: grid; gap: 12px; padding: 18px; }
.settings-terminal-card { display: grid; gap: 13px; padding: 14px; border: 1px solid #dfe8f2; border-radius: 10px; background: linear-gradient(180deg, #fff, #f9fbfd); }
.settings-terminal-card.is-new { border-style: dashed; background: #f8fafc; }
.settings-terminal-title { display: flex; align-items: center; gap: 10px; min-width: 0; }
.settings-terminal-title > span { display: grid; width: 36px; height: 36px; flex: 0 0 36px; place-items: center; border-radius: 9px; color: #047966; background: #dff7f3; }
.settings-terminal-title div { min-width: 0; flex: 1; }
.settings-terminal-title strong,
.settings-terminal-title small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.settings-terminal-title strong { color: var(--slate-900); font-size: .88rem; font-weight: 850; }
.settings-terminal-title small { color: var(--slate-500); font-size: .68rem; }
.settings-terminal-active { display: flex; align-items: end; min-height: 64px; }
.settings-brand-grid { display: grid; align-items: center; gap: 18px; grid-template-columns: 180px minmax(0, 1fr); padding: 18px; }
.settings-logo-preview { display: grid; width: 180px; min-height: 140px; place-items: center; overflow: hidden; border: 1px solid #dfe8f2; border-radius: 12px; background: #f8fafc; color: #94a3b8; }
.settings-logo-preview img { max-width: 100%; max-height: 130px; object-fit: contain; }
.settings-logo-preview i { font-size: 2.2rem; }
.settings-usage-grid { display: grid; gap: 12px; grid-template-columns: repeat(3, minmax(0, 1fr)); padding: 18px; }
.settings-usage-card { display: grid; gap: 9px; min-width: 0; padding: 15px; border: 1px solid #dfe8f2; border-radius: 10px; background: #f8fafc; }
.settings-usage-card span { color: var(--slate-500); font-size: .66rem; font-weight: 850; letter-spacing: .05em; text-transform: uppercase; }
.settings-usage-card strong { color: var(--slate-900); font-size: 1.15rem; font-weight: 850; }
.purchase-panel { border-color: rgba(208, 222, 239, .95); box-shadow: 0 12px 34px rgba(15,32,58,.055); }
.purchase-flow-shortcut {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 14px;
    padding: 14px;
    border: 1px solid #cfe0f4;
    border-left: 4px solid var(--blue-600);
    border-radius: 10px;
    background: linear-gradient(180deg, #fff, #f8fbff);
    box-shadow: 0 10px 26px rgba(15,32,58,.055);
}
.purchase-flow-shortcut-copy { min-width: 0; }
.purchase-flow-shortcut-copy span {
    color: var(--blue-600);
    font-size: .62rem;
    font-weight: 850;
    letter-spacing: .06em;
    text-transform: uppercase;
}
.purchase-flow-shortcut-copy h3 {
    margin: 3px 0 2px;
    color: var(--slate-900);
    font-size: 1rem;
    font-weight: 850;
}
.purchase-flow-shortcut-copy p {
    margin: 0;
    color: var(--slate-500);
    font-size: .76rem;
    font-weight: 750;
}
.purchase-flow-shortcut-actions {
    display: flex;
    gap: 8px;
    flex: 0 0 auto;
    flex-wrap: wrap;
    justify-content: flex-end;
}
.purchase-flow-shortcut-actions form { margin: 0; }
.purchase-flow-shortcut-actions .btn { min-height: 40px; }
.purchase-conference-stepper { display: grid; gap: 8px; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.purchase-conference-stepper > div { display: flex; align-items: center; justify-content: center; gap: 7px; min-height: 42px; min-width: 0; padding: 8px; border: 1px solid #dfe8f2; border-radius: 9px; color: #718197; background: #f8fafc; font-size: .7rem; font-weight: 850; }
.purchase-conference-stepper span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.purchase-conference-stepper .is-done { color: #047966; background: #e8fbf7; }
.purchase-conference-stepper .is-active { color: #0f4aa2; border-color: #bfdbfe; background: #eff6ff; }
.purchase-conference-table input { min-width: 110px; }
.purchase-form-grid { display: grid; align-items: end; gap: 12px; grid-template-columns: repeat(12, minmax(0, 1fr)); }
.purchase-form-grid > div { grid-column: span 3; min-width: 0; }
.purchase-form-grid .span-3 { grid-column: span 3; }
.purchase-form-grid .span-4 { grid-column: span 4; }
.purchase-form-grid .span-5 { grid-column: span 5; }
.purchase-form-grid .span-12 { grid-column: 1 / -1; }
.purchase-preview-grid { display: grid; gap: 10px; margin-top: 14px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.purchase-preview-grid > div { min-width: 0; padding: 12px; border: 1px solid #dfe8f2; border-radius: 10px; background: linear-gradient(180deg, #fff, #f8fbff); }
.purchase-preview-grid span { display: block; color: var(--slate-500); font-size: .6rem; font-weight: 850; letter-spacing: .05em; text-transform: uppercase; }
.purchase-preview-grid strong { display: block; margin-top: 4px; overflow-wrap: anywhere; color: var(--slate-900); font-size: .88rem; font-weight: 850; }
.purchase-preview-grid small { display: block; margin-top: 3px; color: var(--slate-500); font-size: .66rem; line-height: 1.35; }
.purchase-receiving-summary { display: grid; gap: 10px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.purchase-receiving-summary > div { min-width: 0; padding: 12px; border: 1px solid #dfe8f2; border-left-width: 4px; border-radius: 10px; background: #fff; }
.purchase-receiving-summary > div:nth-child(1) { border-left-color: #2563eb; }
.purchase-receiving-summary > div:nth-child(2) { border-left-color: #64748b; }
.purchase-receiving-summary > div:nth-child(3) { border-left-color: #d97706; }
.purchase-receiving-summary.is-ok > div:nth-child(3) { border-left-color: #059669; background: #f0fdf4; }
.purchase-receiving-summary.is-warning > div:nth-child(3) { border-left-color: #dc2626; background: #fff8f8; }
.purchase-receiving-summary span { display: block; color: var(--slate-500); font-size: .6rem; font-weight: 850; letter-spacing: .05em; text-transform: uppercase; }
.purchase-receiving-summary strong { display: block; margin-top: 4px; color: var(--slate-900); font-size: 1rem; font-weight: 900; }
.purchase-receiving-summary small { display: block; margin-top: 3px; color: var(--slate-500); font-size: .66rem; line-height: 1.35; }
.purchase-premium-table { min-width: 1080px; }
.management-panel { border-color: rgba(208, 222, 239, .95); box-shadow: 0 12px 34px rgba(15,32,58,.055); }
.management-filter-grid { display: grid; align-items: end; gap: 12px; grid-template-columns: repeat(12, minmax(0, 1fr)); }
.management-filter-grid > div { grid-column: span 3; min-width: 0; }
.management-filter-grid .span-4 { grid-column: span 4; }
.management-filter-actions { display: flex; gap: 8px; }
.management-table { min-width: 980px; }
.management-table td strong { color: var(--slate-900); font-size: .82rem; font-weight: 850; }
.management-table td small { font-size: .67rem; line-height: 1.35; }
.management-badges { display: flex; gap: 5px; flex-wrap: wrap; }
.management-badges .badge { width: fit-content; }
.cash-inline-form { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.cash-inline-form .form-control { width: min(180px, 100%); min-height: 40px; }
.cash-inline-form .btn { min-height: 40px; gap: 6px; white-space: nowrap; }
.sales-history-card .table-responsive { border: 1px solid #e5ebf2; }
.insight-card { overflow: hidden; border-color: #dbe7f3; box-shadow: 0 16px 40px rgba(15,32,58,.07); }
.insight-heading { display: flex; align-items: center; gap: 11px; margin-bottom: 14px; }
.insight-heading > span { display: grid; width: 39px; height: 39px; flex: 0 0 39px; place-items: center; border-radius: 12px; color: #fff; background: linear-gradient(145deg, var(--blue-600), var(--teal-500)); box-shadow: 0 10px 22px rgba(20,99,255,.18); }
.insight-heading > span.danger { background: linear-gradient(145deg, #ef4444, #f59e0b); }
.insight-heading h2 { margin: 0; color: var(--slate-900); font-size: .9rem; font-weight: 850; letter-spacing: -.015em; }
.insight-heading p { margin: 2px 0 0; color: var(--slate-500); font-size: .68rem; }
.rank-list, .stock-watch-list { display: grid; gap: 10px; }
.rank-item { display: grid; align-items: center; gap: 9px; grid-template-columns: 28px minmax(0, 1fr) auto; }
.rank-item > b { display: grid; width: 25px; height: 25px; place-items: center; border-radius: 8px; color: var(--blue-600); background: var(--blue-100); font-size: .72rem; }
.rank-item strong, .stock-watch-list strong { display: block; overflow: hidden; color: var(--slate-900); font-size: .76rem; text-overflow: ellipsis; white-space: nowrap; }
.rank-item small, .stock-watch-list small { display: block; color: var(--slate-500); font-size: .63rem; }
.rank-item span { display: block; height: 5px; margin-top: 5px; overflow: hidden; border-radius: 999px; background: #edf2f7; }
.rank-item span::before { display: block; width: var(--bar, 0); height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--blue-600), var(--teal-500)); content: ""; }
.rank-item em { color: var(--slate-700); font-size: .7rem; font-style: normal; font-weight: 800; white-space: nowrap; }
.stock-watch-list > div { padding: 10px 11px; border: 1px solid #f3d0d5; border-radius: 10px; background: #fff8f9; }
.finance-snapshot { display: grid; gap: 8px; margin-bottom: 11px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.finance-snapshot > div { padding: 9px; border: 1px solid #e1e8f1; border-radius: 10px; background: #f8fafc; }
.finance-snapshot span { display: block; color: var(--slate-500); font-size: .58rem; font-weight: 850; letter-spacing: .05em; text-transform: uppercase; }
.finance-snapshot strong { display: block; margin-top: 3px; overflow-wrap: anywhere; font-size: .82rem; }
.mini-sale-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 9px 0; border-top: 1px solid #edf1f6; }
.mini-sale-row span { color: var(--slate-900); font-size: .72rem; font-weight: 800; }
.mini-sale-row small { display: block; margin-top: 2px; color: var(--slate-500); font-size: .62rem; font-weight: 600; }
.mini-sale-row strong { color: var(--teal-600); font-size: .74rem; white-space: nowrap; }
.sales-period-bars { display: grid; gap: 10px; }
.sales-period-bars > div { display: grid; align-items: center; gap: 8px; grid-template-columns: 42px minmax(0, 1fr) 92px 72px; color: var(--slate-600); font-size: .7rem; }
.sales-period-bars div div { height: 10px; overflow: hidden; border-radius: 999px; background: #edf2f7; }
.sales-period-bars i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--blue-600), var(--teal-500)); }
.sales-period-bars strong { color: var(--slate-900); font-size: .72rem; text-align: right; white-space: nowrap; }
.sales-period-bars small { color: var(--slate-500); font-size: .62rem; text-align: right; }
.abc-list, .alert-stack, .negative-margin-list { display: grid; gap: 9px; }
.abc-list > div { display: grid; align-items: center; gap: 8px; grid-template-columns: 30px minmax(0, 1fr) auto; }
.abc-list b { display: grid; width: 27px; height: 27px; place-items: center; border-radius: 8px; font-size: .72rem; }
.abc-A { color: #047966; background: #dff7f3; }
.abc-B { color: #9a5f00; background: #fff3cf; }
.abc-C { color: #64748b; background: #eef2f7; }
.abc-list strong, .negative-margin-list strong { display: block; overflow: hidden; color: var(--slate-900); font-size: .74rem; text-overflow: ellipsis; white-space: nowrap; }
.abc-list small, .negative-margin-list small { display: block; color: var(--slate-500); font-size: .62rem; }
.abc-list em { color: var(--slate-700); font-size: .7rem; font-style: normal; font-weight: 850; white-space: nowrap; }
.alert-line { padding: 10px 11px; border: 1px solid #dbe7f3; border-left-width: 4px; border-radius: 9px; background: #fff; }
.alert-line strong { display: block; color: var(--slate-900); font-size: .75rem; }
.alert-line span { display: block; margin-top: 3px; color: var(--slate-500); font-size: .66rem; }
.alert-line.is-danger { border-left-color: #ef4444; background: #fff8f9; }
.alert-line.is-warning { border-left-color: #f59e0b; background: #fffaf0; }
.alert-line.is-secondary { border-left-color: #64748b; background: #f8fafc; }
.negative-margin-list > div { padding: 10px 0; border-top: 1px solid #edf1f6; }
.negative-margin-list em { display: block; margin-top: 4px; color: #dc2626; font-size: .74rem; font-style: normal; font-weight: 850; }
.compact-empty { padding: 24px 12px; font-size: .74rem; }
.compact-empty i { display: block; margin-bottom: 6px; font-size: 1.4rem; }
.label-options { display: grid; gap: 5px 12px; grid-template-columns: repeat(2, minmax(0, 1fr)); color: #52647b; font-size: .72rem; font-weight: 700; }
.label-options label { display: inline-flex; align-items: center; gap: 6px; }
.labels-sheet { display: grid; gap: 10px; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); }
.labels-pequeno { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); }
.labels-grande { grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); }
.product-label { display: grid; width: 100%; aspect-ratio: 1 / 1; align-content: center; align-items: center; gap: 4px; padding: 10px 9px; overflow: hidden; border: 1px solid #b8c7da; border-radius: 8px; color: #111827; background: #fff; text-align: center; page-break-inside: avoid; print-color-adjust: exact; -webkit-print-color-adjust: exact; }
.product-label.is-grade-label {
    border-color: #2563eb;
    background: #f8fbff;
}
.product-label.is-piece-label {
    border-color: #cbd5e1;
}
.labels-pequeno .product-label { padding: 6px; }
.labels-grande .product-label { padding: 11px 10px; }
.label-head { display: flex; align-items: center; justify-content: center; gap: 7px; min-width: 0; width: 100%; padding: 0; }
.product-label strong,
.label-product-name { display: -webkit-box; max-width: 100%; overflow: hidden; color: #0f172a; font-size: 1.08rem; font-weight: 950; line-height: 1.02; text-transform: uppercase; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.labels-grande .product-label strong { font-size: 1.22rem; }
.product-label small { color: #334155; font-size: .62rem; line-height: 1.1; }
.product-label .label-store-name {
    display: block;
    max-width: 100%;
    overflow: hidden;
    color: #1f2937;
    font-size: .54rem;
    font-weight: 950;
    letter-spacing: 0;
    line-height: 1.05;
    text-overflow: ellipsis;
    text-transform: uppercase;
    white-space: nowrap;
}
.label-type-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 42px;
    padding: 2px 7px;
    border-radius: 999px;
    font-size: .55rem;
    font-weight: 900;
    line-height: 1.2;
}
.label-type-badge.is-grade {
    color: #ffffff;
    background: #2563eb;
}
.label-type-badge.is-piece {
    color: #334155;
    background: #e2e8f0;
}
.product-label .label-relation {
    display: block;
    max-width: 100%;
    overflow: hidden;
    color: #0f172a;
    font-size: .6rem;
    font-weight: 850;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.label-field-hidden {
    display: none !important;
}
.label-group-hidden {
    display: none !important;
}
.label-config-grid {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}
.label-config-text-field {
    margin-bottom: 12px;
}
.label-config-text-field .form-label {
    margin-bottom: 6px;
}
.label-config-grid label {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 40px;
    padding: 9px 10px;
    border: 1px solid #dbe7f3;
    border-radius: 8px;
    background: #f8fbff;
    color: var(--slate-800);
    font-size: .76rem;
    font-weight: 750;
}
.label-config-grid input {
    flex: 0 0 auto;
}
.label-price { color: #0f172a; font-size: .72rem; font-weight: 950; white-space: nowrap; }
.label-meta-grid { display: grid; align-content: center; gap: 2px 5px; grid-template-columns: 1fr 1fr; min-height: 0; min-width: 0; width: 100%; padding: 0; }
.label-meta-grid small { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: baseline; gap: 3px; min-width: 0; overflow: hidden; text-align: left; }
.label-meta-grid b { color: #64748b; font-size: .54rem; font-weight: 900; text-transform: uppercase; }
.label-meta-grid span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.label-barcode-block { display: grid; flex: 0 0 auto; justify-items: center; gap: 0; width: 100%; min-width: 0; margin-top: 0; }
.barcode-svg { width: 100%; max-width: 172px; height: 29px; }
.label-code { display: flex; max-width: 100%; align-items: baseline; justify-content: center; gap: 3px; overflow: visible; color: #0f172a; font-family: Consolas, "Courier New", monospace; font-size: .58rem; font-weight: 850; letter-spacing: 0; white-space: nowrap; }
.label-code b { color: #64748b; font-family: inherit; font-size: .82em; font-weight: 800; text-transform: uppercase; }
.label-code span { color: #0f172a; font: inherit; overflow-wrap: anywhere; }
.labeling-workspace {
    display: grid;
    align-items: start;
    gap: 16px;
    grid-template-columns: minmax(250px, 320px) minmax(0, 1fr);
}
.labeling-command-bar { align-items: flex-start; }
.labeling-command-bar .page-actions { justify-content: flex-end; }
.labeling-mode-panel {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 0 0 10px;
    padding: 8px;
    border: 1px solid #dbe7f3;
    border-radius: 8px;
    background: #fff;
}
.labeling-mode-panel > div {
    display: none;
    gap: 2px;
    min-width: 0;
}
.labeling-mode-panel span,
.labeling-mode-panel small {
    color: var(--slate-500);
    font-size: .68rem;
    font-weight: 750;
}
.labeling-mode-panel span {
    text-transform: uppercase;
}
.labeling-mode-panel strong {
    color: var(--slate-900);
    font-size: .96rem;
    font-weight: 700;
}
.labeling-mode-options {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    justify-content: flex-start;
    gap: 6px;
}
.labeling-mode-options a {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 34px;
    padding: 7px 10px;
    border: 1px solid #d8e4f0;
    border-radius: 8px;
    color: #334155;
    background: #fff;
    font-size: .75rem;
    font-weight: 650;
    text-decoration: none;
}
.labeling-mode-options a:hover {
    border-color: #9cc7ef;
    color: #15527a;
    background: #f5fbff;
}
.labeling-mode-options a.is-active {
    border-color: #9bd8ca;
    color: #0f5f46;
    background: #e8f7f2;
}
.labeling-sidebar {
    position: sticky;
    top: 86px;
    display: grid;
    gap: 12px;
}
.labeling-progress {
    padding: 14px;
    border: 1px solid #dbe7f3;
    border-radius: 10px;
    background: #fff;
}
.labeling-progress span {
    color: var(--slate-500);
    font-size: .68rem;
    font-weight: 800;
    text-transform: uppercase;
}
.labeling-progress strong {
    display: block;
    margin-top: 4px;
    color: var(--slate-900);
    font-size: 1rem;
}
.labeling-progress small {
    display: block;
    margin-top: 4px;
    color: var(--slate-500);
    font-size: .68rem;
    font-weight: 750;
}
.labeling-progress div {
    height: 8px;
    margin-top: 10px;
    overflow: hidden;
    border-radius: 999px;
    background: #e2e8f0;
}
.labeling-progress i {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #2563eb, #00a99d);
}
.labeling-grade-list {
    display: grid;
    gap: 8px;
}
.labeling-grade-link {
    display: grid;
    gap: 3px;
    padding: 11px 12px;
    border: 1px solid #dbe7f3;
    border-radius: 10px;
    color: inherit;
    background: #fff;
    text-decoration: none;
}
.labeling-grade-link:hover {
    border-color: #b9d2ff;
    background: #f8fbff;
}
.labeling-grade-link.is-active {
    border-color: #2563eb;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, .1);
}
.labeling-grade-link.is-done {
    border-color: #bbf7d0;
    background: #f0fdf4;
}
.labeling-grade-link.labeling-loose-link {
    border-style: dashed;
    background: #fbfdff;
}
.labeling-grade-link.labeling-loose-link.is-active {
    border-style: solid;
}
.labeling-grade-link span {
    color: #64748b;
    font-size: .62rem;
    font-weight: 900;
    text-transform: uppercase;
}
.labeling-grade-link.is-done span {
    color: #047857;
}
.labeling-grade-link strong {
    color: var(--slate-900);
    font-size: .78rem;
}
.labeling-grade-link small {
    color: var(--slate-500);
    font-size: .66rem;
    font-weight: 700;
}
.labeling-stage {
    min-width: 0;
}
.labeling-print-group {
    padding: 12px;
    border: 1px solid #dbe7f3;
    border-radius: 10px;
    background: #fff;
}
.labeling-empty {
    display: grid;
    min-height: 220px;
    place-items: center;
    align-content: center;
    gap: 8px;
    color: var(--slate-500);
    text-align: center;
}
.labeling-empty i {
    display: inline-grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 10px;
    color: #0f766e;
    background: #e8f7f2;
    font-size: 1.2rem;
}
.labeling-empty strong {
    color: var(--slate-900);
    font-size: .95rem;
}
.labeling-empty span {
    font-size: .76rem;
    font-weight: 650;
}

/* Login */
.login-page { min-height: 100vh; padding: 22px; background: #eaf0f7; }
.login-shell { display: grid; width: min(1040px, 100%); min-height: 620px; margin: 0 auto; overflow: hidden; border: 1px solid rgba(255,255,255,.7); border-radius: 24px; background: #fff; box-shadow: 0 28px 70px rgba(15, 32, 58, .16); grid-template-columns: 1.08fr .92fr; }
.login-showcase { position: relative; display: flex; flex-direction: column; justify-content: space-between; padding: 46px; overflow: hidden; color: #fff; background: linear-gradient(145deg, #061524, #123d61); }
.login-showcase::before, .login-showcase::after { position: absolute; border: 1px solid rgba(255,255,255,.08); border-radius: 50%; content: ""; }
.login-showcase::before { top: -160px; right: -130px; width: 430px; height: 430px; }
.login-showcase::after { right: -70px; bottom: -140px; width: 330px; height: 330px; border-width: 60px; }
.login-brand { position: relative; z-index: 1; display: flex; align-items: center; gap: 12px; }
.login-brand-logo {
    width: 238px;
    height: 96px;
    flex: 0 0 238px;
    object-fit: contain;
    filter: drop-shadow(0 22px 30px rgba(0,0,0,.28));
}
.login-pitch { position: relative; z-index: 1; max-width: 430px; }
.login-pitch h1 { margin: 0 0 14px; font-size: clamp(2rem, 4vw, 2.7rem); font-weight: 780; letter-spacing: -.045em; line-height: 1.08; }
.login-pitch p { margin: 0 0 28px; color: #b7c9dd; line-height: 1.7; }
.login-features { display: grid; gap: 13px; }
.login-feature { display: flex; align-items: center; gap: 10px; color: #dce9f7; font-size: .82rem; }
.login-feature i { display: grid; width: 29px; height: 29px; place-items: center; border-radius: 8px; color: #9dccff; background: rgba(255,255,255,.09); }
.login-form-panel { display: flex; align-items: center; padding: 55px; }
.login-form-wrap { width: 100%; }
.login-form-wrap h2 { margin-bottom: 7px; font-size: 1.55rem; font-weight: 760; letter-spacing: -.03em; }
.login-form-wrap > p { margin-bottom: 28px; color: var(--slate-500); font-size: .83rem; }
.login-input { position: relative; }
.login-input > i { position: absolute; top: 50%; left: 14px; z-index: 3; color: #8e9bad; transform: translateY(-50%); }
.login-input .form-control { height: 48px; padding-left: 42px; }
.login-input .password-toggle { position: absolute; top: 50%; right: 8px; z-index: 4; display: grid; width: 34px; height: 34px; place-items: center; border: 0; color: #7d899a; background: transparent; transform: translateY(-50%); }
.login-submit { min-height: 48px; }
.login-security { display: flex; align-items: center; justify-content: center; gap: 6px; margin-top: 22px; color: #98a4b4; font-size: .68rem; }
.login-security a { color: inherit; font-weight: 800; text-decoration: none; }
.login-security a:hover { color: var(--blue-600); }
.master-login-page { background: #eaf0f7; }
.master-login-shell { border-color: rgba(11, 31, 58, .12); }
.master-login-showcase { background: linear-gradient(145deg, #061524, #123d61); }
@media (max-width: 1199.98px) {
    .dashboard-hero { align-items: flex-start; grid-template-columns: 1fr; }
    .dashboard-hero-main { width: 100%; }
    .dashboard-hero-status { width: 100%; max-width: none; }
    .dashboard-quick-actions { justify-content: flex-start; }
    .dashboard-quick-actions { width: 100%; max-width: none; flex-direction: row; }
    .settings-hero { grid-template-columns: 1fr; }
    .operation-hero { align-items: flex-start; flex-direction: column; }
    .operation-summary-grid { width: 100%; }
    .deposit-usage-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .checkout-card { position: static; }
    .grade-margin-summary { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .stock-kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.stock-grade-dashboard { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .stock-grade-form-grid .span-2,
    .stock-grade-form-grid .span-3,
    .stock-grade-form-grid .span-4,
    .stock-grade-form-grid .span-5,
    .stock-grade-form-grid .span-6 { grid-column: span 6; }
    .stock-grade-tools { justify-content: flex-start; width: 100%; }
}
@media (max-width: 991.98px) {
    .sidebar { transform: translateX(-100%); }
    .sidebar.open { transform: none; }
    .sidebar-overlay.show { position: fixed; inset: 0; z-index: 1030; display: block; background: rgba(7, 20, 38, .58); backdrop-filter: blur(2px); }
    .main-content { margin-left: 0; }
    .content-wrap { padding: 20px 18px; }
    .topbar { min-height: 72px; align-items: flex-start !important; gap: 12px; padding: 10px 18px; }
    .topbar > .d-flex:first-child { min-width: 0; flex: 1 1 auto; }
    .topbar-actions { flex: 0 0 auto; }
    .topbar-date { display: none; }
    .login-page { display: block; padding: 0; background: #fff; }
    .login-shell { min-height: 100vh; border: 0; border-radius: 0; box-shadow: none; grid-template-columns: 1fr; }
    .login-brand-logo { width: 198px; height: 82px; flex-basis: 198px; }
    .login-showcase { min-height: 270px; padding: 28px; }
    .login-pitch h1 { margin-top: 28px; font-size: 2rem; }
    .login-pitch p { margin-bottom: 0; }
    .login-features { display: none; }
    .login-form-panel { padding: 38px 28px; }
    .print-config-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .print-config-title { grid-column: 1 / -1; }
    .labeling-mode-panel { align-items: stretch; flex-direction: column; }
    .labeling-mode-options { justify-content: flex-start; }
    .cash-inline-form .form-control, .cash-inline-form .btn { width: 100%; }
.stock-grade-section-head,
.stock-grade-selection-summary { align-items: stretch; flex-direction: column; }
    .stock-grade-tools { flex-direction: column; align-items: stretch; }
    .stock-grade-search { width: 100%; }
    .stock-grade-camera-panel { grid-template-columns: 1fr; }
    .stock-grade-camera-panel .btn { width: 100%; }
}
@media (max-width: 575.98px) {
    .login-brand { align-items: flex-start; flex-direction: column; gap: 10px; }
    .login-brand-logo { width: 190px; height: 78px; flex-basis: auto; }
    .topbar-title { max-width: 195px; overflow: hidden; font-size: 1.05rem; text-overflow: ellipsis; white-space: nowrap; }
    .topbar-kicker { font-size: .66rem; }
    .user-menu-copy, .user-menu > .bi-chevron-down { display: none; }
    .content-wrap { padding: 16px 12px; }
    .card-body { padding: 1.05rem; }
    .app-footer { padding: 10px 14px 18px; }
    .dashboard-hero { padding: 20px; border-radius: 15px; }
    .daily-action-board { padding: .8rem; }
    .daily-action-heading { align-items: stretch; flex-direction: column; }
    .daily-action-heading .btn { width: 100%; }
    .daily-action-card { min-height: 0; }
    .daily-action-list > div { grid-template-columns: 1fr; }
    .daily-action-list em { white-space: normal; }
    .dashboard-hero-status { grid-template-columns: 1fr; }
    .dashboard-quick-actions { width: 100%; }
    .dashboard-quick-actions .btn { flex: 1 1 auto; }
    .inner-operation-tabs { width: 100%; }
    .inner-operation-tabs .nav-item { flex: 1 0 auto; }
    .inner-operation-tabs .nav-link { justify-content: center; width: 100%; }
.stock-grade-dashboard,
.stock-grade-form-grid { grid-template-columns: 1fr; }
    .stock-grade-form-grid .span-2,
    .stock-grade-form-grid .span-3,
    .stock-grade-form-grid .span-4,
    .stock-grade-form-grid .span-5,
    .stock-grade-form-grid .span-6,
    .stock-grade-form-grid .span-12 { grid-column: 1 / -1; }
    .stock-grade-scan-panel {
        grid-template-columns: auto minmax(0, 1fr) auto auto;
        gap: 7px;
        padding: 8px;
    }
    .label-config-grid { grid-template-columns: 1fr; }
    .stock-grade-piece-table { min-width: 760px; }
    .deposit-rule-strip,
    .deposit-usage-grid { grid-template-columns: 1fr; }
    .page-actions { width: 100%; overflow-x: auto; flex-wrap: nowrap; padding-bottom: 4px; }
    .page-actions .btn { white-space: nowrap; }
    .login-showcase { min-height: 235px; }
    .login-form-panel { padding: 30px 22px; }
}
@media (max-width: 899.98px) {
    .labeling-workspace { grid-template-columns: 1fr; }
    .labeling-sidebar { position: static; }
}
@media print {
    .sidebar, .topbar, .app-footer, .no-print { display: none !important; }
    .main-content { margin: 0; }
    .content-wrap { padding: 0; }
    body { background: #fff; }
    body.label-print-page { width: 50mm; margin: 0; padding: 0; }
    body.label-print-page .main-content { width: 50mm; margin: 0; padding: 0; }
    body.label-print-page .content-wrap { width: 50mm; margin: 0; padding: 0; }
    .card { border: 0; box-shadow: none; }
    body.label-print-page .labels-sheet { display: block; width: 50mm; margin: 0; padding: 0; }
    body.label-print-page .labeling-workspace,
    body.label-print-page .labeling-stage { display: block; }
    body.label-print-page .labeling-print-group { padding: 0; border: 0; border-radius: 0; }
    body.label-print-page .product-label { width: 50mm !important; height: 50mm !important; min-height: 0; margin: 0; aspect-ratio: auto; align-content: center; gap: .65mm; padding: 2mm; border: 1px solid #d1d5db; border-radius: 2mm; box-shadow: none; break-after: page; page-break-after: always; print-color-adjust: exact; -webkit-print-color-adjust: exact; }
    body.label-print-page .product-label:last-child { break-after: auto; page-break-after: auto; }
    .product-label.is-grade-label { border-color: #2563eb; border-width: 1.4px; }
    .product-label strong,
    .label-product-name { font-size: 11pt; line-height: 1; }
    .product-label small { font-size: 5.4pt; }
    .product-label .label-store-name { font-size: 5pt; }
    .label-head { padding: 0; }
    .label-type-badge { font-size: 5.5pt; padding: 1pt 5pt; }
    .label-price { font-size: 6.9pt; padding: 0; }
    .label-meta-grid { gap: .35mm 1mm; padding: 0; }
    .label-meta-grid b { font-size: 4.7pt; }
    .label-barcode-block { margin-top: 0; }
    .barcode-svg { height: 7.5mm; }
    .label-code { font-size: 6.2pt; }
}

/* Enterprise shell */

.content-wrap > .row,
.content-wrap > .card,
.content-wrap > form,
.content-wrap > .alert,
.content-wrap > .dashboard-hero,
.content-wrap > .daily-action-board,
.content-wrap > .d-flex { animation: contentEnter .24s ease both; }
@keyframes contentEnter { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }

.card-titlebar,
.table-toolbar,
.form-toolbar,
.responsive-toolbar { display: flex; min-width: 0; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 16px; }
.table-toolbar > *,
.form-toolbar > *,
.responsive-toolbar > * { min-width: 0; }
.toolbar-copy h2, .toolbar-copy h3 { margin: 0; color: var(--slate-900); font-size: .9rem; font-weight: 800; letter-spacing: -.015em; }
.toolbar-copy p { margin: 3px 0 0; color: var(--slate-500); font-size: .7rem; }
.action-cell { width: 1%; white-space: nowrap; }
.action-cell form { display: inline-flex; margin-left: 5px; vertical-align: middle; }
.action-cell .btn { width: auto; min-width: 36px; margin: 2px 0; padding-right: .72rem; padding-left: .72rem; white-space: nowrap; vertical-align: middle; }
.action-cell .btn + .btn,
.action-cell .btn + form { margin-left: 5px; }
.action-cell .btn.btn-icon-only { display: inline-grid; width: 34px; min-width: 34px; padding: 0; place-items: center; }
.record-count { display: inline-flex; align-items: center; gap: 5px; padding: 5px 8px; border-radius: 7px; color: #5b6c83; background: #edf2f7; font-size: .67rem; font-weight: 700; }
.form-section-title { display: flex; align-items: center; gap: 9px; margin: 0 0 16px; color: var(--slate-900); font-size: .88rem; font-weight: 800; }
.form-section-title i { display: grid; width: 30px; height: 30px; place-items: center; border-radius: 8px; color: var(--blue-600); background: var(--blue-100); }
.form-actions { display: flex; justify-content: flex-end; gap: 8px; padding-top: 14px; border-top: 1px solid #edf1f6; }
.data-card { overflow: hidden; }
.data-card > .card-body { padding-bottom: .8rem; }
.data-card > .table-responsive, .data-card > .card-body > .table-responsive { border: 1px solid #e5ebf2; }
.data-card .table thead { position: sticky; top: 0; z-index: 2; }
.data-card .table tbody tr:nth-child(even) { background: rgba(248, 250, 252, .52); }
.metric-strip { display: grid; gap: 12px; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.metric-mini { padding: 14px 16px; border: 1px solid #e1e8f1; border-radius: 12px; background: #fff; }
.metric-mini span { color: var(--slate-500); font-size: .67rem; font-weight: 700; text-transform: uppercase; }
.metric-mini strong { display: block; margin-top: 5px; font-size: 1.15rem; font-weight: 800; }
.status-dot { display: inline-block; width: 7px; height: 7px; margin-right: 5px; border-radius: 50%; background: currentColor; }

.btn-success { border-color: var(--teal-600); background: linear-gradient(180deg, #00a99d, #008c82); box-shadow: 0 7px 16px rgba(0, 140, 130, .16); }
.btn-success:hover, .btn-success:focus { border-color: #00776f; background: #00776f; }
.text-success { color: var(--teal-600) !important; }
.bg-success-subtle { background-color: #dff7f3 !important; }
.text-bg-success { background-color: var(--teal-600) !important; }
.dropdown-menu { padding: 7px; border-radius: 11px; }
.dropdown-item { padding: 8px 10px; border-radius: 7px; font-size: .78rem; font-weight: 600; }
.clickable-row { cursor: pointer; }
.clickable-row:hover { box-shadow: inset 3px 0 0 var(--blue-500); }
.is-submitting { cursor: wait; opacity: .82; pointer-events: none; }
.interaction-progress { position: fixed; top: 0; left: 0; z-index: 2000; width: 0; height: 3px; opacity: 0; background: linear-gradient(90deg, var(--blue-500), var(--teal-500)); box-shadow: 0 0 10px rgba(40,120,255,.45); transition: width .25s ease, opacity .2s; }
.interaction-progress.active { width: 78%; opacity: 1; }
.interaction-progress.complete { width: 100%; opacity: 0; }
.toast-container { z-index: 2000; }
.app-toast { overflow: hidden; border: 1px solid #e0e7f0; border-radius: 12px; background: #fff; box-shadow: 0 14px 38px rgba(15,32,58,.17); }
.app-toast .toast-body { display: flex; align-items: center; gap: 10px; padding: 12px 14px; color: #34465f; font-size: .76rem; font-weight: 650; }
.toast-icon { display: grid; width: 31px; height: 31px; flex: 0 0 31px; place-items: center; border-radius: 8px; }
.command-modal .modal-content { overflow: hidden; border: 1px solid #dfe7f0; border-radius: 16px; box-shadow: 0 24px 70px rgba(6,21,36,.25); }
.command-search { position: relative; border-bottom: 1px solid #e7edf4; }
.command-search > i { position: absolute; top: 50%; left: 18px; color: #7c8b9e; font-size: 1.05rem; transform: translateY(-50%); }
.command-search input { width: 100%; height: 58px; padding: 0 48px; border: 0; outline: 0; color: var(--slate-900); background: #fff; font-size: .9rem; font-weight: 600; }
.command-search kbd { position: absolute; top: 50%; right: 15px; padding: 3px 7px; border: 1px solid #d9e1ea; border-radius: 5px; color: #8090a3; background: #f6f8fa; font-family: inherit; font-size: .6rem; transform: translateY(-50%); }
.command-list { max-height: min(440px, 62vh); padding: 9px; overflow-y: auto; }
.command-group-title { padding: 8px 10px 5px; color: #8a98aa; font-size: .6rem; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.command-item { display: flex; align-items: center; gap: 11px; padding: 10px; border-radius: 9px; color: #34465f; text-decoration: none; transition: .13s; }
.command-item:hover, .command-item.active { color: #123e78; background: #eef5ff; }
.command-item > i { display: grid; width: 32px; height: 32px; flex: 0 0 32px; place-items: center; border-radius: 8px; color: var(--blue-600); background: #e5efff; }
.command-item strong { display: block; font-size: .76rem; }
.command-item small { display: block; margin-top: 2px; color: #8492a4; font-size: .63rem; }
.command-empty { padding: 32px; color: #8795a7; text-align: center; }
.unsaved-indicator { display: inline-flex; align-items: center; gap: 5px; margin-left: 7px; color: #d97706; font-size: .62rem; font-weight: 700; }
.pagination { --bs-pagination-border-radius: 8px; }

@media (min-width: 1600px) {
    .content-wrap { padding: 30px 36px; }
    .topbar { padding-right: 36px; padding-left: 36px; }
    .app-footer { padding-right: 36px; padding-left: 36px; }
    .card-body { padding: 1.4rem; }
}

@media (max-width: 991.98px) {
    body.sidebar-collapsed .sidebar { width: var(--sidebar-width); padding-right: 16px; padding-left: 16px; }
    body.sidebar-collapsed .main-content { margin-left: 0; }
    body.sidebar-collapsed .brand { justify-content: flex-start; padding-right: 7px; padding-left: 7px; }
    body.sidebar-collapsed .brand-logo { display: block; width: min(224px, 100%); height: 90px; flex-basis: auto; object-fit: contain; }
    body.sidebar-collapsed .brand-logo-symbol { display: none; }
    body.sidebar-collapsed .brand > span:last-child,
    body.sidebar-collapsed .sidebar .nav-link > span:not(.workflow-step),
    body.sidebar-collapsed .nav-label,
    body.sidebar-collapsed .sidebar-user-copy { display: initial; }
    body.sidebar-collapsed .workflow-step { display: grid; }
    body.sidebar-collapsed .nav-counter { display: inline-block; }
    body.sidebar-collapsed .sidebar .nav-link { justify-content: flex-start; gap: 11px; padding-right: 11px; padding-left: 11px; }
    body.sidebar-collapsed .sidebar .nav-link i { width: 20px; font-size: 1.06rem; }
    body.sidebar-collapsed .sidebar-user { justify-content: flex-start; padding-right: 10px; padding-left: 10px; }
    body.sidebar-collapsed .sidebar-avatar { display: grid; }
    .metric-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .table-toolbar, .card-titlebar, .form-toolbar, .responsive-toolbar { align-items: stretch; flex-direction: column; }
    .table-toolbar .search-box,
    .responsive-toolbar .search-box,
    .form-toolbar .search-box { width: 100%; max-width: none !important; }
}

@media (max-width: 767.98px) {
    .quick-command { width: 38px; justify-content: center; padding: 0; }
    .quick-command span, .quick-command kbd { display: none; }
    .responsive-cards { border-collapse: separate; border-spacing: 0 10px; }
    .responsive-cards thead { display: none; }
    .responsive-cards tbody, .responsive-cards tr, .responsive-cards td { display: block; width: 100%; }
    .responsive-cards tbody tr { overflow: hidden; border: 1px solid #dfe7f0; border-radius: 12px; background: #fff !important; box-shadow: 0 3px 10px rgba(15,32,58,.045); }
    .responsive-cards tbody td { display: flex; min-height: 42px; align-items: center; justify-content: space-between; gap: 14px; padding: .65rem .8rem; border-bottom: 1px solid #edf1f6; text-align: right !important; white-space: normal; }
    .responsive-cards tbody td::before { flex: 0 0 38%; color: #77869a; content: attr(data-label); font-size: .64rem; font-weight: 800; letter-spacing: .045em; text-align: left; text-transform: uppercase; }
    .responsive-cards tbody td:last-child { justify-content: flex-end; border-bottom: 0; background: #f8fafc; }
    .responsive-cards tbody td.action-cell,
    .responsive-cards tbody td:last-child { flex-wrap: wrap; gap: 8px; white-space: normal; }
    .responsive-cards tbody td.action-cell .btn:not(.btn-icon-only),
    .responsive-cards tbody td:last-child .btn:not(.btn-icon-only) { flex: 1 1 150px; max-width: 100%; }
    .responsive-cards tbody td:last-child::before { display: none; }
    .responsive-cards tbody td > small { text-align: right; }
    .responsive-cards tbody td form { display: inline-block; }
    .responsive-cards tfoot { display: block; }
    .responsive-cards tfoot tr { display: flex; align-items: center; justify-content: flex-end; }
    .responsive-cards tfoot th { display: block; border: 0; }
    .order-item { margin-bottom: 12px !important; padding: 14px 10px; border: 1px solid #e0e7f0; border-radius: 12px; background: #f9fbfd; }
    .order-item > [class*="col-"] { min-width: 0; }
    .order-item .btn { width: 100%; }
    .order-item .item-total,
    .order-item .pdv-item-total { width: 100%; min-width: 0; padding-top: 6px; text-align: right !important; }
    .form-actions { position: sticky; right: 0; bottom: 0; left: 0; z-index: 5; flex-wrap: wrap; margin: 14px -1.05rem -1.05rem; padding: 12px 1.05rem; background: rgba(255,255,255,.96); box-shadow: 0 -5px 16px rgba(15,32,58,.07); backdrop-filter: blur(8px); }
    .form-actions .btn { flex: 1 1 180px; }
    .operation-summary-grid,
    .stock-kpi-grid { grid-template-columns: 1fr; }
    .operation-tabs { overflow-x: auto; flex-wrap: nowrap; padding-bottom: 8px; }
    .operation-tabs .nav-item { flex: 0 0 auto; }
    .operation-tabs .nav-link { white-space: nowrap; }
    .grade-margin-summary { grid-template-columns: 1fr; }
    .barcode-reader-field { flex-direction: column; }
    .barcode-reader-field > i { top: 25px; }
    .label-options { grid-template-columns: 1fr; }
    .finance-snapshot { grid-template-columns: 1fr; }
}

@media (max-width: 575.98px) {
    .metric-strip { grid-template-columns: 1fr; }
    .topbar { padding-right: 12px; padding-left: 12px; }
    .topbar-actions { gap: 6px; }
    .shell-toggle { width: 37px; height: 37px; flex-basis: 37px; }
    .content-wrap { padding: 14px 10px; }
    .card { border-radius: 12px; }
    .btn:not(.btn-sm) { min-height: 42px; }
    .login-showcase { min-height: auto; padding: 24px 22px; }
    .login-pitch h1 { margin-top: 20px; font-size: 1.58rem; line-height: 1.14; }
    .login-pitch p { font-size: .78rem; line-height: 1.55; }
    .d-flex.justify-content-between.mb-3:has(> .search-box) { align-items: stretch !important; flex-direction: column; }
    .d-flex.justify-content-between.mb-3:has(> .search-box) .search-box { width: 100%; max-width: none !important; }
    .responsive-toolbar .btn,
    .table-toolbar .btn,
    .form-toolbar .btn { width: 100%; }
    .page-actions { overflow-x: auto; flex-wrap: nowrap; padding-bottom: 5px; scrollbar-width: thin; }
    .page-actions .btn { flex: 0 0 auto; white-space: nowrap; }
    .app-footer { align-items: flex-start; flex-direction: column; gap: 3px; }
}

/* Shipping workflow */
.shipping-hero {
    display: grid;
    align-items: stretch;
    gap: 16px;
    margin-bottom: 14px;
    padding: 18px;
    border: 1px solid #d9e4ef;
    border-radius: 10px;
    color: #fff;
    background: linear-gradient(135deg, #09213b, #0f766e);
    box-shadow: 0 16px 40px rgba(9, 33, 59, .14);
    grid-template-columns: minmax(0, 1fr) minmax(460px, .95fr);
}
.shipping-hero h2 { margin: 6px 0 6px; font-size: 1.45rem; font-weight: 850; letter-spacing: 0; }
.shipping-hero p { max-width: 680px; margin: 0; color: #cfe2ef; }
.shipping-kpis { display: grid; gap: 10px; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.shipping-hero .shipping-kpi { position: relative; min-width: 0; min-height: 96px; padding: 14px 15px; border: 1px solid rgba(255,255,255,.62); border-radius: 8px; color: #0f2137; background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(235,245,255,.94)); text-decoration: none; box-shadow: 0 12px 26px rgba(3, 11, 24, .18); transition: transform .16s, border-color .16s, box-shadow .16s, background .16s; }
.shipping-hero .shipping-kpi:hover,
.shipping-hero .shipping-kpi:focus { border-color: #fff; color: #071827; background: #fff; box-shadow: 0 16px 34px rgba(3, 11, 24, .26); transform: translateY(-1px); }
.shipping-hero .shipping-kpi.is-active { border-color: #7dd3fc; background: linear-gradient(180deg, #e0f2fe, #fff); box-shadow: 0 0 0 3px rgba(14, 165, 233, .2), 0 16px 34px rgba(3, 11, 24, .24); }
.shipping-hero .shipping-kpi.is-active::after { position: absolute; right: 12px; bottom: 10px; width: 8px; height: 8px; border-radius: 999px; background: #0ea5e9; content: ""; }
.shipping-hero .shipping-kpi span { display: block; color: #38546f; font-size: .68rem; font-weight: 900; letter-spacing: .045em; line-height: 1.25; text-transform: uppercase; }
.shipping-hero .shipping-kpi strong { display: block; margin-top: 10px; color: #071827; font-size: 1.8rem; font-weight: 900; line-height: 1; }
.shipping-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.shipping-toolbar .form-control { width: min(380px, 100%); }
.shipping-board { display: grid; gap: 12px; grid-template-columns: repeat(auto-fill, minmax(310px, 1fr)); }
.shipping-card { display: grid; gap: 12px; padding: 13px; border: 1px solid #dfe8f2; border-radius: 10px; background: #fff; box-shadow: 0 10px 26px rgba(15,32,58,.045); }
.shipping-card-main { display: flex; justify-content: space-between; gap: 12px; }
.shipping-card h3 { margin: 8px 0 3px; font-size: 1rem; font-weight: 850; }
.shipping-card p { margin: 0; color: var(--slate-900); font-weight: 750; }
.shipping-card small { color: var(--slate-500); }
.shipping-card-total { text-align: right; white-space: nowrap; }
.shipping-card-total span { display: block; color: var(--slate-500); font-size: .62rem; font-weight: 850; text-transform: uppercase; }
.shipping-card-total strong { display: block; margin-top: 4px; color: var(--slate-900); }
.shipping-progress > div:first-child { display: flex; justify-content: space-between; color: #617289; font-size: .68rem; font-weight: 850; }
.shipping-progress-bar, .shipping-row-progress { height: 8px; overflow: hidden; border-radius: 999px; background: #edf2f7; }
.shipping-progress-bar span, .shipping-row-progress span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--blue-600), var(--teal-500)); }
.shipping-progress small { display: block; margin-top: 6px; color: var(--slate-500); font-size: .67rem; }
.shipping-timeline { display: grid; gap: 6px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.shipping-timeline > div { display: flex; min-width: 0; align-items: center; gap: 6px; padding: 7px; border-radius: 8px; color: #7a8ba0; background: #f5f8fc; font-size: .68rem; font-weight: 750; }
.shipping-timeline .done { color: #047966; background: #e8fbf7; }
.shipping-timeline span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.shipping-card-actions { display: flex; justify-content: flex-end; gap: 7px; }
.shipping-process-actions { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 12px; }
.shipping-process-actions > div { display: flex; align-items: center; gap: 8px; }
.shipping-process-hero { display: grid; align-items: stretch; gap: 14px; margin-bottom: 12px; padding: 16px; border: 1px solid #d9e4ef; border-radius: 10px; color: #fff; background: linear-gradient(135deg, #09213b, #0f766e); box-shadow: 0 14px 34px rgba(9,33,59,.13); grid-template-columns: minmax(0, 1fr) minmax(420px, .9fr); }
.shipping-process-hero h2 { margin: 6px 0 5px; font-size: 1.35rem; font-weight: 850; }
.shipping-process-hero p { margin: 0; color: #cfe2ef; }
.shipping-process-metrics { display: grid; gap: 8px; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.shipping-process-metrics > div { padding: 10px; border: 1px solid rgba(255,255,255,.14); border-radius: 8px; background: rgba(255,255,255,.1); }
.shipping-process-metrics span, .shipping-summary-lines span { display: block; color: #8ca0b7; font-size: .58rem; font-weight: 850; letter-spacing: .06em; text-transform: uppercase; }
.shipping-process-metrics span { color: #bcd5e8; }
.shipping-process-metrics strong { display: block; margin-top: 5px; color: #fff; font-size: .95rem; overflow-wrap: anywhere; }
.shipping-process-metrics .is-danger { border-color: rgba(248, 113, 113, .45); background: rgba(220, 38, 38, .22); }
.shipping-stepper { display: grid; position: relative; gap: 8px; margin-bottom: 12px; padding: 10px; border: 1px solid #dfe8f2; border-radius: 10px; background: #fff; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.shipping-stepper > div { display: flex; align-items: center; justify-content: center; gap: 7px; min-height: 38px; border-radius: 8px; color: #718197; background: #f8fafc; font-size: .72rem; font-weight: 850; }
.shipping-stepper .is-done { color: #047966; background: #e8fbf7; }
.shipping-start-panel, .shipping-finished-panel { display: flex; align-items: center; gap: 16px; padding: 26px; border: 1px solid #dfe8f2; border-radius: 10px; background: #fff; box-shadow: 0 12px 30px rgba(15,32,58,.055); }
.shipping-start-panel { flex-direction: column; justify-content: center; min-height: 300px; text-align: center; }
.shipping-start-panel > i { color: var(--blue-600); font-size: 2.5rem; }
.shipping-start-panel h2, .shipping-finished-panel h2 { margin: 0; font-size: 1.1rem; font-weight: 850; }
.shipping-start-panel p, .shipping-finished-panel p { margin: 5px 0 0; color: var(--slate-500); }
.shipping-workspace { display: grid; align-items: start; gap: 14px; grid-template-columns: minmax(0, 1fr) minmax(300px, 340px); }
.shipping-pick-main { display: grid; gap: 12px; min-width: 0; }
.shipping-scan-panel { display: grid; align-items: center; gap: 8px 12px; padding: 12px; border: 1px solid #cfe0f4; border-radius: 10px; background: #fff; box-shadow: 0 10px 26px rgba(15,32,58,.045); grid-template-columns: minmax(180px, .45fr) minmax(280px, 1fr); }
.shipping-scan-panel span { display: inline-flex; align-items: center; gap: 7px; color: #047966; font-size: .65rem; font-weight: 850; letter-spacing: .06em; text-transform: uppercase; }
.shipping-scan-panel strong { display: block; margin-top: 4px; color: var(--slate-900); font-size: .78rem; }
.shipping-scan-panel small { grid-column: 2; color: var(--slate-500); font-size: .7rem; font-weight: 750; }
.shipping-scan-panel small.is-success { color: #047966; }
.shipping-scan-panel small.is-danger { color: #b42334; }
.shipping-scan-panel small.is-warning { color: #9a5f00; }
.shipping-scan-field { position: relative; display: flex; gap: 8px; }
.shipping-scan-field > i { position: absolute; top: 50%; left: 13px; z-index: 2; color: var(--teal-600); transform: translateY(-50%); }
.shipping-scan-field .form-control { min-height: 50px; padding-left: 38px; border-radius: 8px; font-size: 1rem; font-weight: 800; }
.shipping-scan-field .btn { width: 54px; min-height: 50px; border-radius: 8px; }
.shipping-pick-list { display: grid; gap: 9px; }
.shipping-pick-item { display: grid; align-items: center; gap: 9px; padding: 10px; border: 1px solid #dfe8f2; border-radius: 10px; background: #fff; box-shadow: 0 8px 20px rgba(15,32,58,.035); grid-template-columns: minmax(230px, 1fr) minmax(250px, .9fr) minmax(260px, .8fr); }
.shipping-pick-item.is-complete { border-color: #b8e6dc; background: #fbfffe; }
.shipping-pick-item.has-shortage { border-color: #fecaca; }
.shipping-pick-item.just-scanned { box-shadow: 0 0 0 3px rgba(0, 140, 130, .13), 0 12px 28px rgba(0,140,130,.12); }
.shipping-pick-product { min-width: 0; }
.shipping-pick-product code { display: inline-block; margin-bottom: 5px; }
.shipping-pick-product strong { display: block; overflow: hidden; color: var(--slate-900); font-size: .85rem; text-overflow: ellipsis; white-space: nowrap; }
.shipping-pick-product span { display: block; margin-top: 3px; color: var(--slate-500); font-size: .68rem; }
.shipping-pick-numbers { display: grid; gap: 7px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.shipping-pick-numbers > div, .shipping-summary-lines > div { padding: 8px; border: 1px solid #e0e9f4; border-radius: 8px; background: #f8fafc; }
.shipping-pick-numbers span { display: block; color: #718197; font-size: .56rem; font-weight: 850; letter-spacing: .05em; text-transform: uppercase; }
.shipping-pick-numbers strong { display: block; margin-top: 3px; color: var(--slate-900); font-size: .75rem; overflow-wrap: anywhere; }
.shipping-pick-numbers .is-danger { border-color: #fecaca; background: #fff7f7; }
.shipping-pick-numbers .is-danger strong { color: #b91c1c; }
.shipping-row-progress { grid-column: 1 / -1; height: 6px; }
.shipping-pick-input { display: grid; gap: 6px; grid-template-columns: 34px minmax(76px, 1fr) 34px auto; }
.shipping-pick-input .btn { min-height: 38px; padding: .4rem .65rem; border-radius: 8px; }
.shipping-pick-input .shipping-step-minus, .shipping-pick-input .shipping-step-plus { padding: 0; }
.shipping-pick-input .form-control { min-height: 38px; text-align: center; font-weight: 850; }
.shipping-pick-summary, .shipping-dispatch-card { position: sticky; top: 92px; display: grid; gap: 12px; padding: 13px; border: 1px solid #dfe8f2; border-radius: 10px; background: #fff; box-shadow: 0 12px 30px rgba(15,32,58,.055); }
.shipping-progress-ring { display: grid; min-height: 132px; place-items: center; align-content: center; border-radius: 10px; color: #fff; background: linear-gradient(135deg, #09213b, #0f766e); }
.shipping-progress-ring strong { display: block; font-size: 2rem; line-height: 1; }
.shipping-progress-ring span { margin-top: 5px; color: #cfe2ef; font-size: .7rem; font-weight: 850; text-transform: uppercase; }
.shipping-summary-lines { display: grid; gap: 8px; grid-template-columns: 1fr 1fr; }
.shipping-summary-lines strong { display: block; margin-top: 4px; color: var(--slate-900); font-size: .86rem; }
.shipping-summary-lines .is-danger { border-color: #fecaca; background: #fff7f7; }
.shipping-summary-actions { display: grid; gap: 8px; }
.shipping-confirmed-list { display: grid; gap: 8px; }
.shipping-confirmed-list > div { display: grid; align-items: center; gap: 10px; padding: 10px; border: 1px solid #e1eaf3; border-radius: 8px; background: #f8fafc; grid-template-columns: minmax(0, 1fr) auto 22px; }
.shipping-confirmed-list span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.shipping-confirmed-list strong { color: var(--slate-900); font-size: .8rem; white-space: nowrap; }
.shipping-dispatch-card h2 { margin: 0; font-size: 1rem; font-weight: 850; }
.shipping-dispatch-card p { margin: -5px 0 4px; color: var(--slate-500); font-size: .75rem; }
.shipping-finished-panel > i { color: var(--success); font-size: 2rem; }
.shipping-finished-panel > div { min-width: 0; flex: 1; }

.plan-usage-list {
    display: grid;
    gap: 12px;
}
.plan-usage-item {
    display: grid;
    gap: 7px;
}
.plan-usage-item > div:first-child {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}
.plan-usage-item span {
    color: var(--slate-500);
    font-size: .72rem;
    font-weight: 750;
}
.plan-usage-item strong {
    color: var(--slate-900);
    font-size: .78rem;
}
.plan-usage-bar {
    height: 7px;
    overflow: hidden;
    border-radius: 999px;
    background: #edf2f7;
}
.plan-usage-bar span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--blue-600), var(--teal-500));
}
.finance-command {
    display: grid;
    gap: 16px;
    align-items: stretch;
    margin-bottom: 14px;
    grid-template-columns: minmax(0, 1fr) minmax(260px, 340px);
}
.finance-command-copy,
.finance-command-score,
.finance-panel,
.finance-kpi {
    border: 1px solid #dbe5ef;
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 8px 24px rgba(15, 32, 58, .045);
}
.finance-command-copy { padding: 20px; }
.finance-eyebrow,
.finance-command-score span,
.finance-kpi span,
.finance-panel-head span,
.finance-waterfall span,
.finance-pipeline span,
.finance-plan-card header span,
.finance-plan-economics span,
.finance-usage span {
    color: #7d8fa6;
    font-size: .62rem;
    font-weight: 850;
    letter-spacing: .06em;
    text-transform: uppercase;
}
.finance-command h2 { margin: 4px 0 6px; font-size: 1.55rem; font-weight: 850; }
.finance-command p { max-width: 760px; margin: 0; color: var(--slate-500); line-height: 1.55; }
.finance-command-score {
    display: grid;
    align-content: center;
    padding: 18px;
}
.finance-command-score strong { display: block; margin-top: 5px; font-size: 2rem; line-height: 1; }
.finance-command-score small { display: block; margin-top: 7px; color: var(--slate-500); font-weight: 750; }
.finance-command-score.positive { border-color: #b8e6dc; background: #f8fffc; }
.finance-command-score.positive strong { color: #047857; }
.finance-command-score.negative { border-color: #fecaca; background: #fff8f8; }
.finance-command-score.negative strong { color: #b91c1c; }
.finance-tabs {
    position: sticky;
    top: 86px;
    z-index: 5;
    display: flex;
    gap: 8px;
    margin-bottom: 14px;
    padding: 8px;
    overflow-x: auto;
    border: 1px solid #dfe8f2;
    border-radius: 8px;
    background: rgba(255,255,255,.92);
    backdrop-filter: blur(12px);
}
.finance-tabs a {
    display: inline-flex;
    min-height: 34px;
    align-items: center;
    gap: 7px;
    padding: 0 12px;
    border-radius: 7px;
    color: #52657d;
    font-size: .74rem;
    font-weight: 800;
    text-decoration: none;
    white-space: nowrap;
}
.finance-tabs a:hover { color: var(--blue-600); background: #f4f8ff; }
.finance-kpi-grid {
    display: grid;
    gap: 10px;
    margin-bottom: 14px;
    grid-template-columns: repeat(6, minmax(0, 1fr));
}
.finance-kpi {
    min-height: 122px;
    padding: 14px;
}
.finance-kpi strong { display: block; margin-top: 8px; font-size: 1.25rem; font-weight: 850; }
.finance-kpi small { display: block; margin-top: 5px; color: var(--slate-500); font-size: .7rem; line-height: 1.35; }
.finance-kpi.primary { border-color: #b8cff8; background: #f8fbff; }
.finance-kpi.danger { border-color: #fecaca; background: #fff8f8; }
.finance-board {
    display: grid;
    gap: 14px;
    margin-bottom: 14px;
    grid-template-columns: minmax(0, 1fr) minmax(360px, .72fr);
}
.finance-panel { padding: 16px; }
.finance-panel-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;
}
.finance-panel-head h3 { margin: 3px 0 0; font-size: 1rem; font-weight: 850; }
.finance-waterfall,
.finance-pipeline,
.finance-model-grid {
    display: grid;
    gap: 10px;
}
.finance-waterfall > div,
.finance-pipeline > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 11px 12px;
    border: 1px solid #e1e9f2;
    border-radius: 7px;
    background: #f8fafc;
}
.finance-waterfall strong,
.finance-pipeline strong { color: var(--slate-900); font-size: .96rem; }
.finance-waterfall .total { background: #fff; }
.finance-waterfall .total.positive strong { color: #047857; }
.finance-waterfall .total.negative strong { color: #b91c1c; }
.finance-pipeline { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.finance-pipeline > div { display: grid; align-content: center; min-height: 86px; }
.finance-pipeline small { color: var(--slate-500); font-weight: 750; }
.finance-risk-list { display: grid; gap: 8px; }
.finance-risk-item {
    display: grid;
    align-items: center;
    gap: 10px;
    padding: 10px;
    border: 1px solid #e1e9f2;
    border-radius: 7px;
    background: #fbfdff;
    grid-template-columns: minmax(0, 1fr) auto auto;
}
.finance-risk-item strong,
.finance-table td strong { display: block; color: var(--slate-900); font-size: .82rem; }
.finance-risk-item span,
.finance-table td small { display: block; color: var(--slate-500); font-size: .68rem; line-height: 1.35; }
.finance-pill {
    display: inline-flex;
    min-height: 24px;
    align-items: center;
    justify-content: center;
    padding: 0 8px;
    border-radius: 999px;
    font-size: .64rem;
    font-weight: 850;
    white-space: nowrap;
}
.finance-pill.success { color: #047857; background: #dcfce7; }
.finance-pill.primary { color: #1d4ed8; background: #dbeafe; }
.finance-pill.warning { color: #9a5f00; background: #fef3c7; }
.finance-pill.danger { color: #b91c1c; background: #fee2e2; }
.finance-empty {
    padding: 22px;
    border: 1px dashed #cbd8e6;
    border-radius: 7px;
    color: var(--slate-500);
    background: #f8fafc;
    text-align: center;
}
.finance-plan-mix { display: grid; gap: 10px; }
.finance-plan-mix > div { display: grid; gap: 5px; }
.finance-plan-mix span { display: flex; justify-content: space-between; gap: 10px; color: var(--slate-700); font-size: .75rem; }
.finance-plan-mix small { color: var(--slate-500); }
.finance-plan-mix div div,
.finance-usage div {
    height: 7px;
    overflow: hidden;
    border-radius: 999px;
    background: #edf2f7;
}
.finance-plan-mix i,
.finance-usage i {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--blue-600), var(--teal-500));
}
.finance-plan-mix em { color: var(--slate-500); font-size: .68rem; font-style: normal; }
.finance-search { position: relative; width: min(380px, 100%); }
.finance-search i { position: absolute; top: 50%; left: 12px; z-index: 1; color: var(--slate-500); transform: translateY(-50%); }
.finance-search .form-control { padding-left: 34px; }
.finance-table { min-width: 1120px; }
.finance-table td { vertical-align: middle; }
.finance-usage { min-width: 180px; }
.finance-usage div { margin: 5px 0; }
.finance-usage div.warning i { background: linear-gradient(90deg, #f59e0b, #f97316); }
.finance-usage div.danger i { background: linear-gradient(90deg, #dc2626, #ef4444); }
.finance-contract-grid {
    display: grid;
    gap: 6px;
    min-width: 250px;
    grid-template-columns: minmax(120px, 1fr) 136px minmax(110px, .8fr);
}
.finance-row-actions {
    display: flex;
    gap: 5px;
    align-items: center;
    justify-content: flex-end;
}
.finance-row-actions form { display: inline-flex; }
.finance-plan-grid {
    display: grid;
    gap: 12px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}
.finance-plan-card {
    display: grid;
    gap: 12px;
    padding: 14px;
    border: 1px solid #dfe8f2;
    border-radius: 8px;
    background: #fbfdff;
}
.finance-plan-card.featured { border-color: #b8cff8; background: #f7fbff; }
.finance-plan-card h4 { margin: 2px 0 4px; font-size: 1rem; font-weight: 850; }
.finance-plan-card p { margin: 0; color: var(--slate-500); font-size: .72rem; line-height: 1.4; }
.finance-price-inputs,
.finance-limit-list {
    display: grid;
    gap: 8px;
}
.finance-price-inputs label,
.finance-model-grid label {
    color: #34465f;
    font-size: .7rem;
    font-weight: 800;
}
.finance-price-inputs input,
.finance-model-grid input { margin-top: 5px; }
.finance-plan-economics {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 9px;
    border-radius: 7px;
    background: #fff;
}
.finance-plan-economics strong { color: #047857; }
.finance-limit-list span {
    display: flex;
    justify-content: space-between;
    gap: 8px;
    color: var(--slate-500);
    font-size: .7rem;
}
.finance-limit-list strong { color: var(--slate-900); }
.finance-simple-price-list {
    display: grid;
    gap: 10px;
}
.finance-simple-price-row {
    position: relative;
    display: grid;
    grid-template-columns: minmax(180px, 1.1fr) repeat(3, minmax(140px, .8fr)) minmax(120px, .55fr);
    gap: 10px;
    align-items: end;
    padding: 12px;
    border: 1px solid #dfe8f2;
    border-radius: 8px;
    background: #fff;
}
.finance-simple-price-row.featured {
    border-color: #b8cff8;
    background: #f8fbff;
}
.finance-simple-plan-name span {
    display: block;
    color: var(--slate-500);
    font-size: .68rem;
    font-weight: 800;
    text-transform: uppercase;
}
.finance-simple-plan-name strong {
    display: block;
    margin-top: 4px;
    color: var(--slate-900);
    font-size: .96rem;
    font-weight: 850;
}
.finance-simple-price-row label {
    color: #34465f;
    font-size: .72rem;
    font-weight: 800;
}
.finance-simple-price-row input {
    min-height: 40px;
    margin-top: 5px;
}
.finance-simple-limits {
    align-self: center;
    justify-self: end;
}
.finance-simple-limits summary {
    cursor: pointer;
    color: #2563a8;
    font-size: .76rem;
    font-weight: 800;
    white-space: nowrap;
}
.finance-simple-limits div {
    position: absolute;
    z-index: 20;
    display: grid;
    min-width: 220px;
    gap: 6px;
    margin-top: 8px;
    padding: 10px;
    border: 1px solid #dfe8f2;
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 12px 28px rgba(15, 23, 42, .12);
}
.finance-simple-limits span {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    color: var(--slate-500);
    font-size: .72rem;
}
.finance-simple-limits strong {
    color: var(--slate-900);
}
.finance-model-grid { grid-template-columns: minmax(180px, .8fr) minmax(180px, .8fr) minmax(260px, 1.4fr); }

@media (max-width: 1399.98px) {
    .shipping-pick-item { grid-template-columns: minmax(220px, 1fr) minmax(230px, .9fr); }
    .shipping-pick-input { grid-column: 1 / -1; }
}
@media (max-width: 1199.98px) {
    .shipping-hero,
    .shipping-process-hero,
    .shipping-workspace,
    .finance-command,
    .finance-board { grid-template-columns: 1fr; }
    .shipping-pick-summary,
    .shipping-dispatch-card { position: static; }
    .finance-kpi-grid,
    .finance-plan-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .finance-simple-price-row { grid-template-columns: minmax(180px, 1fr) repeat(3, minmax(130px, .8fr)); }
    .finance-simple-limits { grid-column: 1 / -1; justify-self: start; }
    .finance-contract-grid,
    .finance-model-grid { grid-template-columns: 1fr; }
}
@media (max-width: 991.98px) {
    .shipping-kpis,
    .shipping-process-metrics,
    .finance-kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .shipping-toolbar { align-items: stretch; flex-direction: column; }
    .shipping-toolbar .form-control { width: 100%; }
    .shipping-scan-panel,
    .shipping-pick-item { grid-template-columns: 1fr; }
    .shipping-scan-panel small { grid-column: 1; }
    .finance-panel-head,
    .finance-risk-item { align-items: stretch; grid-template-columns: 1fr; flex-direction: column; }
    .finance-risk-item form { justify-self: start; }
}
@media (max-width: 575.98px) {
    .shipping-hero,
    .shipping-process-hero { padding: 12px; }
    .shipping-kpis,
    .shipping-process-metrics,
    .shipping-stepper,
    .shipping-pick-numbers,
    .shipping-summary-lines,
    .shipping-pick-input,
    .finance-kpi-grid,
    .finance-pipeline,
    .finance-plan-grid { grid-template-columns: 1fr; }
    .finance-simple-price-row { grid-template-columns: 1fr; }
    .shipping-process-actions,
    .shipping-card-main,
    .shipping-finished-panel { align-items: stretch; flex-direction: column; }
    .shipping-card-total { text-align: left; }
}

/* Categorias: mantem a tela leve e evita herdar o visual de cards do catalogo de produtos. */
.category-page {
    align-items: flex-start;
}

.category-tabs-nav {
    margin-top: 4px;
}

.category-tabs {
    min-height: 420px;
}

.category-tabs .is-loading {
    opacity: .58;
    pointer-events: none;
    transition: opacity .12s ease;
}

.category-tabs .category-list-card,
.category-tabs .category-form-card {
    margin-top: 0;
}

.category-form-shell {
    max-width: 760px;
}

.category-form-card,
.category-list-card {
    border-color: rgba(208, 222, 239, .95);
    box-shadow: 0 12px 34px rgba(15,32,58,.055);
}

.category-filter-grid {
    display: grid;
    align-items: end;
    gap: 12px;
    grid-template-columns: minmax(220px, 1.3fr) minmax(150px, .8fr) minmax(170px, .9fr) auto;
}

.category-filter-grid .span-4,
.category-filter-grid > div {
    grid-column: auto;
    min-width: 0;
}

.category-filter-grid .management-filter-actions {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
}

.category-table {
    min-width: 900px;
    border-collapse: collapse;
    background: transparent;
}

.category-table thead th {
    border-bottom: 1px solid #e5ebf2;
    background: #f8fafc;
}

.category-table tbody tr {
    background: transparent;
    box-shadow: none;
}

.category-table tbody td {
    border-top: 0;
    border-bottom: 1px solid #edf1f6;
    vertical-align: middle;
}

.category-table tbody td:first-child,
.category-table tbody td:last-child {
    border-right: 0;
    border-left: 0;
    border-radius: 0;
}

.category-table .management-badges {
    max-width: 210px;
}

.category-table .action-cell {
    white-space: nowrap;
}

.category-table .action-cell form {
    display: inline-flex;
    margin-left: 5px;
}

.category-table .action-cell .btn {
    display: inline-grid;
    width: 34px;
    min-width: 34px;
    height: 34px;
    padding: 0;
    place-items: center;
}

.category-insight-grid {
    display: grid;
    gap: 12px;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
}

.category-insight-card {
    display: grid;
    min-height: 128px;
    align-content: space-between;
    gap: 8px;
    padding: 16px;
    border: 1px solid #dfe8f2;
    border-radius: 10px;
    color: inherit;
    background: #fff;
    text-decoration: none;
    box-shadow: 0 12px 30px rgba(15,32,58,.055);
}

.category-insight-card:hover {
    border-color: #c8d8e9;
    color: inherit;
    box-shadow: 0 16px 34px rgba(15,32,58,.08);
}

.category-insight-card span {
    color: var(--slate-500);
    font-size: .64rem;
    font-weight: 850;
    letter-spacing: .055em;
    text-transform: uppercase;
}

.category-insight-card strong {
    color: var(--slate-900);
    font-size: 1.45rem;
    font-weight: 850;
    line-height: 1;
}

.category-insight-card small {
    color: var(--slate-500);
    font-size: .72rem;
}

@media (max-width: 991.98px) {
    .category-filter-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .category-filter-grid .span-4,
    .category-filter-grid .management-filter-actions {
        grid-column: 1 / -1;
    }
}

@media (max-width: 767.98px) {
    .category-filter-grid {
        grid-template-columns: 1fr;
    }

    .category-filter-grid .management-filter-actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .category-table.responsive-cards {
        min-width: 0;
    }

    .category-table.responsive-cards .management-badges {
        justify-content: flex-end;
        max-width: none;
    }
}

/* Financeiro operacional */
.finance-workspace {
    display: grid;
    gap: 18px;
}

.finance-inner-tabs {
    margin-bottom: 0;
}

.finance-tab-content {
    min-width: 0;
}

.finance-summary-grid {
    display: grid;
    gap: 12px;
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.finance-summary-card {
    position: relative;
    display: grid;
    min-height: 118px;
    align-content: space-between;
    gap: 9px;
    padding: 16px;
    overflow: hidden;
    border: 1px solid var(--brand-line, #dbe5f0);
    border-left-width: 4px;
    border-radius: var(--radius-md, 8px);
    background: linear-gradient(180deg, #fff, #f9fbfe);
    box-shadow: var(--shadow-card, 0 8px 24px rgba(16, 32, 51, .065));
}

.finance-summary-card::after {
    position: absolute;
    inset: auto 12px 0;
    height: 3px;
    border-radius: 999px 999px 0 0;
    background: rgba(20, 94, 242, .08);
    content: "";
}

.finance-summary-card span {
    color: var(--brand-muted, #65758b);
    font-size: .64rem;
    font-weight: 900;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.finance-summary-card strong {
    display: block;
    overflow-wrap: anywhere;
    color: var(--brand-ink, #102033);
    font-size: clamp(1.05rem, 1.5vw, 1.3rem);
    font-weight: 900;
    line-height: 1.08;
}

.finance-summary-card small {
    color: var(--brand-muted, #65758b);
    font-size: .72rem;
    font-weight: 700;
}

.finance-summary-card.is-income { border-left-color: #0f9f8f; }
.finance-summary-card.is-expense { border-left-color: #c83042; }
.finance-summary-card.is-balance-positive { border-left-color: var(--brand-primary, #145ef2); }
.finance-summary-card.is-balance-negative,
.finance-summary-card.is-pending { border-left-color: #d88906; }
.finance-summary-card.is-overdue { border-left-color: #c83042; }

.finance-page-grid {
    display: grid;
    align-items: start;
    gap: 18px;
    grid-template-columns: minmax(300px, .42fr) minmax(0, 1fr);
}

.finance-overview-actions,
.product-overview-actions {
    display: flex;
    gap: 10px;
    margin-top: 16px;
    flex-wrap: wrap;
}

.finance-overview-actions .btn,
.product-overview-actions .btn {
    min-height: 42px;
}

.finance-entry-card,
.finance-list-card {
    overflow: hidden;
}

.finance-entry-card .card-body,
.finance-list-card .card-body {
    padding: clamp(1.15rem, 1.7vw, 1.45rem);
}

.finance-entry-card {
    width: min(760px, 100%);
    max-width: 760px;
    margin-inline: auto;
}

.finance-card-heading {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 18px;
    padding-bottom: 14px;
    border-bottom: 1px solid var(--brand-line-soft, #edf2f7);
}

.finance-card-heading > span {
    display: grid;
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    place-items: center;
    border: 1px solid #d7e6ff;
    border-radius: var(--radius-md, 8px);
    color: var(--brand-primary, #145ef2);
    background: #eef5ff;
    font-size: 1.05rem;
}

.finance-card-heading h2 {
    margin: 0;
    color: var(--brand-ink, #102033);
    font-size: .98rem;
    font-weight: 900;
}

.finance-card-heading p {
    margin: 4px 0 0;
    color: var(--brand-muted, #65758b);
    font-size: .74rem;
    line-height: 1.42;
}

.finance-card-heading-inline {
    align-items: center;
    justify-content: flex-start;
}

.finance-type-grid {
    display: grid;
    gap: 10px;
}

.finance-filter-panel {
    display: grid;
    gap: 12px;
    margin-bottom: 16px;
    padding: 14px;
    border: 1px solid var(--brand-line-soft, #edf2f7);
    border-radius: var(--radius-md, 8px);
    background: var(--brand-panel-soft, #f8fafc);
}

.finance-filter-panel .finance-filter-grid {
    display: grid;
    align-items: end;
    gap: 10px;
    grid-template-columns: minmax(150px, .7fr) minmax(150px, .7fr) auto;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
}

.finance-filter-actions .btn {
    min-width: 118px;
}

.finance-search-form {
    min-width: 0;
}

.finance-search-field {
    position: relative;
    width: min(420px, 100%);
}

.finance-search-field i {
    position: absolute;
    top: 50%;
    left: 13px;
    z-index: 1;
    color: var(--brand-muted, #65758b);
    transform: translateY(-50%);
}

.finance-search-field .form-control {
    padding-left: 38px;
}

.finance-simple-table {
    min-width: 860px;
}

.finance-simple-table td {
    vertical-align: middle;
}

.finance-simple-table td strong {
    color: var(--brand-ink, #102033);
    font-size: .82rem;
}

.finance-simple-table td small {
    margin-top: 3px;
    font-size: .68rem;
}

.finance-simple-table td:last-child {
    width: 86px;
    white-space: nowrap;
}

.finance-simple-table td:last-child .btn {
    width: 34px;
    min-width: 34px;
    padding-inline: 0;
}

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

@media (max-width: 1199.98px) {
    .finance-page-grid {
        grid-template-columns: 1fr;
    }

    .finance-entry-card {
        position: static;
    }
}

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

    .finance-filter-panel .finance-filter-grid {
        grid-template-columns: 1fr;
    }

    .finance-filter-actions .btn,
    .finance-search-field {
        width: 100%;
    }
}

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

    .finance-card-heading {
        align-items: stretch;
    }

    .finance-simple-table td:last-child .btn {
        width: 34px;
    }
}

/* Product images: final overrides for catalog, form and POS thumbnails. */
.product-image-editor {
    display: grid;
    grid-template-columns: 180px minmax(0, 1fr);
    gap: 18px;
    align-items: start;
}

.product-image-preview,
.product-card-photo,
.pdv-product-thumb,
.pdv-manual-thumb {
    display: grid;
    place-items: center;
    overflow: hidden;
    border: 1px solid #d9e4ef;
    background: #f7fafc;
    color: #8da0b5;
}

.product-image-preview {
    width: 180px;
    aspect-ratio: 1;
    border-radius: 12px;
    font-weight: 750;
}

.product-image-preview i,
.product-card-photo i {
    font-size: 1.55rem;
}

.product-image-preview img,
.product-card-photo img,
.pdv-product-thumb img,
.pdv-manual-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.product-catalog-item {
    grid-template-columns: 92px minmax(230px, 1fr) minmax(420px, 1.55fr) minmax(180px, .62fr);
}

.product-card-photo {
    width: 92px;
    min-height: 92px;
    align-self: start;
    border-radius: 10px;
    font-size: .68rem;
    font-weight: 800;
    text-align: center;
}

.product-card-photo span {
    padding: 0 8px;
}

.pdv-product-thumb {
    width: 46px;
    height: 46px;
    border-radius: 9px;
    font-size: 1rem;
}

.pdv-manual-thumb {
    width: 42px;
    height: 42px;
    border-radius: 9px;
}

.pdv-manual-copy {
    display: grid;
    min-width: 0;
    gap: 2px;
}

.pdv-manual-copy strong,
.pdv-manual-copy span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

@media (max-width: 1399.98px) {
    .product-catalog-item {
        grid-template-columns: 88px minmax(220px, .85fr) minmax(340px, 1.35fr);
    }

    .product-card-side {
        grid-column: 2 / -1;
    }
}

@media (max-width: 991.98px) {
    .product-catalog-item,
    .product-image-editor {
        grid-template-columns: 1fr;
    }

    .product-card-side {
        grid-column: auto;
    }

    .product-card-photo,
    .product-image-preview {
        width: 100%;
        max-width: 180px;
    }
}

/* Paineis especiais que compartilham o mesmo contexto visual */
.app-shell .shipping-hero,
.app-shell .shipping-process-hero,
.app-shell .settings-hero {
    position: relative;
    isolation: isolate;
    overflow: hidden !important;
    border-color: #173750 !important;
    border-left: 4px solid #2fc1b2 !important;
    color: #f7fbff !important;
    background:
        linear-gradient(110deg, rgba(47, 193, 178, .12), transparent 38%),
        linear-gradient(135deg, #0b2236 0%, #102f49 58%, #16445d 100%) !important;
    box-shadow: 0 14px 32px rgba(8, 29, 47, .16) !important;
}

.app-shell .shipping-hero::before,
.app-shell .shipping-process-hero::before,
.app-shell .settings-hero::before {
    display: block !important;
    position: absolute;
    z-index: -1;
    inset: 0 0 auto;
    height: 1px;
    background: linear-gradient(90deg, #39d2c0, rgba(83, 167, 229, .65), transparent 78%);
    content: "";
}

.app-shell .shipping-hero h2,
.app-shell .shipping-process-hero h2,
.app-shell .settings-hero h2 {
    color: #fff !important;
    text-shadow: 0 1px 1px rgba(0, 0, 0, .12);
}

.app-shell .shipping-hero p,
.app-shell .shipping-process-hero p,
.app-shell .settings-hero p {
    color: #bed0df !important;
}

.app-shell .settings-eyebrow {
    border: 1px solid rgba(107, 224, 210, .25) !important;
    color: #8ce6db !important;
    background: rgba(6, 23, 37, .38) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .05);
}

.app-shell .settings-eyebrow i {
    color: #5fddcf;
}

.app-shell .settings-hero-metrics > div,
.app-shell .shipping-process-metrics > div {
    border-color: rgba(173, 207, 229, .2) !important;
    color: #f7fbff !important;
    background: rgba(255, 255, 255, .075) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .055) !important;
}

.app-shell .settings-hero-metrics span,
.app-shell .shipping-process-metrics span {
    color: #9eb6c9 !important;
}

.app-shell .settings-hero-metrics strong,
.app-shell .shipping-process-metrics strong {
    color: #fff !important;
}

.app-shell .shipping-process-metrics .is-danger {
    border-color: rgba(255, 143, 154, .42) !important;
    background: rgba(197, 52, 67, .16) !important;
}

.app-shell .shipping-hero .shipping-kpi {
    border-color: rgba(173, 207, 229, .2) !important;
    color: #f7fbff !important;
    background: rgba(255, 255, 255, .075) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .055) !important;
}

.app-shell .shipping-hero .shipping-kpi span {
    color: #9eb6c9 !important;
}

.app-shell .shipping-hero .shipping-kpi strong {
    color: #fff !important;
}

.app-shell .shipping-hero .shipping-kpi:hover,
.app-shell .shipping-hero .shipping-kpi:focus-visible {
    border-color: rgba(117, 226, 213, .58) !important;
    color: #fff !important;
    background: rgba(47, 193, 178, .16) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08) !important;
}

.app-shell .shipping-hero .shipping-kpi.is-active {
    border-color: #65d7ca !important;
    background: rgba(47, 193, 178, .22) !important;
    box-shadow: inset 3px 0 0 #65d7ca !important;
}

@media (max-width: 575.98px) {
    .app-shell .shipping-kpis,
    .app-shell .shipping-process-metrics {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .app-shell .shipping-hero .shipping-kpi {
        min-height: 92px;
        padding: 12px;
    }
}

/* Fluxos simplificados de produto e estoque */
.product-simple-form {
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(250px, .8fr);
    gap: 0 28px;
    margin-top: 18px;
}

.product-form-section {
    min-width: 0;
    padding: 20px 0;
    border-top: 1px solid #e5ebf3;
}

.product-form-main {
    grid-row: span 2;
}

.product-form-side {
    min-width: 0;
}

.product-form-image {
    grid-column: 1 / -1;
}

.form-block-heading {
    display: flex;
    align-items: center;
    gap: 9px;
    margin-bottom: 16px;
    color: var(--slate-900);
    font-size: .82rem;
    font-weight: 850;
}

.form-block-heading i {
    display: grid;
    width: 30px;
    height: 30px;
    place-items: center;
    border-radius: 7px;
    color: var(--blue-700);
    background: #eaf2ff;
}

.stock-adjust-card .card-body {
    max-width: 980px;
}

.stock-adjust-grid {
    display: grid;
    gap: 16px;
    grid-template-columns: repeat(12, minmax(0, 1fr));
}

.stock-adjust-grid > * {
    min-width: 0;
}

.stock-adjust-grid .span-3 { grid-column: span 3; }
.stock-adjust-grid .span-4 { grid-column: span 4; }
.stock-adjust-grid .span-6 { grid-column: span 6; }
.stock-adjust-grid .span-8 { grid-column: span 8; }

.stock-adjust-grid [data-stock-supplier-group] {
    transition: opacity .16s ease;
}

.stock-adjust-grid [data-stock-supplier-group].is-disabled {
    opacity: .48;
}

.stock-transfer-dashboard {
    display: grid;
    gap: 12px;
    margin-bottom: 14px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}
.stock-transfer-dashboard > div {
    min-width: 0;
    padding: 13px 15px;
    border: 1px solid #d7e4f3;
    border-radius: 8px;
    background: linear-gradient(180deg, #fff 0%, #f8fbff 100%);
    box-shadow: var(--shadow-sm);
}

.stock-transfer-dashboard > div {
    position: relative;
    overflow: hidden;
}

.stock-transfer-dashboard > div::before {
    position: absolute;
    inset: 0 auto 0 0;
    width: 3px;
    background: #2563eb;
    content: "";
}
.stock-transfer-dashboard span,
.stock-transfer-status {
    color: var(--slate-500);
    font-size: .66rem;
    font-weight: 850;
    letter-spacing: .04em;
    text-transform: uppercase;
}
.stock-transfer-dashboard strong {
    display: block;
    margin-top: 4px;
    color: var(--slate-900);
    font-size: 1.16rem;
    font-weight: 900;
}
.stock-transfer-dashboard small {
    display: block;
    margin-top: 4px;
    color: #8090a4;
    font-size: .66rem;
}

.stock-transfer-guide {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: -2px 0 14px;
}

.stock-transfer-guide span {
    display: inline-flex;
    min-height: 34px;
    align-items: center;
    gap: 8px;
    padding: 7px 10px;
    border: 1px solid #dbe7f3;
    border-radius: 8px;
    color: #475569;
    background: #fff;
    font-size: .76rem;
    font-weight: 850;
}

.stock-transfer-guide strong {
    display: inline-flex;
    width: 20px;
    height: 20px;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    color: #fff;
    background: #2563eb;
    font-size: .68rem;
    font-weight: 900;
}

.stock-transfer-workbench {
    display: grid;
    gap: 16px;
    grid-template-columns: 1fr;
    align-items: start;
}

.stock-transfer-inventory-column,
.stock-transfer-action-column {
    min-width: 0;
}

.stock-transfer-inventory-column {
    order: 2;
}

.stock-transfer-action-column {
    order: 1;
    position: static;
    display: grid;
    gap: 12px;
}

.stock-transfer-station-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 14px;
    border: 1px solid #cfe0ff;
    border-radius: 8px;
    background: #0f172a;
    box-shadow: var(--shadow-sm);
}

.stock-transfer-station-head span,
.stock-transfer-station-head small {
    color: #b6c5dd;
    font-size: .66rem;
    font-weight: 850;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.stock-transfer-station-head strong {
    display: block;
    margin-top: 2px;
    color: #fff;
    font-size: 1rem;
    font-weight: 900;
}

.stock-transfer-list-card {
    height: 100%;
    margin-bottom: 0;
}
.stock-transfer-list-card .card-body,
.stock-label-transfer-card .card-body {
    padding: 14px;
}

.stock-transfer-list-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;
}

.stock-transfer-list-head .form-section-title {
    margin-bottom: 0;
}

.stock-transfer-list-count {
    display: inline-flex;
    min-height: 30px;
    align-items: center;
    padding: 5px 10px;
    border: 1px solid #dbe7f3;
    border-radius: 8px;
    color: #2563eb;
    background: #eff6ff;
    font-size: .72rem;
    font-weight: 850;
}

.stock-transfer-location-tabs {
    display: flex;
    gap: 8px;
    margin-bottom: 12px;
    overflow-x: auto;
    padding-bottom: 2px;
    scrollbar-width: thin;
}

.stock-transfer-location-tabs button {
    display: inline-flex;
    min-height: 36px;
    flex: 0 0 auto;
    align-items: center;
    gap: 8px;
    padding: 7px 11px;
    border: 1px solid #dbe7f3;
    border-radius: 8px;
    color: var(--slate-700);
    background: #fff;
    font-size: .78rem;
    font-weight: 850;
    transition: border-color .18s ease, background .18s ease, color .18s ease, box-shadow .18s ease;
}

.stock-transfer-location-tabs button span {
    display: inline-flex;
    min-width: 24px;
    justify-content: center;
    padding: 2px 7px;
    border-radius: 999px;
    color: #64748b;
    background: #f1f5f9;
    font-size: .68rem;
}

.stock-transfer-location-tabs button.is-active {
    border-color: #9bbcff;
    color: #1d4ed8;
    background: #eff6ff;
    box-shadow: 0 8px 18px rgba(37, 99, 235, .09);
}

.stock-transfer-location-tabs button.is-active span {
    color: #fff;
    background: #2563eb;
}

.stock-transfer-location-panel {
    display: none;
}

.stock-transfer-location-panel.is-active {
    display: grid;
    gap: 8px;
    max-height: 620px;
    overflow-y: auto;
    padding-right: 3px;
}

.stock-transfer-product-row {
    display: grid;
    width: 100%;
    min-height: 52px;
    grid-template-columns: minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 12px;
    padding: 9px 11px;
    border: 1px solid #dbe7f3;
    border-radius: 8px;
    color: inherit;
    background: #fff;
    text-align: left;
    transition: border-color .18s ease, background .18s ease, box-shadow .18s ease, transform .18s ease;
}

.stock-transfer-product-row:hover {
    border-color: #9bbcff;
    background: #f8fbff;
    box-shadow: var(--shadow-sm);
    transform: translateY(-1px);
}

.stock-transfer-product-main {
    min-width: 0;
}

.stock-transfer-product-main strong,
.stock-transfer-product-main small {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.stock-transfer-product-main strong {
    color: var(--slate-900);
    font-size: .86rem;
    font-weight: 900;
}

.stock-transfer-product-main small {
    margin-top: 3px;
    color: #64748b;
    font-size: .7rem;
}

.stock-transfer-product-qty {
    justify-self: end;
    padding: 5px 9px;
    border-radius: 8px;
    color: #1d4ed8;
    background: #eff6ff;
    font-size: .78rem;
    font-weight: 900;
    white-space: nowrap;
}

.stock-transfer-product-action {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #2563eb;
    font-size: .74rem;
    font-weight: 900;
    white-space: nowrap;
}

.stock-transfer-empty {
    padding: 16px;
    border: 1px dashed #cbd5e1;
    border-radius: 8px;
    color: #64748b;
    background: #f8fafc;
    font-size: .84rem;
    text-align: center;
}

.stock-label-transfer-card {
    margin-bottom: 0;
    border-color: #cfe0ff;
    background: linear-gradient(180deg, #fff 0%, #f8fbff 100%);
}

.stock-label-grid {
    display: grid;
    gap: 14px;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    align-items: end;
}

.stock-label-grid > * {
    min-width: 0;
}

.stock-label-grid .span-3 { grid-column: span 3; }
.stock-label-grid .span-6 { grid-column: span 6; }

.stock-label-scan {
    display: grid;
    gap: 8px;
    grid-template-columns: minmax(0, 1fr) auto;
}

.stock-label-summary {
    display: grid;
    gap: 12px;
    margin-top: 14px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.stock-label-panel {
    min-width: 0;
    border: 1px solid #dbe7f3;
    border-radius: 8px;
    background: #fff;
    overflow: hidden;
}

.stock-label-panel-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 12px;
    border-bottom: 1px solid #e2e8f0;
    background: #f8fafc;
}

.stock-label-panel-head strong {
    color: var(--slate-900);
    font-size: .86rem;
    font-weight: 900;
}

.stock-label-panel-head span {
    color: #2563eb;
    font-size: .72rem;
    font-weight: 900;
    white-space: nowrap;
}

.stock-label-list {
    display: grid;
    gap: 7px;
    max-height: 190px;
    overflow-y: auto;
    padding: 10px;
}

.stock-label-row {
    display: grid;
    min-height: 46px;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px;
    padding: 8px 10px;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    background: #fff;
}

.stock-label-row span {
    min-width: 0;
}

.stock-label-row strong,
.stock-label-row small {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.stock-label-row strong {
    color: #1d4ed8;
    font-size: .84rem;
    font-weight: 900;
}

.stock-label-row small {
    margin-top: 2px;
    color: #64748b;
    font-size: .68rem;
}

.stock-label-row button {
    display: inline-flex;
    width: 32px;
    height: 32px;
    align-items: center;
    justify-content: center;
    border: 1px solid #fecaca;
    border-radius: 8px;
    color: #dc2626;
    background: #fff;
}

.stock-label-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 14px;
}

.stock-transfer-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 16px;
}

.stock-transfer-head .form-section-title {
    margin-bottom: 0;
}

.stock-transfer-subtitle {
    margin: 3px 0 0;
    color: #64748b;
    font-size: .72rem;
    line-height: 1.35;
}

.stock-transfer-status {
    display: inline-flex;
    min-height: 32px;
    align-items: center;
    justify-content: center;
    padding: 6px 10px;
    border: 1px solid #dbe7f3;
    border-radius: 8px;
    background: #f8fafc;
    white-space: nowrap;
}

.stock-transfer-status.is-ready {
    border-color: #9dd8ca;
    color: #0f766e;
    background: #f0fdfa;
}

.stock-transfer-status.is-warning {
    border-color: #fed7aa;
    color: #9a3412;
    background: #fff7ed;
}

.initial-stock-lines {
    display: grid;
    gap: 14px;
}

.initial-stock-line {
    position: relative;
    padding: 16px;
    border: 1px solid #dfe8f2;
    border-radius: 12px;
    background: #f8fbff;
}

.initial-stock-remove {
    margin-top: 12px;
}

.initial-stock-history {
    display: grid;
    gap: 10px;
}

.initial-stock-history-item {
    display: grid;
    gap: 5px;
    padding: 13px 14px;
    color: inherit;
    text-decoration: none;
    border: 1px solid #dfe8f2;
    border-radius: 12px;
    background: #fff;
    transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.initial-stock-history-item:hover {
    border-color: #b8c7da;
    box-shadow: var(--shadow-sm);
    transform: translateY(-1px);
}

.initial-stock-history-item strong {
    color: var(--slate-900);
    font-size: .95rem;
}

.initial-stock-history-item small {
    color: var(--slate-500);
}

.user-permission-grid {
    display: grid;
    max-height: 360px;
    gap: 8px;
    padding: 10px;
    overflow: auto;
    border: 1px solid #dfe8f2;
    border-radius: 12px;
    background: #f8fbff;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.user-permission-check {
    display: flex;
    min-width: 0;
    align-items: flex-start;
    gap: 8px;
    padding: 9px;
    border: 1px solid #e5edf6;
    border-radius: 10px;
    background: #fff;
}

.user-permission-check span {
    min-width: 0;
}

.user-permission-check strong {
    display: block;
    color: var(--slate-900);
    font-size: .78rem;
    line-height: 1.2;
}

.user-permission-check small {
    color: var(--slate-500);
    font-size: .68rem;
}

.stock-lot-filter {
    display: grid;
    max-width: 760px;
    align-items: end;
    gap: 10px;
    grid-template-columns: minmax(260px, 1fr) auto auto;
}

.stock-lot-table {
    min-width: 1050px;
}

.stock-lot-table td {
    vertical-align: middle;
}

.stock-lot-table .badge.d-block {
    width: fit-content;
}

@media (max-width: 991.98px) {
    .product-simple-form {
        grid-template-columns: 1fr;
    }

    .product-form-main,
    .product-form-image {
        grid-column: auto;
        grid-row: auto;
    }

    .stock-adjust-grid .span-3,
    .stock-adjust-grid .span-4,
    .stock-adjust-grid .span-6,
    .stock-adjust-grid .span-8 {
        grid-column: span 6;
    }

    .stock-transfer-dashboard {
        grid-template-columns: 1fr;
    }

    .stock-transfer-workbench {
        grid-template-columns: 1fr;
    }

    .stock-transfer-action-column {
        position: static;
    }

    .stock-transfer-location-panel.is-active {
        max-height: 520px;
    }

    .stock-transfer-product-row {
        grid-template-columns: minmax(0, 1fr) auto;
    }

    .stock-transfer-product-action {
        grid-column: 1 / -1;
        justify-self: end;
    }

    .stock-label-grid .span-3,
    .stock-label-grid .span-6 {
        grid-column: span 6;
    }

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

}

@media (max-width: 575.98px) {
    .app-shell .operation-tabs {
        display: flex;
        width: 100%;
        flex-wrap: nowrap;
        overflow-x: auto;
        scrollbar-width: none;
    }

    .app-shell .operation-tabs::-webkit-scrollbar {
        display: none;
    }

    .app-shell .operation-tabs .nav-item {
        flex: 0 0 auto;
    }

    .app-shell .operation-tabs .nav-link {
        width: auto !important;
        min-width: max-content;
    }

    .app-shell .operation-summary-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .stock-adjust-grid {
        grid-template-columns: 1fr;
    }

    .stock-adjust-grid .span-3,
    .stock-adjust-grid .span-4,
    .stock-adjust-grid .span-6,
    .stock-adjust-grid .span-8 {
        grid-column: 1 / -1;
    }

    .stock-transfer-head {
        align-items: stretch;
        flex-direction: column;
    }

    .stock-transfer-status {
        width: 100%;
        justify-content: flex-start;
        white-space: normal;
    }

    .stock-transfer-list-head {
        align-items: stretch;
        flex-direction: column;
    }

    .stock-transfer-station-head {
        align-items: flex-start;
        flex-direction: column;
    }

    .stock-transfer-location-panel.is-active {
        max-height: 420px;
    }

    .stock-transfer-product-row {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .stock-transfer-product-qty,
    .stock-transfer-product-action {
        justify-self: start;
    }

    .stock-transfer-product-action {
        grid-column: auto;
    }

    .stock-label-grid {
        grid-template-columns: 1fr;
    }

    .stock-label-grid .span-3,
    .stock-label-grid .span-6 {
        grid-column: 1 / -1;
    }

    .stock-label-scan {
        grid-template-columns: 1fr;
    }

    .stock-label-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .stock-lot-filter {
        max-width: none;
        grid-template-columns: 1fr;
    }

    .stock-lot-table {
        width: 100%;
        min-width: 0;
    }
}

@media (max-width: 420px) {
    .app-shell .topbar .dropdown {
        display: none;
    }
}

/* Pedidos unificado */
.order-flow-hero {
    grid-template-columns: minmax(0, 1fr) minmax(330px, 520px);
}

.order-flow-hero .operation-summary-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.operation-tabs .nav-link small {
    display: inline-grid;
    min-width: 22px;
    height: 22px;
    align-items: center;
    justify-content: center;
    padding: 0 6px;
    border-radius: 999px;
    color: #526982;
    background: #eef4fa;
    font-size: .66rem;
    font-weight: 850;
}

.operation-tabs .nav-link.active small {
    color: #0f2d4a;
    background: rgba(255, 255, 255, .82);
}

.order-flow-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;
}

.order-flow-toolbar form {
    width: min(390px, 100%);
}

.order-flow-list {
    overflow: hidden;
    border-color: #dbe7f3;
    box-shadow: 0 10px 28px rgba(15, 32, 58, .055);
}

.order-flow-list .table {
    margin-bottom: 0;
}

.order-flow-board {
    margin-bottom: 14px;
}

.order-flow-board .shipping-card {
    border-radius: 9px;
}

.order-origin-badge {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    min-height: 24px;
    padding: 4px 8px;
    border: 1px solid #cfe8dc;
    border-radius: 999px;
    background: #f2fbf8;
    color: #0f766e;
    font-size: .68rem;
    font-weight: 850;
    vertical-align: middle;
}

.order-note-preview {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 9px 10px;
    border: 1px solid #e1e9f2;
    border-radius: 8px;
    background: #f8fafc;
    color: #526174;
    font-size: .78rem;
    line-height: 1.35;
}

.order-note-preview i {
    color: #0f766e;
}

.order-detail-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.order-detail-actions > div {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
}

.order-detail-actions form {
    margin: 0;
}

.order-detail-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(330px, 520px);
    gap: 18px;
    align-items: center;
    margin-bottom: 16px;
    padding: 18px 22px;
    border: 1px solid rgba(23, 107, 135, .28);
    border-radius: 12px;
    color: #ffffff;
    background: linear-gradient(135deg, #102033 0%, #176b87 55%, #0f766e 100%);
    box-shadow: 0 14px 32px rgba(15, 32, 58, .13);
}

.order-detail-hero h2 {
    margin: 9px 0 4px;
    font-size: 1.45rem;
    font-weight: 900;
    overflow-wrap: anywhere;
}

.order-detail-hero p {
    margin: 0;
    color: #dff7ff;
}

.order-detail-hero .order-origin-badge {
    border-color: rgba(255, 255, 255, .26);
    background: rgba(255, 255, 255, .16);
    color: #ffffff;
}

.order-detail-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(300px, 380px);
    gap: 16px;
    align-items: start;
}

.order-detail-main,
.order-detail-side {
    display: grid;
    gap: 16px;
    min-width: 0;
}

.order-detail-side {
    position: sticky;
    top: 96px;
}

.order-detail-card {
    border-color: #dbe7f3;
    box-shadow: 0 10px 28px rgba(15, 32, 58, .055);
}

.order-detail-section-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
}

.order-detail-section-head span,
.order-detail-lines span {
    display: block;
    color: var(--slate-500);
    font-size: .62rem;
    font-weight: 850;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.order-detail-section-head h3 {
    margin: 3px 0 0;
    color: var(--slate-900);
    font-size: 1rem;
    font-weight: 900;
}

.order-detail-items {
    margin-bottom: 0;
}

.order-detail-items th,
.order-detail-items td {
    vertical-align: middle;
}

.order-detail-lines {
    display: grid;
    gap: 9px;
}

.order-detail-lines > div {
    min-width: 0;
    padding: 10px;
    border: 1px solid #e1e9f2;
    border-radius: 8px;
    background: #f8fafc;
}

.order-detail-lines strong,
.order-detail-lines small {
    display: block;
    min-width: 0;
    overflow-wrap: anywhere;
}

.order-detail-lines strong {
    margin-top: 3px;
    color: var(--slate-900);
    font-weight: 850;
}

.order-detail-lines small {
    color: var(--slate-500);
}

.order-detail-timeline {
    display: grid;
    gap: 8px;
}

.order-detail-timeline > div {
    display: grid;
    align-items: center;
    gap: 8px;
    grid-template-columns: 32px minmax(0, 1fr) auto;
    min-width: 0;
    padding: 9px;
    border-radius: 8px;
    background: #f5f8fc;
    color: #64748b;
}

.order-detail-timeline i {
    display: grid;
    width: 32px;
    height: 32px;
    place-items: center;
    border-radius: 8px;
    background: #e8eef6;
}

.order-detail-timeline .done {
    color: #047966;
    background: #e8fbf7;
}

.order-detail-timeline .done i {
    background: #ccf7eb;
}

.order-detail-timeline span {
    font-weight: 850;
}

.order-detail-timeline small {
    color: inherit;
    font-size: .72rem;
}

.order-detail-note {
    margin: 0;
    color: #526174;
    line-height: 1.45;
    overflow-wrap: anywhere;
}

@media (max-width: 991.98px) {
    .order-flow-hero {
        grid-template-columns: 1fr;
    }

    .order-detail-hero,
    .order-detail-grid {
        grid-template-columns: 1fr;
    }

    .order-detail-side {
        position: static;
    }

    .order-flow-toolbar {
        align-items: stretch;
        flex-direction: column;
    }

    .order-flow-toolbar form {
        width: 100%;
    }
}

@media (max-width: 575.98px) {
    .order-flow-hero .operation-summary-grid {
        grid-template-columns: 1fr;
    }

    .order-detail-actions,
    .order-detail-section-head {
        align-items: stretch;
        flex-direction: column;
    }

    .order-detail-actions > div,
    .order-detail-actions .btn,
    .order-detail-actions form,
    .order-detail-actions button {
        width: 100%;
    }

    .order-detail-hero .operation-summary-grid,
    .order-detail-timeline > div {
        grid-template-columns: 1fr;
    }
}

/* Codex layout stabilization pass: prevent common overflow and overlap cases. */
.app-shell .main-content,
.app-shell .content-wrap,
.app-shell .row > *,
.app-shell .card,
.app-shell .card-body,
.app-shell .tab-content,
.app-shell .tab-pane,
.app-shell .responsive-toolbar,
.app-shell .card-titlebar,
.app-shell .finance-card-heading,
.app-shell .dashboard-hero-main,
.app-shell .dashboard-quick-actions,
.app-shell .product-card-main,
.app-shell .product-card-side,
.app-shell .order-line-card,
.app-shell .finance-filter-panel,
.app-shell .table-toolbar {
    min-width: 0;
}

.app-shell h1,
.app-shell h2,
.app-shell h3,
.app-shell h4,
.app-shell h5,
.app-shell h6,
.app-shell p,
.app-shell span,
.app-shell small,
.app-shell strong,
.app-shell code,
.app-shell td,
.app-shell th,
.app-shell label,
.app-shell .badge {
    overflow-wrap: anywhere;
}

.app-shell .topbar {
    gap: 14px;
}

.app-shell .topbar > .d-flex:first-child,
.app-shell .topbar-heading {
    min-width: 0;
}

.app-shell .topbar-title,
.app-shell .topbar-kicker {
    max-width: min(56vw, 720px);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.app-shell .topbar-actions {
    flex: 0 1 auto;
    flex-wrap: wrap;
    justify-content: flex-end;
}
.app-shell .responsive-toolbar,
.app-shell .card-titlebar,
.app-shell .finance-card-heading,
.app-shell .stock-lot-label-head,
.app-shell .stock-grade-section-head,
.app-shell .dashboard-clean-section-head,
.app-shell .order-summary-panel,
.app-shell .purchase-flow-shortcut,
.app-shell .form-actions,
.app-shell .page-actions {
    flex-wrap: wrap;
}
.app-shell .responsive-toolbar > *,
.app-shell .card-titlebar > *,
.app-shell .finance-card-heading > *,
.app-shell .stock-lot-label-head > *,
.app-shell .stock-grade-section-head > *,
.app-shell .dashboard-clean-section-head > *,
.app-shell .order-summary-panel > *,
.app-shell .purchase-flow-shortcut > *,
.app-shell .form-actions > *,
.app-shell .page-actions > * {
    min-width: 0;
}

.app-shell .btn,
.app-shell .nav-link,
.app-shell .dropdown-item,
.app-shell .operation-tabs .nav-link,
.app-shell .inner-operation-tabs .nav-link {
    max-width: 100%;
}

.app-shell .btn {
    white-space: normal;
    overflow-wrap: anywhere;
}

.app-shell .btn i,
.app-shell .nav-link i {
    flex: 0 0 auto;
}

.app-shell .table-responsive {
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    overflow-y: visible;
    -webkit-overflow-scrolling: touch;
}

.app-shell table {
    max-width: 100%;
}

.app-shell .table td,
.app-shell .table th {
    vertical-align: middle;
}
.app-shell .table td > .d-flex,
.app-shell .table th > .d-flex,
.app-shell .action-cell,
.app-shell .product-card-actions,
.app-shell .purchase-flow-shortcut-actions,
.app-shell .finance-filter-actions,
.app-shell .management-filter-actions,
.app-shell .product-filter-actions {
    flex-wrap: wrap;
}

.app-shell .form-control,
.app-shell .form-select,
.app-shell .input-group,
.app-shell .entity-autocomplete,
.app-shell .search-box {
    max-width: 100%;
}

.app-shell .entity-autocomplete-list {
    max-width: min(100vw - 32px, 720px);
}

.app-shell .dashboard-hero,
.app-shell .dashboard-premium-hero,
.app-shell .store-operation-intro,
.app-shell .operation-hero {
    isolation: isolate;
}

.app-shell .stock-lot-label-actions,
.app-shell .stock-grade-pill,
.app-shell .nav-counter,
.app-shell .badge {
    white-space: normal;
}

.app-shell .modal-dialog {
    max-width: min(96vw, var(--bs-modal-width, 700px));
    margin-right: auto;
    margin-left: auto;
}

body.login-page .login-showcase {
    overflow: hidden;
}

body.login-page .login-pitch,
body.login-page .login-brand,
body.login-page .login-feature,
body.login-page .login-form-wrap {
    max-width: 100%;
}

@media (max-width: 1199.98px) {
    .app-shell .topbar {
        align-items: flex-start !important;
        flex-direction: column;
    }

    .app-shell .topbar-actions {
        width: 100%;
        justify-content: flex-start;
    }

    .app-shell .topbar-title,
    .app-shell .topbar-kicker {
        max-width: calc(100vw - 128px);
    }
.app-shell .dashboard-hero-status,
.app-shell .dashboard-premium-hero .dashboard-hero-status,
.app-shell .dashboard-quick-actions,
.app-shell .operation-summary-grid,
.app-shell .store-operation-summary,
.app-shell .stock-lot-label-context,
.app-shell .stock-lot-label-summary,
.app-shell .stock-lot-label-groups,
.app-shell .deposit-usage-grid,
.app-shell .stock-grade-dashboard {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 991.98px) {
    .app-shell .main-content {
        margin-left: 0 !important;
    }

    .app-shell .topbar {
        position: sticky;
        min-height: auto;
        padding: 12px 16px;
    }

    .app-shell .content-wrap {
        padding: 16px;
    }

    .app-shell .card-body,
    .app-shell .operation-tab-content .card-body {
        padding: 1rem;
    }

    .app-shell .responsive-toolbar,
    .app-shell .card-titlebar,
    .app-shell .finance-card-heading,
    .app-shell .stock-lot-label-head,
    .app-shell .stock-grade-section-head,
    .app-shell .dashboard-clean-section-head {
        align-items: stretch;
        flex-direction: column;
    }
.app-shell .page-actions,
.app-shell .form-actions,
.app-shell .purchase-flow-shortcut-actions,
.app-shell .product-card-actions {
        width: 100%;
    }
.app-shell .page-actions .btn,
.app-shell .form-actions .btn,
.app-shell .purchase-flow-shortcut-actions .btn,
.app-shell .product-card-actions .btn,
.app-shell .product-card-actions form {
        width: 100%;
    }
}

@media (max-width: 767.98px) {
    .app-shell .topbar-actions > *,
    .app-shell .quick-command,
    .app-shell .topbar-date,
    .app-shell .user-menu {
        max-width: 100%;
    }

    .app-shell .quick-command span,
    .app-shell .topbar-date,
    .app-shell .user-menu-copy {
        display: none;
    }
.app-shell .dashboard-hero-status,
.app-shell .dashboard-premium-hero .dashboard-hero-status,
.app-shell .dashboard-quick-actions,
.app-shell .operation-summary-grid,
.app-shell .store-operation-summary,
.app-shell .stock-lot-label-context,
.app-shell .stock-lot-label-summary,
.app-shell .stock-lot-label-groups,
.app-shell .deposit-usage-grid,
.app-shell .deposit-rule-strip,
.app-shell .stock-grade-dashboard,
.app-shell .finance-summary-grid,
.app-shell .purchase-preview-grid,
.app-shell .purchase-receiving-summary,
.app-shell .purchase-conference-stepper,
.app-shell .product-card-metrics,
.app-shell .dashboard-clean-summary-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .app-shell .store-operation-intro,
    .app-shell .operation-hero,
    .app-shell .dashboard-hero,
    .app-shell .dashboard-premium-hero {
        min-height: auto;
        padding: 18px;
    }

    .app-shell .table-responsive {
        margin-right: -2px;
        margin-left: -2px;
        border-radius: 8px;
    }

    .app-shell .purchase-conference-table {
        min-width: 760px;
    }
}

@media (max-width: 575.98px) {
    body.login-page .login-showcase {
        min-height: auto;
        padding: 22px;
    }

    body.login-page .login-brand-logo {
        width: min(168px, 72vw);
        height: auto;
    }

    body.login-page .login-pitch h1 {
        max-width: 100%;
        font-size: clamp(1.55rem, 8vw, 2rem);
        line-height: 1.08;
    }

    body.login-page .login-pitch p {
        max-width: 100%;
    }

    body.login-page .login-form-panel {
        padding: 34px 22px;
    }

    .app-shell .content-wrap {
        padding: 12px;
    }

    .app-shell .card-body,
    .app-shell .operation-tab-content .card-body {
        padding: .85rem;
    }

    .app-shell .btn,
    .app-shell .form-control,
    .app-shell .form-select {
        min-height: 38px;
    }
}

/* Codex internal screen stabilization pass: tabs, filters, tables and dense forms. */
.app-shell .operation-tabs,
.app-shell .inner-operation-tabs,
.app-shell .settings-tabs,
.app-shell .product-inner-tabs,
.app-shell .finance-inner-tabs,
.app-shell .pdv-panel-tabs {
    display: flex;
    max-width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    flex-wrap: nowrap;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
}

.app-shell .operation-tabs::-webkit-scrollbar,
.app-shell .inner-operation-tabs::-webkit-scrollbar,
.app-shell .settings-tabs::-webkit-scrollbar,
.app-shell .product-inner-tabs::-webkit-scrollbar,
.app-shell .finance-inner-tabs::-webkit-scrollbar,
.app-shell .pdv-panel-tabs::-webkit-scrollbar {
    display: none;
}

.app-shell .operation-tabs .nav-item,
.app-shell .inner-operation-tabs .nav-item,
.app-shell .settings-tabs .nav-item,
.app-shell .product-inner-tabs .nav-item,
.app-shell .finance-inner-tabs .nav-item,
.app-shell .pdv-panel-tabs .nav-item {
    flex: 0 0 auto;
    min-width: 0;
}

.app-shell .operation-tabs .nav-link,
.app-shell .inner-operation-tabs .nav-link,
.app-shell .settings-tabs .nav-link,
.app-shell .product-inner-tabs .nav-link,
.app-shell .finance-inner-tabs .nav-link,
.app-shell .pdv-panel-tabs .nav-link {
    min-width: max-content;
    white-space: nowrap;
}

.app-shell .pagination-wrap {
    flex-wrap: wrap;
}

.app-shell .pagination-wrap > span {
    min-width: 0;
}

.app-shell .pagination-wrap .pagination {
    min-width: 0;
}

.app-shell .action-cell {
    width: auto;
    min-width: max-content;
    white-space: nowrap;
    text-align: right;
}

.app-shell .action-cell form,
.app-shell .action-cell .btn {
    display: inline-flex;
    margin: 2px;
    vertical-align: middle;
}

.app-shell .action-cell .btn {
    display: inline-flex;
    min-width: 34px;
    align-items: center;
    justify-content: center;
    gap: 5px;
    white-space: nowrap;
}

.app-shell .table .badge,
.app-shell .record-count,
.app-shell .checkout-static-field,
.app-shell .nav-counter {
    display: inline-flex;
    max-width: 100%;
    align-items: center;
    gap: 5px;
    line-height: 1.25;
    vertical-align: middle;
}
.app-shell .purchase-form-grid,
.app-shell .stock-adjust-grid,
.app-shell .stock-grade-form-grid,
.app-shell .product-filter-grid,
.app-shell .management-filter-grid,
.app-shell .category-filter-grid,
.app-shell .finance-filter-grid,
.app-shell .finance-filter-panel,
.app-shell .user-permission-grid {
    max-width: 100%;
}
.app-shell .purchase-form-grid > *,
.app-shell .stock-adjust-grid > *,
.app-shell .stock-grade-form-grid > *,
.app-shell .product-filter-grid > *,
.app-shell .management-filter-grid > *,
.app-shell .category-filter-grid > *,
.app-shell .finance-filter-grid > *,
.app-shell .user-permission-grid > * {
    min-width: 0;
}

.app-shell input,
.app-shell select,
.app-shell textarea {
    min-width: 0;
}

.app-shell .entity-autocomplete-list {
    width: 100%;
    overflow-x: hidden;
}

.app-shell .entity-autocomplete-option {
    min-width: 0;
    white-space: normal;
    overflow-wrap: anywhere;
}

.app-shell .modal-content {
    max-height: calc(100vh - 32px);
}

.app-shell .modal-body {
    min-width: 0;
    overflow-x: auto;
}

.app-shell .purchase-conference-table th,
.app-shell .purchase-conference-table td {
    white-space: normal;
}

.app-shell .purchase-conference-item .table-responsive {
    overflow-x: visible !important;
}

.app-shell .purchase-conference-table {
    width: 100%;
    min-width: 0;
    table-layout: fixed;
}

.app-shell .purchase-conference-table th,
.app-shell .purchase-conference-table td {
    padding-right: .45rem;
    padding-left: .45rem;
}

.app-shell .purchase-conference-table th:nth-child(1),
.app-shell .purchase-conference-table td:nth-child(1) {
    width: 20%;
}

.app-shell .purchase-conference-table th:nth-child(2),
.app-shell .purchase-conference-table td:nth-child(2) {
    width: 16%;
}

.app-shell .purchase-conference-table th:nth-child(3),
.app-shell .purchase-conference-table td:nth-child(3) {
    width: 9%;
}

.app-shell .purchase-conference-table th:nth-child(4),
.app-shell .purchase-conference-table td:nth-child(4) {
    width: 12%;
}

.app-shell .purchase-conference-table th:nth-child(5),
.app-shell .purchase-conference-table td:nth-child(5) {
    width: 25%;
}

.app-shell .purchase-conference-table th:nth-child(6),
.app-shell .purchase-conference-table td:nth-child(6) {
    width: 10%;
}

.app-shell .purchase-conference-table th:nth-child(7),
.app-shell .purchase-conference-table td:nth-child(7) {
    width: 8%;
}

.app-shell .purchase-conference-table input.form-control,
.app-shell .purchase-conference-table select.form-select {
    width: 100%;
    min-width: 0;
    padding-right: .55rem;
    padding-left: .55rem;
}

.app-shell .conference-field-caption,
.app-shell .conference-row-hint {
    display: block;
    margin-bottom: 4px;
    color: #64748b;
    font-size: .66rem;
    font-weight: 800;
    line-height: 1.15;
}

.app-shell .conference-row-hint {
    min-height: 24px;
    margin-top: -2px;
}

.app-shell .purchase-conference-table tr.is-loose-piece [data-grade-pieces] {
    color: #64748b;
    background: #f1f5f9;
    cursor: default;
}

.app-shell .purchase-conference-table th:last-child,
.app-shell .purchase-conference-table td:last-child {
    position: static;
    right: 0;
    z-index: 3;
    padding-right: 10px;
    padding-left: 10px;
    background: #fff;
    text-align: center;
    box-shadow: none;
}

.app-shell .purchase-conference-table thead th:last-child {
    z-index: 4;
    background: #f3f6fa;
}

.app-shell .purchase-conference-table [data-remove-grade-row] {
    display: inline-flex;
    width: 38px;
    height: 38px;
    min-width: 38px;
    align-items: center;
    justify-content: center;
    padding: 0;
    border-color: #fecaca;
    border-radius: 10px;
    color: #dc2626;
    background: #fff;
    box-shadow: 0 6px 14px rgba(220, 38, 38, .1);
}

.app-shell .purchase-conference-table [data-remove-grade-row]:hover,
.app-shell .purchase-conference-table [data-remove-grade-row]:focus-visible {
    border-color: #ef4444;
    color: #fff;
    background: #dc2626;
}

.app-shell .grade-size-builder,
.app-shell .grade-size-rows,
.app-shell .grade-size-row {
    max-width: 100%;
}

.app-shell .purchase-conference-table .grade-size-builder {
    min-width: 0;
}

.app-shell .grade-size-row {
    grid-template-columns: minmax(60px, 1fr) minmax(42px, .78fr) 58px 30px;
    gap: 5px;
}

.app-shell .grade-size-row .btn {
    width: 30px;
    min-width: 30px;
    height: 30px;
    white-space: nowrap;
}

.app-shell .grade-size-row [data-remove-grade-size] {
    border-color: #fecaca;
    color: #dc2626;
    background: #fff;
}

.app-shell .table-responsive table .action-cell {
    position: sticky;
    right: 0;
    z-index: 2;
    background: #fff;
    box-shadow: -10px 0 18px rgba(15, 32, 58, .06);
}

.app-shell .table-responsive table tr:hover .action-cell {
    background: #fbfdff;
}

.app-shell .table-responsive table .action-cell .btn {
    box-shadow: 0 4px 12px rgba(15, 32, 58, .05);
}

.app-shell .row .d-flex.gap-2,
.app-shell .row .d-flex.gap-3,
.app-shell .table-toolbar,
.app-shell .form-toolbar {
    flex-wrap: wrap;
}

@media (min-width: 992px) and (max-width: 1199.98px) {
    .app-shell .topbar {
        align-items: center !important;
        flex-direction: row;
    }

    .app-shell .topbar-actions {
        width: auto;
        max-width: 48%;
        justify-content: flex-end;
    }

    .app-shell .topbar-title,
    .app-shell .topbar-kicker {
        max-width: 42vw;
    }
}

@media (max-width: 991.98px) {
    .app-shell .purchase-form-grid,
    .app-shell .stock-adjust-grid,
    .app-shell .stock-grade-form-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .app-shell .purchase-form-grid > *,
    .app-shell .purchase-form-grid .span-3,
    .app-shell .purchase-form-grid .span-4,
    .app-shell .purchase-form-grid .span-5,
    .app-shell .purchase-form-grid .span-6,
    .app-shell .stock-adjust-grid > *,
    .app-shell .stock-adjust-grid .span-3,
    .app-shell .stock-adjust-grid .span-4,
    .app-shell .stock-adjust-grid .span-6,
    .app-shell .stock-adjust-grid .span-8,
    .app-shell .stock-grade-form-grid > *,
    .app-shell .stock-grade-form-grid .span-2,
    .app-shell .stock-grade-form-grid .span-3,
    .app-shell .stock-grade-form-grid .span-4,
    .app-shell .stock-grade-form-grid .span-5,
    .app-shell .stock-grade-form-grid .span-6 {
        grid-column: span 1;
    }

    .app-shell .purchase-form-grid .span-12,
    .app-shell .stock-grade-form-grid .span-12 {
        grid-column: 1 / -1;
    }
}

@media (max-width: 767.98px) {
    .app-shell .topbar {
        align-items: center !important;
        flex-direction: row;
        justify-content: space-between;
        gap: 10px;
        min-height: 62px;
        padding: 10px 12px;
    }

    .app-shell .topbar > .d-flex:first-child {
        flex: 1 1 auto;
        min-width: 0;
    }

    .app-shell .topbar-actions {
        display: flex;
        width: auto;
        flex: 0 0 auto;
        align-items: center;
        justify-content: flex-end;
        gap: 8px;
    }

    .app-shell .shell-toggle,
    .app-shell .quick-command,
    .app-shell .user-menu {
        flex: 0 0 auto;
    }

    .app-shell .quick-command {
        width: 40px;
        min-width: 40px;
        justify-content: center;
    }

    .app-shell .topbar-title {
        max-width: calc(100vw - 158px);
    }

    .app-shell .pagination-wrap {
        align-items: stretch;
        flex-direction: column;
    }

    .app-shell .pagination-wrap .pagination {
        justify-content: flex-start;
        overflow-x: auto;
        flex-wrap: nowrap;
        padding-bottom: 2px;
    }

    .app-shell .table-responsive {
        overflow-x: auto !important;
        overflow-y: visible;
    }

    .app-shell .responsive-cards tbody td.action-cell,
    .app-shell .responsive-cards tbody td:last-child {
        position: static;
        display: grid;
        min-width: 0;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        justify-content: stretch;
        background: #f8fafc;
        box-shadow: none;
    }

    .app-shell .responsive-cards tbody td.action-cell .btn,
    .app-shell .responsive-cards tbody td:last-child .btn,
    .app-shell .responsive-cards tbody td.action-cell form,
    .app-shell .responsive-cards tbody td:last-child form {
        width: 100%;
        min-width: 0;
    }

    .app-shell .purchase-conference-table {
        display: block;
        min-width: 0;
    }

    .app-shell .purchase-conference-table thead {
        display: none;
    }

    .app-shell .purchase-conference-table tbody,
    .app-shell .purchase-conference-table tr,
    .app-shell .purchase-conference-table td {
        display: block;
        width: 100% !important;
    }

    .app-shell .purchase-conference-table tr {
        padding: 10px;
        border: 1px solid #dfe8f2;
        border-radius: 12px;
        background: #fff;
    }

    .app-shell .purchase-conference-table td {
        padding: 7px 0;
        border: 0;
    }

    .app-shell .purchase-conference-table td::before {
        display: block;
        margin-bottom: 5px;
        color: #64748b;
        font-size: .62rem;
        font-weight: 900;
        letter-spacing: .04em;
        text-transform: uppercase;
    }

    .app-shell .purchase-conference-table td:nth-child(1)::before { content: "Tipo / nome"; }
    .app-shell .purchase-conference-table td:nth-child(2)::before { content: "Rastreio"; }
    .app-shell .purchase-conference-table td:nth-child(3)::before { content: "Qtd."; }
    .app-shell .purchase-conference-table td:nth-child(4)::before { content: "Conteudo"; }
    .app-shell .purchase-conference-table td:nth-child(5)::before { content: "Tamanhos"; }
    .app-shell .purchase-conference-table td:nth-child(6)::before { content: "Total"; }
    .app-shell .purchase-conference-table td:nth-child(7)::before { content: "Acao"; }
}

@media (max-width: 575.98px) {
    .app-shell .operation-tabs,
    .app-shell .inner-operation-tabs,
    .app-shell .settings-tabs,
    .app-shell .product-inner-tabs,
    .app-shell .finance-inner-tabs,
    .app-shell .pdv-panel-tabs {
        display: flex;
        grid-template-columns: none;
    }

    .app-shell .operation-tabs .nav-link,
    .app-shell .inner-operation-tabs .nav-link,
    .app-shell .settings-tabs .nav-link,
    .app-shell .product-inner-tabs .nav-link,
    .app-shell .finance-inner-tabs .nav-link,
    .app-shell .pdv-panel-tabs .nav-link {
        width: auto;
        justify-content: center;
    }
.app-shell .purchase-form-grid,
.app-shell .stock-adjust-grid,
.app-shell .stock-grade-form-grid,
.app-shell .product-filter-grid,
.app-shell .management-filter-grid,
.app-shell .category-filter-grid,
.app-shell .finance-filter-grid,
.app-shell .user-permission-grid {
        grid-template-columns: minmax(0, 1fr);
    }
.app-shell .purchase-form-grid > *,
.app-shell .purchase-form-grid .span-3,
.app-shell .purchase-form-grid .span-4,
.app-shell .purchase-form-grid .span-5,
.app-shell .purchase-form-grid .span-6,
.app-shell .purchase-form-grid .span-12,
.app-shell .stock-adjust-grid > *,
.app-shell .stock-adjust-grid .span-3,
.app-shell .stock-adjust-grid .span-4,
.app-shell .stock-adjust-grid .span-6,
.app-shell .stock-adjust-grid .span-8,
.app-shell .stock-grade-form-grid > *,
.app-shell .stock-grade-form-grid .span-2,
.app-shell .stock-grade-form-grid .span-3,
.app-shell .stock-grade-form-grid .span-4,
.app-shell .stock-grade-form-grid .span-5,
.app-shell .stock-grade-form-grid .span-6,
.app-shell .stock-grade-form-grid .span-12,
.app-shell .product-filter-grid > *,
.app-shell .product-filter-grid .span-4,
.app-shell .management-filter-grid > *,
.app-shell .management-filter-grid .span-4,
.app-shell .category-filter-grid > *,
.app-shell .category-filter-grid .span-4,
.app-shell .finance-filter-grid > *,
.app-shell .user-permission-grid > * {
        grid-column: 1 / -1;
    }

    .app-shell .responsive-cards tbody td.action-cell,
    .app-shell .responsive-cards tbody td:last-child {
        grid-template-columns: minmax(0, 1fr);
    }

    .app-shell .modal-dialog {
        max-width: calc(100vw - 16px);
        margin: 8px auto;
    }

    .app-shell .modal-content {
        max-height: calc(100vh - 16px);
    }
}

.app-shell #purchaseList .table-responsive {
    overflow-x: visible !important;
    border: 0;
    background: transparent;
}

.app-shell #purchaseList .purchase-premium-table {
    display: block;
    width: 100%;
    min-width: 0;
    border-collapse: separate;
    border-spacing: 0;
}

.app-shell #purchaseList .purchase-premium-table thead {
    display: none;
}

.app-shell #purchaseList .purchase-premium-table tbody {
    display: grid;
    gap: 10px;
}

.app-shell #purchaseList .purchase-premium-table tbody tr {
    display: grid;
    width: 100%;
    grid-template-columns: minmax(132px, .72fr) minmax(240px, 1.45fr) minmax(150px, .82fr) minmax(150px, .82fr) minmax(150px, .82fr) minmax(135px, .68fr) minmax(108px, .5fr);
    align-items: stretch;
    gap: 0;
    overflow: hidden;
    border: 1px solid #dfe8f2;
    border-radius: 8px;
    background: #fff !important;
    box-shadow: 0 7px 18px rgba(15, 32, 58, .055);
}

.app-shell #purchaseList .purchase-premium-table tbody td {
    display: block;
    min-width: 0;
    padding: 10px 12px;
    border: 0;
    border-right: 1px solid #eef3f8;
    text-align: left !important;
    white-space: normal;
}

.app-shell #purchaseList .purchase-premium-table tbody td:last-child {
    border-right: 0;
}

.app-shell #purchaseList .purchase-premium-table tbody td::before {
    display: block;
    margin-bottom: 5px;
    color: #64748b;
    font-size: .58rem;
    font-weight: 900;
    letter-spacing: .045em;
    line-height: 1.2;
    text-transform: uppercase;
}

.app-shell #purchaseList .purchase-premium-table tbody td:nth-child(1)::before { content: "Cód. Recebimento"; }
.app-shell #purchaseList .purchase-premium-table tbody td:nth-child(2)::before { content: "Itens"; }
.app-shell #purchaseList .purchase-premium-table tbody td:nth-child(3)::before { content: "Local e lote"; }
.app-shell #purchaseList .purchase-premium-table tbody td:nth-child(4)::before { content: "Resumo"; }
.app-shell #purchaseList .purchase-premium-table tbody td:nth-child(5)::before { content: "Etiquetas"; }
.app-shell #purchaseList .purchase-premium-table tbody td:nth-child(6)::before { content: "Situacao"; }

.app-shell #purchaseList .purchase-premium-table tbody td > * {
    max-width: 100%;
}

.app-shell #purchaseList .purchase-premium-table tbody td strong,
.app-shell #purchaseList .purchase-premium-table tbody td small,
.app-shell #purchaseList .purchase-premium-table tbody td span,
.app-shell #purchaseList .purchase-premium-table tbody td code {
    overflow-wrap: anywhere;
}

.app-shell #purchaseList .purchase-premium-table.responsive-cards tbody td > strong,
.app-shell #purchaseList .purchase-premium-table.responsive-cards tbody td > code,
.app-shell #purchaseList .purchase-premium-table.responsive-cards tbody td > span,
.app-shell #purchaseList .purchase-premium-table.responsive-cards tbody td > small,
.app-shell #purchaseList .purchase-premium-table.responsive-cards tbody td > div:not(.management-badges) {
    justify-self: start;
    text-align: left;
}

.app-shell #purchaseList .purchase-premium-table tbody td small {
    line-height: 1.32;
}

.app-shell #purchaseList .purchase-premium-table tbody td.action-cell {
    position: static !important;
    display: grid;
    align-content: start;
    grid-template-columns: minmax(0, 1fr);
    gap: 7px;
    padding: 10px;
    background: #f8fafc;
    box-shadow: none !important;
    text-align: left !important;
}

.app-shell #purchaseList .purchase-premium-table tbody td.action-cell::before {
    display: none;
}

.app-shell #purchaseList .purchase-premium-table tbody td.action-cell form,
.app-shell #purchaseList .purchase-premium-table tbody td.action-cell .btn {
    width: 100%;
    min-width: 0;
    margin: 0;
}

.app-shell #purchaseList .purchase-premium-table tbody td.action-cell .btn {
    justify-content: center;
}

@media (max-width: 1399.98px) {
    .app-shell #purchaseList .purchase-premium-table tbody tr {
        grid-template-columns: minmax(150px, .8fr) minmax(260px, 1.45fr) minmax(170px, .9fr) minmax(170px, .9fr);
    }

    .app-shell #purchaseList .purchase-premium-table tbody td {
        border-bottom: 1px solid #eef3f8;
    }

    .app-shell #purchaseList .purchase-premium-table tbody td:nth-child(4n),
    .app-shell #purchaseList .purchase-premium-table tbody td:last-child {
        border-right: 0;
    }

    .app-shell #purchaseList .purchase-premium-table tbody td:nth-last-child(-n+3) {
        border-bottom: 0;
    }

    .app-shell #purchaseList .purchase-premium-table tbody td.action-cell {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 1199.98px) {

    .app-shell #purchaseList .purchase-premium-table tbody tr {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .app-shell #purchaseList .purchase-premium-table tbody td:nth-child(2n) {
        border-right: 0;
    }

    .app-shell #purchaseList .purchase-premium-table tbody td:nth-last-child(-n+3) {
        border-bottom: 1px solid #eef3f8;
    }

    .app-shell #purchaseList .purchase-premium-table tbody td.action-cell {
        grid-column: 1 / -1;
    }

    .app-shell #purchaseList .purchase-premium-table tbody td:last-child {
        border-bottom: 0;
    }
}

@media (max-width: 767.98px) {

    .app-shell #purchaseList .purchase-premium-table tbody tr {
        grid-template-columns: minmax(0, 1fr);
        gap: 0;
    }

    .app-shell #purchaseList .purchase-premium-table tbody td {
        padding: 9px 11px;
        border-right: 0;
        border-bottom: 1px solid #eef3f8;
    }

    .app-shell #purchaseList .purchase-premium-table tbody td:last-child {
        border-bottom: 0;
    }

    .app-shell #purchaseList .purchase-premium-table tbody td.action-cell {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        padding: 10px;
    }
}

/* Compact filter rail */
.app-shell .compact-filter-bar {
    width: 100%;
    padding: 9px;
    border: 1px solid var(--module-line, #dce5ef);
    border-radius: 8px;
    background: linear-gradient(180deg, #fff, rgba(var(--module-primary-rgb, 20, 99, 255), .035));
}

.app-shell .compact-filter-row {
    display: grid;
    align-items: start;
    gap: 8px;
    grid-template-columns: minmax(220px, 1fr) auto auto;
}

.app-shell .compact-filter-search {
    position: relative;
    display: block;
    min-width: 0;
    margin: 0;
}

.app-shell .compact-filter-search span {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
}

.app-shell .compact-filter-search i {
    position: absolute;
    top: 50%;
    left: 12px;
    color: var(--slate-500);
    font-size: .9rem;
    transform: translateY(-50%);
    pointer-events: none;
}

.app-shell .compact-filter-search .form-control {
    min-height: 38px;
    padding-left: 36px;
}

.app-shell .compact-filter-advanced {
    position: relative;
    min-width: 170px;
}

.app-shell .compact-filter-advanced summary {
    display: inline-flex;
    min-height: 38px;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 7px 12px;
    border: 1px solid #d7e2ee;
    border-radius: 8px;
    color: var(--slate-700);
    background: #fff;
    font-size: .78rem;
    font-weight: 750;
    cursor: pointer;
    user-select: none;
}

.app-shell .compact-filter-advanced summary::-webkit-details-marker {
    display: none;
}

.app-shell .compact-filter-advanced[open] summary {
    border-color: rgba(var(--module-primary-rgb, 20, 99, 255), .34);
    color: var(--module-primary, var(--blue-600));
    background: rgba(var(--module-primary-rgb, 20, 99, 255), .065);
}

.app-shell .compact-filter-grid {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    z-index: 30;
    display: grid;
    width: min(720px, calc(100vw - 72px));
    gap: 10px;
    padding: 12px;
    border: 1px solid var(--module-line, #dce5ef);
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 18px 42px rgba(15, 32, 58, .13);
    grid-template-columns: repeat(3, minmax(150px, 1fr));
}

.app-shell .compact-filter-grid .form-label {
    margin-bottom: 4px;
    color: var(--slate-500);
    font-size: .68rem;
    font-weight: 800;
    text-transform: uppercase;
}

.app-shell .compact-filter-actions {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 7px;
}

.app-shell .compact-filter-actions .btn {
    min-height: 38px;
    white-space: nowrap;
}

@media (max-width: 991.98px) {
    .app-shell .compact-filter-row {
        grid-template-columns: minmax(0, 1fr) auto;
    }

    .app-shell .compact-filter-actions {
        grid-column: 1 / -1;
        justify-content: flex-end;
    }
}

@media (max-width: 575.98px) {
    .app-shell .compact-filter-row {
        grid-template-columns: 1fr;
    }

    .app-shell .compact-filter-advanced,
    .app-shell .compact-filter-advanced summary,
    .app-shell .compact-filter-actions,
    .app-shell .compact-filter-actions .btn {
        width: 100%;
    }

    .app-shell .compact-filter-grid {
        position: static;
        width: 100%;
        margin-top: 8px;
        grid-template-columns: 1fr;
        box-shadow: none;
    }

    .app-shell .compact-filter-actions {
        flex-direction: column;
    }
}

/* Cleaner section headers: remove square title washes from dense screens. */
.app-shell .table-toolbar,
.app-shell .responsive-toolbar,
.app-shell .card-titlebar,
.app-shell .form-toolbar,
.app-shell .finance-card-heading {
    position: relative;
    align-items: center;
    margin-bottom: 12px;
    padding: 0 0 11px;
    border-bottom: 1px solid rgba(203, 213, 225, .72);
    background: transparent !important;
}

.app-shell .table-toolbar::after,
.app-shell .responsive-toolbar::after,
.app-shell .card-titlebar::after,
.app-shell .form-toolbar::after,
.app-shell .finance-card-heading::after {
    position: absolute;
    right: 0;
    bottom: -1px;
    left: 0;
    height: 1px;
    background: linear-gradient(90deg, rgba(var(--module-primary-rgb, 20, 99, 255), .28), rgba(255, 255, 255, 0) 42%);
    content: "";
    pointer-events: none;
}

.app-shell .table-toolbar .toolbar-copy,
.app-shell .responsive-toolbar .toolbar-copy,
.app-shell .card-titlebar .toolbar-copy,
.app-shell .form-toolbar .toolbar-copy {
    position: relative;
    padding-left: 12px;
}

.app-shell .table-toolbar .toolbar-copy::before,
.app-shell .responsive-toolbar .toolbar-copy::before,
.app-shell .card-titlebar .toolbar-copy::before,
.app-shell .form-toolbar .toolbar-copy::before {
    position: absolute;
    top: 3px;
    bottom: 3px;
    left: 0;
    width: 3px;
    border-radius: 3px;
    background: var(--module-primary, var(--blue-600));
    content: "";
}

.app-shell .toolbar-copy h2,
.app-shell .toolbar-copy h3,
.app-shell .finance-card-heading h2 {
    color: var(--module-ink, var(--slate-900));
    font-size: .95rem;
    line-height: 1.22;
}

.app-shell .toolbar-copy p,
.app-shell .finance-card-heading p {
    margin-top: 4px;
    color: var(--slate-500);
    font-size: .72rem;
}

.app-shell .finance-card-heading > span {
    border-radius: 8px;
    box-shadow: inset 0 0 0 1px rgba(var(--module-primary-rgb, 20, 99, 255), .14);
}

@media (max-width: 575.98px) {
    .app-shell .table-toolbar,
    .app-shell .responsive-toolbar,
    .app-shell .card-titlebar,
    .app-shell .form-toolbar,
    .app-shell .finance-card-heading {
        padding-bottom: 10px;
    }
}

/* Responsive table safety: dense cards and receiving tables need content-driven height. */
body.app-shell[data-module] .responsive-cards tbody td,
body.app-shell[data-module] #purchaseList .purchase-premium-table tbody td,
body.app-shell[data-module] .purchase-conference-table td {
    height: auto;
    min-height: 0;
}

body.app-shell[data-module] .responsive-cards tbody tr,
body.app-shell[data-module] #purchaseList .purchase-premium-table tbody tr,
body.app-shell[data-module] .purchase-conference-table tr {
    height: auto;
}

body.app-shell[data-module] #purchaseList .table-responsive,
body.app-shell[data-module] .purchase-conference-item .table-responsive {
    overflow-x: auto !important;
    overflow-y: visible;
}

body.app-shell[data-module] .purchase-conference-table input.form-control,
body.app-shell[data-module] .purchase-conference-table select.form-select,
body.app-shell[data-module] .purchase-conference-table .grade-size-builder,
body.app-shell[data-module] .purchase-conference-table .grade-size-row {
    max-width: 100%;
    min-width: 0;
}

body.app-shell[data-module] #purchaseList .purchase-premium-table tbody td > *,
body.app-shell[data-module] .responsive-cards tbody td > * {
    max-width: 100%;
}

/* Receiving action buttons need room for operational labels. */
body.app-shell[data-module="purchases"] #purchaseList .purchase-premium-table tbody tr {
    grid-template-columns: minmax(132px, .72fr) minmax(240px, 1.35fr) minmax(150px, .78fr) minmax(150px, .78fr) minmax(150px, .78fr) minmax(135px, .64fr) minmax(168px, .74fr);
}

body.app-shell[data-module="purchases"] #purchaseList .purchase-premium-table tbody td.action-cell {
    min-width: 168px;
    grid-template-columns: repeat(auto-fit, minmax(118px, 1fr));
    align-items: start;
}

body.app-shell[data-module="purchases"] #purchaseList .purchase-premium-table tbody td.action-cell form,
body.app-shell[data-module="purchases"] #purchaseList .purchase-premium-table tbody td.action-cell .btn {
    min-width: 0;
}

body.app-shell[data-module="purchases"] #purchaseList .purchase-premium-table tbody td.action-cell .btn {
    min-height: 34px;
    gap: 6px;
    padding: .42rem .58rem;
    overflow: hidden;
    white-space: nowrap;
}

body.app-shell[data-module="purchases"] #purchaseList .purchase-premium-table tbody td.action-cell .btn span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

@media (max-width: 1399.98px) {
    body.app-shell[data-module="purchases"] #purchaseList .purchase-premium-table tbody tr {
        grid-template-columns: minmax(150px, .8fr) minmax(260px, 1.45fr) minmax(170px, .9fr) minmax(170px, .9fr);
    }

    body.app-shell[data-module="purchases"] #purchaseList .purchase-premium-table tbody td.action-cell {
        grid-column: span 2;
        grid-template-columns: repeat(auto-fit, minmax(112px, 1fr));
    }
}

@media (max-width: 1199.98px) {
    body.app-shell[data-module="purchases"] #purchaseList .purchase-premium-table tbody tr {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.app-shell[data-module="purchases"] #purchaseList .purchase-premium-table tbody td.action-cell {
        grid-column: 1 / -1;
        grid-template-columns: repeat(auto-fit, minmax(124px, 1fr));
    }
}

@media (max-width: 575.98px) {
    body.app-shell[data-module="purchases"] #purchaseList .purchase-premium-table tbody tr {
        grid-template-columns: minmax(0, 1fr);
    }

    body.app-shell[data-module="purchases"] #purchaseList .purchase-premium-table tbody td.action-cell {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* Integrated compact filters: clear search, light advanced options and fewer nested boxes. */
body.app-shell[data-module] .compact-filter-bar {
    margin-bottom: 14px;
    padding: 8px;
    border: 1px solid rgba(185, 202, 220, .76);
    border-radius: 8px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, .96), rgba(var(--module-primary-rgb), .045)),
        rgba(255, 255, 255, .9);
    box-shadow: 0 8px 18px rgba(18, 40, 68, .055);
}

body.app-shell[data-module] .compact-filter-row {
    display: grid;
    align-items: stretch;
    gap: 8px;
    grid-template-columns: minmax(280px, 1fr) auto auto;
}

body.app-shell[data-module] .compact-filter-search {
    display: flex;
    min-height: 40px;
    align-items: center;
    border: 1px solid rgba(var(--module-primary-rgb), .22);
    border-radius: 8px;
    background: #fff;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .9), 0 6px 14px rgba(18, 40, 68, .045);
}

body.app-shell[data-module] .compact-filter-search i {
    left: 13px;
    color: var(--module-primary);
    font-size: .95rem;
}

body.app-shell[data-module] .compact-filter-search .form-control {
    min-height: 40px;
    border: 0;
    background: transparent;
    box-shadow: none;
    font-size: .84rem;
    font-weight: 750;
}

body.app-shell[data-module] .compact-filter-search .form-control::placeholder {
    color: #7b8aa0;
    font-weight: 650;
}

body.app-shell[data-module] .compact-filter-search:focus-within {
    border-color: rgba(var(--module-primary-rgb), .55);
    box-shadow: 0 0 0 .18rem rgba(var(--module-primary-rgb), .1), 0 8px 18px rgba(18, 40, 68, .065);
}

body.app-shell[data-module] .compact-filter-advanced {
    min-width: 0;
}

body.app-shell[data-module] .compact-filter-advanced summary {
    min-height: 40px;
    border-color: rgba(185, 202, 220, .74);
    border-radius: 8px;
    color: #526176;
    background: rgba(255, 255, 255, .76);
    box-shadow: none;
    font-size: .76rem;
    font-weight: 850;
}

body.app-shell[data-module] .compact-filter-advanced summary::after {
    display: inline-block;
    margin-left: 2px;
    color: #7b8aa0;
    content: "\F282";
    font-family: "bootstrap-icons";
    font-size: .72rem;
    transition: transform .16s ease;
}

body.app-shell[data-module] .compact-filter-advanced[open] summary {
    border-color: rgba(var(--module-primary-rgb), .34);
    color: var(--module-ink);
    background: rgba(var(--module-primary-rgb), .075);
}

body.app-shell[data-module] .compact-filter-advanced[open] summary::after {
    transform: rotate(180deg);
}

body.app-shell[data-module] .compact-filter-grid {
    top: calc(100% + 7px);
    right: 0;
    width: min(680px, calc(100vw - 72px));
    padding: 10px;
    border: 1px solid rgba(185, 202, 220, .82);
    border-radius: 8px;
    background: rgba(255, 255, 255, .98);
    box-shadow: 0 16px 34px rgba(18, 40, 68, .13);
    grid-template-columns: repeat(3, minmax(150px, 1fr));
}

body.app-shell[data-module] .compact-filter-grid .form-label {
    color: #5f6f85;
    font-size: .64rem;
    letter-spacing: .045em;
}

body.app-shell[data-module] .compact-filter-grid .form-control,
body.app-shell[data-module] .compact-filter-grid .form-select {
    min-height: 38px;
    background-color: #fff;
}

body.app-shell[data-module] .compact-filter-actions {
    display: flex;
    align-items: stretch;
    gap: 7px;
}

body.app-shell[data-module] .compact-filter-actions .btn {
    min-height: 40px;
    padding-inline: 13px;
}

body.app-shell[data-module] .compact-filter-actions .filter-action {
    border-color: transparent;
    color: #fff;
    background: linear-gradient(135deg, var(--module-primary), var(--module-accent));
    box-shadow: 0 8px 16px rgba(var(--module-primary-rgb), .16);
}

body.app-shell[data-module] .compact-filter-actions .btn-outline-secondary {
    background: rgba(255, 255, 255, .62);
}

@media (max-width: 991.98px) {
    body.app-shell[data-module] .compact-filter-row {
        grid-template-columns: minmax(0, 1fr) auto;
    }

    body.app-shell[data-module] .compact-filter-actions {
        grid-column: 1 / -1;
        justify-content: flex-end;
    }
}

@media (max-width: 575.98px) {
    body.app-shell[data-module] .compact-filter-row {
        grid-template-columns: minmax(0, 1fr);
    }

    body.app-shell[data-module] .compact-filter-advanced,
    body.app-shell[data-module] .compact-filter-advanced summary,
    body.app-shell[data-module] .compact-filter-actions,
    body.app-shell[data-module] .compact-filter-actions .btn {
        width: 100%;
    }

    body.app-shell[data-module] .compact-filter-grid {
        position: static;
        width: 100%;
        margin-top: 8px;
        border-color: rgba(203, 216, 230, .82);
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .82);
        grid-template-columns: minmax(0, 1fr);
    }

    body.app-shell[data-module] .compact-filter-actions {
        flex-direction: column;
    }
}

/* Modal layer guard: keeps popups above the dim backdrop even inside tabs/cards. */
body.app-shell .modal {
    z-index: 2055;
}

body.app-shell .modal-backdrop {
    z-index: 2050;
}

body.app-shell .modal.show {
    display: block;
}

body.app-shell .modal-dialog,
body.app-shell .modal-content {
    pointer-events: auto;
}

@media (max-width: 575.98px) {
    body.app-shell .modal.show {
        padding: 0 !important;
    }

    body.app-shell .modal.show .modal-dialog {
        width: calc(100% - 16px);
        max-width: calc(100% - 16px);
        height: calc(100dvh - 16px);
        min-height: calc(100dvh - 16px);
        margin: 8px auto;
    }

    body.app-shell .modal.show .modal-dialog-centered {
        align-items: stretch;
        min-height: calc(100dvh - 16px);
    }

    body.app-shell .modal.show .modal-content {
        display: flex;
        max-height: calc(100dvh - 16px);
        height: 100%;
        overflow: hidden;
        border-radius: 12px;
        flex-direction: column;
    }

    body.app-shell .modal.show .modal-header,
    body.app-shell .modal.show .modal-footer {
        flex: 0 0 auto;
    }

    body.app-shell .modal.show .modal-header {
        padding: 14px 16px 12px;
    }

    body.app-shell .modal.show .modal-title {
        font-size: .96rem;
        line-height: 1.2;
    }

    body.app-shell .modal.show .modal-body {
        flex: 1 1 auto;
        min-height: 0;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }

    body.app-shell .modal.show .modal-footer {
        position: sticky;
        bottom: 0;
        z-index: 3;
        margin-top: 0;
        padding: 10px 12px calc(10px + env(safe-area-inset-bottom));
        border-top: 1px solid #e4ebf3;
        background: #fff;
        box-shadow: 0 -12px 26px rgba(15, 32, 58, .08);
    }
}

body.app-shell .pagination-wrap {
    color: var(--premium-muted-strong);
}

body.app-shell .pagination-wrap .page-link {
    color: var(--premium-ink);
    font-weight: 820;
}

body.app-shell[data-module] .pagination-wrap .page-item.active .page-link {
    border-color: var(--module-primary, var(--premium-blue));
    background: linear-gradient(135deg, var(--module-primary, var(--premium-blue)), var(--module-accent, var(--premium-teal)));
}

body.app-shell .empty-state,
body.app-shell .table-empty-filter {
    color: var(--premium-muted-strong);
    font-weight: 720;
}

/* Layout overlap guard: keep dense operational screens from clipping text or action buttons. */
body.app-shell :where(.btn, .nav-link, .dropdown-item, .badge, .record-count, .nav-counter) {
    min-width: 0;
    max-width: 100%;
}

body.app-shell :where(.btn:not(.btn-icon-only), .dropdown-item, .operation-tabs .nav-link, .inner-operation-tabs .nav-link, .settings-tabs .nav-link, .product-inner-tabs .nav-link, .finance-inner-tabs .nav-link, .pdv-panel-tabs .nav-link) {
    white-space: normal;
    overflow-wrap: anywhere;
}

body.app-shell :where(.btn, .nav-link, .dropdown-item) > span {
    min-width: 0;
    overflow-wrap: anywhere;
}
body.app-shell :where(.form-actions,
.page-actions,
.management-filter-actions,
.compact-filter-actions,
.finance-filter-actions,
.product-filter-actions,
.purchase-flow-shortcut-actions,
.stock-label-actions) {
    flex-wrap: wrap;
    min-width: 0;
}
body.app-shell :where(.form-actions,
.page-actions,
.management-filter-actions,
.compact-filter-actions,
.finance-filter-actions,
.product-filter-actions,
.purchase-flow-shortcut-actions,
.stock-label-actions) > * {
    min-width: 0;
}

body.app-shell :where(.action-cell, .table-responsive table .action-cell),
body.app-shell[data-module] .action-cell {
    width: auto;
    min-width: 0;
    white-space: normal;
}

body.app-shell :where(.action-cell form, .action-cell .btn),
body.app-shell[data-module] .action-cell :where(form, .btn) {
    max-width: 100%;
    white-space: normal;
}

body.app-shell :where(.table td, .table th, .responsive-cards tbody td, .purchase-premium-table tbody td) > * {
    min-width: 0;
}

body.app-shell :where(.toolbar-copy, .card-titlebar, .finance-card-heading, .stock-lot-label-head, .stock-grade-section-head, .dashboard-clean-section-head, .section-heading) {
    min-width: 0;
    overflow-wrap: anywhere;
}
body.app-shell :where(.metric-mini,
.stock-kpi,
.finance-summary-card,
.category-insight-card,
.purchase-preview-grid > div,
.purchase-receiving-summary > div,
.dashboard-clean-summary-grid article,
.management-strip > div,
.report-summary-strip > div,
.stock-transfer-dashboard > div,
.stock-grade-dashboard > div,
.deposit-usage-item,
.settings-usage-card,
.finance-snapshot > div) > * {
    min-width: 0;
    overflow-wrap: anywhere;
}

body.app-shell[data-module="purchases"] #purchaseList .purchase-premium-table tbody td.action-cell .btn {
    overflow: visible;
    white-space: normal;
    line-height: 1.15;
}

body.app-shell[data-module="purchases"] #purchaseList .purchase-premium-table tbody td.action-cell .btn span {
    overflow: visible;
    text-overflow: clip;
    white-space: normal;
}

@media (max-width: 575.98px) {
body.app-shell :where(.form-actions,
.page-actions,
.management-filter-actions,
.compact-filter-actions,
.finance-filter-actions,
.product-filter-actions,
.purchase-flow-shortcut-actions,
.stock-label-actions) {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
    }
body.app-shell :where(.form-actions,
.page-actions,
.management-filter-actions,
.compact-filter-actions,
.finance-filter-actions,
.product-filter-actions,
.purchase-flow-shortcut-actions,
.stock-label-actions) > *,
body.app-shell :where(.form-actions,
.page-actions,
.management-filter-actions,
.compact-filter-actions,
.finance-filter-actions,
.product-filter-actions,
.purchase-flow-shortcut-actions,
.stock-label-actions) .btn {
        width: 100%;
    }
}

/* Final topbar spacing guard: keeps the menu icon, module dot and title from being squeezed. */
body.app-shell .topbar {
    align-items: center !important;
    gap: 16px;
}

body.app-shell .topbar > .d-flex:first-child {
    display: grid !important;
    grid-template-columns: 42px minmax(0, 1fr);
    align-items: center;
    gap: 16px !important;
    min-width: 220px;
    flex: 1 1 auto;
}

body.app-shell .shell-toggle {
    width: 42px;
    height: 42px;
    min-width: 42px;
    flex: 0 0 42px;
    border-radius: 10px;
}

body.app-shell .topbar-heading {
    display: grid;
    gap: 3px;
    min-width: 0;
}

body.app-shell .topbar-title {
    display: flex;
    align-items: center;
    gap: 8px;
    max-width: none;
    min-width: 0;
    margin: 0;
    overflow: visible;
    line-height: 1.18;
    text-overflow: clip;
    white-space: normal;
}

body.app-shell[data-module] .topbar-title::before {
    flex: 0 0 9px;
    margin-right: 0;
}

body.app-shell .topbar-kicker {
    display: block;
    max-width: 100%;
    overflow: visible;
    line-height: 1.28;
    text-overflow: clip;
    white-space: normal;
}

@media (max-width: 767.98px) {
    body.app-shell .topbar {
        flex-wrap: nowrap;
        min-height: 64px;
        padding: 10px 12px;
    }

    body.app-shell .topbar > .d-flex:first-child {
        grid-template-columns: 40px minmax(0, 1fr);
        gap: 12px !important;
        min-width: 0;
    }

    body.app-shell .shell-toggle {
        width: 40px;
        height: 40px;
        min-width: 40px;
        flex-basis: 40px;
    }

    body.app-shell .topbar-actions .logout-link,
    body.app-shell .user-menu {
        min-width: 42px;
        min-height: 42px;
    }

    body.app-shell .topbar-actions .logout-link {
        width: 42px;
        height: 42px;
    }

    body.app-shell .topbar-avatar {
        width: 40px;
        height: 40px;
    }

    body.app-shell .topbar-title {
        font-size: 1.05rem;
    }

    body.app-shell .topbar-kicker {
        font-size: .72rem;
    }
}

/* Operational UX clarity pass: flatter, denser work screens for stock and purchases. */
body.app-shell[data-module="stock"],
body.app-shell[data-module="purchases"] {
    --ops-surface: #ffffff;
    --ops-subtle: #f6f9fc;
    --ops-line: #dbe5ef;
    --ops-line-strong: #c8d6e4;
    --ops-ink: #142338;
    --ops-muted: #667892;
}

body.app-shell[data-module="stock"] .content-wrap,
body.app-shell[data-module="purchases"] .content-wrap {
    display: grid;
    gap: 12px;
}

body.app-shell[data-module="stock"] :where(.card, .purchase-panel, .data-card),
body.app-shell[data-module="purchases"] :where(.card, .purchase-panel, .data-card) {
    overflow: hidden;
    border-color: var(--ops-line);
    border-radius: 8px;
    background: var(--ops-surface);
    box-shadow: none;
}

body.app-shell[data-module="stock"] :where(.card, .purchase-panel, .data-card):hover,
body.app-shell[data-module="purchases"] :where(.card, .purchase-panel, .data-card):hover {
    transform: none;
    box-shadow: none;
}

body.app-shell[data-module="stock"] .card-body,
body.app-shell[data-module="purchases"] .card-body {
    padding: 14px;
}

body.app-shell[data-module="stock"] :where(.table-toolbar, .responsive-toolbar),
body.app-shell[data-module="purchases"] :where(.table-toolbar, .responsive-toolbar) {
    align-items: center;
    margin-bottom: 10px;
    padding: 0 0 9px;
    border-bottom: 1px solid var(--ops-line);
    background: transparent !important;
}

body.app-shell[data-module="stock"] :where(.table-toolbar, .responsive-toolbar)::after,
body.app-shell[data-module="stock"] :where(.table-toolbar, .responsive-toolbar) .toolbar-copy::before,
body.app-shell[data-module="purchases"] :where(.table-toolbar, .responsive-toolbar)::after,
body.app-shell[data-module="purchases"] :where(.table-toolbar, .responsive-toolbar) .toolbar-copy::before {
    display: none;
}

body.app-shell[data-module="stock"] :where(.table-toolbar, .responsive-toolbar) .toolbar-copy,
body.app-shell[data-module="purchases"] :where(.table-toolbar, .responsive-toolbar) .toolbar-copy {
    padding-left: 0;
}

body.app-shell[data-module="stock"] .toolbar-copy h2,
body.app-shell[data-module="stock"] .toolbar-copy h3,
body.app-shell[data-module="purchases"] .toolbar-copy h2,
body.app-shell[data-module="purchases"] .toolbar-copy h3 {
    color: var(--ops-ink);
    font-size: .93rem;
    font-weight: 860;
}

body.app-shell[data-module="stock"] .toolbar-copy p,
body.app-shell[data-module="purchases"] .toolbar-copy p {
    margin-top: 2px;
    color: var(--ops-muted);
    font-size: .72rem;
}

body.app-shell[data-module="stock"] :where(.operation-tabs, .inner-operation-tabs),
body.app-shell[data-module="purchases"] :where(.operation-tabs, .inner-operation-tabs) {
    gap: 6px;
    margin-bottom: 10px;
    padding: 5px;
    border-color: var(--ops-line);
    border-radius: 8px;
    background: var(--ops-surface);
    box-shadow: none;
}

body.app-shell[data-module="stock"] :where(.operation-tabs, .inner-operation-tabs) .nav-link,
body.app-shell[data-module="purchases"] :where(.operation-tabs, .inner-operation-tabs) .nav-link {
    min-height: 34px;
    padding: 7px 10px;
    border-radius: 6px;
    color: #4b5f76;
    font-size: .76rem;
}

body.app-shell[data-module="stock"] :where(.operation-tabs, .inner-operation-tabs) .nav-link.active,
body.app-shell[data-module="purchases"] :where(.operation-tabs, .inner-operation-tabs) .nav-link.active {
    color: #fff;
    background: var(--module-primary, #1768e5);
    box-shadow: none;
}

body.app-shell[data-module="stock"] :where(.compact-filter-bar, .stock-lot-filter),
body.app-shell[data-module="purchases"] :where(.compact-filter-bar, .stock-lot-filter) {
    padding: 10px;
    border-color: var(--ops-line);
    border-radius: 8px;
    background: var(--ops-subtle);
    box-shadow: none;
}

body.app-shell[data-module="stock"] :where(.stock-kpi, .stock-grade-dashboard > div, .stock-transfer-dashboard > div),
body.app-shell[data-module="purchases"] :where(.purchase-receiving-summary > div) {
    min-height: 0;
    padding: 10px 12px;
    border-color: var(--ops-line);
    border-radius: 8px;
    background: var(--ops-surface);
    box-shadow: none;
}

body.app-shell[data-module="stock"] :where(.stock-kpi, .stock-grade-dashboard > div, .stock-transfer-dashboard > div)::before,
body.app-shell[data-module="purchases"] :where(.purchase-receiving-summary > div)::before {
    display: none;
}

body.app-shell[data-module="stock"] :where(.stock-kpi, .stock-grade-dashboard > div, .stock-transfer-dashboard > div) span,
body.app-shell[data-module="purchases"] :where(.purchase-receiving-summary > div) span {
    color: var(--ops-muted);
    font-size: .64rem;
    letter-spacing: .04em;
}

body.app-shell[data-module="stock"] :where(.stock-kpi, .stock-grade-dashboard > div, .stock-transfer-dashboard > div) strong,
body.app-shell[data-module="purchases"] :where(.purchase-receiving-summary > div) strong {
    color: var(--ops-ink);
    font-size: 1.02rem;
    line-height: 1.18;
}

body.app-shell[data-module="stock"] :where(.table, .stock-premium-table, .stock-lot-table),
body.app-shell[data-module="purchases"] :where(.table, .purchase-premium-table) {
    margin-bottom: 0;
}

body.app-shell[data-module="stock"] :where(.table, .stock-premium-table, .stock-lot-table) th,
body.app-shell[data-module="purchases"] :where(.table, .purchase-premium-table) th {
    padding: 9px 10px;
    color: #52657d;
    background: #f8fafc;
    font-size: .68rem;
    font-weight: 850;
    letter-spacing: .03em;
}

body.app-shell[data-module="stock"] :where(.table, .stock-premium-table, .stock-lot-table) td,
body.app-shell[data-module="purchases"] :where(.table, .purchase-premium-table) td {
    padding: 10px;
    vertical-align: middle;
}

body.app-shell[data-module="stock"] :where(.table, .stock-premium-table, .stock-lot-table) tbody tr:hover,
body.app-shell[data-module="purchases"] :where(.table, .purchase-premium-table) tbody tr:hover {
    background: #f9fbfd;
}

body.app-shell[data-module="stock"] :where(.btn),
body.app-shell[data-module="purchases"] :where(.btn) {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    justify-content: center;
    gap: 7px;
    border-radius: 7px;
    box-shadow: none !important;
}

body.app-shell[data-module="stock"] :where(.btn-sm, .table .btn-sm),
body.app-shell[data-module="purchases"] :where(.btn-sm, .table .btn-sm) {
    min-height: 31px;
    padding: 5px 8px;
}

body.app-shell[data-module="stock"] :where(.alert),
body.app-shell[data-module="purchases"] :where(.alert) {
    border-top: 1px solid var(--ops-line);
    border-right: 1px solid var(--ops-line);
    border-bottom: 1px solid var(--ops-line);
    border-left-width: 4px;
    border-radius: 8px;
    box-shadow: none;
}

body.app-shell[data-module="stock"] :where(.empty-state),
body.app-shell[data-module="purchases"] :where(.empty-state) {
    padding: 18px 12px !important;
    border: 1px dashed var(--ops-line-strong);
    border-radius: 8px;
    background: #fbfdff;
}

body.app-shell[data-module="stock"] :where(.stock-lot-label-panel, .stock-label-transfer-card, .stock-transfer-list-card),
body.app-shell[data-module="purchases"] :where(.purchase-panel) {
    border-radius: 8px;
}

@media (max-width: 767.98px) {
    body.app-shell[data-module="stock"] .card-body,
    body.app-shell[data-module="purchases"] .card-body {
        padding: 12px;
    }

    body.app-shell[data-module="stock"] :where(.operation-tabs, .inner-operation-tabs),
    body.app-shell[data-module="purchases"] :where(.operation-tabs, .inner-operation-tabs) {
        overflow-x: auto;
        flex-wrap: nowrap;
    }
}

/* Sidebar refinement: compact, calmer navigation with stronger active state. */
body.app-shell .sidebar {
    width: var(--sidebar-width);
    padding: 16px 12px 12px;
    background: #0b1f33 !important;
    border-right: 1px solid rgba(148, 163, 184, .13);
    box-shadow: 4px 0 18px rgba(7, 20, 38, .09);
}

body.app-shell .brand {
    min-height: 74px;
    justify-content: center;
    padding: 0 8px 14px;
}

body.app-shell .brand-logo {
    width: min(188px, 100%);
    height: 64px;
    filter: none;
}

body.app-shell .brand-logo-symbol {
    width: 44px;
    height: 44px;
    filter: none;
}

body.app-shell .sidebar nav.sidebar-nav {
    gap: 3px;
    padding: 0 2px 8px 0;
}

body.app-shell .sidebar-section {
    gap: 2px;
    padding: 5px 0 6px;
}

body.app-shell .sidebar-section + .sidebar-section {
    margin-top: 3px;
    border-top: 1px solid rgba(148, 163, 184, .10);
}

body.app-shell .nav-label {
    padding: 8px 10px 4px;
    color: #7f93ad;
    font-size: .61rem;
    font-weight: 820;
    letter-spacing: .09em;
}

body.app-shell .nav-label::after {
    background: rgba(148, 163, 184, .12);
}

body.app-shell .sidebar .nav-link {
    min-height: 36px;
    gap: 9px;
    margin: 0;
    padding: 7px 9px;
    border: 1px solid transparent;
    border-radius: 8px;
    color: #a9b8ca;
    font-size: .78rem;
    font-weight: 650;
    line-height: 1.2;
    transition: background-color .16s ease, border-color .16s ease, color .16s ease;
}

body.app-shell .sidebar .nav-link i {
    display: grid;
    width: 26px;
    height: 26px;
    flex: 0 0 26px;
    place-items: center;
    border-radius: 7px;
    color: #8ca0ba;
    background: rgba(255, 255, 255, .035);
    font-size: .96rem;
}

body.app-shell .sidebar .nav-link span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

body.app-shell .sidebar .nav-link:hover {
    color: #edf6ff;
    background: rgba(255, 255, 255, .06);
    border-color: rgba(148, 163, 184, .10);
    transform: none;
}

body.app-shell .sidebar .nav-link:hover i {
    color: #e7f0ff;
    background: rgba(96, 165, 250, .13);
}

body.app-shell .sidebar .nav-link.active {
    color: #ffffff;
    background: rgba(37, 99, 235, .20);
    border-color: rgba(96, 165, 250, .28);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .035);
}

body.app-shell .sidebar .nav-link.active::before {
    inset: 8px auto 8px -1px;
    width: 3px;
    border-radius: 0 6px 6px 0;
    background: #38bdf8;
}

body.app-shell .sidebar .nav-link.active i {
    color: #ffffff;
    background: #2563eb;
}

body.app-shell .nav-counter {
    min-width: 20px;
    padding: 2px 6px;
    border: 1px solid rgba(96, 165, 250, .24);
    color: #dbeafe;
    background: rgba(37, 99, 235, .20);
    font-size: .58rem;
}

body.app-shell .nav-counter-danger {
    border-color: rgba(248, 113, 113, .26);
    color: #fee2e2;
    background: rgba(220, 38, 38, .20);
}

body.app-shell .sidebar-user {
    gap: 9px;
    padding: 11px 7px 4px;
    border-top-color: rgba(148, 163, 184, .12);
}

body.app-shell .sidebar-avatar {
    width: 32px;
    height: 32px;
    background: #1d4ed8;
    font-size: .72rem;
}

body.app-shell .sidebar-user-copy strong {
    color: #eff6ff;
    font-size: .78rem;
}

body.app-shell .sidebar-user-copy small {
    color: #8ca0ba;
    font-size: .66rem;
}

body.app-shell .logout-link {
    width: 32px;
    height: 32px;
    border-radius: 8px;
}

body.sidebar-collapsed.app-shell .sidebar {
    width: var(--sidebar-collapsed);
    padding-right: 10px;
    padding-left: 10px;
}

body.sidebar-collapsed.app-shell .brand {
    min-height: 58px;
    padding-bottom: 12px;
}

body.sidebar-collapsed.app-shell .sidebar .nav-link {
    justify-content: center;
    min-height: 40px;
    padding-right: 0;
    padding-left: 0;
}

body.sidebar-collapsed.app-shell .sidebar .nav-link i {
    width: 30px;
    height: 30px;
    flex-basis: 30px;
}

body.sidebar-collapsed.app-shell .sidebar-user {
    justify-content: center;
    padding-right: 0;
    padding-left: 0;
}

@media (max-width: 991.98px) {
    body.app-shell .sidebar,
    body.sidebar-collapsed.app-shell .sidebar {
        width: var(--sidebar-width);
        padding: 16px 12px 12px;
    }

    body.app-shell .brand,
    body.sidebar-collapsed.app-shell .brand {
        min-height: 74px;
        justify-content: center;
        padding: 0 8px 14px;
    }

    body.sidebar-collapsed.app-shell .brand-logo {
        width: min(188px, 100%);
        height: 64px;
    }

    body.sidebar-collapsed.app-shell .sidebar .nav-link {
        justify-content: flex-start;
        gap: 9px;
        min-height: 36px;
        padding: 7px 9px;
    }
}

body.app-shell .empty-action {
    display: grid;
    justify-items: center;
    gap: 10px;
    padding: 34px 18px;
    border: 1px dashed #cbd8e6;
    border-radius: 10px;
    background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
    color: #607086;
    text-align: center;
}

body.app-shell .empty-action i {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 12px;
    color: #176b87;
    background: #e8f3f6;
    font-size: 1.35rem;
}

body.app-shell .empty-action h3 {
    margin: 0;
    color: #122033;
    font-size: 1rem;
    font-weight: 850;
}

body.app-shell .empty-action p {
    max-width: 440px;
    margin: 0;
    color: #667892;
    font-size: .82rem;
    line-height: 1.45;
}

body.app-shell .empty-action .empty-action-buttons {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
    margin-top: 4px;
}

body.app-shell .empty-action .btn {
    min-height: 36px;
    border-radius: 8px;
}

body.app-shell .empty-action.is-table {
    margin: 12px;
}

body.app-shell .table-empty-row td {
    padding: 0 !important;
    border-bottom: 0;
}

@media (max-width: 575.98px) {
    body.app-shell .empty-action {
        padding: 26px 14px;
    }

    body.app-shell .empty-action .empty-action-buttons,
    body.app-shell .empty-action .empty-action-buttons .btn {
        width: 100%;
    }
}

/* Final table polish: consistent admin tables without touching business logic. */
body.app-shell :where(.table-responsive) {
    border: 1px solid rgba(190, 205, 222, .84);
    border-radius: 10px;
    background: #ffffff;
}

body.app-shell :where(.table) {
    margin-bottom: 0;
    border-collapse: separate;
    border-spacing: 0;
    color: #344258;
    table-layout: auto;
}

body.app-shell :where(.table thead th) {
    position: relative;
    padding: .76rem .9rem;
    border-bottom: 1px solid #c9d6e4;
    color: #26364d;
    background: linear-gradient(180deg, #f8fbff 0%, #eef4fb 100%);
    box-shadow: inset 0 -1px 0 rgba(255, 255, 255, .88);
    font-size: .66rem;
    font-weight: 950;
    letter-spacing: .055em;
    line-height: 1.15;
    text-transform: uppercase;
    vertical-align: middle;
    white-space: nowrap;
}

body.app-shell :where(.table thead th:first-child) {
    padding-left: 1.05rem;
}

body.app-shell :where(.table thead th:last-child) {
    padding-right: 1.05rem;
    text-align: right;
}

body.app-shell :where(.table tbody td) {
    padding: .82rem .9rem;
    border-bottom: 1px solid rgba(218, 228, 238, .86);
    color: #415169;
    font-size: .83rem;
    line-height: 1.38;
    vertical-align: middle;
    word-break: normal;
    overflow-wrap: normal;
}

body.app-shell :where(.table tbody td:first-child) {
    padding-left: 1.05rem;
}

body.app-shell :where(.table tbody td:last-child) {
    padding-right: 1.05rem;
}

body.app-shell :where(.table tbody tr:nth-child(even)) {
    background: rgba(247, 250, 253, .72);
}

body.app-shell :where(.table tbody tr:hover) {
    background: rgba(var(--module-primary-rgb, 37, 99, 235), .045);
    box-shadow: inset 3px 0 0 rgba(var(--module-primary-rgb, 37, 99, 235), .34);
}

body.app-shell :where(.table tbody tr:last-child td) {
    border-bottom: 0;
}

body.app-shell :where(.table td strong, .table td .fw-semibold, .table td code) {
    color: #17243a;
    font-weight: 900;
}

body.app-shell :where(.table td:first-child strong, .table td:first-child code) {
    font-size: .87rem;
}

body.app-shell :where(.table td small, .table td .small, .table td .text-muted) {
    display: block;
    max-width: 42ch;
    margin-top: 3px;
    color: #6d7d92 !important;
    font-size: .72rem;
    line-height: 1.3;
    overflow-wrap: anywhere;
}

body.app-shell :where(.table .badge, .responsive-cards .badge, .badge[class*="text-bg-"], .badge[class*="bg-"]) {
    display: inline-flex;
    width: fit-content;
    min-height: 24px;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: .32rem .6rem;
    border: 1px solid transparent;
    border-radius: 999px;
    font-size: .64rem;
    font-weight: 900;
    letter-spacing: .025em;
    line-height: 1;
    text-transform: uppercase;
    white-space: nowrap;
}

body.app-shell :where(.badge.text-bg-success, .badge.bg-success) {
    border-color: rgba(15, 118, 110, .20);
    color: #0f5f52 !important;
    background: linear-gradient(180deg, #dbf7ee, #c9f1e4) !important;
}

body.app-shell :where(.badge.text-bg-warning, .badge.bg-warning) {
    border-color: rgba(180, 83, 9, .22);
    color: #8a4b10 !important;
    background: linear-gradient(180deg, #fff4cf, #fde7a6) !important;
}

body.app-shell :where(.badge.text-bg-danger, .badge.bg-danger) {
    border-color: rgba(185, 28, 28, .18);
    color: #9f1d1d !important;
    background: linear-gradient(180deg, #fee2e2, #fecaca) !important;
}

body.app-shell :where(.badge.text-bg-primary, .badge.bg-primary, .badge.text-bg-info, .badge.bg-info) {
    border-color: rgba(var(--module-primary-rgb, 37, 99, 235), .22);
    color: var(--module-ink, #1d4ed8) !important;
    background: linear-gradient(180deg, rgba(var(--module-primary-rgb, 37, 99, 235), .15), rgba(var(--module-accent-rgb, 14, 165, 233), .12)) !important;
}

body.app-shell :where(.badge.text-bg-secondary, .badge.bg-secondary, .badge.text-bg-light, .badge.bg-light) {
    border-color: rgba(148, 163, 184, .26);
    color: #4f5f73 !important;
    background: linear-gradient(180deg, #f8fafc, #edf2f7) !important;
}

body.app-shell :where(.action-cell, .table td.text-end:last-child) {
    width: 1%;
    min-width: 118px;
    text-align: right;
    white-space: nowrap;
}

body.app-shell :where(.action-cell form, .table td.text-end:last-child form) {
    display: inline-flex;
    margin: 2px 0 2px 5px;
    vertical-align: middle;
}

body.app-shell :where(.action-cell .btn, .table td.text-end:last-child .btn, .table .btn-sm) {
    display: inline-flex;
    min-height: 31px;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: .34rem .58rem;
    border-radius: 8px;
    font-size: .68rem;
    font-weight: 850;
    line-height: 1;
    white-space: nowrap;
}

body.app-shell :where(.action-cell .btn i, .table td.text-end:last-child .btn i, .table .btn-sm i) {
    font-size: .78rem;
}

body.app-shell :where(.action-cell .btn.btn-icon-only, .table .btn-icon-only) {
    width: 31px;
    min-width: 31px;
    height: 31px;
    padding: 0;
}

@media (max-width: 767.98px) {
    body.app-shell :where(.responsive-cards tbody td, .responsive-cards tbody td:first-child, .responsive-cards tbody td:last-child) {
        padding: .72rem .78rem;
    }

    body.app-shell :where(.responsive-cards tbody td.action-cell, .responsive-cards tbody td.text-end:last-child) {
        width: auto;
        min-width: 0;
        text-align: left;
        white-space: normal;
    }

    body.app-shell :where(.responsive-cards tbody td.action-cell .btn, .responsive-cards tbody td.action-cell form) {
        width: 100%;
        margin: 3px 0;
        white-space: normal;
    }

    body.app-shell :where(.table td small, .table td .small, .table td .text-muted) {
        max-width: none;
    }
}

body.app-shell .table thead th,
body.app-shell[data-module] .table thead th {
    padding: .76rem .9rem;
    border-bottom: 1px solid #c9d6e4;
    color: #26364d;
    background: linear-gradient(180deg, #f8fbff 0%, #eef4fb 100%);
    font-size: .66rem;
    font-weight: 950;
    letter-spacing: .055em;
    white-space: nowrap;
}

body.app-shell .table tbody td,
body.app-shell[data-module] .table tbody td {
    padding: .82rem .9rem;
    color: #415169;
    font-size: .83rem;
    line-height: 1.38;
    word-break: normal;
    overflow-wrap: normal;
}

body.app-shell .table .badge,
body.app-shell[data-module] .table .badge,
body.app-shell .responsive-cards .badge,
body.app-shell[data-module] .responsive-cards .badge {
    display: inline-flex;
    min-height: 24px;
    align-items: center;
    border-radius: 999px;
    font-size: .64rem;
    font-weight: 900;
    letter-spacing: .025em;
    text-transform: uppercase;
    white-space: nowrap;
}

body.app-shell .action-cell,
body.app-shell[data-module] .action-cell,
body.app-shell .table td.text-end:last-child,
body.app-shell[data-module] .table td.text-end:last-child {
    width: 1%;
    min-width: 118px;
    text-align: right;
    white-space: nowrap;
}

body.app-shell .action-cell .btn,
body.app-shell[data-module] .action-cell .btn,
body.app-shell .table td.text-end:last-child .btn,
body.app-shell[data-module] .table td.text-end:last-child .btn,
body.app-shell .table .btn-sm,
body.app-shell[data-module] .table .btn-sm {
    display: inline-flex;
    min-height: 31px;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: .34rem .58rem;
    border-radius: 8px;
    line-height: 1;
    white-space: nowrap;
}

@media (max-width: 767.98px) {
    body.app-shell .responsive-cards tbody td.action-cell,
    body.app-shell[data-module] .responsive-cards tbody td.action-cell,
    body.app-shell .responsive-cards tbody td.text-end:last-child,
    body.app-shell[data-module] .responsive-cards tbody td.text-end:last-child {
        width: auto;
        min-width: 0;
        text-align: left;
        white-space: normal;
    }

    body.app-shell .responsive-cards tbody td.action-cell .btn,
    body.app-shell[data-module] .responsive-cards tbody td.action-cell .btn,
    body.app-shell .responsive-cards tbody td.action-cell form,
    body.app-shell[data-module] .responsive-cards tbody td.action-cell form {
        width: 100%;
        white-space: normal;
    }
}

/* Button hierarchy: primary teal, secondary bordered, danger red, neutral gray, print/export blue. */
body.app-shell {
    --action-primary: #0f766e;
    --action-primary-hover: #0b5f59;
    --action-primary-soft: #e7f5f3;
    --action-secondary-border: #cbd5e1;
    --action-secondary-text: #334155;
    --action-secondary-hover: #f8fafc;
    --action-neutral: #64748b;
    --action-neutral-hover: #475569;
    --action-danger: #dc2626;
    --action-danger-hover: #b91c1c;
    --action-export: #2563eb;
    --action-export-hover: #1d4ed8;
    --action-export-soft: #eff6ff;
}

body.app-shell :where(.btn) {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border-radius: 8px;
    font-weight: 850;
    letter-spacing: 0;
    box-shadow: none !important;
}

body.app-shell :where(.btn-primary, .btn-success, .primary-action):not(.btn-outline-primary):not(.btn-outline-secondary):not(.btn-outline-danger):not(.btn-danger):not(.btn-warning) {
    border-color: var(--action-primary) !important;
    color: #fff !important;
    background: var(--action-primary) !important;
}

body.app-shell :where(.btn-primary, .btn-success, .primary-action):not(.btn-outline-primary):not(.btn-outline-secondary):not(.btn-outline-danger):not(.btn-danger):not(.btn-warning):hover,
body.app-shell :where(.btn-primary, .btn-success, .primary-action):not(.btn-outline-primary):not(.btn-outline-secondary):not(.btn-outline-danger):not(.btn-danger):not(.btn-warning):focus {
    border-color: var(--action-primary-hover) !important;
    color: #fff !important;
    background: var(--action-primary-hover) !important;
}

body.app-shell :where(.btn-outline-primary, .btn-outline-secondary, .btn-outline-success, .btn-outline-warning):not(.primary-action):not(:has(.bi-printer, .bi-file-pdf, .bi-filetype-pdf, .bi-download, .bi-upload, .bi-box-arrow-up, .bi-box-arrow-down, .bi-cloud-download, .bi-cloud-upload)) {
    border-color: var(--action-secondary-border) !important;
    color: var(--action-secondary-text) !important;
    background: #fff !important;
}

body.app-shell :where(.btn-outline-primary, .btn-outline-secondary, .btn-outline-success, .btn-outline-warning):not(.primary-action):not(:has(.bi-printer, .bi-file-pdf, .bi-filetype-pdf, .bi-download, .bi-upload, .bi-box-arrow-up, .bi-box-arrow-down, .bi-cloud-download, .bi-cloud-upload)):hover,
body.app-shell :where(.btn-outline-primary, .btn-outline-secondary, .btn-outline-success, .btn-outline-warning):not(.primary-action):not(:has(.bi-printer, .bi-file-pdf, .bi-filetype-pdf, .bi-download, .bi-upload, .bi-box-arrow-up, .bi-box-arrow-down, .bi-cloud-download, .bi-cloud-upload)):focus {
    border-color: #94a3b8 !important;
    color: #17243a !important;
    background: var(--action-secondary-hover) !important;
}

body.app-shell :where(.btn-danger, .btn-outline-danger) {
    border-color: var(--action-danger) !important;
    color: #fff !important;
    background: var(--action-danger) !important;
}

body.app-shell :where(.btn-danger, .btn-outline-danger):hover,
body.app-shell :where(.btn-danger, .btn-outline-danger):focus {
    border-color: var(--action-danger-hover) !important;
    color: #fff !important;
    background: var(--action-danger-hover) !important;
}

body.app-shell :where(.btn-secondary, .btn-light, .btn-warning):not(:has(.bi-printer, .bi-file-pdf, .bi-filetype-pdf, .bi-download, .bi-upload, .bi-box-arrow-up, .bi-box-arrow-down, .bi-cloud-download, .bi-cloud-upload)) {
    border-color: var(--action-neutral) !important;
    color: #fff !important;
    background: var(--action-neutral) !important;
}

body.app-shell :where(.btn-secondary, .btn-light, .btn-warning):not(:has(.bi-printer, .bi-file-pdf, .bi-filetype-pdf, .bi-download, .bi-upload, .bi-box-arrow-up, .bi-box-arrow-down, .bi-cloud-download, .bi-cloud-upload)):hover,
body.app-shell :where(.btn-secondary, .btn-light, .btn-warning):not(:has(.bi-printer, .bi-file-pdf, .bi-filetype-pdf, .bi-download, .bi-upload, .bi-box-arrow-up, .bi-box-arrow-down, .bi-cloud-download, .bi-cloud-upload)):focus {
    border-color: var(--action-neutral-hover) !important;
    color: #fff !important;
    background: var(--action-neutral-hover) !important;
}

body.app-shell :where(.btn-info, .btn-outline-info),
body.app-shell :where(.btn):has(.bi-printer, .bi-file-pdf, .bi-filetype-pdf, .bi-download, .bi-upload, .bi-box-arrow-up, .bi-box-arrow-down, .bi-cloud-download, .bi-cloud-upload) {
    border-color: #bfdbfe !important;
    color: var(--action-export) !important;
    background: var(--action-export-soft) !important;
}

body.app-shell :where(.btn-info, .btn-outline-info):hover,
body.app-shell :where(.btn-info, .btn-outline-info):focus,
body.app-shell :where(.btn):has(.bi-printer, .bi-file-pdf, .bi-filetype-pdf, .bi-download, .bi-upload, .bi-box-arrow-up, .bi-box-arrow-down, .bi-cloud-download, .bi-cloud-upload):hover,
body.app-shell :where(.btn):has(.bi-printer, .bi-file-pdf, .bi-filetype-pdf, .bi-download, .bi-upload, .bi-box-arrow-up, .bi-box-arrow-down, .bi-cloud-download, .bi-cloud-upload):focus {
    border-color: var(--action-export) !important;
    color: #fff !important;
    background: var(--action-export) !important;
}

body.app-shell :where(.btn-danger, .btn-outline-danger):has(.bi-printer, .bi-file-pdf, .bi-filetype-pdf, .bi-download, .bi-upload, .bi-box-arrow-up, .bi-box-arrow-down, .bi-cloud-download, .bi-cloud-upload) {
    border-color: var(--action-danger) !important;
    color: #fff !important;
    background: var(--action-danger) !important;
}

body.app-shell :where(.btn-danger, .btn-outline-danger):has(.bi-printer, .bi-file-pdf, .bi-filetype-pdf, .bi-download, .bi-upload, .bi-box-arrow-up, .bi-box-arrow-down, .bi-cloud-download, .bi-cloud-upload):hover,
body.app-shell :where(.btn-danger, .btn-outline-danger):has(.bi-printer, .bi-file-pdf, .bi-filetype-pdf, .bi-download, .bi-upload, .bi-box-arrow-up, .bi-box-arrow-down, .bi-cloud-download, .bi-cloud-upload):focus {
    border-color: var(--action-danger-hover) !important;
    color: #fff !important;
    background: var(--action-danger-hover) !important;
}

/* Compact module actions. Titles already live in the main topbar. */
body.app-shell .module-page-actions {
    display: flex;
    min-width: 0;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    margin: 0 0 12px;
    margin-left: auto;
    flex-wrap: wrap;
}

body.app-shell .module-page-actions .btn {
    min-height: 38px;
}

body.app-shell .module-header-metrics {
    display: grid;
    gap: 8px;
    margin: -4px 0 14px;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
}

body.app-shell .module-header-metrics > div {
    min-width: 0;
    padding: 10px 12px;
    border: 1px solid #dbe4ee;
    border-left: 3px solid #0f766e;
    border-radius: 6px;
    background: #fff;
}

body.app-shell .module-header-metrics span {
    display: block;
    color: #68798e;
    font-size: .62rem;
    font-weight: 900;
    letter-spacing: .045em;
    text-transform: uppercase;
}

body.app-shell .module-header-metrics strong {
    display: block;
    margin-top: 3px;
    color: #17243a;
    font-size: .98rem;
    font-weight: 920;
}

@media (max-width: 767.98px) {
    body.app-shell .module-page-actions {
        width: 100%;
        margin-left: 0;
        justify-content: stretch;
        flex-direction: row;
    }

    body.app-shell .module-page-actions .btn {
        flex: 1 1 150px;
    }
}

/* Form system: consistent fields, clean labels, below-field errors and footer actions. */
body.app-shell {
    --form-field-height: 42px;
    --form-field-radius: 8px;
    --form-field-border: #cfd9e6;
    --form-field-border-hover: #b8c6d8;
    --form-field-bg: #ffffff;
    --form-field-text: #17243a;
    --form-field-muted: #68798e;
    --form-field-focus: #0f766e;
    --form-error: #b91c1c;
}

body.app-shell :where(.form-label) {
    display: block;
    margin-bottom: 6px;
    color: var(--form-field-muted) !important;
    font-size: .68rem;
    font-weight: 850;
    letter-spacing: .025em;
    line-height: 1.2;
}

body.app-shell :where(.form-control, .form-select, .input-group-text, .checkout-static-field) {
    min-height: var(--form-field-height) !important;
    border-color: var(--form-field-border) !important;
    border-radius: var(--form-field-radius) !important;
    color: var(--form-field-text);
    background-color: var(--form-field-bg);
    font-size: .84rem;
    font-weight: 600;
    line-height: 1.25;
    box-shadow: none !important;
}

body.app-shell :where(input.form-control:not([type="file"]), select.form-select, .input-group-text, .checkout-static-field) {
    height: var(--form-field-height) !important;
}

body.app-shell :where(textarea.form-control) {
    min-height: 96px !important;
    height: auto !important;
    resize: vertical;
    line-height: 1.4;
}

body.app-shell :where(.form-control:hover, .form-select:hover) {
    border-color: var(--form-field-border-hover) !important;
}

body.app-shell :where(.form-control:focus, .form-select:focus) {
    border-color: var(--form-field-focus) !important;
    box-shadow: 0 0 0 .18rem rgba(15, 118, 110, .12) !important;
}

body.app-shell :where(.form-control::placeholder) {
    color: #94a3b8;
    font-weight: 500;
}

body.app-shell :where(.form-control:disabled, .form-select:disabled, .form-control[readonly]) {
    color: #64748b;
    background-color: #f1f5f9;
    opacity: 1;
}

body.app-shell :where(input.kwn-numeric-field) {
    padding-inline: 12px;
    font-variant-numeric: tabular-nums;
    text-align: right;
}

body.app-shell :where(input.kwn-numeric-field[type="number"]) {
    appearance: textfield;
    -moz-appearance: textfield;
}

body.app-shell input.kwn-numeric-field[type="number"]::-webkit-outer-spin-button,
body.app-shell input.kwn-numeric-field[type="number"]::-webkit-inner-spin-button {
    margin: 0;
    -webkit-appearance: none;
}

body.app-shell :where(.input-group) {
    align-items: stretch;
}

body.app-shell :where(.input-group > .form-control, .input-group > .form-select) {
    min-height: var(--form-field-height);
}

body.app-shell :where(.input-group > .input-group-text:first-child) {
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}

body.app-shell :where(.input-group > .input-group-text:last-child) {
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
}

body.app-shell :where(.is-invalid, .form-control.is-invalid, .form-select.is-invalid) {
    border-color: var(--form-error) !important;
    background-image: none;
}

body.app-shell :where(.is-invalid:focus, .form-control.is-invalid:focus, .form-select.is-invalid:focus) {
    box-shadow: 0 0 0 .18rem rgba(185, 28, 28, .12) !important;
}

body.app-shell form :where(.invalid-feedback, .field-error, .form-error, .form-text.text-danger, small.text-danger) {
    display: block;
    width: 100%;
    margin-top: 5px;
    color: var(--form-error) !important;
    font-size: .72rem;
    font-weight: 750;
    line-height: 1.3;
}

body.app-shell form :where(.form-text:not(.text-danger), small.form-text) {
    display: block;
    margin-top: 5px;
    color: var(--form-field-muted);
    font-size: .71rem;
    line-height: 1.3;
}

body.app-shell :where(.form-actions, .modal-footer, .card-footer.form-actions) {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 16px;
    padding: 12px 0 0;
    border-top: 1px solid #e4ebf3;
    background: #fff;
}

body.app-shell :where(.modal-footer) {
    margin-top: 0;
    padding: 12px 16px;
}

body.app-shell :where(.modal-body + .modal-footer) {
    position: sticky;
    bottom: 0;
    z-index: 2;
}

body.app-shell :where(.form-actions .btn, .modal-footer .btn, .card-footer.form-actions .btn) {
    min-height: 38px;
}

@media (max-width: 575.98px) {
    body.app-shell :where(.form-actions, .modal-footer, .card-footer.form-actions) {
        align-items: stretch;
        flex-direction: column-reverse;
    }

    body.app-shell :where(.form-actions .btn, .modal-footer .btn, .card-footer.form-actions .btn) {
        width: 100%;
    }
}

/* Final visual QA guard: keep dense filters and table actions touch-safe. */
body.app-shell :where(.action-cell .btn, .table td.text-end:last-child .btn, .table .btn-sm) {
    min-height: 38px;
}

body.app-shell :where(.action-cell .btn.btn-icon-only, .table .btn-icon-only, .btn.btn-icon-only) {
    width: 38px;
    min-width: 38px;
    height: 38px;
    min-height: 38px;
    padding-inline: 0;
}

body.app-shell :where(.responsive-cards tbody td.action-cell .btn, .responsive-cards tbody td:last-child .btn) {
    min-height: 40px;
}

body.app-shell .action-cell .btn,
body.app-shell[data-module] .action-cell .btn,
body.app-shell .table td.text-end:last-child .btn,
body.app-shell[data-module] .table td.text-end:last-child .btn,
body.app-shell .btn-sm,
body.app-shell .table .btn-sm,
body.app-shell[data-module] .btn-sm,
body.app-shell[data-module] .table .btn-sm {
    min-height: 38px !important;
}

body.app-shell .action-cell .btn.btn-icon-only,
body.app-shell[data-module] .action-cell .btn.btn-icon-only,
body.app-shell .table .btn-icon-only,
body.app-shell[data-module] .table .btn-icon-only {
    width: 38px !important;
    min-width: 38px !important;
    height: 38px !important;
    min-height: 38px !important;
}

@media (max-width: 767.98px) {
    body.app-shell :where(.compact-filter-row) {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        gap: 10px;
    }

    body.app-shell :where(.compact-filter-advanced) {
        position: static;
        width: 100%;
    }

    body.app-shell :where(.compact-filter-grid) {
        position: static !important;
        inset: auto !important;
        width: 100% !important;
        max-width: 100%;
        margin-top: 8px;
        margin-bottom: 14px;
        grid-template-columns: minmax(0, 1fr) !important;
    }

    body.app-shell :where(.compact-filter-actions) {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        gap: 8px;
        width: 100%;
    }

    body.app-shell :where(.compact-filter-actions .btn) {
        width: 100%;
        min-height: 42px;
    }
}

@media (max-width: 575.98px) {
    body.app-shell :where(.compact-filter-row) {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        gap: 10px;
    }

    body.app-shell :where(.compact-filter-advanced) {
        position: static;
        width: 100%;
    }

    body.app-shell :where(.compact-filter-grid) {
        position: static !important;
        inset: auto !important;
        width: 100% !important;
        max-width: 100%;
        margin-top: 8px;
        margin-bottom: 14px;
        grid-template-columns: minmax(0, 1fr) !important;
    }

    body.app-shell :where(.compact-filter-actions) {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        gap: 8px;
        width: 100%;
    }

    body.app-shell :where(.compact-filter-actions .btn) {
        width: 100%;
        min-height: 42px;
    }
}

/* Calm color pass: restrained palette for daily operation screens. */
:root {
    --kwn-color-primary: #0f766e;
    --kwn-color-primary-hover: #0b5f59;
    --kwn-color-bg: #f6f8fb;
    --kwn-color-surface: #ffffff;
    --kwn-color-surface-soft: #f8fafc;
    --kwn-color-border: #d7e1ec;
    --kwn-color-border-strong: #c4d1df;
    --kwn-color-text: #17243a;
    --kwn-color-muted: #66788f;
    --kwn-color-heading: #0f1f35;
    --kwn-shadow-sm: 0 8px 20px rgba(15, 32, 58, .055);
    --kwn-shadow-md: 0 16px 34px rgba(15, 32, 58, .09);
    --premium-page: #f6f8fb;
    --premium-surface: #ffffff;
    --premium-line: #d7e1ec;
    --premium-line-strong: #c4d1df;
    --premium-ink-strong: #0f1f35;
    --premium-ink: #17243a;
    --premium-text: #2c3d55;
    --premium-muted: #66788f;
    --premium-muted-strong: #53657c;
    --premium-blue: #1d5fd6;
    --premium-teal: #0f766e;
    --premium-warm: #b7791f;
}

body.app-shell {
    --action-primary: #0f766e;
    --action-primary-hover: #0b5f59;
    --action-primary-soft: #e8f6f3;
    --action-secondary-border: #c9d6e4;
    --action-secondary-text: #334155;
    --action-secondary-hover: #f7fafc;
    --action-neutral: #5f7188;
    --action-neutral-hover: #46586f;
    --action-danger: #dc2626;
    --action-danger-hover: #b91c1c;
    --action-export: #1d5fd6;
    --action-export-hover: #184db1;
    --action-export-soft: #edf4ff;
    color: var(--premium-text);
    background: var(--premium-page);
}

body.app-shell[data-module] {
    --module-primary: #0f766e;
    --module-primary-rgb: 15, 118, 110;
    --module-accent: #1d5fd6;
    --module-accent-rgb: 29, 95, 214;
    --module-soft: #f3faf8;
    --module-line: #c9d6e4;
    --module-ink: #153642;
    --module-accent-strength: .045;
    --module-accent-strength-soft: .025;
}

body.app-shell[data-module="dashboard"],
body.app-shell[data-module="store"],
body.app-shell[data-module="stock"] {
    --module-primary: #0f766e;
    --module-primary-rgb: 15, 118, 110;
    --module-accent: #1d5fd6;
    --module-accent-rgb: 29, 95, 214;
    --module-soft: #f3faf8;
    --module-line: #c7dfda;
    --module-ink: #153642;
}

body.app-shell[data-module="purchases"],
body.app-shell[data-module="catalog"],
body.app-shell[data-module="orders"] {
    --module-primary: #1d5fd6;
    --module-primary-rgb: 29, 95, 214;
    --module-accent: #0f766e;
    --module-accent-rgb: 15, 118, 110;
    --module-soft: #f2f7ff;
    --module-line: #cbdcff;
    --module-ink: #18345f;
}

body.app-shell[data-module="finance"] {
    --module-primary: #166534;
    --module-primary-rgb: 22, 101, 52;
    --module-accent: #b7791f;
    --module-accent-rgb: 183, 121, 31;
    --module-soft: #f4fbf6;
    --module-line: #cfe5d4;
    --module-ink: #173c25;
}

body.app-shell[data-module="reports"],
body.app-shell[data-module="partners"],
body.app-shell[data-module="system"],
body.app-shell[data-module="default"] {
    --module-primary: #4657a8;
    --module-primary-rgb: 70, 87, 168;
    --module-accent: #1d5fd6;
    --module-accent-rgb: 29, 95, 214;
    --module-soft: #f5f6ff;
    --module-line: #d8def4;
    --module-ink: #29315f;
}

body.app-shell[data-module] .main-content {
    background:
        linear-gradient(180deg, rgba(var(--module-primary-rgb), .035) 0, rgba(255, 255, 255, 0) 240px),
        var(--premium-page) !important;
}

body.app-shell[data-module] .topbar {
    border-top-color: var(--module-primary) !important;
    background:
        linear-gradient(90deg, rgba(var(--module-primary-rgb), .055), rgba(255, 255, 255, .96) 42%),
        #fff !important;
    box-shadow: 0 8px 22px rgba(15, 32, 58, .055) !important;
}

body.app-shell .sidebar {
    background:
        linear-gradient(180deg, #0f1b2d 0%, #111827 100%) !important;
}

body.app-shell .sidebar .nav-label {
    padding-top: 11px;
    color: #8799ad !important;
    font-size: .6rem;
    font-weight: 700;
    letter-spacing: .08em;
}

body.app-shell .sidebar-group-toggle {
    width: 100%;
    border: 0;
    background: transparent;
    text-align: left;
    cursor: pointer;
}

body.app-shell .sidebar-group-toggle::after {
    display: none;
}

body.app-shell .sidebar-group-toggle > i:first-child {
    width: 18px;
    flex: 0 0 18px;
    color: #8296ad;
    font-size: .76rem;
    text-align: center;
}

body.app-shell .sidebar-group-line {
    height: 1px;
    min-width: 8px;
    flex: 1;
    background: rgba(148, 163, 184, .12);
}

body.app-shell .sidebar-group-chevron {
    flex: 0 0 auto;
    color: #7f93aa;
    font-size: .68rem;
    transition: transform .18s ease;
}

body.app-shell .sidebar-section.is-open .sidebar-group-chevron {
    transform: rotate(180deg);
}

body.app-shell .sidebar-group-toggle:hover,
body.app-shell .sidebar-group-toggle:focus-visible {
    color: #dbe7f5 !important;
}

body.app-shell .sidebar-section.is-open .sidebar-group-toggle {
    color: #cbd8e8 !important;
}

body.app-shell .sidebar-group-toggle:focus-visible {
    border-radius: 6px;
    outline: 2px solid rgba(96, 165, 250, .7);
    outline-offset: 1px;
}

body.app-shell .sidebar-group-items {
    display: grid;
    min-width: 0;
    gap: 2px;
    padding-top: 2px;
}

body.app-shell .sidebar-section.is-collapsed .sidebar-group-items {
    display: none;
}

body.sidebar-collapsed.app-shell .sidebar-section-collapsible .sidebar-group-items {
    display: grid;
}

body.app-shell .sidebar .nav-link {
    min-height: 40px;
    color: #bfcbda !important;
    background: transparent !important;
    font-size: .81rem;
    font-weight: 500;
    line-height: 1.2;
    text-shadow: none;
}

body.app-shell .sidebar-section-collapsible .sidebar-group-items .nav-link {
    padding-left: 11px;
}

body.app-shell .sidebar .nav-link i {
    color: #8fa2b8 !important;
    font-size: 1.02rem;
}

body.app-shell .sidebar .nav-link:hover {
    color: #fff !important;
    background: rgba(255, 255, 255, .07) !important;
}

body.app-shell .sidebar .nav-link.active {
    color: #fff !important;
    border-color: rgba(45, 212, 191, .16) !important;
    background: rgba(45, 212, 191, .1) !important;
    font-weight: 600;
}

body.app-shell .sidebar .nav-link.active::before {
    background: #2dd4bf !important;
}

body.app-shell .sidebar .nav-link.active i,
body.app-shell .sidebar .nav-link:hover i {
    color: #fff !important;
}

body.app-shell .sidebar .nav-counter {
    min-width: 22px;
    height: 20px;
    padding-inline: 6px;
    border: 1px solid rgba(255, 255, 255, .12);
    box-shadow: none;
    font-size: .62rem;
    line-height: 18px;
}

body.app-shell :where(.card, .management-panel, .purchase-panel, .finance-entry-card, .finance-list-card, .category-list-card, .category-form-card, .settings-panel, .data-card, .stock-lot-label-panel, .stock-label-transfer-card, .stock-transfer-list-card) {
    border-color: var(--premium-line) !important;
    background: #fff !important;
    box-shadow: var(--kwn-shadow-sm) !important;
}

body.app-shell :where(.card:hover, .management-panel:hover, .purchase-panel:hover, .data-card:hover) {
    border-color: var(--premium-line-strong) !important;
    box-shadow: var(--kwn-shadow-md) !important;
}

body.app-shell :where(.table thead th) {
    border-bottom-color: var(--premium-line-strong) !important;
    color: #34445a !important;
    background: #f3f7fb !important;
}

body.app-shell :where(.table tbody td) {
    color: #3d4f67 !important;
}

body.app-shell :where(.table tbody tr:hover) {
    background: rgba(var(--module-primary-rgb), .035) !important;
}

body.app-shell :where(.badge, .status-badge, .kwn-badge) {
    border: 1px solid transparent;
    box-shadow: none !important;
}

body.app-shell :where(.badge.text-bg-success, .badge.bg-success, .status-badge.success, .kwn-badge.success) {
    border-color: #b7e5d3 !important;
    color: #0f5f46 !important;
    background: #e5f7ef !important;
}

body.app-shell :where(.badge.text-bg-primary, .badge.bg-primary, .status-badge.info, .kwn-badge.info) {
    border-color: #c4d7ff !important;
    color: #184db1 !important;
    background: #edf4ff !important;
}

body.app-shell :where(.badge.text-bg-warning, .badge.bg-warning, .status-badge.warning, .kwn-badge.warning) {
    border-color: #f4d69a !important;
    color: #81540f !important;
    background: #fff7e6 !important;
}

body.app-shell :where(.badge.text-bg-danger, .badge.bg-danger, .status-badge.danger, .kwn-badge.danger) {
    border-color: #f5b7b7 !important;
    color: #b91c1c !important;
    background: #feecec !important;
}

body.app-shell :where(.badge.text-bg-secondary, .badge.bg-secondary, .status-badge.neutral, .kwn-badge.neutral) {
    border-color: #d7e1ec !important;
    color: #4b5f76 !important;
    background: #f3f7fb !important;
}

body.app-shell :where(.alert-info) {
    border-color: #c4d7ff !important;
    color: #18345f !important;
    background: #f2f7ff !important;
}

body.app-shell :where(.alert-success) {
    border-color: #b7e5d3 !important;
    color: #0f5f46 !important;
    background: #eaf8f2 !important;
}

body.app-shell :where(.alert-warning) {
    border-color: #f4d69a !important;
    color: #81540f !important;
    background: #fff8ea !important;
}

body.app-shell :where(.alert-danger) {
    border-color: #f5b7b7 !important;
    color: #b91c1c !important;
    background: #fff0f0 !important;
}

body.app-shell :where(.form-control:focus, .form-select:focus, .btn:focus-visible) {
    outline: 0 !important;
    box-shadow: 0 0 0 .18rem rgba(15, 118, 110, .13) !important;
}

body.app-shell :where(.operation-hero, .store-operation-intro, .dashboard-clean-hero, .dashboard-premium-hero) {
    border-color: rgba(var(--module-primary-rgb), .18) !important;
    color: #fff !important;
    background:
        linear-gradient(135deg, rgba(15, 31, 53, .96), rgba(var(--module-primary-rgb), .82)),
        #0f1f35 !important;
    box-shadow: var(--kwn-shadow-sm) !important;
}

body.app-shell :where(.operation-hero, .store-operation-intro, .dashboard-clean-hero, .dashboard-premium-hero) :where(h1, h2, h3, strong) {
    color: #fff !important;
}

body.app-shell :where(.operation-hero, .store-operation-intro, .dashboard-clean-hero, .dashboard-premium-hero) :where(p, small, .text-muted) {
    color: rgba(255, 255, 255, .76) !important;
}

/* Client branding: FIKBELLA Jeans */
.login-brand.client-login-brand {
    align-items: center;
    gap: 16px;
}

.login-brand-logo.client-login-logo {
    width: 112px;
    height: 109px;
    flex: 0 0 112px;
    border: 1px solid rgba(255, 255, 255, .2);
    border-radius: 20px;
    object-fit: cover;
    background: #a6a6a6;
    box-shadow: 0 18px 34px rgba(0, 0, 0, .28);
    filter: none;
}

.client-login-copy {
    display: grid;
    gap: 4px;
}

.client-login-copy strong {
    color: #ffffff;
    font-size: 1.08rem;
    font-weight: 800;
    letter-spacing: .055em;
    text-transform: uppercase;
}

.client-login-copy small {
    color: #c4d1df;
    font-size: .72rem;
    font-weight: 650;
    letter-spacing: .02em;
}

body.app-shell .brand.client-tenant-brand {
    min-height: 112px;
    gap: 7px;
}

body.app-shell .client-sidebar-logo {
    width: 82px;
    height: 80px;
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 17px;
    object-fit: cover;
    object-position: center;
    background: #a6a6a6;
    box-shadow: 0 12px 24px rgba(0, 0, 0, .24);
    filter: none;
}

body.app-shell .client-sidebar-symbol {
    width: 46px;
    height: 45px;
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 11px;
    object-fit: cover;
    object-position: center;
    background: #a6a6a6;
    filter: none;
}

.client-brand-caption {
    color: #aebdd0;
    font-size: .61rem;
    font-weight: 750;
    letter-spacing: .07em;
    text-transform: uppercase;
}

body.sidebar-collapsed .client-brand-caption {
    display: none;
}

@media (max-width: 991.98px) {
    body.app-shell .brand.client-tenant-brand,
    body.sidebar-collapsed.app-shell .brand.client-tenant-brand {
        min-height: 104px;
    }

    body.app-shell .client-tenant-brand .client-sidebar-logo,
    body.sidebar-collapsed.app-shell .client-tenant-brand .client-sidebar-logo {
        display: block;
        width: 76px;
        height: 74px;
    }

    body.app-shell .client-tenant-brand .client-sidebar-symbol,
    body.sidebar-collapsed.app-shell .client-tenant-brand .client-sidebar-symbol {
        display: none;
    }

    body.sidebar-collapsed.app-shell .client-brand-caption {
        display: block;
    }
}

@media (max-width: 575.98px) {
    .login-brand.client-login-brand {
        flex-direction: row;
        align-items: center;
        gap: 12px;
    }

    .login-brand-logo.client-login-logo {
        width: 78px;
        height: 76px;
        flex: 0 0 78px;
        border-radius: 15px;
    }

    .client-login-copy strong {
        font-size: .92rem;
    }

    .client-login-copy small {
        font-size: .66rem;
    }
}