/*
 * SmartCashier 8.0 — Calm Velocity
 * Shared visual system layered over Bootstrap/AdminLTE/Tailwind.
 * All application overrides are scoped under .sc-v8.
 */

:root {
    --sc-brand-50: #f5f4ff;
    --sc-brand-100: #e9e7ff;
    --sc-brand-200: #d2ceff;
    --sc-brand-500: #675cf0;
    --sc-brand-600: #5146e5;
    --sc-brand-700: #4338ca;
    --sc-brand-800: #3730a3;
    --sc-cyan-600: #087e8b;
    --sc-mint-500: #20b486;
    --sc-canvas: #f6f7fb;
    --sc-surface: #ffffff;
    --sc-surface-raised: #fcfcfe;
    --sc-fill-soft: #f0f2f7;
    --sc-border: #dde1ea;
    --sc-border-strong: #c8ceda;
    --sc-text: #171923;
    --sc-text-secondary: #414756;
    --sc-text-muted: #6f7685;
    --sc-text-subtle: #9299a8;
    --sc-success: #087f5b;
    --sc-success-soft: #e7f7f0;
    --sc-warning: #a85d00;
    --sc-warning-soft: #fff2d8;
    --sc-danger: #c33d61;
    --sc-danger-soft: #fdebf0;
    --sc-info: #086f83;
    --sc-info-soft: #e5f6f8;
    --sc-pending: #7556b8;
    --sc-pending-soft: #f0eafc;
    --sc-radius-sm: 7px;
    --sc-radius-md: 9px;
    --sc-radius-lg: 12px;
    --sc-radius-xl: 16px;
    --sc-shadow-xs: 0 1px 2px rgba(23, 25, 35, .06);
    --sc-shadow-sm: 0 3px 10px rgba(23, 25, 35, .07);
    --sc-shadow-md: 0 12px 30px rgba(23, 25, 35, .11);
    --sc-focus: 0 0 0 3px rgba(81, 70, 229, .18);
    --sc-font-ui: Inter, "Source Sans Pro", "Noto Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --sc-font-mono: "SFMono-Regular", "Cascadia Code", "Roboto Mono", Consolas, monospace;
    --theme-700: var(--sc-brand-600);
    --theme-800: var(--sc-brand-700);
    --theme-900: var(--sc-brand-800);
}

.sc-theme-dark {
    --sc-brand-50: #23213b;
    --sc-brand-100: #302c57;
    --sc-brand-200: #4b4389;
    --sc-brand-500: #9a92ff;
    --sc-brand-600: #887dff;
    --sc-brand-700: #a39cff;
    --sc-brand-800: #c1bcff;
    --sc-canvas: #11131a;
    --sc-surface: #181b24;
    --sc-surface-raised: #202430;
    --sc-fill-soft: #252a36;
    --sc-border: #303544;
    --sc-border-strong: #444b5d;
    --sc-text: #f4f5f8;
    --sc-text-secondary: #d5d8e0;
    --sc-text-muted: #a7adba;
    --sc-text-subtle: #7e8594;
    --sc-shadow-xs: 0 1px 2px rgba(0, 0, 0, .18);
    --sc-shadow-sm: 0 5px 14px rgba(0, 0, 0, .24);
    --sc-shadow-md: 0 18px 44px rgba(0, 0, 0, .38);
}

html {
    background: var(--sc-canvas) !important;
}

body.sc-v8 {
    color: var(--sc-text);
    background: var(--sc-canvas) !important;
    font-family: var(--sc-font-ui);
    font-size: 14px;
    line-height: 1.45;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
}

.sc-v8 main,
.sc-v8 #scrollable-container,
.sc-v8 .content-wrapper {
    background: var(--sc-canvas) !important;
}

.sc-v8 ::selection {
    color: var(--sc-brand-800);
    background: var(--sc-brand-100);
}

.sc-v8 a {
    color: var(--sc-brand-700);
}

.sc-v8 a:hover,
.sc-v8 a:focus {
    color: var(--sc-brand-800);
}

.sc-v8 :focus-visible {
    outline: 2px solid var(--sc-brand-600);
    outline-offset: 2px;
}

.sc-v8 .content {
    padding: 20px 24px 28px;
}

.sc-v8 .content-header {
    padding: 24px 24px 4px;
}

.sc-v8 .content-header > h1,
.sc-v8 .content-header h1 {
    margin: 0;
    color: var(--sc-text) !important;
    font-family: var(--sc-font-ui);
    font-size: clamp(22px, 2vw, 28px) !important;
    font-weight: 680 !important;
    line-height: 1.28;
    letter-spacing: -.025em;
}

.sc-v8 .content-header h1 small {
    color: var(--sc-text-muted) !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    letter-spacing: 0;
}

.sc-v8 h2,
.sc-v8 h3,
.sc-v8 h4,
.sc-v8 .box-title {
    color: var(--sc-text);
    font-family: var(--sc-font-ui);
    letter-spacing: -.012em;
}

.sc-v8 .text-muted,
.sc-v8 .help-block {
    color: var(--sc-text-muted) !important;
}

.sc-v8 .display_currency,
.sc-v8 .input_number,
.sc-v8 .font-mono,
.sc-v8 [class*="tw-font-mono"],
.sc-v8 td.text-right,
.sc-v8 th.text-right {
    font-variant-numeric: tabular-nums lining-nums;
}

/* Application shell */
.sc-v8 .side-bar {
    border-right: 1px solid var(--sc-border) !important;
    background: rgba(255, 255, 255, .98) !important;
    box-shadow: none;
}

.sc-v8 .side-bar > a:first-child {
    position: relative;
    justify-content: flex-start !important;
    height: 64px !important;
    padding: 0 18px;
    border-right: 0 !important;
    border-bottom: 1px solid var(--sc-border) !important;
    background: var(--sc-surface) !important;
}

.sc-v8 .side-bar-heading {
    overflow: hidden;
    margin: 0;
    color: var(--sc-text) !important;
    font-size: 16px !important;
    font-weight: 680 !important;
    letter-spacing: -.02em;
    text-align: left !important;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sc-v8 .side-bar-heading span {
    width: 8px !important;
    height: 8px !important;
    margin-left: 7px;
    background: var(--sc-mint-500) !important;
    box-shadow: 0 0 0 4px rgba(32, 180, 134, .12);
}

.sc-v8 #sidebar-search {
    color: var(--sc-text-secondary) !important;
}

.sc-v8 #sidebar-search::placeholder {
    color: var(--sc-text-subtle) !important;
}

.sc-v8 .side-bar > div:nth-child(2) {
    padding: 12px 12px 8px !important;
    border-right: 0 !important;
    border-color: var(--sc-border) !important;
}

.sc-v8 .side-bar > div:nth-child(2) > div {
    min-height: 38px;
    border: 1px solid var(--sc-border) !important;
    border-radius: var(--sc-radius-md) !important;
    background: var(--sc-canvas) !important;
    transition: border-color 120ms ease, box-shadow 120ms ease, background 120ms ease;
}

.sc-v8 .side-bar > div:nth-child(2) > div:focus-within {
    border-color: var(--sc-brand-600) !important;
    background: var(--sc-surface) !important;
    box-shadow: var(--sc-focus);
}

.sc-v8 #side-bar {
    padding: 4px 8px 16px;
}

.sc-v8 #side-bar a {
    min-height: 38px;
    margin: 2px 0;
    border-radius: var(--sc-radius-md);
    color: var(--sc-text-secondary);
    font-size: 13px;
    font-weight: 540;
    transition: color 120ms ease, background 120ms ease, transform 120ms ease;
}

.sc-v8 #side-bar a:hover {
    color: var(--sc-brand-700) !important;
    background: var(--sc-brand-50) !important;
}

.sc-v8 #side-bar .theme-sidebar-active {
    color: var(--sc-brand-700) !important;
    background: var(--sc-brand-100) !important;
    box-shadow: inset 3px 0 0 var(--sc-brand-600);
}

.sc-v8 #side-bar a svg,
.sc-v8 #side-bar a i {
    color: var(--sc-text-subtle);
}

.sc-v8 #side-bar a:hover svg,
.sc-v8 #side-bar a:hover i,
.sc-v8 #side-bar .theme-sidebar-active svg,
.sc-v8 #side-bar .theme-sidebar-active i {
    color: var(--sc-brand-600) !important;
}

.sc-v8 .sc-app-topbar {
    position: relative;
    z-index: 1035;
    min-height: 68px;
    border-bottom: 1px solid var(--sc-border) !important;
    background: rgba(255, 255, 255, .96) !important;
    box-shadow: 0 6px 22px rgba(23, 25, 35, .055) !important;
    backdrop-filter: blur(20px) saturate(150%);
}

.sc-v8 .sc-app-topbar > .sc-app-topbar__container {
    padding: 9px 18px !important;
}

.sc-v8 .sc-app-topbar__row {
    min-width: 0;
    min-height: 49px;
}

.sc-v8 .sc-app-topbar__leading {
    flex: 1 1 auto;
    min-width: 0;
}

.sc-v8 .sc-app-topbar__context {
    min-width: 0;
}

.sc-v8 .sc-app-topbar__business {
    display: block;
    max-width: 280px;
    overflow: hidden;
    color: var(--sc-text-muted);
    font-size: 10px;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: .075em;
    text-overflow: ellipsis;
    text-transform: uppercase;
    white-space: nowrap;
}

.sc-v8 .sc-app-topbar__page-row {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    margin-top: 2px;
}

.sc-v8 .sc-app-topbar__page-title {
    display: block;
    max-width: 320px;
    overflow: hidden;
    color: var(--sc-text);
    font-size: 15px;
    font-weight: 690;
    line-height: 1.25;
    letter-spacing: -.012em;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sc-v8 .sc-app-topbar__date {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    flex: 0 0 auto;
    padding-left: 10px;
    border-left: 1px solid var(--sc-border);
    color: var(--sc-text-muted);
    font-family: var(--sc-font-mono);
    font-size: 11px;
    font-variant-numeric: tabular-nums;
    line-height: 1.2;
}

.sc-v8 .sc-app-topbar__date svg {
    width: 14px;
    height: 14px;
}

.sc-v8 .sc-app-topbar__actions {
    flex: 0 0 auto;
    gap: 7px;
    min-width: 0;
    white-space: nowrap;
}

.sc-v8 .sc-app-topbar .theme-btn-bg,
.sc-v8 .sc-app-topbar summary.theme-btn-bg {
    min-height: 38px;
    border: 1px solid var(--sc-border) !important;
    border-radius: 10px !important;
    color: var(--sc-text-secondary) !important;
    background: var(--sc-surface-raised) !important;
    box-shadow: var(--sc-shadow-xs) !important;
    transition: border-color 120ms ease, color 120ms ease, background 120ms ease, box-shadow 120ms ease, transform 120ms ease;
}

.sc-v8 .sc-app-topbar .theme-btn-bg:hover,
.sc-v8 .sc-app-topbar summary.theme-btn-bg:hover {
    border-color: var(--sc-brand-200) !important;
    color: var(--sc-brand-700) !important;
    background: var(--sc-brand-50) !important;
    box-shadow: var(--sc-shadow-sm) !important;
    transform: translateY(-1px);
}

.sc-v8 .sc-app-topbar .theme-btn-bg svg,
.sc-v8 .sc-app-topbar summary.theme-btn-bg svg {
    color: currentColor !important;
}

.sc-v8 .sc-app-topbar summary {
    list-style: none;
}

.sc-v8 .sc-app-topbar summary::-webkit-details-marker {
    display: none;
}

.sc-v8 .sc-topbar-icon-button {
    position: relative;
    flex: 0 0 38px;
    width: 38px;
    height: 38px;
    min-height: 38px !important;
    padding: 0 !important;
}

.sc-v8 .sc-topbar-icon-button svg,
.sc-v8 .sc-topbar-secondary-action > svg:first-child,
.sc-v8 .sc-topbar-profit-action svg,
.sc-v8 .sc-topbar-user-trigger > svg,
.sc-v8 .sc-topbar-primary-action svg {
    width: 19px;
    height: 19px;
}

.sc-v8 .sc-topbar-primary-action {
    gap: 7px;
    min-height: 40px;
    padding: 0 14px;
    border-color: var(--sc-brand-600) !important;
    border: 1px solid var(--sc-brand-600);
    border-radius: 10px;
    color: #fff !important;
    background: var(--sc-brand-600) !important;
    box-shadow: 0 5px 14px rgba(81, 70, 229, .20);
    font-size: 13px;
    font-weight: 680;
    line-height: 1;
    transition: background 120ms ease, border-color 120ms ease, box-shadow 120ms ease, transform 120ms ease;
}

.sc-v8 .sc-topbar-primary-action:hover,
.sc-v8 .sc-topbar-primary-action:focus {
    border-color: var(--sc-brand-700) !important;
    color: #fff !important;
    background: var(--sc-brand-700) !important;
    box-shadow: 0 7px 18px rgba(81, 70, 229, .26);
    transform: translateY(-1px);
}

.sc-v8 .sc-topbar-primary-action:active {
    box-shadow: none;
    transform: scale(.98);
}

.sc-v8 .sc-intelligence-launcher {
    position: relative;
    isolation: isolate;
    gap: 9px;
    min-height: 42px;
    padding: 4px 13px 4px 6px;
    overflow: hidden;
    border: 1px solid rgba(129, 140, 248, .72);
    border-radius: 12px;
    color: #fff !important;
    background: linear-gradient(118deg, #312e81 0%, #5b21b6 48%, #0369a1 100%);
    box-shadow: 0 7px 20px rgba(79, 70, 229, .28), inset 0 1px 0 rgba(255, 255, 255, .22);
    text-decoration: none !important;
    transition: transform 160ms ease, box-shadow 160ms ease, border-color 160ms ease;
}

.sc-v8 .sc-intelligence-launcher::before {
    position: absolute;
    z-index: 0;
    top: -80%;
    left: -35%;
    width: 32%;
    height: 260%;
    content: "";
    pointer-events: none;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .34), transparent);
    transform: rotate(18deg);
    animation: sc-intelligence-shimmer 4.8s ease-in-out infinite;
}

.sc-v8 .sc-intelligence-launcher:hover,
.sc-v8 .sc-intelligence-launcher:focus {
    border-color: rgba(165, 243, 252, .9);
    color: #fff !important;
    box-shadow: 0 10px 26px rgba(79, 70, 229, .38), 0 0 0 3px rgba(99, 102, 241, .12);
    transform: translateY(-1px);
    outline: none;
}

.sc-v8 .sc-intelligence-orb {
    position: relative;
    z-index: 1;
    display: inline-grid;
    flex: 0 0 32px;
    width: 32px;
    height: 32px;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, .3);
    border-radius: 10px;
    background: rgba(255, 255, 255, .12);
    box-shadow: inset 0 0 12px rgba(103, 232, 249, .13);
}

.sc-v8 .sc-intelligence-orbit {
    position: absolute;
    inset: 0;
    width: 32px;
    height: 32px;
    color: #a5f3fc;
    animation: sc-intelligence-orbit 8s linear infinite;
}

.sc-v8 .sc-intelligence-core {
    position: relative;
    color: #fff;
    font-family: var(--sc-font-mono);
    font-size: 10px;
    font-weight: 850;
    letter-spacing: -.03em;
    text-shadow: 0 0 9px rgba(165, 243, 252, .9);
    animation: sc-intelligence-pulse 2.2s ease-in-out infinite;
}

.sc-v8 .sc-intelligence-label {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    line-height: 1;
}

.sc-v8 .sc-intelligence-label small {
    margin-bottom: 3px;
    color: #c4b5fd;
    font-size: 7px;
    font-weight: 750;
    letter-spacing: .13em;
}

.sc-v8 .sc-intelligence-label strong {
    color: #fff;
    font-size: 12px;
    font-weight: 750;
    letter-spacing: .01em;
}

.sc-v8 .sc-intelligence-live {
    position: relative;
    z-index: 1;
    width: 5px;
    height: 5px;
    margin-left: 1px;
    border-radius: 999px;
    background: #67e8f9;
    box-shadow: 0 0 0 4px rgba(103, 232, 249, .12), 0 0 9px #67e8f9;
    animation: sc-intelligence-live 1.8s ease-out infinite;
}

@keyframes sc-intelligence-shimmer {
    0%, 58% { left: -35%; opacity: 0; }
    66% { opacity: 1; }
    84%, 100% { left: 120%; opacity: 0; }
}

@keyframes sc-intelligence-orbit {
    to { transform: rotate(360deg); }
}

@keyframes sc-intelligence-pulse {
    0%, 100% { opacity: .84; transform: scale(.94); }
    50% { opacity: 1; transform: scale(1.08); }
}

@keyframes sc-intelligence-live {
    0%, 100% { box-shadow: 0 0 0 0 rgba(103, 232, 249, .42), 0 0 9px #67e8f9; }
    55% { box-shadow: 0 0 0 5px rgba(103, 232, 249, 0), 0 0 9px #67e8f9; }
}

.sc-v8 .sc-topbar-secondary-action,
.sc-v8 .sc-topbar-profit-action,
.sc-v8 .sc-topbar-user-trigger {
    gap: 7px;
    min-height: 38px;
    padding: 0 11px;
    font-size: 12px;
    font-weight: 650;
    line-height: 1;
}

.sc-v8 .sc-topbar-chevron {
    width: 13px !important;
    height: 13px !important;
    color: var(--sc-text-muted) !important;
    transition: transform 140ms ease;
}

.sc-v8 details[open] > summary .sc-topbar-chevron {
    transform: rotate(180deg);
}

.sc-v8 .sc-topbar-profit-action {
    border-color: color-mix(in srgb, var(--sc-success) 22%, white) !important;
    color: var(--sc-success) !important;
    background: var(--sc-success-soft) !important;
}

.sc-v8 .sc-topbar-profit-action:hover,
.sc-v8 .sc-topbar-profit-action:focus {
    border-color: color-mix(in srgb, var(--sc-success) 34%, white) !important;
    color: #066f50 !important;
    background: color-mix(in srgb, var(--sc-success-soft) 82%, white) !important;
}

.sc-v8 .sc-topbar-user-trigger {
    max-width: 220px;
}

.sc-v8 .sc-topbar-user-name {
    max-width: 140px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sc-v8 .sc-app-topbar .tw-dw-menu,
.sc-v8 .sc-app-topbar details > ul,
.sc-v8 .dropdown-menu {
    padding: 6px !important;
    border: 1px solid var(--sc-border) !important;
    border-radius: var(--sc-radius-lg) !important;
    background: var(--sc-surface) !important;
    box-shadow: var(--sc-shadow-md) !important;
}

.sc-v8 .sc-app-topbar .sc-topbar-actions-menu {
    right: 0 !important;
    left: auto !important;
    z-index: 1060 !important;
    width: 260px !important;
    margin-top: 10px !important;
    padding: 8px !important;
    transform-origin: top right;
}

.sc-v8 .sc-topbar-menu-heading {
    padding: 7px 9px 6px;
    color: var(--sc-text-muted);
    font-size: 10px;
    font-weight: 720;
    line-height: 1;
    letter-spacing: .075em;
    text-transform: uppercase;
}

.sc-v8 .sc-topbar-menu-item {
    display: flex !important;
    align-items: center;
    gap: 10px;
    min-height: 40px;
    padding: 8px 9px !important;
    border-radius: 8px !important;
    color: var(--sc-text-secondary) !important;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.25;
}

.sc-v8 .sc-topbar-menu-item svg {
    flex: 0 0 19px;
    width: 19px;
    height: 19px;
    color: var(--sc-text-muted);
}

.sc-v8 .sc-topbar-menu-item:hover,
.sc-v8 .sc-topbar-menu-item:focus {
    color: var(--sc-brand-700) !important;
    background: var(--sc-brand-50) !important;
}

.sc-v8 .sc-topbar-menu-item:hover svg,
.sc-v8 .sc-topbar-menu-item:focus svg {
    color: var(--sc-brand-600);
}

.sc-v8 .sc-topbar-menu-divider {
    height: 1px;
    margin: 5px 7px;
    background: var(--sc-border);
}

.sc-v8 .sc-app-topbar .sc-topbar-user-dropdown {
    right: 0 !important;
    left: auto !important;
    z-index: 1060 !important;
    margin-top: 10px !important;
    border-radius: 12px !important;
    transform-origin: top right;
}

.sc-v8 .sc-topbar-account-divider {
    height: 1px;
    margin: 5px 7px;
    background: var(--sc-border);
}

.sc-v8 .sc-topbar-subscription-entry {
    display: flex;
    align-items: center;
    gap: 9px;
    min-height: 36px;
    padding: 8px 10px;
    color: var(--sc-text-secondary);
    font-size: 13px;
    font-weight: 600;
}

.sc-v8 .sc-topbar-subscription-entry > i {
    float: none !important;
    width: 19px;
    color: var(--sc-brand-600) !important;
    text-align: center;
}

.sc-v8 .sc-topbar-notifications {
    position: relative;
}

.sc-v8 .sc-topbar-notifications .notifications_count {
    position: absolute;
    top: -5px;
    right: -5px;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    border: 2px solid var(--sc-surface);
    border-radius: 999px;
    color: #fff;
    background: var(--sc-danger) !important;
    font-family: var(--sc-font-mono);
    font-size: 9px;
    font-weight: 750;
    line-height: 14px;
    text-align: center;
}

.sc-v8 .sc-topbar-notifications .notifications_count:empty {
    display: none;
}

.sc-v8 .sc-topbar-notifications > .dropdown-menu {
    top: calc(100% + 10px);
    right: 0 !important;
    left: auto !important;
    z-index: 1060 !important;
    width: min(360px, calc(100vw - 24px)) !important;
    height: auto !important;
    max-height: min(520px, calc(100vh - 92px));
    margin: 0 !important;
    overflow-y: auto !important;
}

.sc-v8 .sc-app-topbar :is(a, button, summary):focus-visible {
    outline: 2px solid var(--sc-brand-600);
    outline-offset: 2px;
}

.sc-v8 .dropdown-menu > li > a,
.sc-v8 details > ul a {
    border-radius: var(--sc-radius-sm);
    color: var(--sc-text-secondary);
}

.sc-v8 .dropdown-menu > li > a:hover,
.sc-v8 details > ul a:hover {
    color: var(--sc-brand-700);
    background: var(--sc-brand-50);
}

@media (max-width: 1279px) {
    .sc-v8 .sc-app-topbar__date,
    .sc-v8 .sc-topbar-profit-label {
        display: none;
    }

    .sc-v8 .sc-topbar-profit-action {
        width: 38px;
        padding: 0;
    }

    .sc-v8 .sc-app-topbar__business {
        max-width: 190px;
    }

    .sc-v8 .sc-app-topbar__page-title {
        max-width: 220px;
    }
}

@media (max-width: 991px) {
    .sc-v8 .sc-app-topbar > .sc-app-topbar__container {
        padding-right: 12px !important;
        padding-left: 12px !important;
    }

    .sc-v8 .sc-app-topbar__row {
        gap: 10px !important;
    }

    .sc-v8 .sc-app-topbar__actions {
        gap: 5px;
    }

    .sc-v8 .sc-topbar-primary-action,
    .sc-v8 .sc-intelligence-launcher,
    .sc-v8 .sc-topbar-secondary-action,
    .sc-v8 .sc-topbar-user-trigger {
        flex: 0 0 38px;
        width: 38px;
        padding: 0;
    }

    .sc-v8 .sc-topbar-primary-label,
    .sc-v8 .sc-intelligence-label,
    .sc-v8 .sc-intelligence-live,
    .sc-v8 .sc-topbar-secondary-label,
    .sc-v8 .sc-topbar-chevron,
    .sc-v8 .sc-topbar-user-name {
        display: none !important;
    }

    .sc-v8 .sc-intelligence-launcher {
        padding: 4px;
    }

    .sc-v8 .sc-app-topbar__business {
        max-width: 150px;
    }

    .sc-v8 .sc-app-topbar__page-title {
        max-width: 160px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .sc-v8 .sc-intelligence-launcher::before,
    .sc-v8 .sc-intelligence-orbit,
    .sc-v8 .sc-intelligence-core,
    .sc-v8 .sc-intelligence-live {
        animation: none !important;
    }
}

@media (max-width: 767px) {
    .sc-v8 .sc-app-topbar {
        min-height: 62px;
    }

    .sc-v8 .sc-app-topbar > .sc-app-topbar__container {
        padding: 7px 9px !important;
    }

    .sc-v8 .sc-app-topbar__row {
        min-height: 46px;
        gap: 7px !important;
    }

    .sc-v8 .sc-app-topbar__leading {
        gap: 7px !important;
    }

    .sc-v8 .sc-app-topbar__business {
        display: none;
    }

    .sc-v8 .sc-app-topbar__page-row {
        margin-top: 0;
    }

    .sc-v8 .sc-app-topbar__page-title {
        max-width: 120px;
        font-size: 13px;
    }

    .sc-v8 .sc-topbar-actions-menu {
        position: fixed !important;
        top: 57px !important;
        right: 9px !important;
        left: auto !important;
        width: min(280px, calc(100vw - 18px)) !important;
    }
}

@media (max-width: 479px) {
    .sc-v8 .sc-app-topbar__context {
        display: none;
    }

    .sc-v8 .sc-app-topbar__leading {
        flex: 0 0 auto;
    }

    .sc-v8 .sc-app-topbar__actions {
        flex: 0 0 auto;
        margin-left: auto;
    }

    .sc-v8 .sc-topbar-profit-action {
        display: none !important;
    }
}

/* Surfaces */
.sc-v8 .box,
.sc-v8 .nav-tabs-custom,
.sc-v8 .info-box,
.sc-v8 .small-box,
.sc-v8 .card,
.sc-v8 .tw-dw-card {
    border: 1px solid var(--sc-border) !important;
    border-radius: var(--sc-radius-lg) !important;
    background: var(--sc-surface) !important;
    box-shadow: var(--sc-shadow-xs) !important;
}

.sc-v8 .box.box-solid {
    border-top: 1px solid var(--sc-border) !important;
}

.sc-v8 .box-header {
    min-height: 52px;
    padding: 15px 18px;
    border-bottom: 1px solid var(--sc-border);
    border-radius: var(--sc-radius-lg) var(--sc-radius-lg) 0 0;
    background: var(--sc-surface-raised);
}

.sc-v8 .box-header.with-border {
    border-bottom-color: var(--sc-border);
}

.sc-v8 .box-header .box-title {
    font-size: 15px;
    font-weight: 650;
}

.sc-v8 .box-body {
    padding: 18px;
}

.sc-v8 .box-footer {
    padding: 14px 18px;
    border-top: 1px solid var(--sc-border);
    border-radius: 0 0 var(--sc-radius-lg) var(--sc-radius-lg);
    background: var(--sc-surface-raised);
}

.sc-v8 .well {
    border: 1px solid var(--sc-border);
    border-radius: var(--sc-radius-lg);
    background: var(--sc-fill-soft);
    box-shadow: none;
}

.sc-v8 hr {
    border-color: var(--sc-border);
}

/* Buttons */
.sc-v8 .btn,
.sc-v8 .tw-dw-btn {
    min-height: 38px;
    border-radius: var(--sc-radius-md) !important;
    font-family: var(--sc-font-ui);
    font-size: 13px;
    font-weight: 620;
    letter-spacing: -.005em;
    box-shadow: var(--sc-shadow-xs);
    transition: color 120ms ease, background 120ms ease, border-color 120ms ease, box-shadow 120ms ease, transform 120ms ease;
}

.sc-v8 .btn:hover,
.sc-v8 .tw-dw-btn:hover {
    box-shadow: var(--sc-shadow-sm);
    transform: translateY(-1px);
}

.sc-v8 .btn:active,
.sc-v8 .tw-dw-btn:active {
    box-shadow: none;
    transform: scale(.985);
}

.sc-v8 .btn-primary,
.sc-v8 .tw-dw-btn-primary,
.sc-v8 .btn-info:not(.btn-link) {
    border-color: var(--sc-brand-600) !important;
    color: #fff !important;
    background: var(--sc-brand-600) !important;
}

.sc-v8 .btn-primary:hover,
.sc-v8 .btn-primary:focus,
.sc-v8 .tw-dw-btn-primary:hover,
.sc-v8 .btn-info:not(.btn-link):hover {
    border-color: var(--sc-brand-700) !important;
    background: var(--sc-brand-700) !important;
}

.sc-v8 .btn-default,
.sc-v8 .tw-dw-btn-outline {
    border-color: var(--sc-border-strong) !important;
    color: var(--sc-text-secondary) !important;
    background: var(--sc-surface) !important;
}

.sc-v8 .btn-default:hover,
.sc-v8 .tw-dw-btn-outline:hover {
    border-color: var(--sc-brand-200) !important;
    color: var(--sc-brand-700) !important;
    background: var(--sc-brand-50) !important;
}

.sc-v8 .btn-success,
.sc-v8 .tw-dw-btn-success {
    border-color: var(--sc-success) !important;
    color: #fff !important;
    background: var(--sc-success) !important;
}

.sc-v8 .btn-warning,
.sc-v8 .tw-dw-btn-warning {
    border-color: var(--sc-warning) !important;
    color: #fff !important;
    background: var(--sc-warning) !important;
}

.sc-v8 .btn-danger,
.sc-v8 .tw-dw-btn-error {
    border-color: var(--sc-danger) !important;
    color: #fff !important;
    background: var(--sc-danger) !important;
}

.sc-v8 .btn-link {
    color: var(--sc-brand-700);
    background: transparent;
    box-shadow: none;
}

.sc-v8 .btn-sm,
.sc-v8 .tw-dw-btn-sm {
    min-height: 32px;
    padding: 5px 10px;
}

.sc-v8 .btn-lg {
    min-height: 46px;
    padding: 11px 18px;
    font-size: 14px;
}

.sc-v8 .btn[disabled],
.sc-v8 .btn.disabled,
.sc-v8 .tw-dw-btn[disabled] {
    border-color: var(--sc-border) !important;
    color: var(--sc-text-subtle) !important;
    background: var(--sc-fill-soft) !important;
    box-shadow: none;
    opacity: 1;
    transform: none;
}

/* Forms */
.sc-v8 label {
    margin-bottom: 6px;
    color: var(--sc-text-secondary);
    font-size: 13px;
    font-weight: 620;
}

.sc-v8 .form-group {
    margin-bottom: 16px;
}

.sc-v8 .form-group > label:not(.radio-inline):not(.checkbox-inline),
.sc-v8 .form-horizontal .form-group > .control-label {
    display: inline-block;
    float: none;
    width: auto;
    max-width: 100%;
    padding-top: 0;
    margin-bottom: 6px;
    text-align: left;
    vertical-align: middle;
}

.sc-v8 .form-group > .form-control,
.sc-v8 .form-group > .select2-container {
    display: block;
    clear: both;
    width: 100% !important;
}

.sc-v8 .form-group > .input-group {
    display: table;
    clear: both;
    width: 100% !important;
}

.sc-v8 .form-horizontal .form-group > .control-label[class*="col-"],
.sc-v8 .form-horizontal .form-group > .control-label[class*="col-"] + [class*="col-"] {
    float: none;
    width: 100%;
    margin-left: 0;
}

.sc-v8 .form-control,
.sc-v8 .select2-container .select2-selection--single,
.sc-v8 .select2-container .select2-selection--multiple,
.sc-v8 .input-group-addon {
    min-height: 40px;
    border-color: var(--sc-border-strong) !important;
    border-radius: var(--sc-radius-md);
    color: var(--sc-text);
    background: var(--sc-surface);
    box-shadow: none !important;
    transition: border-color 120ms ease, box-shadow 120ms ease, background 120ms ease;
}

.sc-v8 .form-control {
    padding: 9px 12px;
    font-family: var(--sc-font-ui);
    font-size: 14px;
}

.sc-v8 input.form-control,
.sc-v8 select.form-control {
    height: 40px;
}

.sc-v8 textarea.form-control {
    min-height: 88px;
    padding-top: 10px;
    padding-bottom: 10px;
    line-height: 1.5;
    resize: vertical;
}

.sc-v8 .form-control::placeholder {
    color: var(--sc-text-subtle);
}

.sc-v8 .form-control:hover,
.sc-v8 .select2-container .select2-selection:hover {
    border-color: #adb5c4 !important;
}

.sc-v8 .form-control:focus,
.sc-v8 .select2-container--focus .select2-selection,
.sc-v8 .select2-container--open .select2-selection {
    border-color: var(--sc-brand-600) !important;
    box-shadow: var(--sc-focus) !important;
}

.sc-v8 .form-control[disabled],
.sc-v8 .form-control[readonly],
.sc-v8 fieldset[disabled] .form-control {
    color: var(--sc-text-muted);
    background: var(--sc-fill-soft);
}

.sc-v8 .input-group .form-control:first-child,
.sc-v8 .input-group-addon:first-child,
.sc-v8 .input-group-btn:first-child > .btn {
    border-radius: var(--sc-radius-md) 0 0 var(--sc-radius-md);
}

.sc-v8 .input-group .form-control:last-child,
.sc-v8 .input-group-addon:last-child,
.sc-v8 .input-group-btn:last-child > .btn {
    border-radius: 0 var(--sc-radius-md) var(--sc-radius-md) 0;
}

.sc-v8 .input-group-addon {
    padding: 9px 11px;
    color: var(--sc-text-muted);
    background: var(--sc-fill-soft);
}

.sc-v8 .input-group > .select2-container {
    position: relative;
    z-index: 2;
    display: table-cell;
    width: 100% !important;
    vertical-align: middle;
}

.sc-v8 .input-group > .select2-container:not(:first-child) .select2-selection {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.sc-v8 .input-group > .select2-container:not(:last-child) .select2-selection {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.sc-v8 .input-group-btn > .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 40px;
    min-height: 40px;
}

.sc-v8 .select2-container .select2-selection--single {
    height: 40px;
    padding: 5px 8px;
}

.sc-v8 .select2-container--default .select2-selection--single .select2-selection__rendered {
    padding-right: 24px;
    padding-left: 4px;
    color: var(--sc-text);
    line-height: 28px;
    margin-top: 0;
}

.sc-v8 .select2-container--default .select2-selection--single .select2-selection__arrow {
    top: 0;
    right: 6px;
    height: 38px;
}

.sc-v8 .select2-container--default .select2-selection--single .select2-selection__arrow b {
    margin-top: -2px;
}

.sc-v8 .select2-container .select2-selection--multiple {
    padding: 3px 6px;
}

.sc-v8 .select2-container--default .select2-selection--multiple .select2-selection__choice {
    margin-top: 3px;
}

.sc-v8 .select2-dropdown {
    overflow: hidden;
    margin-top: 4px;
    border-color: var(--sc-border) !important;
    border-radius: var(--sc-radius-lg) !important;
    box-shadow: var(--sc-shadow-md);
}

.sc-v8 .select2-results__option {
    margin: 2px 5px;
    padding: 8px 10px;
    border-radius: var(--sc-radius-sm);
}

.sc-v8 .select2-container--default .select2-results__option--highlighted[aria-selected] {
    color: var(--sc-brand-800);
    background: var(--sc-brand-100);
}

.sc-v8 .has-error .form-control {
    border-color: var(--sc-danger) !important;
    box-shadow: 0 0 0 3px rgba(195, 61, 97, .12) !important;
}

.sc-v8 .has-error .help-block,
.sc-v8 label.error {
    color: var(--sc-danger) !important;
    font-size: 12px;
    font-weight: 550;
}

.sc-v8 .form-group .help-block {
    margin: 6px 0 0;
    color: var(--sc-text-muted);
    font-size: 12px;
    line-height: 1.45;
}

.sc-v8 .radio label,
.sc-v8 .checkbox label,
.sc-v8 label.radio-inline,
.sc-v8 label.checkbox-inline {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 32px;
    padding-left: 0;
    margin-bottom: 0;
}

.sc-v8 .radio input[type="radio"],
.sc-v8 .checkbox input[type="checkbox"],
.sc-v8 label.radio-inline > input[type="radio"],
.sc-v8 label.checkbox-inline > input[type="checkbox"] {
    position: static;
    flex: 0 0 auto;
    margin: 0;
}

.sc-v8 input[type="checkbox"],
.sc-v8 input[type="radio"] {
    accent-color: var(--sc-brand-600);
}

/* Tables and DataTables */
.sc-v8 .table-responsive {
    border: 0;
    border-radius: var(--sc-radius-lg);
}

.sc-v8 .table {
    margin-bottom: 0;
    color: var(--sc-text-secondary);
    background: var(--sc-surface);
}

.sc-v8 .table > thead > tr > th {
    height: 44px;
    padding: 11px 12px;
    border-top: 0;
    border-bottom: 1px solid var(--sc-border) !important;
    color: var(--sc-text-muted);
    background: var(--sc-surface-raised);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .045em;
    text-transform: uppercase;
    vertical-align: middle;
}

.sc-v8 .table > tbody > tr > td {
    min-height: 48px;
    padding: 11px 12px;
    border-top: 1px solid #e9ebf1;
    color: var(--sc-text-secondary);
    font-size: 13px;
    vertical-align: middle;
}

.sc-v8 .table > tbody > tr {
    transition: background 100ms ease, box-shadow 100ms ease;
}

.sc-v8 .table-hover > tbody > tr:hover,
.sc-v8 table.dataTable tbody tr:hover {
    background: #f7f7fc !important;
}

.sc-v8 .table > tbody > tr.selected,
.sc-v8 table.dataTable tbody tr.selected {
    background: var(--sc-brand-50) !important;
    box-shadow: inset 3px 0 0 var(--sc-brand-600);
}

.sc-v8 .table-striped > tbody > tr:nth-of-type(odd) {
    background: #fbfbfd;
}

.sc-v8 table.dataTable {
    overflow: hidden;
    width: 100% !important;
    border: 1px solid var(--sc-border) !important;
    border-collapse: separate !important;
    border-spacing: 0;
    border-radius: var(--sc-radius-lg);
}

.sc-v8 .dataTables_wrapper {
    color: var(--sc-text-muted);
}

/*
 * DataTables scrollCollapse can reduce a short grid to one row and clip Bootstrap
 * action menus. Release overflow only for the lifetime of an open dropdown so
 * normal horizontal and vertical table scrolling remains unchanged.
 */
.sc-v8 .dataTables_wrapper:has(.open > .dropdown-menu) {
    position: relative;
    z-index: 1040;
}

.sc-v8 .box:has(.dataTables_wrapper .open > .dropdown-menu),
.sc-v8 .box-body:has(.dataTables_wrapper .open > .dropdown-menu),
.sc-v8 .nav-tabs-custom:has(.dataTables_wrapper .open > .dropdown-menu),
.sc-v8 .tab-content:has(.dataTables_wrapper .open > .dropdown-menu),
.sc-v8 .tab-pane:has(.dataTables_wrapper .open > .dropdown-menu),
.sc-v8 .table-responsive:has(.open > .dropdown-menu),
.sc-v8 .dataTables_scroll:has(.open > .dropdown-menu),
.sc-v8 .dataTables_scrollBody:has(.open > .dropdown-menu),
.sc-v8 table.dataTable:has(.open > .dropdown-menu) {
    overflow: visible !important;
}

.sc-v8 .dataTables_scrollBody:has(.open > .dropdown-menu) {
    position: relative;
    z-index: 20;
}

.sc-v8 table.dataTable tr:has(.open > .dropdown-menu),
.sc-v8 table.dataTable td:has(.open > .dropdown-menu),
.sc-v8 table.dataTable .open > .dropdown-menu {
    position: relative;
    z-index: 1080;
}

.sc-v8 table.dataTable .open > .dropdown-menu {
    position: absolute;
}

.sc-v8 .dataTables_wrapper .row:first-child,
.sc-v8 .dataTables_wrapper .row:last-child {
    margin: 0;
    padding: 10px 4px;
}

.sc-v8 .dataTables_filter input,
.sc-v8 .dataTables_length select {
    height: 36px;
    border: 1px solid var(--sc-border-strong);
    border-radius: var(--sc-radius-md);
    background: var(--sc-surface);
}

.sc-v8 .pagination > li > a,
.sc-v8 .pagination > li > span {
    min-width: 34px;
    margin: 0 2px;
    border: 1px solid transparent;
    border-radius: var(--sc-radius-sm) !important;
    color: var(--sc-text-secondary);
    background: transparent;
}

.sc-v8 .pagination > .active > a,
.sc-v8 .pagination > .active > span {
    border-color: var(--sc-brand-600);
    color: #fff;
    background: var(--sc-brand-600);
}

.sc-v8 .dataTables_empty {
    height: 140px;
    color: var(--sc-text-muted) !important;
    text-align: center;
}

.sc-v8.sc-density-compact .table > thead > tr > th {
    height: 38px;
    padding-top: 8px;
    padding-bottom: 8px;
}

.sc-v8.sc-density-compact .table > tbody > tr > td {
    min-height: 40px;
    padding-top: 8px;
    padding-bottom: 8px;
}

.sc-v8.sc-density-compact .form-control,
.sc-v8.sc-density-compact .select2-container .select2-selection--single {
    min-height: 36px;
}

/* Tabs, badges, alerts and modals */
.sc-v8 .nav-tabs {
    border-bottom: 1px solid var(--sc-border);
}

.sc-v8 .nav-tabs > li > a {
    margin: 0 12px 0 0;
    padding: 11px 4px;
    border: 0 !important;
    border-bottom: 2px solid transparent !important;
    border-radius: 0;
    color: var(--sc-text-muted);
    font-weight: 600;
    background: transparent !important;
}

.sc-v8 .nav-tabs > li.active > a,
.sc-v8 .nav-tabs > li > a:hover {
    border-bottom-color: var(--sc-brand-600) !important;
    color: var(--sc-brand-700);
}

.sc-v8 .label,
.sc-v8 .badge {
    padding: 5px 8px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 650;
    letter-spacing: .01em;
}

.sc-v8 .label-success,
.sc-v8 .badge-success,
.sc-v8 .bg-green {
    color: var(--sc-success) !important;
    background: var(--sc-success-soft) !important;
}

.sc-v8 .label-warning,
.sc-v8 .badge-warning,
.sc-v8 .bg-yellow {
    color: var(--sc-warning) !important;
    background: var(--sc-warning-soft) !important;
}

.sc-v8 .label-danger,
.sc-v8 .badge-danger,
.sc-v8 .bg-red {
    color: var(--sc-danger) !important;
    background: var(--sc-danger-soft) !important;
}

.sc-v8 .label-info,
.sc-v8 .badge-info,
.sc-v8 .bg-aqua {
    color: var(--sc-info) !important;
    background: var(--sc-info-soft) !important;
}

.sc-v8 .alert {
    padding: 12px 14px;
    border: 1px solid;
    border-radius: var(--sc-radius-lg);
    box-shadow: none;
}

.sc-v8 .alert-success {
    border-color: #b9e6d5;
    color: var(--sc-success);
    background: var(--sc-success-soft);
}

.sc-v8 .alert-warning {
    border-color: #f1d59a;
    color: var(--sc-warning);
    background: var(--sc-warning-soft);
}

.sc-v8 .alert-danger {
    border-color: #f1b8c8;
    color: var(--sc-danger);
    background: var(--sc-danger-soft);
}

.sc-v8 .alert-info {
    border-color: #b8e1e6;
    color: var(--sc-info);
    background: var(--sc-info-soft);
}

.sc-v8 .modal {
    backdrop-filter: blur(3px);
}

.sc-v8 .modal-content {
    overflow: hidden;
    max-width: 100%;
    border: 1px solid rgba(200, 206, 218, .9);
    border-radius: var(--sc-radius-xl);
    background: var(--sc-surface);
    box-shadow: 0 24px 70px rgba(23, 25, 35, .22);
}

.sc-v8 .modal-header {
    position: relative;
    padding: 17px 20px;
    padding-right: 62px;
    border-bottom: 1px solid var(--sc-border);
    color: var(--sc-text) !important;
    background: var(--sc-surface-raised) !important;
    background-image: none !important;
}

.sc-v8 .modal-title {
    font-size: 17px;
    font-weight: 680;
    line-height: 1.35;
}

.sc-v8 .modal-header .close {
    position: absolute;
    top: 50%;
    right: 16px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    margin: 0;
    border: 1px solid transparent;
    border-radius: 9px;
    color: var(--sc-text-muted);
    background: transparent;
    font-size: 22px;
    font-weight: 400;
    line-height: 1;
    opacity: 1;
    transform: translateY(-50%);
    transition: color 120ms ease, background 120ms ease, border-color 120ms ease;
}

.sc-v8 .modal-header .close:hover,
.sc-v8 .modal-header .close:focus {
    border-color: var(--sc-border);
    color: var(--sc-text);
    background: var(--sc-fill-soft);
    opacity: 1;
}

.sc-v8 .modal-body {
    padding: 20px;
    max-height: calc(100vh - 178px);
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
}

.sc-v8 .modal .form-group .select2-container {
    width: 100% !important;
}

.sc-v8 .modal-footer {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    padding: 14px 20px;
    border-top: 1px solid var(--sc-border);
    background: var(--sc-surface-raised);
    text-align: initial;
}

.sc-v8 .modal-footer::before,
.sc-v8 .modal-footer::after {
    display: none;
}

.sc-v8 .modal-footer > .btn,
.sc-v8 .modal-footer > .tw-dw-btn {
    min-height: 40px;
    margin: 0 !important;
}

.sc-v8 .modal-footer > .btn-default,
.sc-v8 .modal-footer > .tw-dw-btn-neutral,
.sc-v8 .modal-footer > [data-dismiss="modal"]:not(.btn-primary):not(.tw-dw-btn-primary):not(.btn-success):not(.tw-dw-btn-success) {
    order: 10;
    border: 1px solid var(--sc-border-strong) !important;
    color: var(--sc-text-secondary) !important;
    background: transparent !important;
    box-shadow: none !important;
}

.sc-v8 .modal-footer > .btn-default:hover,
.sc-v8 .modal-footer > .tw-dw-btn-neutral:hover,
.sc-v8 .modal-footer > [data-dismiss="modal"]:not(.btn-primary):not(.tw-dw-btn-primary):not(.btn-success):not(.tw-dw-btn-success):hover {
    border-color: var(--sc-brand-200) !important;
    color: var(--sc-brand-700) !important;
    background: var(--sc-brand-50) !important;
}

.sc-v8 .modal-footer > [type="submit"],
.sc-v8 .modal-footer > .btn-primary,
.sc-v8 .modal-footer > .tw-dw-btn-primary {
    order: 20;
}

.sc-v8 .modal-footer > .pull-left {
    margin-right: auto !important;
}

.sc-v8 .popover {
    border: 1px solid var(--sc-border);
    border-radius: var(--sc-radius-lg);
    box-shadow: var(--sc-shadow-md);
}

.sc-v8 .tooltip-inner {
    padding: 6px 9px;
    border-radius: var(--sc-radius-sm);
    color: #fff;
    background: var(--sc-text);
    font-size: 12px;
}

/* POS and Direct Sale */
.sc-v8.lockscreen {
    background: var(--sc-canvas) !important;
}

.sc-v8 .pos-header > div {
    border: 1px solid var(--sc-border) !important;
    border-radius: var(--sc-radius-lg) !important;
    background: rgba(255, 255, 255, .96) !important;
    box-shadow: var(--sc-shadow-sm) !important;
}

.sc-v8 .pos-header .tw-bg-\[\#646EE4\] {
    background: var(--sc-brand-600) !important;
}

.sc-v8 #pos_header_more_options > a,
.sc-v8 #pos_header_more_options > button {
    border: 1px solid var(--sc-border) !important;
    border-radius: var(--sc-radius-md) !important;
    color: var(--sc-text-secondary) !important;
    background: var(--sc-surface) !important;
    box-shadow: var(--sc-shadow-xs) !important;
}

.sc-v8 #pos_header_more_options > a:hover,
.sc-v8 #pos_header_more_options > button:hover {
    border-color: var(--sc-brand-200) !important;
    background: var(--sc-brand-50) !important;
    box-shadow: var(--sc-shadow-sm) !important;
}

.sc-v8 #add_pos_sell_form .box,
.sc-v8 #edit_pos_sell_form .box,
.sc-v8 #add_sell_form .box,
.sc-v8 #edit_sell_form .box {
    border-color: var(--sc-border) !important;
    box-shadow: var(--sc-shadow-xs) !important;
}

.sc-v8 #search_product,
.sc-v8 #search_product_for_srock_adjustment {
    min-height: 46px;
    padding-left: 14px;
    border-width: 1px;
    border-color: var(--sc-border-strong) !important;
    border-radius: 11px !important;
    font-size: 15px;
    font-weight: 540;
}

.sc-v8 #search_product:focus {
    border-color: var(--sc-brand-600) !important;
    box-shadow: var(--sc-focus) !important;
}

.sc-v8 #pos_table {
    border: 1px solid var(--sc-border) !important;
    border-radius: var(--sc-radius-lg);
}

.sc-v8 #pos_table thead th {
    position: sticky;
    top: 0;
    z-index: 3;
    background: var(--sc-surface-raised) !important;
}

.sc-v8 #pos_table tbody tr {
    background: var(--sc-surface);
}

.sc-v8 #pos_table tbody tr:hover {
    background: var(--sc-brand-50) !important;
}

.sc-v8 #pos_table .form-control {
    border-color: transparent !important;
    background: transparent;
}

.sc-v8 #pos_table .form-control:hover {
    border-color: var(--sc-border) !important;
    background: var(--sc-surface);
}

.sc-v8 #pos_table .form-control:focus {
    border-color: var(--sc-brand-600) !important;
    background: var(--sc-surface);
}

.sc-v8 #pos_table .lot_number {
    color: var(--sc-brand-700);
    background: var(--sc-brand-50);
    font-size: 12px;
    font-weight: 620;
}

.sc-v8 .pos_quantity,
.sc-v8 .pos_unit_price,
.sc-v8 .pos_unit_price_inc_tax,
.sc-v8 .pos_line_total {
    font-family: var(--sc-font-mono) !important;
    font-variant-numeric: tabular-nums;
}

.sc-v8 #pos_table .input-number .quantity-up,
.sc-v8 #pos_table .input-number .quantity-down {
    color: var(--sc-brand-700) !important;
    background: var(--sc-brand-50) !important;
}

.sc-v8 .pos_product_div,
.sc-v8 .product_list {
    scrollbar-color: var(--sc-border-strong) transparent;
    scrollbar-width: thin;
}

.sc-v8 .pos_product_div .product_box,
.sc-v8 .product_list .product_box {
    overflow: hidden;
    border: 1px solid var(--sc-border) !important;
    border-radius: var(--sc-radius-lg) !important;
    background: var(--sc-surface) !important;
    box-shadow: var(--sc-shadow-xs) !important;
    transition: border-color 140ms ease, box-shadow 140ms ease, transform 140ms ease;
}

.sc-v8 .pos_product_div .product_box:hover,
.sc-v8 .product_list .product_box:hover {
    border-color: var(--sc-brand-200) !important;
    box-shadow: var(--sc-shadow-sm) !important;
    transform: translateY(-2px);
}

.sc-v8 #pos-total,
.sc-v8 .pos-total,
.sc-v8 .total_payable_span,
.sc-v8 #total_payable {
    color: var(--sc-text) !important;
    font-variant-numeric: tabular-nums;
    letter-spacing: -.025em;
}

.sc-v8 #pos-save,
.sc-v8 #pos-finalize,
.sc-v8 #submit-sell,
.sc-v8 .pos-express-finalize {
    min-height: 48px;
    border-radius: 11px !important;
    font-size: 14px;
    font-weight: 700;
}

.sc-v8 .batch-price-picker .modal-content {
    border-radius: 18px;
}

.sc-v8 .batch-price-choice {
    margin-bottom: 8px;
    border: 1px solid var(--sc-border) !important;
    border-radius: var(--sc-radius-lg) !important;
    background: var(--sc-surface) !important;
}

.sc-v8 .batch-price-choice:hover,
.sc-v8 .batch-price-choice:focus {
    border-color: var(--sc-brand-200) !important;
    background: var(--sc-brand-50) !important;
    box-shadow: var(--sc-shadow-sm);
}

.sc-v8 .batch-card-price strong {
    color: var(--sc-brand-700) !important;
    font-family: var(--sc-font-mono);
}

/* Toasts and transient feedback */
.sc-v8 .toast,
.sc-v8 .toast-message,
.sc-v8 .swal2-popup {
    border: 1px solid var(--sc-border) !important;
    border-radius: var(--sc-radius-lg) !important;
    box-shadow: var(--sc-shadow-md) !important;
    font-family: var(--sc-font-ui) !important;
}

.sc-v8 .scrolltop .scroll {
    border: 1px solid var(--sc-border);
    border-radius: 999px;
    color: var(--sc-brand-700);
    background: var(--sc-surface);
    box-shadow: var(--sc-shadow-sm);
}

/* Responsive density */
@media (max-width: 991px) {
    .sc-v8 .content {
        padding: 16px;
    }

    .sc-v8 .content-header {
        padding: 18px 16px 2px;
    }

    .sc-v8 .box-body {
        padding: 15px;
    }

    .sc-v8 .table > thead > tr > th,
    .sc-v8 .table > tbody > tr > td {
        padding-right: 10px;
        padding-left: 10px;
    }
}

@media (max-width: 767px) {
    .sc-v8 .content {
        padding: 12px;
    }

    .sc-v8 .content-header {
        padding: 16px 12px 2px;
    }

    .sc-v8 .content-header h1 {
        font-size: 22px !important;
    }

    .sc-v8 .form-control,
    .sc-v8 .select2-container .select2-selection--single {
        min-height: 44px;
    }

    .sc-v8 input.form-control,
    .sc-v8 select.form-control,
    .sc-v8 .select2-container .select2-selection--single,
    .sc-v8 .input-group-btn > .btn {
        height: 44px;
    }

    .sc-v8 .select2-container--default .select2-selection--single .select2-selection__rendered {
        line-height: 32px;
    }

    .sc-v8 .select2-container--default .select2-selection--single .select2-selection__arrow {
        height: 42px;
    }

    .sc-v8 .btn {
        min-height: 42px;
    }

    .sc-v8 .modal-dialog {
        margin: 10px;
    }

    .sc-v8 .modal-body {
        padding: 16px;
        max-height: calc(100svh - 158px);
    }

    .sc-v8 .modal-header {
        padding: 15px 56px 15px 16px;
    }

    .sc-v8 .modal-header .close {
        right: 12px;
    }

    .sc-v8 .modal-footer {
        padding: 12px 16px;
    }
}

@media (max-width: 479px) {
    .sc-v8 .modal-footer {
        flex-direction: column;
        align-items: stretch;
    }

    .sc-v8 .modal-footer > .btn,
    .sc-v8 .modal-footer > .tw-dw-btn {
        width: 100%;
    }

    .sc-v8 .modal-footer > .pull-left {
        margin-right: 0 !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .sc-v8 *,
    .sc-v8 *::before,
    .sc-v8 *::after {
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
    }
}

@media print {
    html,
    body.sc-v8,
    body.sc-v8.sc-v8-auth,
    .sc-v8 #receipt_section,
    .sc-v8 #invoice_content {
        background: #fff !important;
    }

    .sc-v8,
    .sc-v8 main,
    .sc-v8 #scrollable-container {
        color: #000 !important;
        background: #fff !important;
    }

    .sc-v8 .box,
    .sc-v8 .table,
    .sc-v8 table.dataTable {
        border-color: #bbb !important;
        box-shadow: none !important;
    }
}

/* Authentication */
.sc-v8-auth {
    min-height: 100vh;
    color: var(--sc-text);
    background: var(--sc-canvas) !important;
}

.sc-v8-auth .right-col {
    min-height: 100vh;
}

.sc-v8-auth .smartcashier-login-card::before {
    color: rgba(255, 255, 255, .88);
    font-weight: 700;
    letter-spacing: .22em;
}

.sc-v8-auth .smartcashier-login-card > div,
.sc-v8-auth .login-box-body,
.sc-v8-auth .register-box-body {
    border: 1px solid rgba(255, 255, 255, .16) !important;
    border-radius: 18px !important;
    background: rgba(255, 255, 255, .98) !important;
    box-shadow: 0 28px 80px rgba(0, 0, 0, .28) !important;
}

.sc-v8-auth .smartcashier-login-card h1 {
    color: var(--sc-text) !important;
    font-size: 22px !important;
    font-weight: 680 !important;
    letter-spacing: -.025em;
}

.sc-v8-auth .smartcashier-login-card h2 {
    color: var(--sc-text-muted) !important;
}

.sc-v8-auth .smartcashier-login-card input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]) {
    width: 100%;
    min-height: 46px;
    border: 1px solid var(--sc-border-strong) !important;
    border-radius: var(--sc-radius-md) !important;
    background: var(--sc-surface) !important;
}

.sc-v8-auth .smartcashier-login-card input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):focus {
    border-color: var(--sc-brand-600) !important;
    box-shadow: var(--sc-focus) !important;
}

.sc-v8-auth .smartcashier-login-card button[type="submit"] {
    min-height: 48px;
    border-radius: 11px !important;
    background: var(--sc-brand-600) !important;
}

.sc-v8-auth .smartcashier-login-card button[type="submit"]:hover {
    background: var(--sc-brand-700) !important;
}