:root {
    --bg: #f4f6fb;
    --card: #ffffff;
    --text: #1f2937;
    --muted: #6b7280;
    --border: #e5e7eb;
    --brand: #714b67;
    --brand-dark: #52364b;
    --on-brand: #ffffff;
    --soft: #f8eef6;

    /* Theme aliases used by lookup/scaffold pages. Keep these mapped to the selected theme, not Odoo defaults. */
    --theme-primary: var(--brand);
    --theme-secondary: var(--brand-dark);
    --theme-accent: var(--soft);
    --theme-surface: var(--card);
    --panel-bg: var(--card);
    --text-muted: var(--muted);
    --text-strong: var(--text);
}

* { box-sizing: border-box; }

body {
    margin: 0;
    font-family: Arial, Helvetica, sans-serif;
    background: var(--bg);
    color: var(--text);
}

.login-wrapper {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.login-card, .page-card {
    width: 380px;
    background: var(--card);
    padding: 28px;
    border-radius: 14px;
    box-shadow: 0 8px 30px rgba(0,0,0,.10);
}

.page-card { margin: 60px auto; width: 520px; }
h1, h2, h3 { margin-top: 0; }
label { display: block; margin-top: 14px; font-weight: 600; }

.input {
    width: 100%;
    padding: 11px;
    margin-top: 5px;
    border: 1px solid #ccd3da;
    border-radius: 8px;
}

.btn, .logout-btn, .btn-secondary {
    padding: 12px 16px;
    border: 0;
    border-radius: 8px;
    cursor: pointer;
    font-weight: 700;
    text-decoration: none;
    display: inline-block;
}

.btn { width: 100%; margin-top: 20px; background: var(--brand); color: white; }
.btn-secondary { background: var(--brand); color: white; margin-top: 16px; }
.logout-btn { background: #111827; color: white; }

.alert {
    background: #ffe6e6;
    border: 1px solid #ffb3b3;
    padding: 10px;
    border-radius: 8px;
    margin-bottom: 12px;
}

.validation { color: #b00020; font-size: 13px; }
.links { display: flex; justify-content: space-between; margin-top: 18px; font-size: 14px; }
a { text-decoration: none; color: inherit; }

.shell {
    min-height: 100vh;
    display: grid;
    grid-template-columns: 230px 1fr;
}

.compact-shell { display: block; padding: 28px; }

.sidebar {
    background: var(--brand-dark);
    color: white;
    padding: 24px 18px;
    position: sticky;
    top: 0;
    min-height: 100vh;
}

.sidebar-logo {
    width: 58px;
    height: 58px;
    border-radius: 18px;
    background: rgba(255,255,255,.16);
    display: grid;
    place-items: center;
    font-size: 20px;
    font-weight: 800;
    margin-bottom: 26px;
}

.sidebar-nav { display: grid; gap: 8px; }
.sidebar-nav a {
    padding: 12px 14px;
    border-radius: 10px;
    color: rgba(255,255,255,.82);
}
.sidebar-nav a:hover, .sidebar-nav .active { background: rgba(255,255,255,.13); color: white; }

.main-area { padding: 28px; overflow: auto; min-width: 0; }

/* POS full-screen mode: open Point of Sales without the left menu bar. */
.pos-sidebar-hidden.app-shell {
    grid-template-columns: 1fr;
}
.pos-sidebar-hidden .main-area {
    padding: 18px;
}


.topbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 24px;
}

.topbar h1 { margin-bottom: 4px; }
.muted { color: var(--muted); margin: 0; }
.user-panel { display: flex; align-items: center; gap: 12px; }
.user-chip {
    background: white;
    border: 1px solid var(--border);
    border-radius: 999px;
    padding: 10px 14px;
    font-weight: 700;
}

.info-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(160px, 1fr));
    gap: 14px;
    margin-bottom: 28px;
}

.info-card {
    background: white;
    border: 1px solid var(--border);
    border-radius: 16px;
    padding: 16px;
}
.info-card span { display: block; color: var(--muted); font-size: 13px; margin-bottom: 8px; }
.info-card strong { font-size: 15px; }

.odoo-section, .module-group {
    background: white;
    border: 1px solid var(--border);
    border-radius: 20px;
    padding: 22px;
    margin-bottom: 24px;
}

.section-heading {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 18px;
}
.section-heading p { max-width: 560px; color: var(--muted); margin: 0; }

.app-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
    gap: 16px;
}

.app-card {
    border: 1px solid var(--border);
    border-radius: 18px;
    padding: 18px;
    background: linear-gradient(180deg, #fff, #fbfbfd);
    transition: transform .15s ease, box-shadow .15s ease;
    min-height: 170px;
}
.app-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 14px 30px rgba(31,41,55,.10);
}
.app-icon {
    width: 54px;
    height: 54px;
    border-radius: 16px;
    display: grid;
    place-items: center;
    background: var(--soft);
    font-size: 28px;
    margin-bottom: 14px;
}
.app-card h3 { margin-bottom: 8px; }
.app-card p { color: var(--muted); font-size: 14px; line-height: 1.4; margin: 0; }

.module-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(310px, 1fr));
    gap: 16px;
}

.module-card {
    border: 1px solid var(--border);
    border-radius: 18px;
    padding: 18px;
    background: #fff;
}
.module-title { display: flex; gap: 14px; align-items: flex-start; margin-bottom: 14px; }
.module-title span { font-size: 30px; }
.module-title h3 { margin-bottom: 6px; }
.module-title p { color: var(--muted); margin: 0; line-height: 1.4; }

.action-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.action-list a {
    background: #f3f4f6;
    border: 1px solid var(--border);
    border-radius: 999px;
    padding: 8px 12px;
    font-size: 13px;
}
.action-list a:hover { background: var(--soft); border-color: color-mix(in srgb, var(--brand) 30%, var(--border)); }

.empty-state {
    max-width: 560px;
    margin: 80px auto;
    background: white;
    border: 1px solid var(--border);
    border-radius: 22px;
    padding: 34px;
    text-align: center;
}
.empty-icon { font-size: 52px; margin-bottom: 10px; }

@media (max-width: 900px) {
    .shell { grid-template-columns: 1fr; }
    .sidebar { position: static; min-height: auto; }
    .sidebar-nav { grid-template-columns: repeat(3, 1fr); }
    .info-grid { grid-template-columns: repeat(2, 1fr); }
    .topbar { align-items: flex-start; flex-direction: column; }
    .dashboard-header { grid-template-columns: 1fr; }
    .dashboard-header-clock { justify-self: stretch; }
}

@media (max-width: 560px) {
    .info-grid { grid-template-columns: 1fr; }
    .main-area { padding: 18px; }
    .sidebar-nav { grid-template-columns: 1fr 1fr; }
    .login-card { width: 100%; }
}


.dashboard-header {
    display: grid;
    grid-template-columns: minmax(260px, 1fr) auto auto;
    gap: 18px;
    align-items: center;
}

.dashboard-title-block {
    min-width: 0;
}

.dashboard-header-clock {
    justify-self: center;
}

.date-time-card {
    min-width: 320px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    background: linear-gradient(135deg, var(--brand), var(--brand-dark));
    color: #ffffff;
    border-radius: 20px;
    padding: 16px 18px;
    box-shadow: 0 16px 35px rgba(15, 23, 42, .14);
}

.date-day {
    display: block;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
    opacity: .82;
}

.date-full {
    display: block;
    margin-top: 4px;
    font-size: 16px;
}

.time-now {
    font-size: 24px;
    font-weight: 900;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

@media (max-width: 700px) {
    .dashboard-status-row { justify-content: stretch; }
    .dashboard-header {
    display: grid;
    grid-template-columns: minmax(260px, 1fr) auto auto;
    gap: 18px;
    align-items: center;
}

.dashboard-title-block {
    min-width: 0;
}

.dashboard-header-clock {
    justify-self: center;
}

.date-time-card {
        min-width: 0;
        width: 100%;
        flex-direction: column;
        align-items: flex-start;
    }
}

/* Two-level dashboard additions */
.main-only-grid .app-card {
    min-height: 210px;
}

.module-launcher {
    position: relative;
    text-decoration: none;
}

.module-launcher::after {
    content: "Open";
    position: absolute;
    right: 18px;
    bottom: 16px;
    font-size: 12px;
    font-weight: 700;
    opacity: .65;
}

.module-area {
    display: inline-block;
    margin: 3px 0 10px;
    padding: 4px 10px;
    border-radius: 999px;
    background: rgba(15, 23, 42, .08);
    color: #475569;
    font-size: 12px;
    font-weight: 700;
}

.module-title-line {
    display: flex;
    align-items: center;
    gap: 16px;
}

.module-big-icon {
    width: 64px;
    height: 64px;
    border-radius: 18px;
    display: grid;
    place-items: center;
    font-size: 34px;
    background: #ffffff;
    box-shadow: 0 12px 35px rgba(15, 23, 42, .10);
}

.back-btn {
    border: 0;
    border-radius: 12px;
    padding: 10px 14px;
    background: #e2e8f0;
    color: #0f172a;
    font-weight: 700;
    text-decoration: none;
}

.back-btn:hover {
    background: #cbd5e1;
    color: #0f172a;
}

.submenu-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 18px;
}

.submenu-card {
    display: flex;
    gap: 14px;
    align-items: flex-start;
    min-height: 112px;
    padding: 20px;
    border-radius: 20px;
    background: #ffffff;
    text-decoration: none;
    color: #0f172a;
    box-shadow: 0 14px 35px rgba(15, 23, 42, .08);
    transition: transform .15s ease, box-shadow .15s ease;
}

.submenu-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 18px 45px rgba(15, 23, 42, .13);
    color: #0f172a;
}

.submenu-card h3 {
    margin: 0 0 6px;
    font-size: 18px;
}

.submenu-card p {
    margin: 0;
    color: #64748b;
    font-size: 14px;
}

.submenu-icon {
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    border-radius: 14px;
    display: grid;
    place-items: center;
    background: #f1f5f9;
    font-size: 22px;
}

.alert-box {
    margin-bottom: 18px;
    padding: 12px 16px;
    border-radius: 12px;
    background: #fef2f2;
    color: #991b1b;
    font-weight: 700;
}
.coming-soon-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 22px;
}

.company-form { display: grid; gap: 18px; padding-bottom: 90px; }
.form-card {
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: 18px;
    padding: 22px;
    box-shadow: 0 8px 20px rgba(17,24,39,.05);
}
.form-card-heading {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    margin-bottom: 14px;
}
.form-card-heading h2 { margin: 0; font-size: 20px; }
.form-card-heading span { color: var(--muted); font-size: 13px; }
.form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(220px, 1fr));
    gap: 14px 18px;
}
.checkline {
    display: flex;
    align-items: center;
    gap: 10px;
    padding-top: 28px;
}
.checkline label { margin: 0; }
.success-box {
    background: #e8fff1;
    border: 1px solid #9ee7b6;
    color: #166534;
    padding: 12px 14px;
    border-radius: 10px;
    margin-bottom: 16px;
    font-weight: 700;
}
.sticky-actions {
    position: sticky;
    bottom: 0;
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    padding: 14px 0 0;
    background: linear-gradient(transparent, var(--bg) 20%);
}
.save-btn { width: auto; margin-top: 0; }
@media (max-width: 900px) {
    .form-grid { grid-template-columns: 1fr; }
    .form-card-heading { align-items: flex-start; flex-direction: column; }
}

/* User theme pack */
body.theme-odoo {
    --bg: #f4f6fb;
    --card: #ffffff;
    --text: #1f2937;
    --muted: #6b7280;
    --border: #e5e7eb;
    --brand: #714b67;
    --brand-dark: #52364b;
    --on-brand: #ffffff;
    --soft: #f8eef6;
}

body.theme-blue {
    --bg: #eff6ff;
    --card: #ffffff;
    --text: #0f172a;
    --muted: #64748b;
    --border: #bfdbfe;
    --brand: #2563eb;
    --brand-dark: #1e3a8a;
    --on-brand: #ffffff;
    --soft: #dbeafe;
}

body.theme-green {
    --bg: #ecfdf5;
    --card: #ffffff;
    --text: #052e16;
    --muted: #64748b;
    --border: #bbf7d0;
    --brand: #059669;
    --brand-dark: #065f46;
    --on-brand: #ffffff;
    --soft: #d1fae5;
}

body.theme-gold {
    --bg: #fffbeb;
    --card: #ffffff;
    --text: #292524;
    --muted: #78716c;
    --border: #fde68a;
    --brand: #a16207;
    --brand-dark: #713f12;
    --on-brand: #ffffff;
    --soft: #fef3c7;
}

body.theme-red {
    --bg: #fff1f2;
    --card: #ffffff;
    --text: #1f2937;
    --muted: #6b7280;
    --border: #fecdd3;
    --brand: #dc2626;
    --brand-dark: #991b1b;
    --on-brand: #ffffff;
    --soft: #ffe4e6;
}

body.theme-dark {
    --bg: #0f172a;
    --card: #111827;
    --text: #e5e7eb;
    --muted: #94a3b8;
    --border: #334155;
    --brand: #8b5cf6;
    --brand-dark: #020617;
    --on-brand: #ffffff;
    --soft: #1e293b;
}

body.theme-dark .app-card,
body.theme-dark .module-card,
body.theme-dark .submenu-card,
body.theme-dark .info-card,
body.theme-dark .odoo-section,
body.theme-dark .form-card,
body.theme-dark .empty-state,
body.theme-dark .user-chip,
body.theme-dark .login-card,
body.theme-dark .page-card {
    background: var(--card);
    color: var(--text);
}

body.theme-dark .app-card {
    background: linear-gradient(180deg, #111827, #0f172a);
}

body.theme-dark .action-list a,
body.theme-dark .back-btn,
body.theme-dark .submenu-icon,
body.theme-dark .module-big-icon {
    background: #1e293b;
    color: var(--text);
    border-color: var(--border);
}

.theme-floating-panel {
    position: fixed;
    right: 18px;
    top: 14px;
    z-index: 1000;
    background: var(--card);
    color: var(--text);
    border: 1px solid var(--border);
    border-radius: 999px;
    padding: 8px 10px;
    box-shadow: 0 10px 30px rgba(15, 23, 42, .12);
}

.theme-floating-panel form {
    display: flex;
    align-items: center;
    gap: 8px;
}

.theme-floating-panel label {
    margin: 0;
    font-size: 12px;
    color: var(--muted);
}

.theme-floating-panel select {
    border: 1px solid var(--border);
    background: var(--bg);
    color: var(--text);
    border-radius: 999px;
    padding: 7px 10px;
    font-weight: 700;
}

.theme-floating-panel a {
    color: var(--brand);
    font-size: 12px;
    font-weight: 800;
    padding: 0 6px;
}

.theme-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
    gap: 18px;
}

.theme-card {
    border: 1px solid var(--border);
    border-radius: 20px;
    padding: 18px;
    background: var(--card);
    color: var(--text);
    text-align: left;
    box-shadow: 0 10px 25px rgba(15, 23, 42, .07);
}

.theme-card.selected {
    border: 2px solid var(--brand);
    box-shadow: 0 16px 35px rgba(15, 23, 42, .12);
}

.theme-card h3 { margin: 14px 0 6px; }
.theme-card p { margin: 0 0 14px; color: var(--muted); }

.theme-preview {
    height: 92px;
    border-radius: 16px;
    display: grid;
    grid-template-columns: 72px 1fr;
    grid-template-rows: 1fr 1fr;
    gap: 10px;
    padding: 12px;
    background: var(--bg);
    border: 1px solid var(--border);
}

.theme-preview span:first-child {
    grid-row: 1 / span 2;
    border-radius: 12px;
}

.theme-preview span:nth-child(2),
.theme-preview span:nth-child(3) {
    border-radius: 12px;
    background: var(--card);
    border: 1px solid var(--border);
}

.theme-preview-odoo { --bg: #f4f6fb; --card: #ffffff; --border: #e5e7eb; }
.theme-preview-blue { --bg: #eff6ff; --card: #ffffff; --border: #bfdbfe; }
.theme-preview-green { --bg: #ecfdf5; --card: #ffffff; --border: #bbf7d0; }
.theme-preview-gold { --bg: #fffbeb; --card: #ffffff; --border: #fde68a; }
.theme-preview-red { --bg: #fff1f2; --card: #ffffff; --border: #fecdd3; }
.theme-preview-dark { --bg: #0f172a; --card: #111827; --border: #334155; }

@media (max-width: 760px) {
    .theme-floating-panel {
        position: static;
        margin: 10px;
        border-radius: 14px;
    }
    .theme-floating-panel form { flex-wrap: wrap; }
}

/* Account dropdown theme selector - replaces old floating theme panel */
.account-menu {
    position: relative;
    display: inline-flex;
    align-items: center;
    z-index: 50;
}

.account-menu-button {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    border: 1px solid var(--border);
    background: var(--card);
    color: var(--text);
    border-radius: 999px;
    padding: 7px 10px 7px 7px;
    font-weight: 800;
    cursor: pointer;
    box-shadow: 0 8px 20px rgba(15, 23, 42, .08);
}

.account-avatar {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    display: inline-grid;
    place-items: center;
    background: var(--brand);
    color: #fff;
    font-size: 13px;
}

.account-name {
    max-width: 180px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.account-caret { color: var(--muted); font-size: 13px; }

.account-dropdown {
    position: absolute;
    top: calc(100% + 10px);
    right: 0;
    min-width: 260px;
    background: var(--card);
    color: var(--text);
    border: 1px solid var(--border);
    border-radius: 18px;
    padding: 12px;
    box-shadow: 0 22px 55px rgba(15, 23, 42, .18);
    display: none;
}

.account-menu:hover .account-dropdown,
.account-menu:focus-within .account-dropdown {
    display: block;
}

.account-dropdown-header {
    padding: 6px 6px 12px;
    border-bottom: 1px solid var(--border);
    margin-bottom: 10px;
}

.account-dropdown-header strong,
.account-dropdown-header span {
    display: block;
}

.account-dropdown-header span {
    margin-top: 3px;
    font-size: 12px;
    color: var(--muted);
}

.account-theme-form label {
    margin: 0 0 6px;
    font-size: 12px;
    color: var(--muted);
}

.account-theme-form select {
    width: 100%;
    border: 1px solid var(--border);
    background: var(--bg);
    color: var(--text);
    border-radius: 12px;
    padding: 10px 12px;
    font-weight: 700;
}

.account-dropdown-link,
.account-logout {
    width: 100%;
    display: block;
    margin-top: 10px;
    border-radius: 12px;
    padding: 10px 12px;
    font-weight: 800;
    text-align: left;
}

.account-dropdown-link {
    color: var(--brand);
    background: color-mix(in srgb, var(--brand) 8%, transparent);
}

.account-logout {
    border: 0;
    background: #111827;
    color: #fff;
    cursor: pointer;
}

body.theme-dark .account-menu-button,
body.theme-dark .account-dropdown {
    background: var(--card);
    color: var(--text);
    border-color: var(--border);
}

@media (max-width: 760px) {
    .user-panel {
        width: 100%;
        justify-content: space-between;
        flex-wrap: wrap;
    }

    .account-menu,
    .account-menu-button {
        width: 100%;
    }

    .account-menu-button {
        justify-content: space-between;
    }

    .account-dropdown {
        left: 0;
        right: auto;
        width: 100%;
        min-width: 0;
    }
}

/* Attractive extended theme pack */
body.theme-ocean {
    --bg: #e0f2fe;
    --card: #ffffff;
    --text: #082f49;
    --muted: #64748b;
    --border: #bae6fd;
    --brand: #0284c7;
    --brand-dark: #075985;
    --on-brand: #ffffff;
    --soft: #cffafe;
}

body.theme-mint {
    --bg: #f0fdfa;
    --card: #ffffff;
    --text: #134e4a;
    --muted: #64748b;
    --border: #99f6e4;
    --brand: #10b981;
    --brand-dark: #047857;
    --on-brand: #052e16;
    --soft: #ccfbf1;
}

body.theme-teal {
    --bg: #ecfeff;
    --card: #ffffff;
    --text: #042f2e;
    --muted: #64748b;
    --border: #99f6e4;
    --brand: #0f766e;
    --brand-dark: #134e4a;
    --on-brand: #ffffff;
    --soft: #ccfbf1;
}

body.theme-coffee {
    --bg: #fef3c7;
    --card: #fffaf0;
    --text: #3f2a1d;
    --muted: #786557;
    --border: #fcd9a3;
    --brand: #92400e;
    --brand-dark: #451a03;
    --on-brand: #ffffff;
    --soft: #fde68a;
}

body.theme-rose {
    --bg: #fff1f2;
    --card: #ffffff;
    --text: #4c0519;
    --muted: #7f1d1d;
    --border: #fecdd3;
    --brand: #e11d48;
    --brand-dark: #9f1239;
    --on-brand: #ffffff;
    --soft: #ffe4e6;
}

body.theme-sunset {
    --bg: #fff7ed;
    --card: #ffffff;
    --text: #431407;
    --muted: #7c2d12;
    --border: #fed7aa;
    --brand: #f97316;
    --brand-dark: #9a3412;
    --on-brand: #431407;
    --soft: #ffedd5;
}

body.theme-royal {
    --bg: #eef2ff;
    --card: #ffffff;
    --text: #1e1b4b;
    --muted: #64748b;
    --border: #c7d2fe;
    --brand: #4f46e5;
    --brand-dark: #312e81;
    --on-brand: #ffffff;
    --soft: #e0e7ff;
}

body.theme-grape {
    --bg: #f5f3ff;
    --card: #ffffff;
    --text: #2e1065;
    --muted: #6b7280;
    --border: #ddd6fe;
    --brand: #7c3aed;
    --brand-dark: #4c1d95;
    --on-brand: #ffffff;
    --soft: #ede9fe;
}

body.theme-slate {
    --bg: #f1f5f9;
    --card: #ffffff;
    --text: #0f172a;
    --muted: #64748b;
    --border: #cbd5e1;
    --brand: #475569;
    --brand-dark: #1e293b;
    --on-brand: #ffffff;
    --soft: #e2e8f0;
}

body.theme-glass {
    --bg: #e0f7ff;
    --card: rgba(255,255,255,.82);
    --text: #0f172a;
    --muted: #475569;
    --border: rgba(125, 211, 252, .65);
    --brand: #38bdf8;
    --brand-dark: #0369a1;
    --on-brand: #0f172a;
    --soft: rgba(224, 242, 254, .88);
}

body.theme-midnight {
    --bg: #020617;
    --card: #0f172a;
    --text: #e0f2fe;
    --muted: #94a3b8;
    --border: #1e3a8a;
    --brand: #06b6d4;
    --brand-dark: #020617;
    --on-brand: #020617;
    --soft: #082f49;
}

body.theme-carbon {
    --bg: #09090b;
    --card: #18181b;
    --text: #fafafa;
    --muted: #a1a1aa;
    --border: #3f3f46;
    --brand: #f59e0b;
    --brand-dark: #111111;
    --on-brand: #111111;
    --soft: #27272a;
}

body.theme-sunset .sidebar,
body.theme-royal .sidebar,
body.theme-grape .sidebar,
body.theme-ocean .sidebar,
body.theme-glass .sidebar {
    background: linear-gradient(160deg, var(--brand-dark), var(--brand));
}

body.theme-midnight,
body.theme-carbon,
body.theme-dark {
    background: radial-gradient(circle at top right, rgba(6, 182, 212, .12), transparent 28%), var(--bg);
}

body.theme-glass .odoo-section,
body.theme-glass .form-card,
body.theme-glass .info-card,
body.theme-glass .app-card,
body.theme-glass .submenu-card,
body.theme-glass .account-dropdown,
body.theme-glass .account-menu-button,
body.theme-glass .theme-card {
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
}

body.theme-midnight .app-card,
body.theme-midnight .module-card,
body.theme-midnight .submenu-card,
body.theme-midnight .info-card,
body.theme-midnight .odoo-section,
body.theme-midnight .form-card,
body.theme-midnight .empty-state,
body.theme-midnight .user-chip,
body.theme-midnight .login-card,
body.theme-midnight .page-card,
body.theme-midnight .account-menu-button,
body.theme-midnight .account-dropdown,
body.theme-midnight .theme-card,
body.theme-carbon .app-card,
body.theme-carbon .module-card,
body.theme-carbon .submenu-card,
body.theme-carbon .info-card,
body.theme-carbon .odoo-section,
body.theme-carbon .form-card,
body.theme-carbon .empty-state,
body.theme-carbon .user-chip,
body.theme-carbon .login-card,
body.theme-carbon .page-card,
body.theme-carbon .account-menu-button,
body.theme-carbon .account-dropdown,
body.theme-carbon .theme-card {
    background: var(--card);
    color: var(--text);
    border-color: var(--border);
}

body.theme-midnight .app-card,
body.theme-carbon .app-card {
    background: linear-gradient(180deg, var(--card), var(--bg));
}

body.theme-midnight .action-list a,
body.theme-midnight .back-btn,
body.theme-midnight .submenu-icon,
body.theme-midnight .module-big-icon,
body.theme-carbon .action-list a,
body.theme-carbon .back-btn,
body.theme-carbon .submenu-icon,
body.theme-carbon .module-big-icon {
    background: var(--soft);
    color: var(--text);
    border-color: var(--border);
}

.theme-grid {
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
}

.theme-card {
    position: relative;
    overflow: hidden;
    transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}

.theme-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 22px 48px rgba(15, 23, 42, .14);
}

.theme-card-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-top: 14px;
}

.theme-card-title h3 { margin: 0; }
.theme-card-title strong {
    color: #fff;
    background: var(--brand);
    border-radius: 999px;
    padding: 5px 9px;
    font-size: 12px;
}

.theme-preview {
    height: 112px;
    grid-template-columns: 78px 1fr;
    grid-template-rows: 1fr 1fr 18px;
    background: linear-gradient(135deg, var(--bg), var(--soft));
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.3);
}

.theme-preview span:first-child {
    background: linear-gradient(160deg, var(--brand-dark), var(--brand)) !important;
}

.theme-preview em {
    grid-column: 1 / span 2;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--brand), transparent);
    opacity: .7;
}

.theme-preview-ocean { --bg: #e0f2fe; --card: #ffffff; --border: #bae6fd; --brand: #0284c7; --brand-dark: #075985; --soft: #cffafe; }
.theme-preview-mint { --bg: #f0fdfa; --card: #ffffff; --border: #99f6e4; --brand: #10b981; --brand-dark: #047857; --soft: #ccfbf1; }
.theme-preview-teal { --bg: #ecfeff; --card: #ffffff; --border: #99f6e4; --brand: #0f766e; --brand-dark: #134e4a; --soft: #ccfbf1; }
.theme-preview-coffee { --bg: #fef3c7; --card: #fffaf0; --border: #fcd9a3; --brand: #92400e; --brand-dark: #451a03; --soft: #fde68a; }
.theme-preview-rose { --bg: #fff1f2; --card: #ffffff; --border: #fecdd3; --brand: #e11d48; --brand-dark: #9f1239; --soft: #ffe4e6; }
.theme-preview-sunset { --bg: #fff7ed; --card: #ffffff; --border: #fed7aa; --brand: #f97316; --brand-dark: #9a3412; --soft: #ffedd5; }
.theme-preview-royal { --bg: #eef2ff; --card: #ffffff; --border: #c7d2fe; --brand: #4f46e5; --brand-dark: #312e81; --soft: #e0e7ff; }
.theme-preview-grape { --bg: #f5f3ff; --card: #ffffff; --border: #ddd6fe; --brand: #7c3aed; --brand-dark: #4c1d95; --soft: #ede9fe; }
.theme-preview-slate { --bg: #f1f5f9; --card: #ffffff; --border: #cbd5e1; --brand: #475569; --brand-dark: #1e293b; --soft: #e2e8f0; }
.theme-preview-glass { --bg: #e0f7ff; --card: rgba(255,255,255,.82); --border: rgba(125, 211, 252, .65); --brand: #38bdf8; --brand-dark: #0369a1; --soft: rgba(224, 242, 254, .88); }
.theme-preview-midnight { --bg: #020617; --card: #0f172a; --border: #1e3a8a; --brand: #06b6d4; --brand-dark: #020617; --soft: #082f49; }
.theme-preview-carbon { --bg: #09090b; --card: #18181b; --border: #3f3f46; --brand: #f59e0b; --brand-dark: #111111; --soft: #27272a; }

/* VB.NET style multi-level left menu */
.app-shell { grid-template-columns: 300px 1fr; }
.erp-sidebar { overflow-y: auto; }
.multi-menu { display: block; }
.multi-menu .menu-home,
.menu-row { width: 100%; }
.multi-menu .menu-home {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 12px;
    margin-bottom: 10px;
    border-radius: 12px;
    color: rgba(255,255,255,.9);
    text-decoration: none;
    background: rgba(255,255,255,.10);
}
.menu-node { margin: 3px 0; }
.menu-row {
    display: grid;
    grid-template-columns: 1fr 34px;
    align-items: center;
    gap: 4px;
}
.menu-link {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 36px;
    padding: 8px 10px;
    border-radius: 10px;
    color: rgba(255,255,255,.88);
    text-decoration: none;
    font-size: .92rem;
}
.menu-link:hover,
.menu-link:focus { background: rgba(255,255,255,.13); color: #fff; }
.menu-icon { width: 22px; text-align: center; flex: 0 0 auto; }
.menu-toggle {
    width: 30px;
    height: 30px;
    border: 0;
    border-radius: 10px;
    background: rgba(255,255,255,.10);
    color: #fff;
    cursor: pointer;
    transition: transform .18s ease, background .18s ease;
}
.menu-toggle:hover { background: rgba(255,255,255,.20); }
.menu-toggle.open { transform: rotate(180deg); }
.menu-children {
    display: none;
    margin-left: 13px;
    padding-left: 10px;
    border-left: 1px solid rgba(255,255,255,.18);
}
.menu-children.open { display: block; }
.menu-children .menu-link { font-size: .86rem; min-height: 32px; padding-block: 6px; }
.menu-children .menu-children .menu-link { font-size: .82rem; }

.multi-level-dashboard {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(270px, 1fr));
    gap: 16px;
}
.dash-menu-card {
    background: #fff;
    border: 1px solid rgba(15,23,42,.08);
    border-radius: 18px;
    padding: 14px;
    box-shadow: 0 10px 30px rgba(15,23,42,.06);
}
.dash-menu-card .dash-menu-card {
    box-shadow: none;
    border-radius: 14px;
    padding: 10px;
    margin-top: 8px;
    background: rgba(248,250,252,.8);
}
.dash-menu-title {
    display: flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
    color: #111827;
}
.dash-menu-title span {
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    background: var(--theme-soft, #f3e8ff);
}
.dash-menu-leaf p { margin: 8px 0 0 46px; color: #64748b; font-size: .85rem; }
.dash-sub-list { margin-top: 10px; }
body.theme-dark .dash-menu-card,
body.theme-midnight .dash-menu-card,
body.theme-carbon .dash-menu-card { background: rgba(17,24,39,.94); border-color: rgba(255,255,255,.08); }
body.theme-dark .dash-menu-card .dash-menu-card,
body.theme-midnight .dash-menu-card .dash-menu-card,
body.theme-carbon .dash-menu-card .dash-menu-card { background: rgba(255,255,255,.05); }
body.theme-dark .dash-menu-title,
body.theme-midnight .dash-menu-title,
body.theme-carbon .dash-menu-title { color: #f8fafc; }

@media (max-width: 900px) {
    .app-shell { grid-template-columns: 1fr; }
    .erp-sidebar { max-height: 45vh; }
}

/* Dashboard correction: clock stays inline with Branch / Role / Rights cards */
.dashboard-header {
    display: grid;
    grid-template-columns: minmax(260px, 1fr) auto;
    gap: 18px;
    align-items: start;
}

.dashboard-status-row {
    grid-template-columns: minmax(180px, 1fr) minmax(180px, 1fr) minmax(260px, 1fr) minmax(320px, auto);
    align-items: stretch;
}

.dashboard-inline-clock.date-time-card {
    min-width: 320px;
    margin: 0;
    height: 100%;
    border: 1px solid rgba(255,255,255,.18);
}

/* Dashboard menu correction: show one menu level per dashboard */
.one-level-dashboard {
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    align-items: stretch;
}

.dash-menu-card-link {
    position: relative;
    display: grid;
    grid-template-columns: 54px 1fr 24px;
    gap: 14px;
    align-items: center;
    min-height: 132px;
    background: var(--card);
    color: var(--text);
    border: 1px solid var(--border);
    border-radius: 20px;
    padding: 18px;
    text-decoration: none;
    box-shadow: 0 12px 30px rgba(15, 23, 42, .07);
    transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}

.dash-menu-card-link:hover,
.dash-menu-card-link:focus {
    transform: translateY(-3px);
    box-shadow: 0 18px 42px rgba(15, 23, 42, .12);
    border-color: color-mix(in srgb, var(--brand) 45%, var(--border));
    color: var(--text);
}

.dash-menu-card-icon {
    width: 54px;
    height: 54px;
    display: grid;
    place-items: center;
    border-radius: 17px;
    background: var(--soft);
    color: var(--brand-dark);
    font-size: 27px;
}

.dash-menu-card-body h3 {
    margin: 0 0 8px;
    font-size: 18px;
}

.dash-menu-card-body p {
    margin: 8px 0 0;
    color: var(--muted);
    font-size: 14px;
    line-height: 1.35;
}

.dash-menu-card-arrow {
    color: var(--brand);
    font-size: 32px;
    font-weight: 300;
}

body.theme-dark .dash-menu-card-link,
body.theme-midnight .dash-menu-card-link,
body.theme-carbon .dash-menu-card-link {
    background: var(--card);
    color: var(--text);
    border-color: var(--border);
}

body.theme-dark .dash-menu-card-icon,
body.theme-midnight .dash-menu-card-icon,
body.theme-carbon .dash-menu-card-icon {
    background: var(--soft);
    color: var(--text);
}

@media (max-width: 1100px) {
    .dashboard-status-row {
        grid-template-columns: repeat(2, minmax(180px, 1fr));
    }

    .dashboard-inline-clock.date-time-card {
        min-width: 0;
    }
}

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

    .dashboard-status-row {
        grid-template-columns: 1fr;
    }

    .dashboard-inline-clock.date-time-card {
        width: 100%;
        flex-direction: row;
        align-items: center;
    }
}

/* Odoo-style Company form */
.company-topbar {
    align-items: center;
}

.odoo-company-form {
    margin-top: 14px;
}

.odoo-form-shell {
    background: rgba(255,255,255,.94);
    border: 1px solid color-mix(in srgb, var(--brand-dark) 16%, transparent);
    border-radius: 10px;
    box-shadow: 0 14px 34px rgba(34, 24, 46, .08);
    overflow: hidden;
}

.odoo-form-statusbar {
    min-height: 50px;
    padding: 10px 16px;
    border-bottom: 1px solid color-mix(in srgb, var(--brand-dark) 12%, transparent);
    background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(249,249,251,.92));
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.odoo-actions {
    display: flex;
    align-items: center;
    gap: 10px;
}

.odoo-save {
    border: 0;
    background: var(--brand);
    color: #fff;
    border-radius: 4px;
    padding: 8px 18px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    box-shadow: 0 8px 18px color-mix(in srgb, var(--brand) 22%, transparent);
}

.odoo-save:hover {
    background: var(--brand-dark);
}

.odoo-discard {
    color: var(--brand-dark);
    text-decoration: none;
    font-weight: 600;
    padding: 8px 10px;
}

.odoo-discard:hover {
    color: var(--brand);
}

.odoo-status-pills {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.odoo-status {
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    padding: 6px 12px;
    border-radius: 999px;
    border: 1px solid color-mix(in srgb, var(--brand) 20%, transparent);
    color: var(--brand-dark);
    background: #fff;
}

.odoo-status.active {
    background: color-mix(in srgb, var(--brand) 12%, transparent);
    color: var(--brand);
}

.odoo-company-header {
    display: flex;
    align-items: flex-start;
    gap: 18px;
    padding: 18px 18px 22px;
    border-bottom: 1px solid color-mix(in srgb, var(--brand-dark) 12%, transparent);
}

.odoo-logo-box {
    width: 92px;
    min-width: 92px;
    position: relative;
}

.odoo-logo-box img,
.odoo-logo-placeholder {
    width: 92px;
    height: 92px;
    object-fit: contain;
    border-radius: 14px;
    border: 1px solid color-mix(in srgb, var(--brand-dark) 16%, transparent);
    background: #fff;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.4);
}

.odoo-logo-placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    color: #8f8493;
    font-weight: 800;
    font-size: 14px;
    background: linear-gradient(135deg, #fff, #f6f0f5);
}

.odoo-logo-upload {
    display: block;
    margin-top: 8px;
    text-align: center;
    font-size: 11px;
    font-weight: 700;
    color: var(--brand);
    cursor: pointer;
}

.odoo-logo-upload input {
    display: none;
}

.odoo-title-area {
    flex: 1;
    min-width: 0;
}

.odoo-title-label {
    display: block;
    font-size: 13px;
    font-weight: 800;
    color: #000;
    margin-bottom: 3px;
}

.odoo-company-name-input {
    width: 100%;
    border: 0;
    border-bottom: 1px solid transparent;
    background: transparent;
    font-size: 34px;
    line-height: 1.2;
    color: #111827;
    padding: 0 0 4px;
    outline: none;
}

.odoo-company-name-input:focus {
    border-bottom-color: var(--brand);
}

.odoo-title-meta {
    margin-top: 10px;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.odoo-title-meta span {
    padding: 5px 10px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--brand) 8%, transparent);
    color: var(--brand-dark);
    font-size: 12px;
    font-weight: 700;
}

.odoo-tabs > input[type="radio"] {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.odoo-tab-labels {
    display: flex;
    gap: 0;
    border-bottom: 1px solid color-mix(in srgb, var(--brand-dark) 14%, transparent);
    background: #fbfbfc;
    padding-left: 16px;
}

.odoo-tab-labels label {
    padding: 13px 18px;
    border-right: 1px solid color-mix(in srgb, var(--brand-dark) 12%, transparent);
    color: var(--brand-dark);
    font-weight: 600;
    cursor: pointer;
    position: relative;
}

#tab-general:checked ~ .odoo-tab-labels label[for="tab-general"],
#tab-branches:checked ~ .odoo-tab-labels label[for="tab-branches"],
#tab-accounting:checked ~ .odoo-tab-labels label[for="tab-accounting"],
#tab-admin:checked ~ .odoo-tab-labels label[for="tab-admin"] {
    background: #fff;
    color: var(--brand);
}

#tab-general:checked ~ .odoo-tab-labels label[for="tab-general"]::before,
#tab-branches:checked ~ .odoo-tab-labels label[for="tab-branches"]::before,
#tab-accounting:checked ~ .odoo-tab-labels label[for="tab-accounting"]::before,
#tab-admin:checked ~ .odoo-tab-labels label[for="tab-admin"]::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    height: 3px;
    background: var(--brand);
}

.odoo-tab-content {
    display: none;
    padding: 20px 16px 28px;
}

#tab-general:checked ~ .tab-general-content,
#tab-branches:checked ~ .tab-branches-content,
#tab-accounting:checked ~ .tab-accounting-content,
#tab-admin:checked ~ .tab-admin-content {
    display: block;
}

.odoo-two-column {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 42px;
}

.odoo-field-group h3,
.odoo-branch-card h3 {
    margin: 0 0 16px;
    color: #312338;
    font-size: 18px;
}

.odoo-row {
    display: grid;
    grid-template-columns: 155px minmax(0, 1fr);
    gap: 12px;
    align-items: center;
    margin-bottom: 14px;
}

.odoo-row.textarea-row {
    align-items: start;
}

.odoo-row label {
    color: #111827;
    font-size: 14px;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}

.field-required-marker,
.text-danger {
    color: #dc2626;
    font-weight: 900;
}

.field-optional-marker {
    display: inline-flex;
    align-items: center;
    min-height: 16px;
    padding: 1px 6px;
    border: 1px solid rgba(100, 116, 139, .22);
    border-radius: 999px;
    background: rgba(241, 245, 249, .88);
    color: #64748b;
    font-size: 10px;
    font-weight: 800;
    line-height: 1.2;
    text-transform: uppercase;
}

.odoo-input {
    width: 100%;
    min-height: 34px;
    border: 0;
    border-bottom: 1px solid color-mix(in srgb, var(--brand-dark) 18%, transparent);
    background: transparent;
    padding: 6px 4px;
    outline: none;
    color: #111827;
    font-size: 14px;
}

.odoo-input:focus {
    border-bottom-color: var(--brand);
    background: color-mix(in srgb, var(--brand) 3.5%, transparent);
}

.odoo-input.light::placeholder {
    color: #9ca3af;
}

.odoo-input.small {
    max-width: 150px;
}

.odoo-address-stack {
    display: flex;
    flex-direction: column;
    gap: 7px;
}

.odoo-inline-fields {
    display: grid;
    grid-template-columns: 90px 1fr 1fr;
    gap: 10px;
}

.check-row input[type="checkbox"] {
    width: 18px;
    height: 18px;
    accent-color: var(--brand);
}

.odoo-branch-card {
    border: 1px solid color-mix(in srgb, var(--brand) 16%, transparent);
    border-radius: 12px;
    padding: 18px;
    background: linear-gradient(135deg, color-mix(in srgb, var(--brand) 8%, transparent), rgba(255,255,255,.92));
}

.branch-preview {
    margin-top: 14px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 14px;
    border-radius: 10px;
    background: #fff;
    border: 1px solid color-mix(in srgb, var(--brand-dark) 10%, transparent);
}

.small-note {
    margin-left: 167px;
    max-width: 480px;
}

@media (max-width: 1100px) {
    .odoo-two-column {
        grid-template-columns: 1fr;
        gap: 20px;
    }
}

@media (max-width: 760px) {
    .odoo-form-statusbar,
    .odoo-company-header {
        flex-direction: column;
        align-items: stretch;
    }

    .odoo-company-header {
        gap: 12px;
    }

    .odoo-company-name-input {
        font-size: 26px;
    }

    .odoo-tab-labels {
        padding-left: 0;
        overflow-x: auto;
    }

    .odoo-tab-labels label {
        white-space: nowrap;
    }

    .odoo-row {
        grid-template-columns: 1fr;
        gap: 4px;
    }

    .odoo-inline-fields {
        grid-template-columns: 1fr;
    }

    .small-note {
        margin-left: 0;
    }
}

/* Theme-aware Odoo company create/update form */
.odoo-form-shell {
    background: color-mix(in srgb, var(--card) 96%, transparent);
    border-color: color-mix(in srgb, var(--brand) 18%, var(--border));
    color: var(--text);
}

.odoo-form-statusbar {
    background: linear-gradient(180deg, color-mix(in srgb, var(--card) 98%, white), color-mix(in srgb, var(--soft) 55%, var(--card)));
    border-bottom-color: color-mix(in srgb, var(--brand) 16%, var(--border));
}

.odoo-save,
.odoo-new {
    border: 0;
    background: var(--brand);
    color: #fff;
    border-radius: 4px;
    padding: 8px 18px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    text-decoration: none;
    box-shadow: 0 8px 18px color-mix(in srgb, var(--brand) 25%, transparent);
}

.odoo-save:hover,
.odoo-new:hover {
    background: var(--brand-dark);
    color: #fff;
}

.odoo-new {
    background: color-mix(in srgb, var(--brand) 86%, white);
}

.odoo-discard,
.odoo-logo-upload,
.odoo-tab-labels label:hover {
    color: var(--brand);
}

.odoo-status {
    border-color: color-mix(in srgb, var(--brand) 22%, var(--border));
    color: color-mix(in srgb, var(--brand) 75%, var(--text));
    background: var(--card);
}

.odoo-status.active,
.odoo-title-meta span {
    background: color-mix(in srgb, var(--brand) 12%, var(--card));
    color: var(--brand);
}

.odoo-company-header,
.odoo-tab-labels {
    border-color: color-mix(in srgb, var(--brand) 16%, var(--border));
}

.odoo-tab-labels {
    background: color-mix(in srgb, var(--soft) 45%, var(--card));
}

#tab-general:checked ~ .odoo-tab-labels label[for="tab-general"],
#tab-branches:checked ~ .odoo-tab-labels label[for="tab-branches"],
#tab-accounting:checked ~ .odoo-tab-labels label[for="tab-accounting"],
#tab-admin:checked ~ .odoo-tab-labels label[for="tab-admin"] {
    background: var(--card);
    color: var(--brand);
}

#tab-general:checked ~ .odoo-tab-labels label[for="tab-general"]::before,
#tab-branches:checked ~ .odoo-tab-labels label[for="tab-branches"]::before,
#tab-accounting:checked ~ .odoo-tab-labels label[for="tab-accounting"]::before,
#tab-admin:checked ~ .odoo-tab-labels label[for="tab-admin"]::before {
    background: var(--brand);
}

.odoo-company-name-input,
.odoo-row label,
.odoo-field-group h3,
.odoo-branch-card h3,
.odoo-input {
    color: var(--text);
}

.odoo-input {
    border-bottom-color: color-mix(in srgb, var(--brand) 18%, var(--border));
}

.odoo-input:focus {
    border-bottom-color: var(--brand);
    background: color-mix(in srgb, var(--brand) 5%, transparent);
}

.check-row input[type="checkbox"] {
    accent-color: var(--brand);
}

.odoo-logo-box img,
.odoo-logo-placeholder,
.branch-preview {
    background: var(--card);
    border-color: color-mix(in srgb, var(--brand) 16%, var(--border));
}

.odoo-logo-placeholder,
.odoo-input::placeholder {
    color: var(--muted);
}

.odoo-branch-card {
    border-color: color-mix(in srgb, var(--brand) 16%, var(--border));
    background: linear-gradient(135deg, color-mix(in srgb, var(--brand) 8%, var(--card)), color-mix(in srgb, var(--card) 92%, transparent));
}

body.theme-dark .odoo-form-shell,
body.theme-midnight .odoo-form-shell,
body.theme-carbon .odoo-form-shell {
    background: var(--card);
}

/* Sidebar show/hide and menu icons */
.app-shell {
    grid-template-columns: 280px minmax(0, 1fr);
    transition: grid-template-columns .18s ease;
}

.sidebar-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 20px;
}

.sidebar-logo {
    color: #ffffff;
    text-decoration: none;
    margin-bottom: 0;
    flex: 0 0 auto;
}

.sidebar-pin-toggle,
.mobile-sidebar-toggle {
    border: 0;
    cursor: pointer;
    font-weight: 800;
    color: #ffffff;
    background: rgba(255,255,255,.14);
    border-radius: 12px;
    transition: background .15s ease, transform .15s ease;
}

.sidebar-pin-toggle {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    font-size: 20px;
}

.sidebar-pin-toggle:hover,
.mobile-sidebar-toggle:hover {
    background: rgba(255,255,255,.24);
}

.toggle-collapsed { display: none; }

.mobile-sidebar-toggle {
    display: none;
    margin-bottom: 14px;
    padding: 10px 14px;
    background: var(--brand);
}

.menu-home,
.menu-link {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 42px;
    width: 100%;
}

.menu-row {
    display: flex;
    align-items: center;
    gap: 4px;
}

.menu-link {
    flex: 1 1 auto;
    min-width: 0;
}

.menu-text {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.menu-icon {
    width: 26px;
    height: 26px;
    flex: 0 0 26px;
    display: inline-grid;
    place-items: center;
    border-radius: 9px;
    background: rgba(255,255,255,.12);
    font-size: 15px;
    line-height: 1;
}

.menu-toggle {
    flex: 0 0 30px;
    width: 30px;
    height: 30px;
    border: 0;
    border-radius: 10px;
    cursor: pointer;
    color: rgba(255,255,255,.82);
    background: rgba(255,255,255,.08);
    transition: transform .15s ease, background .15s ease;
}

.menu-toggle:hover { background: rgba(255,255,255,.16); color: #fff; }
.menu-toggle.open { transform: rotate(180deg); }

.menu-children {
    display: none;
    margin: 4px 0 4px 16px;
    padding-left: 10px;
    border-left: 1px solid rgba(255,255,255,.16);
}

.menu-children.open { display: block; }
.menu-children .menu-icon { background: rgba(255,255,255,.08); font-size: 14px; }
.menu-children .menu-link { min-height: 36px; font-size: 13px; padding-top: 8px; padding-bottom: 8px; }
.menu-children .menu-children { margin-left: 12px; }

.sidebar-collapsed.app-shell { grid-template-columns: 82px minmax(0, 1fr); }
.pos-sidebar-hidden.app-shell,
.pos-sidebar-hidden.sidebar-collapsed.app-shell { grid-template-columns: minmax(0, 1fr); }
.sidebar-collapsed .erp-sidebar { padding-left: 12px; padding-right: 12px; }
.sidebar-collapsed .sidebar-head { justify-content: center; flex-direction: column; }
.sidebar-collapsed .sidebar-logo {
    width: 52px;
    height: 52px;
    font-size: 17px;
}
.sidebar-collapsed .toggle-expanded { display: none; }
.sidebar-collapsed .toggle-collapsed { display: inline; }
.sidebar-collapsed .menu-text,
.sidebar-collapsed .menu-toggle { display: none; }
.sidebar-collapsed .menu-home,
.sidebar-collapsed .menu-link {
    justify-content: center;
    padding-left: 0;
    padding-right: 0;
}
.sidebar-collapsed .menu-icon {
    width: 34px;
    height: 34px;
    flex-basis: 34px;
    font-size: 17px;
}
.sidebar-collapsed .menu-children { display: none !important; }

body.theme-dark .menu-icon,
body.theme-midnight .menu-icon,
body.theme-carbon .menu-icon {
    background: rgba(255,255,255,.10);
}

@media (max-width: 900px) {
    .app-shell,
    .sidebar-collapsed.app-shell {
        display: block;
        grid-template-columns: none;
    }

    .mobile-sidebar-toggle { display: inline-flex; align-items: center; gap: 8px; }

    .erp-sidebar {
        position: fixed;
        z-index: 1200;
        left: 0;
        top: 0;
        bottom: 0;
        width: min(320px, 86vw);
        transform: translateX(-105%);
        transition: transform .2s ease;
        overflow-y: auto;
    }

    .mobile-sidebar-open .erp-sidebar { transform: translateX(0); }
    .sidebar-collapsed .menu-text,
    .sidebar-collapsed .menu-toggle { display: inline-flex; }
    .sidebar-collapsed .menu-home,
    .sidebar-collapsed .menu-link { justify-content: flex-start; padding-left: 14px; padding-right: 14px; }
    .sidebar-collapsed .menu-children.open { display: block !important; }
}

/* Database ReIndex page */
.reindex-page .maintenance-icon {
    font-size: 2.4rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

.odoo-company-header.compact {
    align-items: center;
    min-height: 110px;
}

.maintenance-warning {
    border-left: 4px solid var(--theme-primary, #714b67);
}

.maintenance-form {
    margin-top: 1rem;
}

.checkbox-line {
    display: flex;
    gap: .6rem;
    align-items: center;
    font-weight: 500;
}

.maintenance-summary {
    display: grid;
    grid-template-columns: repeat(4, minmax(140px, 1fr));
    gap: 1rem;
    margin: 1.5rem 0;
}

.summary-card {
    border: 1px solid rgba(0,0,0,.08);
    border-radius: 14px;
    padding: 1rem;
    background: var(--panel-bg, #fff);
    box-shadow: 0 8px 24px rgba(0,0,0,.05);
}

.summary-card span {
    display: block;
    font-size: .78rem;
    opacity: .7;
    text-transform: uppercase;
    letter-spacing: .05em;
}

.summary-card strong {
    display: block;
    margin-top: .35rem;
    font-size: 1.35rem;
    color: var(--theme-primary, #714b67);
}

.summary-card.success strong { color: #198754; }
.summary-card.danger strong { color: #dc3545; }

.maintenance-result-table {
    border: 1px solid rgba(0,0,0,.08);
    border-radius: 14px;
    overflow: hidden;
}

@media (max-width: 900px) {
    .maintenance-summary {
        grid-template-columns: repeat(2, minmax(140px, 1fr));
    }
}

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

/* Folder path picker for Company Accounting & System tab */
.path-input-group {
    display: flex;
    align-items: stretch;
    gap: .5rem;
    width: 100%;
}

.path-input-group .odoo-input {
    flex: 1 1 auto;
    min-width: 0;
}

.folder-browse-btn,
.folder-up-btn {
    border: 1px solid color-mix(in srgb, var(--brand, #714b67) 35%, transparent);
    color: var(--brand, #714b67);
    background: color-mix(in srgb, var(--brand, #714b67) 8%, #ffffff);
    border-radius: 10px;
    padding: .55rem .85rem;
    font-weight: 700;
    cursor: pointer;
    white-space: nowrap;
}

.folder-browse-btn:hover,
.folder-up-btn:hover {
    background: color-mix(in srgb, var(--brand, #714b67) 16%, #ffffff);
}

.folder-dialog-backdrop {
    position: fixed;
    inset: 0;
    z-index: 3000;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 1.2rem;
    background: rgba(0, 0, 0, .42);
    backdrop-filter: blur(4px);
}

.folder-dialog-backdrop.open {
    display: flex;
}

.folder-dialog {
    width: min(760px, 96vw);
    max-height: 86vh;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    border-radius: 20px;
    background: var(--panel-bg, #fff);
    box-shadow: 0 24px 70px rgba(0, 0, 0, .28);
    border: 1px solid rgba(0,0,0,.08);
}

.folder-dialog-header,
.folder-dialog-actions,
.folder-dialog-manual {
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: 1rem 1.2rem;
    border-bottom: 1px solid rgba(0,0,0,.08);
}

.folder-dialog-header {
    justify-content: space-between;
}

.folder-dialog-header h3 {
    margin: 0;
    color: var(--brand, #714b67);
}

.folder-dialog-close {
    width: 38px;
    height: 38px;
    border: 0;
    border-radius: 12px;
    background: rgba(0,0,0,.06);
    cursor: pointer;
    font-size: 1.4rem;
    font-weight: 800;
}

.folder-dialog-manual .odoo-input {
    flex: 1 1 auto;
}

.folder-list {
    padding: .75rem;
    overflow: auto;
}

.folder-item {
    width: 100%;
    display: grid;
    grid-template-columns: 38px 1fr;
    grid-template-areas: "icon name" "icon path";
    gap: .1rem .6rem;
    text-align: left;
    padding: .75rem;
    border: 0;
    border-radius: 14px;
    background: transparent;
    cursor: pointer;
    color: inherit;
}

.folder-item:hover {
    background: color-mix(in srgb, var(--brand, #714b67) 10%, transparent);
}

.folder-item span { grid-area: icon; font-size: 1.4rem; }
.folder-item strong { grid-area: name; }
.folder-item small { grid-area: path; opacity: .65; overflow-wrap: anywhere; }
.folder-empty { padding: 2rem; text-align: center; opacity: .7; }

/* Odoo-style country list */
.odoo-list-shell {
    background: var(--panel-bg, #fff);
    border: 1px solid rgba(0,0,0,.08);
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 16px 42px rgba(0,0,0,.06);
}

.list-toolbar {
    align-items: center;
    border-bottom: 1px solid rgba(0,0,0,.08);
}

.list-search-form {
    display: flex;
    gap: .6rem;
    align-items: center;
    flex: 1 1 420px;
    justify-content: flex-end;
}

.list-search-form .odoo-input {
    max-width: 360px;
}

.country-table-card {
    overflow-x: auto;
}

.odoo-list-table {
    width: 100%;
    border-collapse: collapse;
    background: var(--panel-bg, #fff);
}

.odoo-list-table th,
.odoo-list-table td {
    padding: .85rem 1rem;
    border-bottom: 1px solid rgba(0,0,0,.075);
    text-align: left;
}

.odoo-list-table th {
    font-size: .78rem;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: color-mix(in srgb, var(--brand, #714b67) 70%, #333);
    background: color-mix(in srgb, var(--brand, #714b67) 7%, transparent);
}

.odoo-list-table tbody tr:hover {
    background: color-mix(in srgb, var(--brand, #714b67) 6%, transparent);
}

.status-badge {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    padding: .3rem .7rem;
    font-size: .82rem;
    font-weight: 800;
    line-height: 1;
    white-space: nowrap;
}

.status-badge.active {
    color: #116149;
    background: #d8f3e7;
}

.status-badge.inactive {
    color: #8a4d00;
    background: #fff0c2;
}

.table-action {
    color: var(--brand, #714b67);
    font-weight: 800;
    text-decoration: none;
}

.empty-row {
    text-align: center !important;
    padding: 2rem !important;
    opacity: .7;
}

.narrow-form-shell {
    max-width: 980px;
}

.country-editor-grid {
    padding: 1.2rem;
}

@media (max-width: 700px) {
    .path-input-group,
    .folder-dialog-manual,
    .folder-dialog-actions,
    .list-search-form {
        flex-direction: column;
        align-items: stretch;
    }

    .list-toolbar {
        align-items: stretch;
    }

    .list-search-form .odoo-input {
        max-width: none;
    }
}

/* Country flags and delete action */
.country-flag {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 14px;
    font-size: 1.75rem;
    background: color-mix(in srgb, var(--brand, #714b67) 8%, transparent);
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--brand, #714b67) 14%, transparent);
}

.country-header-with-flag {
    grid-template-columns: 110px 1fr;
}

.country-flag-large {
    width: 92px;
    height: 92px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 22px;
    font-size: 3.4rem;
    background: color-mix(in srgb, var(--brand, #714b67) 10%, transparent);
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--brand, #714b67) 18%, transparent);
}

.country-preview-card {
    text-align: center;
}

.country-preview-flag {
    width: 116px;
    height: 116px;
    margin: .75rem auto;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 28px;
    font-size: 4.5rem;
    background: color-mix(in srgb, var(--brand, #714b67) 8%, transparent);
    border: 1px solid color-mix(in srgb, var(--brand, #714b67) 18%, transparent);
}

.table-action-group {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: .45rem;
    flex-wrap: nowrap;
}

.inline-delete-form {
    display: inline-flex;
    margin: 0;
}

.table-icon-action {
    width: 32px;
    height: 32px;
    min-width: 32px;
    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid color-mix(in srgb, var(--brand, #714b67) 18%, transparent);
    background: color-mix(in srgb, var(--brand, #714b67) 6%, #ffffff);
    color: var(--brand, #714b67);
    text-decoration: none;
    cursor: pointer;
    font-size: 1rem;
    line-height: 1;
    transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
}

.table-icon-action:hover {
    text-decoration: none;
    transform: translateY(-1px);
    box-shadow: 0 8px 18px rgba(15, 23, 42, .10);
    background: color-mix(in srgb, var(--brand, #714b67) 12%, #ffffff);
}

.table-icon-action:focus-visible {
    outline: 3px solid color-mix(in srgb, var(--brand, #714b67) 28%, transparent);
    outline-offset: 2px;
}

.edit-icon-action {
    color: var(--brand, #714b67);
}

.delete-action {
    font: inherit;
    padding: 0;
}

.danger-delete-icon {
    color: #dc2626;
    border-color: rgba(220, 38, 38, .22);
    background: rgba(254, 226, 226, .68);
}

.danger-delete-icon .delete-icon {
    font-size: 1.05rem;
    filter: drop-shadow(0 1px 0 rgba(220, 38, 38, .16));
}

.danger-delete-icon:hover {
    color: #b91c1c;
    background: #fee2e2;
    border-color: rgba(220, 38, 38, .38);
    box-shadow: 0 8px 18px rgba(220, 38, 38, .18);
}

.danger-delete-icon:active,
.table-icon-action:active {
    transform: translateY(0);
    box-shadow: none;
}

.table-action:hover {
    text-decoration: underline;
}

@media (max-width: 700px) {
    .country-header-with-flag {
        grid-template-columns: 1fr;
    }

    .country-flag-large {
        width: 78px;
        height: 78px;
        font-size: 2.8rem;
    }
}

/* Country list/kanban view and paging */
.country-list-toolbar {
    gap: .9rem;
    flex-wrap: wrap;
}

.country-search-form {
    flex: 1 1 360px;
}

.country-view-switch {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    padding: .25rem;
    border: 1px solid color-mix(in srgb, var(--brand, #714b67) 16%, transparent);
    border-radius: 12px;
    background: color-mix(in srgb, var(--brand, #714b67) 5%, #fff);
}

.view-switch-btn {
    width: 36px;
    height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 9px;
    text-decoration: none;
    color: color-mix(in srgb, var(--brand, #714b67) 80%, #1f2937);
    font-size: 1.15rem;
    font-weight: 900;
    transition: background .15s ease, transform .15s ease, color .15s ease;
}

.view-switch-btn:hover {
    transform: translateY(-1px);
    background: color-mix(in srgb, var(--brand, #714b67) 12%, #fff);
    text-decoration: none;
}

.view-switch-btn.active {
    color: #fff;
    background: var(--brand, #714b67);
    box-shadow: 0 8px 18px color-mix(in srgb, var(--brand, #714b67) 28%, transparent);
}

.country-paging-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: .8rem 1rem;
    border-bottom: 1px solid rgba(0,0,0,.075);
    background: color-mix(in srgb, var(--brand, #714b67) 4%, transparent);
}

.paging-summary {
    color: var(--text-muted, #6b7280);
    font-size: .92rem;
}

.paging-actions {
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    flex-wrap: wrap;
}

.pager-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: .4rem .8rem;
    border-radius: 999px;
    border: 1px solid color-mix(in srgb, var(--brand, #714b67) 18%, transparent);
    color: var(--brand, #714b67);
    background: var(--panel-bg, #fff);
    font-weight: 800;
    text-decoration: none;
    transition: background .15s ease, transform .15s ease;
}

.pager-btn:hover:not(.disabled) {
    transform: translateY(-1px);
    background: color-mix(in srgb, var(--brand, #714b67) 10%, #fff);
    text-decoration: none;
}

.pager-btn.disabled {
    pointer-events: none;
    opacity: .45;
    cursor: not-allowed;
}

.pager-page {
    min-width: 92px;
    text-align: center;
    font-size: .9rem;
    color: var(--text-muted, #6b7280);
    font-weight: 700;
}

 .country-kanban-grid {
    padding: 1rem;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 1rem;
    align-items: stretch;
}

.country-kanban-card,
.empty-kanban-card {
    position: relative;
    border-radius: 18px;
    border: 1px solid color-mix(in srgb, var(--brand, #714b67) 14%, rgba(0,0,0,.08));
    background: linear-gradient(145deg, color-mix(in srgb, var(--brand, #714b67) 7%, #fff), var(--panel-bg, #fff));
    box-shadow: 0 14px 34px rgba(15,23,42,.08);
    padding: 1rem;
}

.country-kanban-card {
    display: flex;
    flex-direction: column;
    gap: .85rem;
    min-height: 154px;
    transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}

.country-kanban-card:hover {
    transform: translateY(-2px);
    border-color: color-mix(in srgb, var(--brand, #714b67) 28%, rgba(0,0,0,.08));
    box-shadow: 0 18px 40px rgba(15,23,42,.12);
}

.country-kanban-topline {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: .75rem;
}

.country-kanban-flag {
    width: 64px;
    height: 64px;
    flex: 0 0 64px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 18px;
    font-size: 2.5rem;
    background: rgba(255,255,255,.76);
    border: 1px solid color-mix(in srgb, var(--brand, #714b67) 14%, transparent);
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.55);
}

.country-kanban-body {
    min-width: 0;
}

.country-kanban-body h3 {
    margin: 0 0 .75rem;
    font-size: 1.08rem;
    line-height: 1.25;
    min-height: 2.7em;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.country-kanban-meta {
    display: flex;
    align-items: center;
    gap: .5rem;
    flex-wrap: wrap;
}

.country-code-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    padding: .28rem .65rem;
    font-weight: 900;
    line-height: 1;
    white-space: nowrap;
    color: var(--brand, #714b67);
    background: color-mix(in srgb, var(--brand, #714b67) 10%, #fff);
    border: 1px solid color-mix(in srgb, var(--brand, #714b67) 15%, transparent);
}

.country-kanban-actions {
    justify-content: flex-end;
    flex-shrink: 0;
}

.empty-kanban-card {
    grid-column: 1 / -1;
    text-align: center;
    color: var(--text-muted, #6b7280);
    padding: 2.25rem;
}

@media (max-width: 760px) {
    .country-paging-bar,
    .country-list-toolbar {
        align-items: stretch;
        flex-direction: column;
    }

    .paging-actions,
    .country-view-switch {
        justify-content: center;
    }

    .country-kanban-grid {
        grid-template-columns: 1fr;
    }

    .country-kanban-actions {
        justify-content: flex-end;
    }
}

/* Country page compact pager, code-before-name and edit-form delete refinements */
.compact-country-pager {
    justify-content: flex-end;
}

.compact-country-pager .paging-actions {
    margin-left: auto;
}

.country-live-search {
    min-width: 320px;
}

.country-code-inline {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 42px;
    margin-right: .45rem;
    padding: .22rem .5rem;
    border-radius: 999px;
    color: var(--brand, #714b67);
    background: color-mix(in srgb, var(--brand, #714b67) 10%, #fff);
    border: 1px solid color-mix(in srgb, var(--brand, #714b67) 16%, transparent);
    font-size: .78rem;
    font-weight: 900;
    line-height: 1;
    white-space: nowrap;
    vertical-align: middle;
}

.country-kanban-body h3 .country-code-inline {
    margin-bottom: .18rem;
}

.country-edit-delete-icon {
    margin-left: .25rem;
}

.hidden-delete-form {
    display: none;
}

@media (max-width: 760px) {
    .compact-country-pager,
    .compact-country-pager .paging-actions {
        justify-content: center;
        margin-left: 0;
    }

    .country-live-search {
        min-width: 0;
        width: 100%;
    }
}

/* Country pager final layout: Odoo-like range + icon-only next/previous */
.compact-country-pager {
    justify-content: flex-end;
    gap: .7rem;
    padding: .55rem 1rem;
    background: transparent;
}

.country-record-range {
    font-size: .92rem;
    color: var(--text, #1f2937);
    white-space: nowrap;
    font-weight: 600;
}

.compact-country-pager .paging-actions {
    margin-left: 0;
    gap: .18rem;
}

.pager-icon-btn {
    min-width: 34px;
    width: 34px;
    height: 34px;
    min-height: 34px;
    padding: 0;
    border-radius: 6px;
    font-size: 1.55rem;
    line-height: 1;
    color: #2f3a45;
    background: #e9ecef;
    border: 1px solid #d8dce0;
    box-shadow: none;
}

.pager-icon-btn:hover:not(.disabled) {
    background: color-mix(in srgb, var(--brand, #714b67) 14%, #e9ecef);
    color: var(--brand, #714b67);
    transform: none;
}

.pager-icon-btn.disabled {
    opacity: .45;
}

@media (max-width: 760px) {
    .compact-country-pager {
        flex-direction: row;
        justify-content: flex-end;
        align-items: center;
    }
}

/* Advanced action notifications and confirmation modal */
.erp-toast-host {
    position: fixed;
    top: 1rem;
    right: 1rem;
    z-index: 2500;
    display: flex;
    flex-direction: column;
    gap: .65rem;
    pointer-events: none;
}

.erp-toast {
    min-width: 280px;
    max-width: min(430px, calc(100vw - 2rem));
    display: flex;
    align-items: center;
    gap: .65rem;
    padding: .78rem .85rem;
    border-radius: 14px;
    background: rgba(255,255,255,.96);
    border: 1px solid rgba(15,23,42,.1);
    box-shadow: 0 18px 45px rgba(15,23,42,.18);
    color: #172033;
    opacity: 0;
    transform: translateY(-8px) scale(.98);
    transition: opacity .22s ease, transform .22s ease;
    pointer-events: auto;
    overflow: hidden;
    position: relative;
}

.erp-toast::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 5px;
    background: var(--brand, #714b67);
}

.erp-toast.show {
    opacity: 1;
    transform: translateY(0) scale(1);
}

.erp-toast.success::before { background: #16a34a; }
.erp-toast.save::before { background: #0ea5e9; }
.erp-toast.update::before,
.erp-toast.modify::before { background: var(--brand, #714b67); }
.erp-toast.delete::before,
.erp-toast.error::before { background: #dc2626; }
.erp-toast.warning::before { background: #f59e0b; }
.erp-toast.info::before { background: #2563eb; }

.erp-toast-icon {
    font-size: 1.15rem;
    line-height: 1;
    flex: 0 0 auto;
}

.erp-toast-message {
    flex: 1;
    font-weight: 750;
    font-size: .92rem;
}

.erp-toast-close {
    width: 28px;
    height: 28px;
    border: 0;
    border-radius: 50%;
    background: rgba(15,23,42,.07);
    color: #334155;
    font-size: 1.1rem;
    line-height: 1;
    cursor: pointer;
}

.erp-action-modal-backdrop {
    position: fixed;
    inset: 0;
    z-index: 2400;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    background: color-mix(in srgb, var(--text) 48%, transparent);
    backdrop-filter: blur(4px);
}

.erp-action-modal-backdrop.open {
    display: flex;
}

.erp-action-modal {
    width: min(430px, 100%);
    background: #fff;
    color: #111827;
    border-radius: 12px;
    border: 1px solid rgba(15, 23, 42, .08);
    box-shadow: 0 26px 80px rgba(15,23,42,.35);
    padding: 2.1rem 1.8rem 1.55rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 1rem;
    animation: erpModalPop .18s ease-out;
}

@keyframes erpModalPop {
    from { opacity: 0; transform: translateY(10px) scale(.96); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

.erp-action-modal-icon-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
}

.erp-action-modal-icon {
    width: 56px;
    height: 56px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    font-size: 1.75rem;
    line-height: 1;
    background: #fde047;
    color: #fff;
    box-shadow: 0 8px 20px rgba(250, 204, 21, .35);
}

.erp-action-modal-backdrop.save .erp-action-modal-icon {
    background: #2563eb;
    box-shadow: 0 8px 20px rgba(37, 99, 235, .26);
}

.erp-action-modal-backdrop.update .erp-action-modal-icon,
.erp-action-modal-backdrop.modify .erp-action-modal-icon {
    background: var(--brand, #714b67);
    box-shadow: 0 8px 20px color-mix(in srgb, var(--brand, #714b67) 28%, transparent);
}

.erp-action-modal-backdrop.delete .erp-action-modal-icon {
    background: #ef4444;
    box-shadow: 0 8px 20px rgba(239, 68, 68, .26);
}

.erp-action-modal-content h3 {
    margin: .2rem 0 .45rem;
    font-size: 1.55rem;
    font-weight: 850;
    letter-spacing: -.02em;
    color: #111827;
}

.erp-action-modal-content p {
    margin: 0;
    color: #374151;
    line-height: 1.45;
    font-size: 1.05rem;
    white-space: pre-line;
}

.erp-action-modal-content {
    width: 100%;
}

.erp-action-modal-input-wrap {
    width: 100%;
    margin-top: 1rem;
    text-align: left;
}

.erp-action-modal-input-wrap[hidden] {
    display: none !important;
}

.erp-action-modal-input-wrap label {
    display: block;
    margin-bottom: .42rem;
    color: #374151;
    font-size: .92rem;
    font-weight: 800;
}

.erp-action-modal-input {
    width: 100%;
    min-height: 44px;
    box-sizing: border-box;
    border: 1px solid color-mix(in srgb, var(--brand, #714b67) 45%, #cbd5e1);
    border-radius: 7px;
    background: #fff;
    color: #111827;
    padding: .68rem .78rem;
    font: inherit;
    outline: none;
    transition: border-color .12s ease, box-shadow .12s ease;
}

.erp-action-modal-input:focus {
    border-color: var(--brand, #714b67);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand, #714b67) 18%, transparent);
}

.erp-action-modal-input.invalid {
    border-color: #dc2626;
    box-shadow: 0 0 0 3px rgba(220, 38, 38, .14);
}

body.theme-dark .erp-action-modal-input-wrap label,
body.theme-midnight .erp-action-modal-input-wrap label,
body.theme-carbon .erp-action-modal-input-wrap label {
    color: var(--muted) !important;
}

.erp-action-modal-buttons {
    width: 100%;
    display: flex;
    justify-content: center;
    gap: 1.6rem;
    margin-top: .55rem;
}

.erp-modal-cancel,
.erp-modal-confirm {
    min-width: 150px;
    border: 0;
    border-radius: 7px;
    padding: .72rem 1.05rem;
    font-weight: 850;
    font-size: 1rem;
    cursor: pointer;
    color: #fff;
    transition: transform .12s ease, box-shadow .12s ease, filter .12s ease;
}

.erp-modal-cancel {
    background: #e3344a;
    box-shadow: 0 8px 16px rgba(227, 52, 74, .20);
}

.erp-modal-confirm,
.erp-action-modal-backdrop.save .erp-modal-confirm,
.erp-action-modal-backdrop.update .erp-modal-confirm,
.erp-action-modal-backdrop.modify .erp-modal-confirm {
    background: #22a947;
    box-shadow: 0 8px 16px rgba(34, 169, 71, .20);
}

.erp-action-modal-backdrop.delete .erp-modal-confirm {
    background: #dc2626;
    box-shadow: 0 8px 16px rgba(220, 38, 38, .20);
}

.erp-modal-cancel:hover,
.erp-modal-confirm:hover {
    transform: translateY(-1px);
    filter: brightness(.98);
}

@media (max-width: 560px) {
    .erp-toast-host {
        right: .75rem;
        left: .75rem;
    }

    .erp-toast {
        min-width: 0;
        width: 100%;
    }

    .erp-action-modal {
        grid-template-columns: 1fr;
        text-align: center;
    }

    .erp-action-modal-icon {
        margin: 0 auto;
    }

    .erp-action-modal-buttons {
        justify-content: center;
    }
}

/* Generic VB.NET menu page scaffolds */
.scaffold-page { padding-bottom: 32px; }
.scaffold-toolbar { margin-bottom: 12px; }
.scaffold-action-icons { display: flex; gap: 8px; align-items: center; }
.scaffold-hero { display: flex; align-items: center; gap: 18px; padding: 22px; margin-bottom: 16px; }
.scaffold-icon { width: 72px; height: 72px; border-radius: 18px; display: grid; place-items: center; font-size: 34px; background: color-mix(in srgb, var(--theme-primary, var(--brand)) 14%, #fff); border: 1px solid color-mix(in srgb, var(--theme-primary, var(--brand)) 25%, #fff); box-shadow: 0 10px 24px rgba(0,0,0,.08); flex: 0 0 auto; }
.scaffold-title-block { min-width: 0; flex: 1; }
.scaffold-title-block h1 { margin: 4px 0 6px; font-size: clamp(1.8rem, 3vw, 2.6rem); color: var(--text-strong, #2c1d28); }
.scaffold-title-block p { margin: 0; color: var(--text-muted, #6b6070); }
.scaffold-path { font-size: .82rem; text-transform: uppercase; letter-spacing: .08em; color: var(--theme-primary, var(--brand)); font-weight: 700; }
.scaffold-badge { padding: 7px 12px; border-radius: 999px; background: color-mix(in srgb, var(--theme-primary, var(--brand)) 12%, #fff); color: var(--theme-primary, var(--brand)); font-weight: 700; border: 1px solid color-mix(in srgb, var(--theme-primary, var(--brand)) 30%, #fff); }
.scaffold-content-card { padding: 0; overflow: hidden; }
.scaffold-tabs { padding: 0 18px; border-bottom: 1px solid rgba(0,0,0,.08); }
.scaffold-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 28px; padding: 22px; }
.scaffold-grid h2 { font-size: 1.05rem; margin: 0 0 14px; color: var(--text-strong, #2c1d28); }
.scaffold-section-list { display: grid; gap: 10px; }
.scaffold-section-row { display: flex; align-items: center; gap: 10px; padding: 12px 14px; border: 1px solid rgba(0,0,0,.08); border-radius: 14px; background: rgba(255,255,255,.6); }
.scaffold-section-row span { color: var(--theme-primary, var(--brand)); font-weight: 900; }
.scaffold-dl { display: grid; grid-template-columns: 150px 1fr; gap: 10px 14px; margin: 0; }
.scaffold-dl dt { font-weight: 700; color: var(--text-strong, #2c1d28); }
.scaffold-dl dd { margin: 0; color: var(--text-muted, #6b6070); }
.btn-secondary-soft { display: inline-flex; align-items: center; justify-content: center; padding: 9px 13px; border-radius: 10px; background: color-mix(in srgb, var(--theme-primary, var(--brand)) 9%, #fff); color: var(--theme-primary, var(--brand)); text-decoration: none; border: 1px solid color-mix(in srgb, var(--theme-primary, var(--brand)) 25%, #fff); font-weight: 700; }
.btn-secondary-soft:hover { background: color-mix(in srgb, var(--theme-primary, var(--brand)) 16%, #fff); }
.icon-action.neutral[disabled] { opacity: .65; cursor: not-allowed; filter: grayscale(.2); }
@media (max-width: 820px) { .scaffold-hero { align-items: flex-start; flex-wrap: wrap; } .scaffold-grid { grid-template-columns: 1fr; } .scaffold-dl { grid-template-columns: 1fr; } }

/* Ledger master page */
.ledger-filter-form {
    grid-template-columns: minmax(260px, 1fr) minmax(180px, 260px);
    max-width: 780px;
}

.ledger-group-filter {
    min-width: 220px;
}

.ledger-avatar {
    width: 44px;
    height: 44px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--theme-primary, var(--brand)), var(--theme-accent, #a97c9d));
    color: #fff;
    font-weight: 900;
    letter-spacing: .5px;
    box-shadow: 0 10px 24px rgba(31, 41, 55, .12);
}

.ledger-avatar.large {
    width: 92px;
    height: 92px;
    font-size: 36px;
    border-radius: 24px;
}

.ledger-card-group {
    margin: 3px 0 8px;
    color: #6b7280;
    font-weight: 700;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ledger-card-meta {
    display: flex;
    flex-direction: column;
    gap: 3px;
    color: #6b7280;
    font-size: 12px;
    min-height: 34px;
}

.balance-chip {
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
    border-radius: 999px;
    padding: 4px 10px;
    font-size: 12px;
    font-weight: 900;
}

.balance-chip.debit {
    color: #047857;
    background: #d1fae5;
}

.balance-chip.credit {
    color: #b91c1c;
    background: #fee2e2;
}

.ledger-tabs {
    position: relative;
    margin-top: 4px;
    display: flex;
    flex-wrap: wrap;
    border-top: 1px solid color-mix(in srgb, var(--brand-dark) 12%, transparent);
}

.ledger-tabs > input[type="radio"] {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.ledger-tabs > label {
    padding: 13px 18px;
    border-right: 1px solid color-mix(in srgb, var(--brand-dark) 10%, transparent);
    border-bottom: 1px solid color-mix(in srgb, var(--brand-dark) 12%, transparent);
    cursor: pointer;
    color: var(--brand-dark);
    background: #fbfbfc;
    font-weight: 700;
    position: relative;
}

.ledger-tabs > label:hover {
    color: var(--theme-primary, var(--brand));
}

#tab-general:checked + label,
#tab-address:checked + label,
#tab-contact:checked + label,
#tab-accounting:checked + label,
#tab-tax:checked + label {
    color: var(--theme-primary, var(--brand));
    background: #fff;
}

#tab-general:checked + label::before,
#tab-address:checked + label::before,
#tab-contact:checked + label::before,
#tab-accounting:checked + label::before,
#tab-tax:checked + label::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    height: 3px;
    background: var(--theme-primary, var(--brand));
}

.ledger-tabs .tab-panel {
    display: none;
    flex-basis: 100%;
    padding: 22px 18px 30px;
    background: #fff;
}

#tab-general:checked ~ .general-panel,
#tab-address:checked ~ .address-panel,
#tab-contact:checked ~ .contact-panel,
#tab-accounting:checked ~ .accounting-panel,
#tab-tax:checked ~ .tax-panel {
    display: block;
}

.ledger-list-table .small-text {
    font-size: 12px;
}

@media (max-width: 900px) {
    .ledger-filter-form {
        grid-template-columns: 1fr;
    }
    .ledger-tabs > label {
        flex: 1 1 auto;
        text-align: center;
        padding: 11px 10px;
        font-size: 13px;
    }
}

/* Ledger account type smart lookup */
.ledger-account-type-row {
    align-items: flex-start;
}

.ledger-autocomplete-wrap {
    position: relative;
    width: 100%;
}

.ledger-account-shortlist {
    position: absolute;
    z-index: 60;
    top: calc(100% + 6px);
    left: 0;
    right: 0;
    display: none;
    background: #fff;
    border: 1px solid color-mix(in srgb, var(--brand-dark) 16%, transparent);
    border-radius: 14px;
    box-shadow: 0 18px 45px rgba(32, 20, 38, .16);
    overflow: hidden;
    padding: 6px;
}

.ledger-account-shortlist.open {
    display: block;
}

.ledger-account-option,
.ledger-account-show-more,
.erp-lookup-result-item {
    width: 100%;
    border: 0;
    background: transparent;
    text-align: left;
    cursor: pointer;
    font-family: inherit;
}

.ledger-account-option {
    padding: 10px 12px;
    border-radius: 10px;
    font-weight: 650;
    color: #35273a;
}

.ledger-account-option:hover,
.ledger-account-option:focus,
.erp-lookup-result-item:hover,
.erp-lookup-result-item:focus {
    background: color-mix(in srgb, var(--theme-primary, var(--brand)) 10%, #ffffff);
    color: var(--theme-primary, var(--brand));
    outline: none;
}

.ledger-account-show-more {
    margin-top: 4px;
    padding: 10px 12px;
    border-top: 1px solid color-mix(in srgb, var(--brand-dark) 10%, transparent);
    color: var(--theme-primary, var(--brand));
    font-weight: 800;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.ledger-account-empty,
.erp-lookup-empty {
    padding: 14px;
    color: var(--muted);
    font-weight: 650;
}

.erp-lookup-modal-backdrop {
    position: fixed;
    inset: 0;
    z-index: 1300;
    background: rgba(31, 20, 35, .46);
    display: none;
    align-items: center;
    justify-content: center;
    padding: 22px;
}

.erp-lookup-modal-backdrop.open {
    display: flex;
}

.erp-lookup-modal {
    width: min(620px, 100%);
    max-height: min(720px, 90vh);
    background: #fff;
    border-radius: 22px;
    box-shadow: 0 28px 80px rgba(0, 0, 0, .28);
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.erp-lookup-header {
    padding: 20px 22px;
    background: linear-gradient(135deg, var(--theme-primary, var(--brand)), var(--theme-secondary, #b08aa5));
    color: #fff;
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: flex-start;
}

.erp-lookup-header h3 {
    margin: 0 0 4px;
    font-size: 22px;
}

.erp-lookup-header p {
    margin: 0;
    opacity: .86;
}

.erp-lookup-close {
    border: 0;
    background: rgba(255, 255, 255, .18);
    color: #fff;
    width: 34px;
    height: 34px;
    border-radius: 999px;
    font-size: 24px;
    line-height: 1;
    cursor: pointer;
}

.erp-lookup-close:hover {
    background: rgba(255, 255, 255, .28);
}

.erp-lookup-search-row {
    padding: 16px 18px 10px;
    border-bottom: 1px solid color-mix(in srgb, var(--brand-dark) 10%, transparent);
}

.erp-lookup-results {
    padding: 10px;
    overflow-y: auto;
}

.erp-lookup-result-item {
    padding: 12px 14px;
    border-radius: 12px;
    color: #35273a;
    font-size: 15px;
    font-weight: 700;
}

body.theme-dark .ledger-account-shortlist,
body.theme-midnight .ledger-account-shortlist,
body.theme-carbon .ledger-account-shortlist,
body.theme-dark .erp-lookup-modal,
body.theme-midnight .erp-lookup-modal,
body.theme-carbon .erp-lookup-modal {
    background: #1f2330;
    color: #f6f2f7;
    border-color: rgba(255,255,255,.12);
}

body.theme-dark .ledger-account-option,
body.theme-midnight .ledger-account-option,
body.theme-carbon .ledger-account-option,
body.theme-dark .erp-lookup-result-item,
body.theme-midnight .erp-lookup-result-item,
body.theme-carbon .erp-lookup-result-item {
    color: #f6f2f7;
}

/* Global dark-theme text/readability fixes applied across all current and future ERP pages */
body.theme-dark,
body.theme-midnight,
body.theme-carbon {
    color-scheme: dark;
}

body.theme-dark,
body.theme-midnight,
body.theme-carbon,
body.theme-dark .main-area,
body.theme-midnight .main-area,
body.theme-carbon .main-area {
    background: var(--bg);
    color: var(--text);
}

body.theme-dark h1,
body.theme-dark h2,
body.theme-dark h3,
body.theme-dark h4,
body.theme-dark h5,
body.theme-dark h6,
body.theme-dark label,
body.theme-dark strong,
body.theme-dark th,
body.theme-dark td,
body.theme-dark p,
body.theme-dark span,
body.theme-dark div,
body.theme-midnight h1,
body.theme-midnight h2,
body.theme-midnight h3,
body.theme-midnight h4,
body.theme-midnight h5,
body.theme-midnight h6,
body.theme-midnight label,
body.theme-midnight strong,
body.theme-midnight th,
body.theme-midnight td,
body.theme-midnight p,
body.theme-midnight span,
body.theme-midnight div,
body.theme-carbon h1,
body.theme-carbon h2,
body.theme-carbon h3,
body.theme-carbon h4,
body.theme-carbon h5,
body.theme-carbon h6,
body.theme-carbon label,
body.theme-carbon strong,
body.theme-carbon th,
body.theme-carbon td,
body.theme-carbon p,
body.theme-carbon span,
body.theme-carbon div {
    color: inherit;
}

body.theme-dark .muted,
body.theme-dark .small-note,
body.theme-dark .form-hint,
body.theme-dark .small-text,
body.theme-dark .section-heading p,
body.theme-dark .dash-menu-leaf p,
body.theme-dark .dash-menu-card-body p,
body.theme-dark .app-card p,
body.theme-dark .submenu-card p,
body.theme-dark .info-card span,
body.theme-dark .module-title p,
body.theme-midnight .muted,
body.theme-midnight .small-note,
body.theme-midnight .form-hint,
body.theme-midnight .small-text,
body.theme-midnight .section-heading p,
body.theme-midnight .dash-menu-leaf p,
body.theme-midnight .dash-menu-card-body p,
body.theme-midnight .app-card p,
body.theme-midnight .submenu-card p,
body.theme-midnight .info-card span,
body.theme-midnight .module-title p,
body.theme-carbon .muted,
body.theme-carbon .small-note,
body.theme-carbon .form-hint,
body.theme-carbon .small-text,
body.theme-carbon .section-heading p,
body.theme-carbon .dash-menu-leaf p,
body.theme-carbon .dash-menu-card-body p,
body.theme-carbon .app-card p,
body.theme-carbon .submenu-card p,
body.theme-carbon .info-card span,
body.theme-carbon .module-title p {
    color: var(--muted) !important;
}

body.theme-dark .odoo-section,
body.theme-dark .module-group,
body.theme-dark .form-card,
body.theme-dark .odoo-list-shell,
body.theme-dark .odoo-form-card,
body.theme-dark .odoo-company-card,
body.theme-dark .odoo-form-shell,
body.theme-dark .odoo-form-toolbar,
body.theme-dark .odoo-form-statusbar,
body.theme-dark .odoo-company-header,
body.theme-dark .table-card,
body.theme-dark .country-table-card,
body.theme-dark .country-kanban-card,
body.theme-dark .country-preview-card,
body.theme-dark .ledger-form-shell,
body.theme-dark .ledger-kanban-card,
body.theme-dark .scaffold-content-card,
body.theme-dark .scaffold-hero,
body.theme-dark .scaffold-section-row,
body.theme-dark .folder-dialog,
body.theme-dark .erp-action-modal,
body.theme-midnight .odoo-section,
body.theme-midnight .module-group,
body.theme-midnight .form-card,
body.theme-midnight .odoo-list-shell,
body.theme-midnight .odoo-form-card,
body.theme-midnight .odoo-company-card,
body.theme-midnight .odoo-form-shell,
body.theme-midnight .odoo-form-toolbar,
body.theme-midnight .odoo-form-statusbar,
body.theme-midnight .odoo-company-header,
body.theme-midnight .table-card,
body.theme-midnight .country-table-card,
body.theme-midnight .country-kanban-card,
body.theme-midnight .country-preview-card,
body.theme-midnight .ledger-form-shell,
body.theme-midnight .ledger-kanban-card,
body.theme-midnight .scaffold-content-card,
body.theme-midnight .scaffold-hero,
body.theme-midnight .scaffold-section-row,
body.theme-midnight .folder-dialog,
body.theme-midnight .erp-action-modal,
body.theme-carbon .odoo-section,
body.theme-carbon .module-group,
body.theme-carbon .form-card,
body.theme-carbon .odoo-list-shell,
body.theme-carbon .odoo-form-card,
body.theme-carbon .odoo-company-card,
body.theme-carbon .odoo-form-shell,
body.theme-carbon .odoo-form-toolbar,
body.theme-carbon .odoo-form-statusbar,
body.theme-carbon .odoo-company-header,
body.theme-carbon .table-card,
body.theme-carbon .country-table-card,
body.theme-carbon .country-kanban-card,
body.theme-carbon .country-preview-card,
body.theme-carbon .ledger-form-shell,
body.theme-carbon .ledger-kanban-card,
body.theme-carbon .scaffold-content-card,
body.theme-carbon .scaffold-hero,
body.theme-carbon .scaffold-section-row,
body.theme-carbon .folder-dialog,
body.theme-carbon .erp-action-modal {
    background: var(--card) !important;
    color: var(--text) !important;
    border-color: var(--border) !important;
}

body.theme-dark .input,
body.theme-dark .form-control,
body.theme-dark .odoo-input,
body.theme-dark select,
body.theme-dark textarea,
body.theme-dark input[type="text"],
body.theme-dark input[type="password"],
body.theme-dark input[type="email"],
body.theme-dark input[type="number"],
body.theme-dark input[type="date"],
body.theme-dark .ledger-account-type-input,
body.theme-midnight .input,
body.theme-midnight .form-control,
body.theme-midnight .odoo-input,
body.theme-midnight select,
body.theme-midnight textarea,
body.theme-midnight input[type="text"],
body.theme-midnight input[type="password"],
body.theme-midnight input[type="email"],
body.theme-midnight input[type="number"],
body.theme-midnight input[type="date"],
body.theme-midnight .ledger-account-type-input,
body.theme-carbon .input,
body.theme-carbon .form-control,
body.theme-carbon .odoo-input,
body.theme-carbon select,
body.theme-carbon textarea,
body.theme-carbon input[type="text"],
body.theme-carbon input[type="password"],
body.theme-carbon input[type="email"],
body.theme-carbon input[type="number"],
body.theme-carbon input[type="date"],
body.theme-carbon .ledger-account-type-input {
    background: color-mix(in srgb, var(--card) 78%, var(--bg)) !important;
    color: var(--text) !important;
    border-color: var(--border) !important;
}

body.theme-dark .odoo-input,
body.theme-midnight .odoo-input,
body.theme-carbon .odoo-input {
    background: transparent !important;
    border-bottom-color: var(--border) !important;
}

body.theme-dark .input::placeholder,
body.theme-dark .form-control::placeholder,
body.theme-dark .odoo-input::placeholder,
body.theme-dark textarea::placeholder,
body.theme-midnight .input::placeholder,
body.theme-midnight .form-control::placeholder,
body.theme-midnight .odoo-input::placeholder,
body.theme-midnight textarea::placeholder,
body.theme-carbon .input::placeholder,
body.theme-carbon .form-control::placeholder,
body.theme-carbon .odoo-input::placeholder,
body.theme-carbon textarea::placeholder {
    color: var(--muted) !important;
    opacity: .9;
}

body.theme-dark .table,
body.theme-dark .odoo-list-table,
body.theme-dark .countries-list-table,
body.theme-dark .ledger-list-table,
body.theme-dark .maintenance-result-table,
body.theme-midnight .table,
body.theme-midnight .odoo-list-table,
body.theme-midnight .countries-list-table,
body.theme-midnight .ledger-list-table,
body.theme-midnight .maintenance-result-table,
body.theme-carbon .table,
body.theme-carbon .odoo-list-table,
body.theme-carbon .countries-list-table,
body.theme-carbon .ledger-list-table,
body.theme-carbon .maintenance-result-table {
    color: var(--text) !important;
    background: var(--card) !important;
    border-color: var(--border) !important;
}

body.theme-dark table th,
body.theme-dark table td,
body.theme-midnight table th,
body.theme-midnight table td,
body.theme-carbon table th,
body.theme-carbon table td {
    color: var(--text) !important;
    border-color: var(--border) !important;
}

body.theme-dark table thead,
body.theme-dark table thead tr,
body.theme-midnight table thead,
body.theme-midnight table thead tr,
body.theme-carbon table thead,
body.theme-carbon table thead tr {
    background: color-mix(in srgb, var(--soft) 70%, var(--card)) !important;
    color: var(--text) !important;
}

body.theme-dark .table-hover tbody tr:hover,
body.theme-midnight .table-hover tbody tr:hover,
body.theme-carbon .table-hover tbody tr:hover {
    background: color-mix(in srgb, var(--brand) 10%, var(--card)) !important;
}

body.theme-dark .odoo-tab-labels,
body.theme-dark .ledger-tabs > label,
body.theme-dark .ledger-tabs .tab-panel,
body.theme-dark .odoo-tab-content,
body.theme-midnight .odoo-tab-labels,
body.theme-midnight .ledger-tabs > label,
body.theme-midnight .ledger-tabs .tab-panel,
body.theme-midnight .odoo-tab-content,
body.theme-carbon .odoo-tab-labels,
body.theme-carbon .ledger-tabs > label,
body.theme-carbon .ledger-tabs .tab-panel,
body.theme-carbon .odoo-tab-content {
    background: var(--card) !important;
    color: var(--text) !important;
    border-color: var(--border) !important;
}

body.theme-dark #tab-general:checked + label,
body.theme-dark #tab-address:checked + label,
body.theme-dark #tab-contact:checked + label,
body.theme-dark #tab-accounting:checked + label,
body.theme-dark #tab-tax:checked + label,
body.theme-midnight #tab-general:checked + label,
body.theme-midnight #tab-address:checked + label,
body.theme-midnight #tab-contact:checked + label,
body.theme-midnight #tab-accounting:checked + label,
body.theme-midnight #tab-tax:checked + label,
body.theme-carbon #tab-general:checked + label,
body.theme-carbon #tab-address:checked + label,
body.theme-carbon #tab-contact:checked + label,
body.theme-carbon #tab-accounting:checked + label,
body.theme-carbon #tab-tax:checked + label {
    background: color-mix(in srgb, var(--brand) 12%, var(--card)) !important;
    color: var(--brand) !important;
}

body.theme-dark .view-switch-btn,
body.theme-dark .pager-icon-btn,
body.theme-dark .pager-btn,
body.theme-dark .btn-light,
body.theme-dark .btn-secondary-soft,
body.theme-midnight .view-switch-btn,
body.theme-midnight .pager-icon-btn,
body.theme-midnight .pager-btn,
body.theme-midnight .btn-light,
body.theme-midnight .btn-secondary-soft,
body.theme-carbon .view-switch-btn,
body.theme-carbon .pager-icon-btn,
body.theme-carbon .pager-btn,
body.theme-carbon .btn-light,
body.theme-carbon .btn-secondary-soft {
    background: var(--soft) !important;
    color: var(--text) !important;
    border-color: var(--border) !important;
}

body.theme-dark .view-switch-btn.active,
body.theme-midnight .view-switch-btn.active,
body.theme-carbon .view-switch-btn.active {
    background: var(--brand) !important;
    color: #fff !important;
    border-color: var(--brand) !important;
}

body.theme-dark .status-badge,
body.theme-dark .balance-chip,
body.theme-dark .scaffold-badge,
body.theme-dark .module-area,
body.theme-midnight .status-badge,
body.theme-midnight .balance-chip,
body.theme-midnight .scaffold-badge,
body.theme-midnight .module-area,
body.theme-carbon .status-badge,
body.theme-carbon .balance-chip,
body.theme-carbon .scaffold-badge,
body.theme-carbon .module-area {
    background: var(--soft) !important;
    color: var(--text) !important;
    border-color: var(--border) !important;
}

body.theme-dark .ledger-account-shortlist,
body.theme-dark .erp-lookup-modal,
body.theme-dark .erp-lookup-results,
body.theme-dark .erp-lookup-search-row,
body.theme-midnight .ledger-account-shortlist,
body.theme-midnight .erp-lookup-modal,
body.theme-midnight .erp-lookup-results,
body.theme-midnight .erp-lookup-search-row,
body.theme-carbon .ledger-account-shortlist,
body.theme-carbon .erp-lookup-modal,
body.theme-carbon .erp-lookup-results,
body.theme-carbon .erp-lookup-search-row {
    background: var(--card) !important;
    color: var(--text) !important;
    border-color: var(--border) !important;
}

body.theme-dark .ledger-account-option:hover,
body.theme-dark .erp-lookup-result-item:hover,
body.theme-midnight .ledger-account-option:hover,
body.theme-midnight .erp-lookup-result-item:hover,
body.theme-carbon .ledger-account-option:hover,
body.theme-carbon .erp-lookup-result-item:hover {
    background: color-mix(in srgb, var(--brand) 18%, var(--card)) !important;
    color: var(--text) !important;
}

body.theme-dark .country-code-inline,
body.theme-dark .country-kanban-meta,
body.theme-dark .ledger-card-meta,
body.theme-midnight .country-code-inline,
body.theme-midnight .country-kanban-meta,
body.theme-midnight .ledger-card-meta,
body.theme-carbon .country-code-inline,
body.theme-carbon .country-kanban-meta,
body.theme-carbon .ledger-card-meta {
    color: var(--muted) !important;
}

body.theme-dark .folder-list button,
body.theme-midnight .folder-list button,
body.theme-carbon .folder-list button {
    background: var(--card) !important;
    color: var(--text) !important;
    border-color: var(--border) !important;
}

body.theme-dark .success-box,
body.theme-midnight .success-box,
body.theme-carbon .success-box {
    background: rgba(22, 101, 52, .18) !important;
    color: #86efac !important;
    border-color: rgba(134, 239, 172, .25) !important;
}

body.theme-dark .alert,
body.theme-dark .alert-box,
body.theme-midnight .alert,
body.theme-midnight .alert-box,
body.theme-carbon .alert,
body.theme-carbon .alert-box {
    background: rgba(153, 27, 27, .22) !important;
    color: #fecaca !important;
    border-color: rgba(252, 165, 165, .28) !important;
}

body.theme-dark .validation,
body.theme-midnight .validation,
body.theme-carbon .validation {
    color: #fca5a5 !important;
}

/* Reliable country flags: image-based instead of emoji-based for cross-computer support */
.country-flag,
.country-kanban-flag,
.country-flag-large,
.country-preview-flag {
    overflow: hidden;
    color: var(--brand, #714b67);
    font-weight: 800;
}

.country-flag-img {
    display: block;
    width: 32px;
    height: 24px;
    object-fit: cover;
    border-radius: 4px;
    box-shadow: 0 1px 4px rgba(15, 23, 42, .18);
}

.country-kanban-flag .country-flag-img {
    width: 48px;
    height: 36px;
    border-radius: 7px;
}

.country-flag-img.large,
.country-flag-img.preview,
.country-flag-large .country-flag-img,
.country-preview-flag .country-flag-img {
    width: 72px;
    height: 54px;
    border-radius: 10px;
}

.country-preview-flag .country-flag-img.preview {
    width: 88px;
    height: 66px;
}

.country-flag-fallback {
    display: none;
    align-items: center;
    justify-content: center;
    min-width: 32px;
    min-height: 24px;
    padding: .18rem .35rem;
    border-radius: 8px;
    font-size: .72rem;
    line-height: 1;
    background: color-mix(in srgb, var(--brand, #714b67) 12%, #fff);
    border: 1px solid color-mix(in srgb, var(--brand, #714b67) 20%, transparent);
}

.flag-img-failed .country-flag-fallback,
.country-flag-fallback:only-child {
    display: inline-flex;
}

.country-flag-large.flag-img-failed .country-flag-fallback,
.country-preview-flag.flag-img-failed .country-flag-fallback,
.country-kanban-flag.flag-img-failed .country-flag-fallback {
    min-width: 54px;
    min-height: 42px;
    font-size: 1rem;
}

/* State master country relation */
.state-country-code {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 34px;
    padding: 2px 8px;
    margin-right: 6px;
    border-radius: 999px;
    font-size: .78rem;
    font-weight: 800;
    background: color-mix(in srgb, var(--theme-primary, var(--brand)) 12%, transparent);
    color: var(--theme-primary, var(--brand));
    white-space: nowrap;
}
.state-country-line {
    margin-top: 4px;
    font-size: .92rem;
    color: var(--text-muted, #6b7280);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.state-form-header .state-title-area {
    width: 100%;
}
.state-form-grid {
    width: 100%;
    align-items: start;
}
.country-first-select {
    min-height: 44px;
}
body.theme-dark .state-country-code,
body.theme-midnight-neon .state-country-code,
body.theme-carbon-black .state-country-code {
    background: color-mix(in srgb, var(--theme-primary, #8b5cf6) 22%, transparent);
    color: var(--theme-accent, #c4b5fd);
}

/* Fix Ledger Account Type short list: keep Show more visible under first 5 records */
.ledger-account-type-row {
    align-items: flex-start;
}

.ledger-autocomplete-wrap {
    position: relative;
    width: 100%;
    overflow: visible;
}

.ledger-account-shortlist.open {
    position: static;
    display: block;
    margin-top: 6px;
    max-height: none;
    overflow: visible;
    z-index: 1200;
}

.ledger-account-option {
    min-height: 34px;
    padding: 8px 12px;
    line-height: 18px;
}

.ledger-account-show-more {
    min-height: 36px;
    padding: 8px 12px;
    position: relative;
    background: color-mix(in srgb, var(--theme-primary, var(--brand)) 6%, #ffffff);
    border-radius: 10px;
    white-space: nowrap;
}

body.theme-dark .ledger-account-show-more,
body.theme-midnight .ledger-account-show-more,
body.theme-carbon .ledger-account-show-more {
    background: color-mix(in srgb, var(--theme-primary, var(--brand)) 22%, var(--theme-surface, #1e293b));
}

/* Account Group under-group lookup uses the same compact Odoo lookup behavior as Ledger Account Type */
.account-group-under-row {
    align-items: flex-start;
}

.account-group-edit-form .ledger-account-shortlist {
    max-height: none;
}

.account-group-edit-form .erp-lookup-modal {
    width: min(640px, 100%);
}

/* Account Group AJAX search: filter without refreshing the full page or interrupting typing */
#accountGroupResults {
    position: relative;
    min-height: 120px;
    transition: opacity .12s ease;
}
#accountGroupResults.is-loading {
    opacity: .55;
}
#accountGroupResults.is-loading::after {
    content: "";
    position: absolute;
    top: 12px;
    right: 12px;
    width: 18px;
    height: 18px;
    border: 2px solid color-mix(in srgb, var(--theme-primary, var(--brand)) 30%, transparent);
    border-top-color: var(--theme-primary, var(--brand));
    border-radius: 50%;
    animation: erpSpin .75s linear infinite;
}
@keyframes erpSpin { to { transform: rotate(360deg); } }

/* AJAX list refresh keeps the search box focused and only updates the records area. */
.ajax-list-results {
    position: relative;
    transition: opacity .15s ease;
}
.ajax-list-results.is-loading {
    opacity: .62;
}
.ajax-list-results.is-loading::after {
    content: "";
    position: absolute;
    top: 10px;
    right: 14px;
    width: 18px;
    height: 18px;
    border: 2px solid rgba(120, 120, 120, .28);
    border-top-color: var(--theme-primary, var(--brand));
    border-radius: 50%;
    animation: erpAjaxSpin .7s linear infinite;
}
@keyframes erpAjaxSpin { to { transform: rotate(360deg); } }

/* User menu theme selector supports instant AJAX theme change. */
.account-theme-form select {
    transition: border-color .16s ease, box-shadow .16s ease, background-color .16s ease;
}
.account-theme-form select:focus {
    outline: none;
    border-color: var(--brand);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand) 18%, transparent);
}


/* Global dark theme dropdown/readability fix
   Native <select> option popups do not always inherit body text colors on other computers.
   These rules force visible text/background for every normal dropdown, list filter,
   country selector, lookup selector and popup list used by the ERP pages. */
body.theme-dark select,
body.theme-midnight select,
body.theme-carbon select,
body.theme-dark select.form-control,
body.theme-midnight select.form-control,
body.theme-carbon select.form-control,
body.theme-dark .country-first-select,
body.theme-midnight .country-first-select,
body.theme-carbon .country-first-select,
body.theme-dark .ledger-group-filter,
body.theme-midnight .ledger-group-filter,
body.theme-carbon .ledger-group-filter {
    background-color: #111827 !important;
    color: #f8fafc !important;
    border-color: #334155 !important;
    color-scheme: dark;
}

body.theme-dark select option,
body.theme-midnight select option,
body.theme-carbon select option,
body.theme-dark select optgroup,
body.theme-midnight select optgroup,
body.theme-carbon select optgroup {
    background-color: #111827 !important;
    color: #f8fafc !important;
}

body.theme-dark select option:checked,
body.theme-midnight select option:checked,
body.theme-carbon select option:checked,
body.theme-dark select option:hover,
body.theme-midnight select option:hover,
body.theme-carbon select option:hover {
    background-color: #2563eb !important;
    color: #ffffff !important;
}

body.theme-dark select:disabled,
body.theme-midnight select:disabled,
body.theme-carbon select:disabled,
body.theme-dark select option:disabled,
body.theme-midnight select option:disabled,
body.theme-carbon select option:disabled {
    background-color: #0f172a !important;
    color: #94a3b8 !important;
}

/* Lookup and custom dropdown menus used by Account Type, Under Group and future forms. */
body.theme-dark .ledger-account-shortlist,
body.theme-midnight .ledger-account-shortlist,
body.theme-carbon .ledger-account-shortlist,
body.theme-dark .erp-lookup-results,
body.theme-midnight .erp-lookup-results,
body.theme-carbon .erp-lookup-results,
body.theme-dark .erp-lookup-modal,
body.theme-midnight .erp-lookup-modal,
body.theme-carbon .erp-lookup-modal,
body.theme-dark .folder-dialog,
body.theme-midnight .folder-dialog,
body.theme-carbon .folder-dialog {
    background-color: #111827 !important;
    color: #f8fafc !important;
    border-color: #334155 !important;
}

body.theme-dark .ledger-account-option,
body.theme-midnight .ledger-account-option,
body.theme-carbon .ledger-account-option,
body.theme-dark .erp-lookup-result-item,
body.theme-midnight .erp-lookup-result-item,
body.theme-carbon .erp-lookup-result-item,
body.theme-dark .folder-row,
body.theme-midnight .folder-row,
body.theme-carbon .folder-row {
    background-color: #111827 !important;
    color: #f8fafc !important;
}

body.theme-dark .ledger-account-option:hover,
body.theme-midnight .ledger-account-option:hover,
body.theme-carbon .ledger-account-option:hover,
body.theme-dark .ledger-account-option:focus,
body.theme-midnight .ledger-account-option:focus,
body.theme-carbon .ledger-account-option:focus,
body.theme-dark .erp-lookup-result-item:hover,
body.theme-midnight .erp-lookup-result-item:hover,
body.theme-carbon .erp-lookup-result-item:hover,
body.theme-dark .erp-lookup-result-item:focus,
body.theme-midnight .erp-lookup-result-item:focus,
body.theme-carbon .erp-lookup-result-item:focus,
body.theme-dark .folder-row:hover,
body.theme-midnight .folder-row:hover,
body.theme-carbon .folder-row:hover {
    background-color: #1e293b !important;
    color: #ffffff !important;
}

body.theme-dark .lookup-show-more,
body.theme-midnight .lookup-show-more,
body.theme-carbon .lookup-show-more,
body.theme-dark .ledger-show-more,
body.theme-midnight .ledger-show-more,
body.theme-carbon .ledger-show-more {
    background-color: #1e293b !important;
    color: #fbbf24 !important;
    border-top-color: #334155 !important;
}


/* Final theme enforcement for Odoo-style lookup forms and popup lists.
   Odoo-style is layout only: every color below is driven by the currently selected ERP theme variables. */
.ledger-account-shortlist,
.erp-lookup-modal,
.erp-lookup-results,
.erp-lookup-search-row,
.folder-dialog,
.folder-dialog-header,
.folder-dialog-actions,
.folder-dialog-manual {
    background-color: var(--card) !important;
    color: var(--text) !important;
    border-color: var(--border) !important;
}

.erp-lookup-modal {
    border: 1px solid color-mix(in srgb, var(--brand) 22%, var(--border)) !important;
    box-shadow: 0 28px 80px color-mix(in srgb, var(--brand-dark) 24%, transparent) !important;
}

.erp-lookup-header {
    background: linear-gradient(135deg, var(--brand), var(--brand-dark)) !important;
    color: #fff !important;
}

.erp-lookup-header h3,
.erp-lookup-header p {
    color: #fff !important;
}

.erp-lookup-close {
    background: color-mix(in srgb, #ffffff 18%, transparent) !important;
    color: #fff !important;
}

.erp-lookup-close:hover {
    background: color-mix(in srgb, #ffffff 28%, transparent) !important;
}

.ledger-account-option,
.ledger-account-show-more,
.erp-lookup-result-item,
.folder-item,
.folder-row {
    background-color: transparent !important;
    color: var(--text) !important;
}

.ledger-account-option:hover,
.ledger-account-option:focus,
.ledger-account-show-more:hover,
.ledger-account-show-more:focus,
.erp-lookup-result-item:hover,
.erp-lookup-result-item:focus,
.folder-item:hover,
.folder-item:focus,
.folder-row:hover,
.folder-row:focus {
    background-color: color-mix(in srgb, var(--brand) 12%, var(--card)) !important;
    color: var(--brand) !important;
    outline: none !important;
}

.ledger-account-show-more,
.lookup-show-more,
.ledger-show-more {
    background-color: color-mix(in srgb, var(--brand) 7%, var(--card)) !important;
    color: var(--brand) !important;
    border-color: color-mix(in srgb, var(--brand) 18%, var(--border)) !important;
}

.erp-lookup-empty,
.ledger-account-empty {
    color: var(--muted) !important;
}

.erp-lookup-search-row .odoo-input,
.ledger-autocomplete-wrap .odoo-input {
    color: var(--text) !important;
    border-bottom-color: color-mix(in srgb, var(--brand) 22%, var(--border)) !important;
}

.erp-lookup-search-row .odoo-input:focus,
.ledger-autocomplete-wrap .odoo-input:focus {
    border-bottom-color: var(--brand) !important;
    background: color-mix(in srgb, var(--brand) 6%, transparent) !important;
}

/* Native dropdown popup colors: browsers render these differently, but keep selected/hover colors theme-based where supported. */
select option:checked,
select option:hover {
    background-color: var(--brand) !important;
    color: #fff !important;
}

body.theme-dark select option:checked,
body.theme-midnight select option:checked,
body.theme-carbon select option:checked,
body.theme-dark select option:hover,
body.theme-midnight select option:hover,
body.theme-carbon select option:hover {
    background-color: var(--brand) !important;
    color: #fff !important;
}

body.theme-dark .ledger-account-shortlist,
body.theme-midnight .ledger-account-shortlist,
body.theme-carbon .ledger-account-shortlist,
body.theme-dark .erp-lookup-modal,
body.theme-midnight .erp-lookup-modal,
body.theme-carbon .erp-lookup-modal,
body.theme-dark .erp-lookup-results,
body.theme-midnight .erp-lookup-results,
body.theme-carbon .erp-lookup-results,
body.theme-dark .erp-lookup-search-row,
body.theme-midnight .erp-lookup-search-row,
body.theme-carbon .erp-lookup-search-row,
body.theme-dark .folder-dialog,
body.theme-midnight .folder-dialog,
body.theme-carbon .folder-dialog {
    background-color: var(--card) !important;
    color: var(--text) !important;
    border-color: var(--border) !important;
}

body.theme-dark .ledger-account-option,
body.theme-midnight .ledger-account-option,
body.theme-carbon .ledger-account-option,
body.theme-dark .ledger-account-show-more,
body.theme-midnight .ledger-account-show-more,
body.theme-carbon .ledger-account-show-more,
body.theme-dark .erp-lookup-result-item,
body.theme-midnight .erp-lookup-result-item,
body.theme-carbon .erp-lookup-result-item,
body.theme-dark .folder-item,
body.theme-midnight .folder-item,
body.theme-carbon .folder-item,
body.theme-dark .folder-row,
body.theme-midnight .folder-row,
body.theme-carbon .folder-row {
    background-color: transparent !important;
    color: var(--text) !important;
}

body.theme-dark .ledger-account-option:hover,
body.theme-midnight .ledger-account-option:hover,
body.theme-carbon .ledger-account-option:hover,
body.theme-dark .ledger-account-option:focus,
body.theme-midnight .ledger-account-option:focus,
body.theme-carbon .ledger-account-option:focus,
body.theme-dark .ledger-account-show-more:hover,
body.theme-midnight .ledger-account-show-more:hover,
body.theme-carbon .ledger-account-show-more:hover,
body.theme-dark .erp-lookup-result-item:hover,
body.theme-midnight .erp-lookup-result-item:hover,
body.theme-carbon .erp-lookup-result-item:hover,
body.theme-dark .erp-lookup-result-item:focus,
body.theme-midnight .erp-lookup-result-item:focus,
body.theme-carbon .erp-lookup-result-item:focus,
body.theme-dark .folder-item:hover,
body.theme-midnight .folder-item:hover,
body.theme-carbon .folder-item:hover,
body.theme-dark .folder-row:hover,
body.theme-midnight .folder-row:hover,
body.theme-carbon .folder-row:hover {
    background-color: color-mix(in srgb, var(--brand) 18%, var(--card)) !important;
    color: var(--text) !important;
}

/* POS Touch screen - Odoo style layout with selected ERP theme colors */
.pos-touch-page {
    height: calc(100vh - 56px);
    min-height: 640px;
    margin: -18px;
    display: grid;
    grid-template-columns: clamp(340px, 24vw, 430px) minmax(0, 1fr);
    gap: 10px;
    background: var(--bg);
}

.pos-order-panel,
.pos-products-panel {
    background: var(--card);
    border: 1px solid var(--border);
    box-shadow: 0 10px 24px rgba(31,41,55,.08);
    overflow: hidden;
}

.pos-order-panel {
    display: flex;
    flex-direction: column;
    min-height: 0;
}

.pos-tabs,
.pos-product-header {
    min-height: 58px;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border-bottom: 1px solid var(--border);
    background: color-mix(in srgb, var(--card) 88%, var(--soft));
}

.pos-tab,
.pos-icon-btn,
.pos-mini-btn,
.pos-barcode-btn,
.pos-menu-btn,
.pos-user-dot,
.pos-pay-chip {
    border: 1px solid var(--border);
    background: var(--card);
    color: var(--text);
    border-radius: 8px;
    min-height: 42px;
    padding: 0 14px;
    font-weight: 800;
    cursor: pointer;
}

.pos-tab.active,
.pos-category-card.active,
.pos-pay-chip.active {
    background: var(--soft);
    border-color: var(--brand);
    color: var(--brand-dark);
}

.pos-icon-btn,
.pos-barcode-btn,
.pos-menu-btn,
.pos-user-dot {
    display: grid;
    place-items: center;
    min-width: 42px;
    padding: 0;
}

.pos-ticket-no {
    display: inline-flex;
    align-items: center;
    min-height: 42px;
    padding: 0 16px;
    border-radius: 8px;
    background: var(--soft);
    font-weight: 900;
    color: var(--brand-dark);
}

.pos-customer-row {
    display: flex;
    gap: 8px;
    padding: 10px 12px;
    border-bottom: 1px solid var(--border);
}

.pos-customer-picker { position: relative; flex: 1; }
.pos-customer-picker input,
.pos-search-wrap input {
    width: 100%;
    border: 1px solid var(--border);
    background: var(--card);
    color: var(--text);
    border-radius: 9px;
    padding: 12px 14px;
    font-size: 15px;
    outline: none;
}

.pos-customer-picker input:focus,
.pos-search-wrap input:focus {
    border-color: var(--brand);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand) 18%, transparent);
}

.pos-touch-suggest {
    display: none;
    position: absolute;
    z-index: 30;
    left: 0;
    right: 0;
    top: calc(100% + 4px);
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: 12px;
    box-shadow: 0 18px 42px rgba(31,41,55,.18);
    overflow: hidden;
}
.pos-touch-suggest.open { display: grid; }
.pos-touch-suggest button {
    border: 0;
    text-align: left;
    background: transparent;
    color: var(--text);
    padding: 11px 13px;
    cursor: pointer;
}
.pos-touch-suggest button:hover { background: var(--soft); color: var(--brand-dark); }

.pos-order-lines {
    flex: 1;
    overflow: auto;
    background: color-mix(in srgb, var(--bg) 55%, var(--card));
}

.pos-empty-cart,
.pos-products-empty {
    color: var(--muted);
    padding: 22px;
    text-align: center;
    font-weight: 700;
}

.pos-order-line {
    width: 100%;
    display: grid;
    grid-template-columns: 36px 1fr auto 28px;
    align-items: center;
    gap: 8px;
    border: 0;
    border-bottom: 1px solid var(--border);
    background: transparent;
    color: var(--text);
    padding: 10px 10px;
    text-align: left;
    cursor: pointer;
}
.pos-order-line:hover { background: var(--soft); }
.pos-line-qty { font-weight: 900; color: var(--brand-dark); }
.pos-line-name { font-size: 13px; font-weight: 800; }
.pos-line-name small { display: block; color: var(--muted); font-weight: 600; margin-top: 2px; }
.pos-line-remove { color: #b00020; font-weight: 900; font-size: 18px; text-align: center; }

.pos-total-box {
    border-top: 1px solid var(--border);
    padding: 12px;
    display: grid;
    gap: 8px;
    background: var(--card);
}
.pos-total-box div { display: flex; justify-content: space-between; align-items: center; }
.pos-total-box span { color: var(--muted); font-weight: 700; }
.pos-total-box strong { font-size: 16px; }
.pos-total-main span,
.pos-total-main strong { color: var(--text); font-size: 20px; font-weight: 900; }

.pos-keypad {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    border-top: 1px solid var(--border);
    border-left: 1px solid var(--border);
}
.pos-keypad button {
    min-height: 46px;
    border: 0;
    border-right: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
    background: color-mix(in srgb, var(--card) 94%, var(--soft));
    color: var(--text);
    font-weight: 900;
    font-size: 16px;
    cursor: pointer;
}
.pos-keypad button:hover { background: var(--soft); }
.pos-keypad [data-mode] { color: var(--brand-dark); background: color-mix(in srgb, var(--soft) 72%, var(--card)); }

.pos-keypad [data-mode].active {
    background: var(--brand);
    color: white;
    box-shadow: inset 0 0 0 2px color-mix(in srgb, white 55%, transparent);
}

.pos-keypad [data-mode].active:hover {
    background: var(--brand);
    color: white;
}
.pos-keypad [data-key="back"] { background: #fce7e7; color: #9f1239; }

.pos-payment-methods {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    padding: 10px 12px 0;
}
.pos-pay-chip { min-height: 34px; padding: 0 10px; font-size: 12px; }
.pos-payment-btn {
    margin: 10px 12px 12px;
    min-height: 58px;
    border: 0;
    border-radius: 8px;
    background: var(--brand);
    color: #fff;
    font-weight: 900;
    font-size: 16px;
    cursor: pointer;
    box-shadow: 0 12px 26px color-mix(in srgb, var(--brand) 28%, transparent);
}
.pos-payment-btn:hover { background: var(--brand-dark); }

.pos-products-panel {
    display: flex;
    flex-direction: column;
    min-width: 0;
}
.pos-search-wrap {
    max-width: 420px;
    flex: 1;
    position: relative;
}
.pos-search-wrap span {
    position: absolute;
    left: 14px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 22px;
    color: var(--brand-dark);
    font-weight: 900;
}
.pos-search-wrap input { padding-left: 44px; }
.pos-user-dot {
    border-radius: 999px;
    background: var(--brand);
    color: #fff;
    border-color: var(--brand);
}

/* TouchPOS2 category carousel: one fixed row, manual previous/next navigation, no visible scrollbars. */
.pos-category-carousel {
    display: grid;
    grid-template-columns: 52px minmax(0, 1fr) 52px;
    align-items: stretch;
    gap: 8px;
    padding: 10px 12px;
    border-bottom: 1px solid var(--border);
    background: color-mix(in srgb, var(--card) 92%, var(--soft));
    flex: 0 0 auto;
    min-width: 0;
}
.pos-category-strip {
    display: flex;
    flex-wrap: nowrap;
    align-items: stretch;
    gap: 9px;
    padding: 0;
    min-width: 0;
    overflow-x: auto;
    overflow-y: hidden;
    overscroll-behavior-x: contain;
    scrollbar-width: none;
    -ms-overflow-style: none;
    scroll-behavior: smooth;
}
.pos-category-strip::-webkit-scrollbar {
    width: 0;
    height: 0;
    display: none;
}
.pos-category-card {
    flex: 0 0 122px;
    min-width: 122px;
    min-height: 58px;
    border: 1px solid var(--border);
    border-radius: 9px;
    background: color-mix(in srgb, var(--soft) 42%, var(--card));
    color: var(--text);
    font-weight: 800;
    cursor: pointer;
    padding: 8px 10px;
}
.pos-category-card:hover { border-color: var(--brand); color: var(--brand-dark); }
.pos-category-nav {
    width: 52px;
    min-width: 52px;
    min-height: 58px;
    border: 1px solid var(--border);
    border-radius: 9px;
    background: color-mix(in srgb, var(--card) 94%, var(--soft));
    color: var(--brand-dark);
    font-size: 38px;
    font-weight: 900;
    line-height: 1;
    display: grid;
    place-items: center;
    cursor: pointer;
    touch-action: manipulation;
    user-select: none;
    padding: 0 0 4px;
}
.pos-category-nav:hover:not(:disabled),
.pos-category-nav:focus-visible {
    border-color: var(--brand);
    background: var(--soft);
    color: var(--brand-dark);
}
.pos-category-nav:disabled {
    opacity: .32;
    cursor: default;
}

.pos-product-grid {
    flex: 1;
    overflow: auto;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(118px, 1fr));
    grid-auto-rows: minmax(154px, auto);
    gap: 10px;
    padding: 12px;
    align-content: start;
}
.pos-product-card {
    position: relative;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--card);
    color: var(--text);
    display: flex;
    flex-direction: column;
    padding: 0;
    overflow: hidden;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(31,41,55,.07);
    text-align: left;
}
.pos-product-card:hover {
    transform: translateY(-1px);
    box-shadow: 0 10px 20px rgba(31,41,55,.12);
    border-color: var(--brand);
}
.pos-product-image {
    height: 92px;
    display: grid;
    place-items: center;
    background: color-mix(in srgb, var(--soft) 38%, var(--bg));
    border-bottom: 1px solid var(--border);
}
.pos-product-image img { width: 100%; height: 100%; object-fit: cover; }
.pos-product-image span {
    width: 46px;
    height: 46px;
    border-radius: 14px;
    display: grid;
    place-items: center;
    background: var(--brand);
    color: #fff;
    font-size: 22px;
    font-weight: 900;
}
.pos-product-name {
    padding: 7px 8px 3px;
    min-height: 38px;
    max-height: 42px;
    font-size: 12px;
    line-height: 1.15;
    text-transform: uppercase;
    font-weight: 900;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
.pos-product-meta {
    display: flex;
    justify-content: space-between;
    gap: 6px;
    align-items: center;
    padding: 0 8px 8px;
    margin-top: auto;
    font-size: 11px;
    color: var(--muted);
}
.pos-product-meta strong { color: var(--brand-dark); font-size: 12px; white-space: nowrap; }
.pos-product-meta span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pos-stock-pill {
    position: absolute;
    right: 5px;
    top: 84px;
    min-width: 22px;
    height: 22px;
    border-radius: 999px;
    background: var(--brand-dark);
    color: #fff;
    display: grid;
    place-items: center;
    font-size: 11px;
    font-weight: 900;
}

@media (max-width: 1280px) {
    .pos-touch-page { grid-template-columns: 370px minmax(0, 1fr); }
    .pos-product-grid { grid-template-columns: repeat(auto-fill, minmax(112px, 1fr)); }
    .pos-category-card { flex-basis: 112px; min-width: 112px; }
}
@media (min-width: 1600px) {
    .pos-product-grid { grid-template-columns: repeat(auto-fill, minmax(128px, 1fr)); }
}
@media (max-width: 820px) {
    .pos-touch-page { grid-template-columns: 1fr; height: auto; min-height: calc(100vh - 56px); margin: -10px; }
    .pos-order-panel { min-height: auto; max-height: none; }
    .pos-products-panel { min-height: 70vh; }
    .pos-category-carousel { grid-template-columns: 48px minmax(0, 1fr) 48px; gap: 6px; padding: 8px; }
    .pos-category-nav { width: 48px; min-width: 48px; min-height: 56px; }
    .pos-category-card { flex-basis: 108px; min-width: 108px; min-height: 56px; }
}


/* Touch POS 2 - clear product images: larger fixed image area, no text overlap. */
.pos-product-grid {
    grid-template-columns: repeat(auto-fill, minmax(145px, 1fr));
    grid-auto-rows: minmax(220px, auto);
    gap: 12px;
}
.pos-product-card {
    min-height: 220px;
}
.pos-product-image {
    flex: 0 0 150px;
    height: 150px;
    width: 100%;
    overflow: hidden;
    padding: 6px;
    box-sizing: border-box;
    background: color-mix(in srgb, var(--soft) 24%, var(--card));
}
.pos-product-image img {
    width: 100%;
    height: 100%;
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    object-position: center center;
    display: block;
    border-radius: 6px;
}
.pos-product-name {
    min-height: 36px;
    max-height: 40px;
}
.pos-product-name,
.pos-product-meta {
    position: relative;
    z-index: 1;
    background: var(--card);
}
.pos-stock-pill {
    top: 140px;
}
@media (max-width: 1280px) {
    .pos-product-grid {
        grid-template-columns: repeat(auto-fill, minmax(132px, 1fr));
        grid-auto-rows: minmax(204px, auto);
    }
    .pos-product-card { min-height: 204px; }
    .pos-product-image { flex-basis: 136px; height: 136px; }
    .pos-stock-pill { top: 126px; }
}
@media (min-width: 1600px) {
    .pos-product-grid {
        grid-template-columns: repeat(auto-fill, minmax(158px, 1fr));
        grid-auto-rows: minmax(238px, auto);
    }
    .pos-product-card { min-height: 238px; }
    .pos-product-image { flex-basis: 164px; height: 164px; }
    .pos-stock-pill { top: 154px; }
}


/* POS sale controls stay hidden until at least one product is added to the sales grid. */
.pos-touch-page:not(.has-sale-lines) .pos-sale-control {
    display: none !important;
}

/* Touch POS 2 - show inclusive product price and keep available stock badge visible. */
.pos-product-card .pos-stock-pill {
    top: 8px !important;
    right: 8px !important;
    z-index: 4;
    min-width: 28px;
    height: 24px;
    padding: 0 7px;
    border: 2px solid var(--card);
    box-shadow: 0 4px 10px rgba(0,0,0,.18);
    pointer-events: none;
}
.pos-order-line.selected {
    background: color-mix(in srgb, var(--brand) 12%, var(--card));
    box-shadow: inset 4px 0 0 var(--brand);
}
.pos-order-line.selected .pos-line-name,
.pos-order-line.selected .pos-line-qty,
.pos-order-line.selected strong {
    color: var(--brand-dark);
}

/* Dashboard quick-access area: optional shortcuts shown before the Main Menu */
.dashboard-quick-access-section {
    border-color: color-mix(in srgb, var(--brand) 22%, var(--border));
}

.quick-access-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 14px;
}

.quick-access-card {
    display: grid;
    grid-template-columns: 48px 1fr 22px;
    align-items: center;
    gap: 13px;
    min-height: 118px;
    padding: 16px;
    border: 1px solid var(--border);
    border-radius: 18px;
    background: var(--card);
    color: var(--text);
    text-decoration: none;
    box-shadow: 0 10px 28px rgba(15, 23, 42, .06);
    transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}

.quick-access-card:hover,
.quick-access-card:focus {
    transform: translateY(-2px);
    box-shadow: 0 16px 36px rgba(15, 23, 42, .11);
    border-color: color-mix(in srgb, var(--brand) 45%, var(--border));
    color: var(--text);
}

.quick-access-icon {
    width: 48px;
    height: 48px;
    display: grid;
    place-items: center;
    border-radius: 15px;
    background: var(--soft);
    color: var(--brand-dark);
    font-size: 24px;
}

.quick-access-path {
    display: block;
    margin-bottom: 6px;
    color: var(--muted);
    font-size: 12px;
    line-height: 1.25;
}

.quick-access-body h3 {
    margin: 0;
    font-size: 17px;
}

.quick-access-body p {
    margin: 7px 0 0;
    color: var(--muted);
    font-size: 13px;
    line-height: 1.35;
}

.quick-access-arrow {
    color: var(--brand);
    font-size: 28px;
    font-weight: 300;
}

.empty-quick-access {
    background: color-mix(in srgb, var(--card) 92%, var(--soft));
}

body.theme-dark .quick-access-card,
body.theme-midnight .quick-access-card,
body.theme-carbon .quick-access-card {
    background: var(--card);
    color: var(--text);
    border-color: var(--border);
}

body.theme-dark .quick-access-icon,
body.theme-midnight .quick-access-icon,
body.theme-carbon .quick-access-icon {
    background: var(--soft);
    color: var(--text);
}

/* Quick View manager: add/remove shortcuts from menu cards without editing JSON manually. */
.app-card-shell,
.dash-menu-card-shell,
.quick-access-card-shell {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.app-card-shell .app-card,
.dash-menu-card-shell .dash-menu-card-link,
.quick-access-card-shell .quick-access-card {
    flex: 1 1 auto;
    width: 100%;
}

.quickview-toggle-form {
    margin: 0;
}

.quickview-toggle {
    width: 100%;
    border: 1px solid color-mix(in srgb, var(--brand) 28%, var(--border));
    background: color-mix(in srgb, var(--brand) 7%, var(--card));
    color: var(--brand-dark);
    border-radius: 14px;
    padding: 9px 12px;
    font-size: 12px;
    font-weight: 800;
    cursor: pointer;
    transition: transform .15s ease, box-shadow .15s ease, background .15s ease, color .15s ease;
}

.quickview-toggle:hover,
.quickview-toggle:focus {
    transform: translateY(-1px);
    box-shadow: 0 10px 24px rgba(15, 23, 42, .10);
    background: color-mix(in srgb, var(--brand) 14%, var(--card));
}

.quickview-toggle.remove {
    border-color: color-mix(in srgb, #ef4444 28%, var(--border));
    background: color-mix(in srgb, #ef4444 7%, var(--card));
    color: #b91c1c;
}

.quickview-toggle.remove:hover,
.quickview-toggle.remove:focus {
    background: color-mix(in srgb, #ef4444 13%, var(--card));
}

.app-card-shell.is-quickview .app-card,
.dash-menu-card-shell.is-quickview .dash-menu-card-link,
.quick-access-card-shell .quick-access-card {
    border-color: color-mix(in srgb, var(--brand) 45%, var(--border));
}

.app-card-shell.is-quickview::before,
.dash-menu-card-shell.is-quickview::before,
.quick-access-card-shell::before {
    content: "Quick View";
    position: absolute;
    top: 12px;
    right: 12px;
    z-index: 2;
    background: color-mix(in srgb, var(--brand) 14%, var(--card));
    color: var(--brand-dark);
    border: 1px solid color-mix(in srgb, var(--brand) 32%, var(--border));
    border-radius: 999px;
    padding: 4px 8px;
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .02em;
}

body.theme-dark .quickview-toggle,
body.theme-midnight .quickview-toggle,
body.theme-carbon .quickview-toggle {
    background: color-mix(in srgb, var(--brand) 12%, var(--card));
    color: var(--text);
}

body.theme-dark .quickview-toggle.remove,
body.theme-midnight .quickview-toggle.remove,
body.theme-carbon .quickview-toggle.remove {
    background: color-mix(in srgb, #ef4444 13%, var(--card));
    color: #fecaca;
}

/* iPhone-style Quick View editing: hold a card to reveal a small add/remove corner icon. */
.app-card-shell,
.dash-menu-card-shell,
.quick-access-card-shell {
    position: relative;
}

.quickview-corner-form {
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 8;
    margin: 0;
    opacity: 0;
    pointer-events: none;
    transform: scale(.72) translateY(-4px);
    transition: opacity .16s ease, transform .16s ease;
}

.quickview-corner-toggle {
    width: 30px;
    height: 30px;
    border-radius: 999px;
    border: 2px solid var(--card);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 12px 26px rgba(15, 23, 42, .18);
    font-size: 20px;
    font-weight: 950;
    line-height: 1;
    cursor: pointer;
    transition: transform .14s ease, box-shadow .14s ease, filter .14s ease;
}

.quickview-corner-toggle.add {
    background: color-mix(in srgb, var(--brand) 90%, #ffffff);
    color: #ffffff;
}

.quickview-corner-toggle.remove {
    background: #ef4444;
    color: #ffffff;
}

.quickview-corner-toggle:hover,
.quickview-corner-toggle:focus {
    transform: scale(1.08);
    box-shadow: 0 16px 30px rgba(15, 23, 42, .24);
    outline: none;
}

.quickview-corner-toggle::after {
    content: attr(data-tooltip);
    position: absolute;
    right: 0;
    top: -36px;
    white-space: nowrap;
    background: var(--text);
    color: var(--card);
    border-radius: 999px;
    padding: 7px 10px;
    font-size: 11px;
    font-weight: 800;
    box-shadow: 0 10px 24px rgba(15, 23, 42, .18);
    opacity: 0;
    pointer-events: none;
    transform: translateY(3px);
    transition: opacity .14s ease, transform .14s ease;
}

.quickview-corner-toggle:hover::after,
.quickview-corner-toggle:focus::after {
    opacity: 1;
    transform: translateY(0);
}

.app-card-shell.quickview-editing .quickview-corner-form,
.dash-menu-card-shell.quickview-editing .quickview-corner-form,
.quick-access-card-shell.quickview-editing .quickview-corner-form,
.quickview-corner-form:focus-within {
    opacity: 1;
    pointer-events: auto;
    transform: scale(1) translateY(0);
}

.app-card-shell.quickview-pressing .app-card,
.dash-menu-card-shell.quickview-pressing .dash-menu-card-link,
.quick-access-card-shell.quickview-pressing .quick-access-card,
.app-card-shell.quickview-editing .app-card,
.dash-menu-card-shell.quickview-editing .dash-menu-card-link,
.quick-access-card-shell.quickview-editing .quick-access-card {
    transform: scale(.985);
    box-shadow: 0 18px 42px rgba(15, 23, 42, .16);
}

.app-card-shell.quickview-editing .app-card,
.dash-menu-card-shell.quickview-editing .dash-menu-card-link,
.quick-access-card-shell.quickview-editing .quick-access-card {
    outline: 2px dashed color-mix(in srgb, var(--brand) 60%, transparent);
    outline-offset: 4px;
}

.app-card-shell.is-quickview::before,
.dash-menu-card-shell.is-quickview::before,
.quick-access-card-shell::before {
    top: 12px;
    right: auto;
    left: 12px;
}

body.theme-dark .quickview-corner-toggle,
body.theme-midnight .quickview-corner-toggle,
body.theme-carbon .quickview-corner-toggle {
    border-color: color-mix(in srgb, var(--card) 82%, #ffffff);
}

body.theme-dark .quickview-corner-toggle::after,
body.theme-midnight .quickview-corner-toggle::after,
body.theme-carbon .quickview-corner-toggle::after {
    background: color-mix(in srgb, var(--card) 88%, #ffffff);
    color: var(--text);
}

/* Do not reveal Quick View add/remove icons on rollover.
   Icons appear only after long-press/hold, with the dashed edit border. */

/* Dashboard POS image support */
.app-icon img,
.dash-menu-card-icon img,
.quick-access-icon img,
.module-big-icon img,
.menu-icon img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}

.app-icon img,
.dash-menu-card-icon img,
.quick-access-icon img,
.module-big-icon img {
    border-radius: inherit;
}

.menu-icon img {
    width: 22px;
    height: 22px;
    border-radius: 7px;
}

/* Point of Sales order grid: show quantity text (for example 1 KG, 1 Box, 2 Pcs) on the second line. */
.pos-line-name small {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px 8px;
}
.pos-line-qtytext {
    color: var(--brand-dark);
    font-weight: 900;
    white-space: nowrap;
}
.pos-order-line.selected .pos-line-name small,
.pos-order-line.selected .pos-line-qtytext,
.pos-order-line.selected .pos-line-remove {
    color: var(--brand-dark);
}

/* Point of Sales order grid: selected row must stay readable in dark themes. */
body.theme-dark .pos-order-line.selected,
body.theme-midnight .pos-order-line.selected,
body.theme-carbon .pos-order-line.selected {
    background: color-mix(in srgb, var(--brand) 42%, #0f172a) !important;
    box-shadow: inset 4px 0 0 color-mix(in srgb, var(--brand) 78%, #ffffff) !important;
}
body.theme-dark .pos-order-line.selected,
body.theme-dark .pos-order-line.selected .pos-line-name,
body.theme-dark .pos-order-line.selected .pos-line-name small,
body.theme-dark .pos-order-line.selected .pos-line-qty,
body.theme-dark .pos-order-line.selected .pos-line-qtytext,
body.theme-dark .pos-order-line.selected strong,
body.theme-midnight .pos-order-line.selected,
body.theme-midnight .pos-order-line.selected .pos-line-name,
body.theme-midnight .pos-order-line.selected .pos-line-name small,
body.theme-midnight .pos-order-line.selected .pos-line-qty,
body.theme-midnight .pos-order-line.selected .pos-line-qtytext,
body.theme-midnight .pos-order-line.selected strong,
body.theme-carbon .pos-order-line.selected,
body.theme-carbon .pos-order-line.selected .pos-line-name,
body.theme-carbon .pos-order-line.selected .pos-line-name small,
body.theme-carbon .pos-order-line.selected .pos-line-qty,
body.theme-carbon .pos-order-line.selected .pos-line-qtytext,
body.theme-carbon .pos-order-line.selected strong {
    color: #ffffff !important;
}
body.theme-dark .pos-order-line.selected .pos-line-remove,
body.theme-midnight .pos-order-line.selected .pos-line-remove,
body.theme-carbon .pos-order-line.selected .pos-line-remove {
    color: #ffffff !important;
}

/* POS scanner and top status bar */
.pos-order-panel,
.pos-products-panel {
    min-height: 0;
}

.pos-scanner-row {
    padding: 10px 12px;
    border-bottom: 1px solid var(--border);
    background: color-mix(in srgb, var(--card) 84%, var(--soft));
}

.pos-scanner-wrap {
    position: relative;
}

.pos-scanner-wrap span {
    position: absolute;
    left: 13px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--brand-dark);
    font-weight: 900;
    pointer-events: none;
}

.pos-scanner-wrap input {
    width: 100%;
    min-height: 44px;
    border: 1px solid var(--border);
    background: var(--card);
    color: var(--text);
    border-radius: 9px;
    padding: 10px 14px 10px 42px;
    font-size: 15px;
    font-weight: 700;
    outline: none;
}

.pos-scanner-wrap input:focus {
    border-color: var(--brand);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand) 18%, transparent);
}

.pos-top-status {
    margin-left: auto;
    flex: 1 1 430px;
    max-width: 560px;
    min-height: 42px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    padding: 7px 12px;
    background: color-mix(in srgb, var(--soft) 55%, var(--card));
    border: 1px solid var(--border);
    border-radius: 10px;
    color: var(--text);
    font-size: 12px;
    font-weight: 800;
    box-shadow: 0 6px 18px rgba(31,41,55,.08), inset 0 0 0 1px color-mix(in srgb, var(--brand) 10%, transparent);
    overflow: hidden;
}

.pos-top-status span {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    white-space: nowrap;
}

.pos-top-status strong {
    color: var(--muted);
    font-weight: 900;
}

@media (max-width: 1180px) {
    .pos-product-header { flex-wrap: wrap; }
    .pos-top-status { order: 2; flex-basis: 100%; max-width: none; justify-content: flex-start; flex-wrap: wrap; }
}

@media (max-width: 820px) {
    .pos-top-status { border-radius: 8px; font-size: 11px; gap: 8px; }
}

/* POS save/open order workflow */
.pos-save-row {
    display: grid;
    grid-template-columns: .72fr .72fr 1.28fr;
    gap: 8px;
    padding: 10px 12px 12px;
}
.pos-save-row .pos-payment-btn,
.pos-save-btn {
    margin: 0;
    min-height: 58px;
    border: 0;
    border-radius: 8px;
    font-weight: 900;
    font-size: 16px;
    cursor: pointer;
}
.pos-save-btn {
    background: color-mix(in srgb, var(--soft) 72%, var(--card));
    color: var(--brand-dark);
    border: 1px solid var(--border);
}
.pos-save-btn:hover { background: var(--soft); }
.pos-modal-backdrop {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 1100;
    background: rgba(15, 23, 42, .42);
    align-items: center;
    justify-content: center;
    padding: 20px;
}
.pos-modal-backdrop.open { display: flex; }
.pos-busy-overlay {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 2000;
    align-items: center;
    justify-content: center;
    background: rgba(15, 23, 42, .18);
    cursor: wait;
}
.pos-busy-overlay.open { display: flex; }
.pos-busy-card {
    min-width: 220px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 16px 20px;
    border-radius: 10px;
    background: var(--card);
    color: var(--text);
    border: 1px solid var(--border);
    box-shadow: 0 18px 45px rgba(15, 23, 42, .24);
}
.pos-busy-card strong {
    font-size: 15px;
    font-weight: 900;
}
.pos-busy-spinner {
    width: 22px;
    height: 22px;
    border-radius: 999px;
    border: 3px solid color-mix(in srgb, var(--brand) 18%, transparent);
    border-top-color: var(--brand);
    animation: posBusySpin .8s linear infinite;
}
.pos-touch-page.pos-touch-busy {
    cursor: wait;
}
@keyframes posBusySpin {
    to { transform: rotate(360deg); }
}
.pos-orders-modal {
    width: min(880px, 96vw);
    max-height: min(680px, 92vh);
    display: flex;
    flex-direction: column;
    background: var(--card);
    color: var(--text);
    border: 1px solid var(--border);
    border-radius: 16px;
    box-shadow: 0 28px 70px rgba(15, 23, 42, .35);
    overflow: hidden;
}
.pos-orders-head {
    min-height: 58px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px;
    background: color-mix(in srgb, var(--soft) 70%, var(--card));
    border-bottom: 1px solid var(--border);
}
.pos-orders-head strong { font-size: 18px; }
.pos-orders-close {
    width: 36px;
    height: 36px;
    border-radius: 999px;
    border: 1px solid var(--border);
    background: var(--card);
    color: var(--text);
    font-size: 24px;
    line-height: 1;
    cursor: pointer;
}
.pos-orders-search { padding: 12px 16px; border-bottom: 1px solid var(--border); }
.pos-orders-search input {
    width: 100%;
    border: 1px solid var(--border);
    background: var(--card);
    color: var(--text);
    border-radius: 10px;
    padding: 12px 14px;
    font-weight: 700;
    outline: none;
}
.pos-orders-search input:focus { border-color: var(--brand); box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand) 18%, transparent); }
.pos-orders-grid-wrap { overflow: auto; }
.pos-orders-grid {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.pos-orders-grid th,
.pos-orders-grid td {
    padding: 11px 12px;
    border-bottom: 1px solid var(--border);
    text-align: left;
}
.pos-orders-grid th {
    position: sticky;
    top: 0;
    z-index: 1;
    background: var(--soft);
    color: var(--brand-dark);
    font-weight: 900;
}
.pos-orders-grid tbody tr { cursor: pointer; }
.pos-orders-grid tbody tr:hover,
.pos-orders-grid tbody tr:focus { background: color-mix(in srgb, var(--soft) 70%, transparent); outline: none; }

/* POS multi-payment popup, based on the desktop payment grid flow */
.pos-payment-modal { width: min(680px, 96vw); }
.pos-payment-summary {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 8px 14px;
    padding: 14px 16px;
    border-bottom: 1px solid var(--border);
    background: color-mix(in srgb, var(--soft) 35%, var(--card));
}
.pos-payment-summary span { color: var(--muted); font-weight: 800; }
.pos-payment-summary strong { text-align: right; font-size: 16px; }
.pos-payment-entry {
    display: grid;
    grid-template-columns: 1.1fr 1fr auto;
    gap: 10px;
    padding: 12px 16px;
    border-bottom: 1px solid var(--border);
}
.pos-payment-entry select,
.pos-payment-entry input {
    min-height: 42px;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: var(--card);
    color: var(--text);
    padding: 0 12px;
    font-weight: 800;
    outline: none;
}
.pos-payment-entry select:focus,
.pos-payment-entry input:focus {
    border-color: var(--brand);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand) 18%, transparent);
}
.pos-payment-entry button,
.pos-payment-remove {
    border: 1px solid var(--border);
    border-radius: 10px;
    background: color-mix(in srgb, var(--soft) 72%, var(--card));
    color: var(--brand-dark);
    font-weight: 900;
    cursor: pointer;
    padding: 0 14px;
}
.pos-payment-remove { min-width: 34px; min-height: 30px; color: #b00020; }
.pos-payment-actions {
    display: grid;
    grid-template-columns: .9fr 1.4fr;
    gap: 10px;
    padding: 12px 16px 16px;
    border-top: 1px solid var(--border);
}
.pos-payment-actions .pos-payment-btn,
.pos-payment-actions .pos-save-btn { margin: 0; }
@media (max-width: 640px) {
    .pos-payment-entry { grid-template-columns: 1fr; }
    .pos-payment-actions { grid-template-columns: 1fr; }
}

/* POS dark-theme readability and draft order number fixes */
body.theme-dark .pos-tab,
body.theme-dark .pos-icon-btn,
body.theme-dark .pos-mini-btn,
body.theme-dark .pos-barcode-btn,
body.theme-dark .pos-menu-btn,
body.theme-dark .pos-pay-chip,
body.theme-midnight .pos-tab,
body.theme-midnight .pos-icon-btn,
body.theme-midnight .pos-mini-btn,
body.theme-midnight .pos-barcode-btn,
body.theme-midnight .pos-menu-btn,
body.theme-midnight .pos-pay-chip,
body.theme-carbon .pos-tab,
body.theme-carbon .pos-icon-btn,
body.theme-carbon .pos-mini-btn,
body.theme-carbon .pos-barcode-btn,
body.theme-carbon .pos-menu-btn,
body.theme-carbon .pos-pay-chip {
    color: var(--text) !important;
    background: color-mix(in srgb, var(--card) 88%, var(--bg)) !important;
}

body.theme-dark .pos-tab.active,
body.theme-dark .pos-category-card.active,
body.theme-dark .pos-pay-chip.active,
body.theme-midnight .pos-tab.active,
body.theme-midnight .pos-category-card.active,
body.theme-midnight .pos-pay-chip.active,
body.theme-carbon .pos-tab.active,
body.theme-carbon .pos-category-card.active,
body.theme-carbon .pos-pay-chip.active {
    background: color-mix(in srgb, var(--brand) 82%, var(--card)) !important;
    border-color: var(--brand) !important;
    color: #fff !important;
}

body.theme-dark .pos-ticket-no,
body.theme-midnight .pos-ticket-no,
body.theme-carbon .pos-ticket-no {
    color: #fff !important;
    background: color-mix(in srgb, var(--brand) 72%, var(--card)) !important;
}

body.theme-dark .pos-keypad [data-mode],
body.theme-midnight .pos-keypad [data-mode],
body.theme-carbon .pos-keypad [data-mode] {
    color: var(--text) !important;
    background: color-mix(in srgb, var(--card) 88%, var(--bg)) !important;
}

body.theme-dark .pos-keypad [data-mode].active,
body.theme-midnight .pos-keypad [data-mode].active,
body.theme-carbon .pos-keypad [data-mode].active {
    background: var(--brand) !important;
    color: #fff !important;
}

body.theme-dark .pos-save-btn,
body.theme-midnight .pos-save-btn,
body.theme-carbon .pos-save-btn {
    color: var(--text) !important;
    background: color-mix(in srgb, var(--card) 84%, var(--bg)) !important;
    border: 1px solid var(--border) !important;
}

body.theme-dark .pos-save-btn:hover,
body.theme-midnight .pos-save-btn:hover,
body.theme-carbon .pos-save-btn:hover {
    background: color-mix(in srgb, var(--brand) 28%, var(--card)) !important;
    color: #fff !important;
}

body.theme-dark .pos-top-status,
body.theme-midnight .pos-top-status,
body.theme-carbon .pos-top-status {
    color: var(--text) !important;
    background: color-mix(in srgb, var(--card) 86%, var(--bg)) !important;
}

body.theme-dark .pos-top-status strong,
body.theme-midnight .pos-top-status strong,
body.theme-carbon .pos-top-status strong {
    color: var(--text) !important;
}

/* Keep top status fully readable; do not clip the Date value on wide POS screens. */
.pos-product-header { flex-wrap: nowrap; }
.pos-top-status {
    flex: 0 0 auto;
    max-width: none;
    min-width: max-content;
    overflow: visible;
    white-space: nowrap;
}
.pos-top-status span { flex: 0 0 auto; }
@media (max-width: 1350px) {
    .pos-product-header { flex-wrap: wrap; }
    .pos-top-status { order: 2; flex-basis: 100%; min-width: 0; justify-content: flex-start; flex-wrap: wrap; white-space: normal; }
}

body.theme-dark .pos-product-meta strong,
body.theme-dark .pos-line-qty,
body.theme-dark .pos-order-line.selected .pos-line-name,
body.theme-dark .pos-order-line.selected .pos-line-qty,
body.theme-dark .pos-order-line.selected strong,
body.theme-midnight .pos-product-meta strong,
body.theme-midnight .pos-line-qty,
body.theme-midnight .pos-order-line.selected .pos-line-name,
body.theme-midnight .pos-order-line.selected .pos-line-qty,
body.theme-midnight .pos-order-line.selected strong,
body.theme-carbon .pos-product-meta strong,
body.theme-carbon .pos-line-qty,
body.theme-carbon .pos-order-line.selected .pos-line-name,
body.theme-carbon .pos-order-line.selected .pos-line-qty,
body.theme-carbon .pos-order-line.selected strong {
    color: #fff !important;
}

body.theme-dark .pos-order-line.selected,
body.theme-midnight .pos-order-line.selected,
body.theme-carbon .pos-order-line.selected {
    background: color-mix(in srgb, var(--brand) 42%, var(--card)) !important;
}


/* POS payment/new-order UX fixes */
.erp-toast.error,
.erp-toast.delete {
    background: #dc2626 !important;
    border-color: #b91c1c !important;
    color: #fff !important;
}
.erp-toast.error .erp-toast-close,
.erp-toast.delete .erp-toast-close {
    background: rgba(255,255,255,.18) !important;
    color: #fff !important;
}
.erp-toast.error::before,
.erp-toast.delete::before { background: #7f1d1d !important; }

.pos-confirm-backdrop { z-index: 1300; }
.pos-confirm-card {
    width: min(430px, 94vw);
    padding: 26px;
    border-radius: 24px;
    background: var(--card);
    color: var(--text);
    border: 1px solid var(--border);
    box-shadow: 0 30px 90px rgba(15, 23, 42, .34);
    text-align: center;
}
.pos-confirm-icon {
    width: 62px;
    height: 62px;
    margin: 0 auto 14px;
    border-radius: 20px;
    display: grid;
    place-items: center;
    background: var(--brand);
    color: #fff;
    font-size: 30px;
    font-weight: 900;
    box-shadow: 0 16px 36px color-mix(in srgb, var(--brand) 34%, transparent);
}
.pos-confirm-card h3 {
    margin: 0 0 8px;
    font-size: 24px;
    font-weight: 900;
}
.pos-confirm-card p {
    margin: 0;
    color: var(--muted);
    font-weight: 700;
    line-height: 1.45;
}
.pos-confirm-actions {
    display: grid;
    grid-template-columns: 1fr 1.35fr;
    gap: 10px;
    margin-top: 22px;
}
.pos-confirm-actions button {
    min-height: 46px;
    border-radius: 13px;
    border: 1px solid var(--border);
    font-weight: 900;
    cursor: pointer;
}
.pos-confirm-cancel {
    background: color-mix(in srgb, var(--card) 86%, var(--bg));
    color: var(--text);
}
.pos-confirm-ok {
    background: var(--brand);
    color: #fff;
    border-color: var(--brand) !important;
}
body.theme-dark .pos-confirm-card,
body.theme-midnight .pos-confirm-card,
body.theme-carbon .pos-confirm-card {
    background: color-mix(in srgb, var(--card) 92%, #000) !important;
    color: var(--text) !important;
}
body.theme-dark .pos-confirm-card p,
body.theme-midnight .pos-confirm-card p,
body.theme-carbon .pos-confirm-card p { color: color-mix(in srgb, var(--text) 78%, transparent) !important; }

/* POS Action / Customer lookup / touch payment additions */
.pos-action-menu-btn {
    font-size: 22px;
    line-height: 1;
}

.pos-action-modal { width: min(980px, 96vw); }
.pos-action-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(180px, 1fr));
    gap: 8px;
    padding: 16px;
}
.pos-action-tile {
    min-height: 124px;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: color-mix(in srgb, var(--card) 88%, var(--bg));
    color: var(--text);
    font-size: 18px;
    font-weight: 900;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    cursor: pointer;
    box-shadow: inset 0 0 0 1px color-mix(in srgb, #fff 20%, transparent);
}
.pos-action-tile:hover,
.pos-action-tile:focus {
    border-color: var(--brand);
    background: color-mix(in srgb, var(--brand) 10%, var(--card));
    outline: none;
}

.pos-customer-modal { width: min(980px, 96vw); height: min(760px, 92vh); }
.pos-customer-lookup-head {
    min-height: 74px;
    display: grid;
    grid-template-columns: auto 1fr minmax(270px, .7fr) auto;
    align-items: center;
    gap: 8px;
    padding: 12px 16px;
    border-bottom: 1px solid var(--border);
    background: var(--card);
}
.pos-customer-create {
    min-height: 48px;
    border: 0;
    border-radius: 4px;
    padding: 0 16px;
    background: var(--brand);
    color: #fff;
    font-weight: 900;
    cursor: pointer;
}
.pos-customer-lookup-head strong { font-size: 18px; }
.pos-customer-search-wrap { position: relative; }
.pos-customer-search-wrap span {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--brand-dark);
    font-weight: 900;
}
.pos-customer-search-wrap input {
    width: 100%;
    min-height: 48px;
    border: 1px solid var(--border);
    border-radius: 6px;
    background: var(--card);
    color: var(--text);
    padding: 0 12px 0 40px;
    font-size: 16px;
    outline: none;
}
.pos-customer-search-wrap input:focus {
    border-color: var(--brand);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand) 18%, transparent);
}
.pos-customer-list {
    flex: 1;
    overflow: auto;
    background: var(--card);
}
.pos-customer-lookup-row {
    width: 100%;
    min-height: 94px;
    display: grid;
    grid-template-columns: minmax(135px, .55fr) minmax(190px, .9fr) minmax(190px, .9fr) minmax(140px, .7fr) 56px;
    align-items: center;
    gap: 16px;
    padding: 14px 16px;
    border: 0;
    border-bottom: 1px solid var(--border);
    background: var(--card);
    color: var(--text);
    text-align: left;
    cursor: pointer;
}
.pos-customer-lookup-row:hover,
.pos-customer-lookup-row:focus {
    background: color-mix(in srgb, var(--soft) 38%, var(--card));
    outline: none;
}
.pos-customer-lookup-row strong { font-weight: 950; text-transform: uppercase; }
.pos-customer-lookup-row span,
.pos-customer-lookup-row em { font-style: normal; color: var(--text); line-height: 1.45; }
.pos-customer-lookup-row em { text-align: right; font-weight: 800; color: var(--muted); }
.pos-customer-lookup-row b {
    justify-self: end;
    width: 48px;
    height: 48px;
    display: grid;
    place-items: center;
    border: 1px solid var(--border);
    border-radius: 6px;
    background: color-mix(in srgb, var(--card) 88%, var(--bg));
    font-size: 20px;
}
.pos-customer-empty { padding: 26px; color: var(--muted); font-weight: 800; text-align: center; }
.pos-customer-footer {
    padding: 14px 16px;
    border-top: 1px solid var(--border);
    background: var(--card);
}
.pos-customer-footer button {
    width: 100%;
    min-height: 50px;
    border: 1px solid var(--border);
    border-radius: 6px;
    background: color-mix(in srgb, var(--card) 90%, var(--bg));
    color: var(--text);
    font-weight: 900;
    cursor: pointer;
}

.pos-payment-touch-modal { width: min(960px, 96vw); max-height: min(780px, 94vh); }
.pos-payment-touch-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
    padding: 12px 16px;
}
.pos-payment-touch-summary div {
    display: grid;
    gap: 4px;
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 10px 12px;
    background: color-mix(in srgb, var(--soft) 38%, var(--card));
}
.pos-payment-touch-summary span { color: var(--muted); font-weight: 900; }
.pos-payment-touch-summary strong { font-size: 20px; color: var(--text); text-align: left; }
.pos-payment-touch-body {
    display: grid;
    grid-template-columns: minmax(310px, .95fr) minmax(310px, 1fr);
    gap: 14px;
    padding: 14px 16px 16px;
    min-height: 0;
    overflow: auto;
}
.pos-payment-left,
.pos-payment-right { min-width: 0; }
.pos-payment-method-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 10px;
    margin-bottom: 12px;
}
.pos-payment-method-tile {
    min-height: 64px;
    border: 1px solid var(--border);
    border-radius: 14px;
    background: color-mix(in srgb, var(--card) 86%, var(--bg));
    color: var(--text);
    font-weight: 950;
    cursor: pointer;
}
.pos-payment-method-tile.active,
.pos-payment-method-tile:hover,
.pos-payment-method-tile:focus {
    background: var(--brand);
    border-color: var(--brand);
    color: #fff;
    outline: none;
}
.pos-payment-lines-list {
    display: grid;
    gap: 8px;
    max-height: 285px;
    overflow: auto;
}
.pos-payment-line-row {
    min-height: 52px;
    display: grid;
    grid-template-columns: 1fr auto 38px;
    align-items: center;
    gap: 10px;
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 8px 10px;
    background: color-mix(in srgb, var(--card) 90%, var(--bg));
}
.pos-payment-line-row strong { font-weight: 950; }
.pos-payment-line-row span { font-weight: 900; color: var(--brand-dark); }
.pos-payment-empty {
    border: 1px dashed var(--border);
    border-radius: 12px;
    padding: 18px;
    color: var(--muted);
    font-weight: 800;
    text-align: center;
}
.pos-payment-amount-label {
    display: block;
    margin-bottom: 6px;
    color: var(--muted);
    font-weight: 900;
}
.pos-payment-amount-display {
    min-height: 68px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding: 0 18px;
    border: 1px solid var(--border);
    border-radius: 14px;
    background: color-mix(in srgb, var(--card) 90%, var(--bg));
    color: var(--text);
    font-size: 30px;
    font-weight: 950;
    letter-spacing: .02em;
}
.pos-payment-keypad {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
    margin-top: 10px;
}
.pos-payment-keypad button {
    min-height: 62px;
    border: 1px solid var(--border);
    border-radius: 14px;
    background: color-mix(in srgb, var(--card) 88%, var(--bg));
    color: var(--text);
    font-size: 22px;
    font-weight: 950;
    cursor: pointer;
}
.pos-payment-keypad button:hover,
.pos-payment-keypad button:focus {
    background: color-mix(in srgb, var(--brand) 16%, var(--card));
    outline: none;
}
.pos-payment-touch-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin-top: 10px;
}
.pos-payment-touch-actions .pos-payment-btn {
    grid-column: 1 / -1;
    margin: 0;
}
.pos-payment-touch-actions .pos-save-btn { min-height: 52px; }

body.theme-dark .pos-action-tile,
body.theme-midnight .pos-action-tile,
body.theme-carbon .pos-action-tile,
body.theme-dark .pos-customer-lookup-row,
body.theme-midnight .pos-customer-lookup-row,
body.theme-carbon .pos-customer-lookup-row,
body.theme-dark .pos-payment-method-tile,
body.theme-midnight .pos-payment-method-tile,
body.theme-carbon .pos-payment-method-tile,
body.theme-dark .pos-payment-keypad button,
body.theme-midnight .pos-payment-keypad button,
body.theme-carbon .pos-payment-keypad button,
body.theme-dark .pos-payment-amount-display,
body.theme-midnight .pos-payment-amount-display,
body.theme-carbon .pos-payment-amount-display {
    background: color-mix(in srgb, var(--card) 86%, #000) !important;
    color: var(--text) !important;
}
body.theme-dark .pos-payment-method-tile.active,
body.theme-midnight .pos-payment-method-tile.active,
body.theme-carbon .pos-payment-method-tile.active {
    background: var(--brand) !important;
    color: #fff !important;
}
body.theme-dark .pos-payment-line-row span,
body.theme-midnight .pos-payment-line-row span,
body.theme-carbon .pos-payment-line-row span {
    color: #fff !important;
}

@media (max-width: 820px) {
    .pos-action-grid { grid-template-columns: 1fr; }
    .pos-customer-lookup-head { grid-template-columns: 1fr; }
    .pos-customer-lookup-row { grid-template-columns: 1fr; }
    .pos-customer-lookup-row em { text-align: left; }
    .pos-payment-touch-summary { grid-template-columns: 1fr; }
    .pos-payment-touch-body { grid-template-columns: 1fr; }
}

/* POS/global notification readability fix: force toast contrast in all themes, especially dark POS. */
.erp-toast-host {
    z-index: 99999 !important;
}
.erp-toast,
body.theme-dark .erp-toast,
body.theme-midnight .erp-toast,
body.theme-carbon .erp-toast {
    background: #ffffff !important;
    border: 1px solid rgba(15,23,42,.18) !important;
    color: #0f172a !important;
    box-shadow: 0 20px 50px rgba(0,0,0,.42) !important;
    text-shadow: none !important;
}
.erp-toast .erp-toast-message,
body.theme-dark .erp-toast .erp-toast-message,
body.theme-midnight .erp-toast .erp-toast-message,
body.theme-carbon .erp-toast .erp-toast-message,
.erp-toast .erp-toast-icon,
body.theme-dark .erp-toast .erp-toast-icon,
body.theme-midnight .erp-toast .erp-toast-icon,
body.theme-carbon .erp-toast .erp-toast-icon {
    color: inherit !important;
    opacity: 1 !important;
    text-shadow: none !important;
}
.erp-toast .erp-toast-close,
body.theme-dark .erp-toast .erp-toast-close,
body.theme-midnight .erp-toast .erp-toast-close,
body.theme-carbon .erp-toast .erp-toast-close {
    color: inherit !important;
    opacity: 1 !important;
}
.erp-toast.error,
.erp-toast.delete,
body.theme-dark .erp-toast.error,
body.theme-dark .erp-toast.delete,
body.theme-midnight .erp-toast.error,
body.theme-midnight .erp-toast.delete,
body.theme-carbon .erp-toast.error,
body.theme-carbon .erp-toast.delete {
    background: #dc2626 !important;
    border-color: #991b1b !important;
    color: #ffffff !important;
}
.erp-toast.error .erp-toast-close,
.erp-toast.delete .erp-toast-close,
body.theme-dark .erp-toast.error .erp-toast-close,
body.theme-dark .erp-toast.delete .erp-toast-close,
body.theme-midnight .erp-toast.error .erp-toast-close,
body.theme-midnight .erp-toast.delete .erp-toast-close,
body.theme-carbon .erp-toast.error .erp-toast-close,
body.theme-carbon .erp-toast.delete .erp-toast-close {
    background: rgba(255,255,255,.22) !important;
    color: #ffffff !important;
}
.erp-toast.warning,
body.theme-dark .erp-toast.warning,
body.theme-midnight .erp-toast.warning,
body.theme-carbon .erp-toast.warning {
    background: #f59e0b !important;
    border-color: #b45309 !important;
    color: #111827 !important;
}
.erp-toast.success,
body.theme-dark .erp-toast.success,
body.theme-midnight .erp-toast.success,
body.theme-carbon .erp-toast.success {
    background: #16a34a !important;
    border-color: #166534 !important;
    color: #ffffff !important;
}
.erp-toast.info,
.erp-toast.modify,
body.theme-dark .erp-toast.info,
body.theme-dark .erp-toast.modify,
body.theme-midnight .erp-toast.info,
body.theme-midnight .erp-toast.modify,
body.theme-carbon .erp-toast.info,
body.theme-carbon .erp-toast.modify {
    background: #2563eb !important;
    border-color: #1d4ed8 !important;
    color: #ffffff !important;
}

/* POS payment: show applied amount, received cash and return/change clearly. */
.pos-payment-change-note {
    display: block;
    margin-top: 4px;
    font-size: .72rem;
    line-height: 1.2;
    opacity: .82;
    font-weight: 800;
}
body.theme-dark .pos-payment-change-note,
body.theme-midnight .pos-payment-change-note,
body.theme-carbon .pos-payment-change-note {
    color: #ffffff;
    opacity: .88;
}

/* POS payment terminal integration */
.pos-terminal-method-tile {
    border-style: dashed;
}
.pos-terminal-send-btn {
    border-color: #0ea5e9 !important;
    background: linear-gradient(135deg, rgba(14,165,233,.12), rgba(14,165,233,.04)) !important;
}
.pos-terminal-send-btn:hover,
.pos-terminal-send-btn:focus {
    background: #0ea5e9 !important;
    color: #fff !important;
}
.pos-terminal-send-btn:disabled {
    opacity: .75;
    cursor: wait;
}
body.theme-dark .pos-terminal-send-btn,
body.theme-midnight .pos-terminal-send-btn,
body.theme-carbon .pos-terminal-send-btn {
    color: #ffffff !important;
    background: #102033 !important;
    border-color: #38bdf8 !important;
}
body.theme-dark .pos-terminal-send-btn:hover,
body.theme-midnight .pos-terminal-send-btn:hover,
body.theme-carbon .pos-terminal-send-btn:hover,
body.theme-dark .pos-terminal-send-btn:focus,
body.theme-midnight .pos-terminal-send-btn:focus,
body.theme-carbon .pos-terminal-send-btn:focus {
    background: #0ea5e9 !important;
    color: #ffffff !important;
}


.pos-wallet-method-tile {
    font-weight: 800;
    letter-spacing: .01em;
}

.pos-wallet-method-tile[data-wallet-method="Apple Pay"] {
    background: linear-gradient(135deg, #111827, #374151);
    color: #ffffff;
}

.pos-wallet-method-tile[data-wallet-method="Google Pay"] {
    background: linear-gradient(135deg, #ffffff, #e5e7eb);
    color: #111827;
}

.pos-wallet-send-btn {
    background: linear-gradient(135deg, #7c3aed, #2563eb) !important;
    color: #ffffff !important;
    border: 0 !important;
}

.pos-wallet-send-btn:disabled {
    opacity: .65;
}

.pos-wallet-qr-panel {
    margin-top: .75rem;
    padding: .85rem;
    border-radius: 1rem;
    border: 1px solid var(--border-color, #d1d5db);
    background: rgba(255,255,255,.92);
    display: grid;
    gap: .5rem;
    justify-items: center;
    color: #111827;
}

.pos-wallet-qr-panel[hidden] { display: none !important; }

.pos-wallet-qr-head {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
}

.pos-wallet-qr-head span {
    padding: .25rem .55rem;
    border-radius: 999px;
    background: #16a34a;
    color: #ffffff;
    font-size: .78rem;
    font-weight: 700;
}

.pos-wallet-qr-panel canvas {
    border-radius: .75rem;
    padding: .35rem;
    background: #ffffff;
    box-shadow: 0 8px 20px rgba(15,23,42,.16);
}

.pos-wallet-qr-panel small {
    width: 100%;
    word-break: break-all;
    color: #374151;
    text-align: center;
}

body.theme-dark .pos-wallet-qr-panel,
body.theme-midnight .pos-wallet-qr-panel,
body.theme-carbon .pos-wallet-qr-panel {
    background: #111827;
    color: #f9fafb;
    border-color: rgba(255,255,255,.18);
}

body.theme-dark .pos-wallet-qr-panel small,
body.theme-midnight .pos-wallet-qr-panel small,
body.theme-carbon .pos-wallet-qr-panel small {
    color: #e5e7eb;
}


/* POS QR panel and payment gateway setup */
.pos-payment-touch-modal { overflow: hidden; }
.pos-payment-touch-body { overflow: hidden; align-items: stretch; }
.pos-payment-left { display: grid; grid-template-rows: auto auto 1fr; gap: 10px; }
.pos-payment-lines-list { max-height: 210px; }
.pos-wallet-qr-panel {
    margin-top: 0;
    min-height: 220px;
    align-content: start;
}
.pos-wallet-qr-body {
    width: 100%;
    display: grid;
    grid-template-columns: 168px 1fr;
    gap: 12px;
    align-items: center;
}
.pos-wallet-qr-details {
    width: 100%;
    display: grid;
    gap: 8px;
}
.pos-wallet-qr-details div {
    display: grid;
    gap: 3px;
    padding: 8px 10px;
    border-radius: 12px;
    border: 1px solid rgba(148,163,184,.25);
    background: rgba(255,255,255,.55);
    text-align: left;
}
.pos-wallet-qr-details label {
    font-size: .72rem;
    font-weight: 900;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: .03em;
}
.pos-wallet-qr-details strong {
    font-size: .94rem;
    color: #111827;
    word-break: break-word;
}
body.theme-dark .pos-wallet-qr-details div,
body.theme-midnight .pos-wallet-qr-details div,
body.theme-carbon .pos-wallet-qr-details div {
    background: rgba(17,24,39,.92);
    border-color: rgba(255,255,255,.12);
}
body.theme-dark .pos-wallet-qr-details label,
body.theme-midnight .pos-wallet-qr-details label,
body.theme-carbon .pos-wallet-qr-details label {
    color: #9ca3af;
}
body.theme-dark .pos-wallet-qr-details strong,
body.theme-midnight .pos-wallet-qr-details strong,
body.theme-carbon .pos-wallet-qr-details strong {
    color: #f9fafb;
}
@media (max-width: 820px) {
    .pos-wallet-qr-body { grid-template-columns: 1fr; justify-items: center; }
}
.gateway-setup-page .gateway-setup-form { display: grid; gap: 18px; }
.gateway-form-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(220px, 1fr));
    gap: 14px;
}
.gateway-form-grid label,
.gateway-toggle {
    display: grid;
    gap: 8px;
    font-weight: 800;
    color: var(--text);
}
.gateway-form-grid label span { color: var(--muted); font-size: .9rem; }
.gateway-form-grid input,
.gateway-form-grid select,
.gateway-form-grid textarea {
    width: 100%;
    min-height: 46px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: var(--card);
    color: var(--text);
    padding: 10px 12px;
    font-weight: 700;
    outline: none;
}
.gateway-form-grid textarea { min-height: 110px; resize: vertical; }
.gateway-form-grid input:focus,
.gateway-form-grid select:focus,
.gateway-form-grid textarea:focus {
    border-color: var(--brand);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand) 18%, transparent);
}
.gateway-span-2 { grid-column: span 2; }
.gateway-span-3 { grid-column: span 3; }
.gateway-toggle-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(180px, 1fr));
    gap: 12px;
}
.gateway-toggle {
    min-height: 54px;
    align-items: center;
    grid-template-columns: auto 1fr;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: color-mix(in srgb, var(--card) 88%, var(--bg));
    padding: 0 14px;
}
.gateway-form-actions { display: flex; justify-content: flex-end; }
@media (max-width: 900px) {
    .gateway-form-grid, .gateway-toggle-grid { grid-template-columns: 1fr; }
    .gateway-span-2, .gateway-span-3 { grid-column: auto; }
}


/* Dashboard direct quick access for payment gateway setup */
.quick-access-route {
    display: inline-block;
    margin-top: 6px;
    padding: 4px 8px;
    border-radius: 8px;
    background: color-mix(in srgb, var(--brand) 10%, var(--card));
    color: var(--brand-dark);
    font-weight: 900;
}
.gateway-quick-access-card {
    border-color: color-mix(in srgb, var(--brand) 42%, var(--border));
    box-shadow: 0 14px 36px color-mix(in srgb, var(--brand) 14%, transparent);
}
body.theme-dark .quick-access-route,
body.theme-midnight .quick-access-route,
body.theme-carbon .quick-access-route {
    color: #fff;
    background: color-mix(in srgb, var(--brand) 30%, var(--card));
}


.gateway-provider-guide {
    display: grid;
    gap: 8px;
    margin-bottom: 18px;
    padding: 14px;
    border: 1px solid var(--border);
    border-radius: 14px;
    background: color-mix(in srgb, var(--soft) 34%, var(--card));
}
.gateway-provider-guide strong {
    font-size: 1rem;
    color: var(--text);
}
.gateway-provider-guide div {
    display: grid;
    grid-template-columns: 180px 1fr;
    gap: 10px;
    align-items: start;
}
.gateway-provider-guide span {
    font-weight: 950;
    color: var(--brand-dark);
}
.gateway-provider-guide em {
    font-style: normal;
    color: var(--muted);
    font-weight: 700;
}
body.theme-dark .gateway-provider-guide span,
body.theme-midnight .gateway-provider-guide span,
body.theme-carbon .gateway-provider-guide span { color: var(--text); }
@media (max-width: 700px) {
    .gateway-provider-guide div { grid-template-columns: 1fr; }
}


/* POS orders lookup: smooth AJAX search with paging */
.pos-orders-pager {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 16px;
    border-top: 1px solid var(--border);
    background: color-mix(in srgb, var(--soft) 36%, var(--card));
}
.pos-orders-pager button {
    min-width: 110px;
    min-height: 40px;
    border-radius: 10px;
    border: 1px solid var(--border);
    background: color-mix(in srgb, var(--card) 88%, var(--bg));
    color: var(--text);
    font-weight: 900;
    cursor: pointer;
}
.pos-orders-pager button:not(:disabled):hover,
.pos-orders-pager button:not(:disabled):focus {
    background: var(--brand);
    color: #fff;
    border-color: var(--brand);
    outline: none;
}
.pos-orders-pager button:disabled {
    opacity: .45;
    cursor: not-allowed;
}
.pos-orders-pager span {
    color: var(--muted);
    font-weight: 900;
    text-align: center;
}
body.theme-dark .pos-orders-pager,
body.theme-midnight .pos-orders-pager,
body.theme-carbon .pos-orders-pager {
    background: color-mix(in srgb, var(--card) 86%, #000);
}
body.theme-dark .pos-orders-pager button,
body.theme-midnight .pos-orders-pager button,
body.theme-carbon .pos-orders-pager button {
    color: var(--text);
    background: color-mix(in srgb, var(--card) 88%, #000);
}


/* POS ticket number should stay on one line, e.g. DN2606-47. */
.pos-ticket-no {
    white-space: nowrap !important;
    word-break: keep-all !important;
    overflow-wrap: normal !important;
    min-width: max-content !important;
    flex: 0 0 auto !important;
    letter-spacing: -.01em;
}


/* POS action button moved next to Note so invoice number remains visible. */
.pos-customer-row .pos-action-menu-btn {
    min-width: 98px;
    white-space: nowrap;
}
.pos-tabs .pos-ticket-no {
    margin-left: auto;
}
.pos-payment-status-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 82px;
    padding: 4px 8px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 950;
    white-space: nowrap;
    border: 1px solid var(--border);
    background: color-mix(in srgb, var(--soft) 78%, var(--card));
    color: var(--text);
}
.pos-payment-status-badge.paid {
    background: #19a83a;
    border-color: #15803d;
    color: #fff;
}
.pos-payment-status-badge.partial-paid,
.pos-payment-status-badge.partially-paid {
    background: #f5a400;
    border-color: #d97706;
    color: #111827;
}
.pos-payment-status-badge.un-paid {
    background: #ef4444;
    border-color: #dc2626;
    color: #fff;
}
.pos-payment-status-badge.on-account {
    background: #d1d5db;
    border-color: #9ca3af;
    color: #111827;
}
body.theme-dark .pos-payment-status-badge.paid,
body.theme-midnight .pos-payment-status-badge.paid,
body.theme-carbon .pos-payment-status-badge.paid,
body.theme-dark .pos-payment-status-badge.un-paid,
body.theme-midnight .pos-payment-status-badge.un-paid,
body.theme-carbon .pos-payment-status-badge.un-paid {
    color: #fff;
}
body.theme-dark .pos-payment-status-badge.partial-paid,
body.theme-dark .pos-payment-status-badge.partially-paid,
body.theme-dark .pos-payment-status-badge.on-account,
body.theme-midnight .pos-payment-status-badge.partial-paid,
body.theme-midnight .pos-payment-status-badge.partially-paid,
body.theme-midnight .pos-payment-status-badge.on-account,
body.theme-carbon .pos-payment-status-badge.partial-paid,
body.theme-carbon .pos-payment-status-badge.partially-paid,
body.theme-carbon .pos-payment-status-badge.on-account {
    color: #111827;
}


/* POS More Action compact icon */
.pos-customer-row .pos-action-menu-btn {
    min-width: 44px;
    width: 44px;
    padding: 0;
    font-size: 22px;
    font-weight: 950;
    line-height: 1;
    text-align: center;
}


/* POS On Account / credit sale payment option */
.pos-payment-method-tile[data-payment-method="On Account"],
.pos-pay-chip[data-payment="On Account"] {
    background: #e5e7eb !important;
    color: #111827 !important;
    border-color: #9ca3af !important;
}
.pos-payment-method-tile[data-payment-method="On Account"].active,
.pos-payment-method-tile[data-payment-method="On Account"]:hover,
.pos-pay-chip[data-payment="On Account"].active,
.pos-pay-chip[data-payment="On Account"]:hover {
    background: #9ca3af !important;
    color: #111827 !important;
}

/* Stock Items master list - Odoo style, based on VB.NET StockItems.vb */
.stock-items-page { display: grid; gap: 14px; min-width: 0; max-width: 100%; }
.stock-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}
.stock-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.stock-page-size { display: flex; align-items: center; gap: 8px; font-weight: 900; color: var(--text); }
.stock-page-size select,
.stock-filter-grid input,
.stock-filter-grid select {
    min-height: 40px;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: var(--card);
    color: var(--text);
    padding: 0 10px;
    font-weight: 700;
    outline: none;
}
.stock-filter-grid input:focus,
.stock-filter-grid select:focus,
.stock-page-size select:focus {
    border-color: var(--brand);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand) 18%, transparent);
}
.stock-filter-card {
    border: 1px solid var(--border);
    border-radius: 16px;
    background: color-mix(in srgb, var(--card) 92%, var(--bg));
    padding: 14px;
    display: grid;
    gap: 12px;
}
.stock-filter-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(160px, 1fr));
    gap: 10px;
}
.stock-filter-grid label { display: grid; gap: 5px; }
.stock-filter-grid label span { color: var(--muted); font-weight: 900; font-size: .82rem; }
.stock-check-row { display: flex; gap: 14px; flex-wrap: wrap; align-items: center; }
.stock-check-row label { display: flex; align-items: center; gap: 7px; font-weight: 800; color: var(--text); }
.stock-grid-shell {
    min-width: 0;
    max-width: 100%;
    border: 1px solid var(--border);
    border-radius: 16px;
    overflow: hidden;
    background: var(--card);
    box-shadow: 0 18px 45px rgba(15,23,42,.06);
}
#stockItemsGridHost.loading { opacity: .72; }
.stock-grid-summary {
    min-height: 46px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 14px;
    border-bottom: 1px solid var(--border);
    background: color-mix(in srgb, var(--soft) 55%, var(--card));
    font-weight: 900;
    color: var(--text);
}
.stock-grid-wrap { width: 100%; max-width: 100%; overflow: auto; max-height: calc(100vh - 330px); min-height: 280px; }
.stock-items-grid { width: 100%; border-collapse: collapse; font-size: 13px; }
.stock-items-grid th,
.stock-items-grid td { padding: 9px 10px; border-bottom: 1px solid var(--border); white-space: nowrap; vertical-align: middle; }
.stock-items-grid th {
    position: sticky;
    top: 0;
    z-index: 2;
    background: color-mix(in srgb, var(--brand) 14%, var(--soft));
    color: var(--brand-dark);
    font-weight: 950;
    text-align: left;
}
.stock-items-grid tbody tr { cursor: pointer; }
.stock-items-grid tbody tr:hover { background: color-mix(in srgb, var(--soft) 48%, transparent); }
.stock-items-grid tbody tr.selected { background: color-mix(in srgb, var(--brand) 22%, var(--card)); outline: 2px solid var(--brand); outline-offset: -2px; }
.stock-items-grid tbody tr.deactivated { background: color-mix(in srgb, #dc2626 5%, var(--card)); }
.stock-name-cell { min-width: 310px; white-space: normal !important; }
.stock-name-cell strong { display: block; font-weight: 950; }
.stock-name-cell small,
.stock-name-cell em { display: inline-block; margin-right: 8px; color: var(--muted); font-style: normal; font-weight: 700; }
.stock-items-grid .num { text-align: right; font-variant-numeric: tabular-nums; }
.stock-status { display: inline-flex; align-items: center; justify-content: center; min-width: 86px; border-radius: 999px; padding: 4px 9px; font-size: 12px; font-weight: 950; }
.stock-status.active { background: #16a34a; color: #fff; }
.stock-status.inactive { background: #dc2626; color: #fff200; }
.stock-image-cell { width: 76px; text-align: center; }
.stock-image-cell img,
.stock-image-cell span { width: 56px; height: 56px; border-radius: 12px; display: inline-grid; place-items: center; object-fit: cover; background: var(--soft); color: var(--brand-dark); font-weight: 950; }
.stock-pager {
    display: flex;
    gap: 8px;
    align-items: center;
    justify-content: flex-end;
    padding: 11px 14px;
    border-top: 1px solid var(--border);
    background: color-mix(in srgb, var(--soft) 40%, var(--card));
}
.stock-pager button {
    min-height: 36px;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: var(--card);
    color: var(--text);
    padding: 0 12px;
    font-weight: 900;
    cursor: pointer;
}
.stock-pager button:not(:disabled):hover { background: var(--brand); color: #fff; border-color: var(--brand); }
.stock-pager button:disabled { opacity: .5; cursor: not-allowed; }
.empty-cell { text-align: center; padding: 26px !important; color: var(--muted); font-weight: 900; }
body.theme-dark .stock-grid-shell,
body.theme-midnight .stock-grid-shell,
body.theme-carbon .stock-grid-shell,
body.theme-dark .stock-filter-card,
body.theme-midnight .stock-filter-card,
body.theme-carbon .stock-filter-card {
    background: color-mix(in srgb, var(--card) 90%, #000);
}
body.theme-dark .stock-items-grid th,
body.theme-midnight .stock-items-grid th,
body.theme-carbon .stock-items-grid th { color: var(--text); }
@media (max-width: 1100px) { .stock-filter-grid { grid-template-columns: repeat(2, minmax(160px, 1fr)); } }
@media (max-width: 640px) { .stock-filter-grid { grid-template-columns: 1fr; } .stock-toolbar { align-items: stretch; } .stock-actions { width: 100%; } }
@media print {
    .stock-items-topbar, .stock-toolbar, .stock-filter-card, .stock-pager, .sidebar, .topbar .user-panel { display: none !important; }
    .stock-grid-wrap { max-height: none; overflow: visible; }
    .stock-grid-shell { border: 0; box-shadow: none; }
    .stock-items-grid th { position: static; }
}

/* Odoo-style Product / Stock Items page */
.odoo-products-page {
    gap: 10px;
    padding-top: 0;
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
}
.odoo-product-topbar {
    min-height: 58px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--border);
}
.odoo-product-title {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
}
.odoo-product-title h1 {
    margin: 0;
    font-size: 22px;
    line-height: 1;
}
.odoo-product-title .stock-path {
    color: var(--muted);
    font-size: 12px;
    font-weight: 800;
    margin-left: 6px;
}
.odoo-new-btn {
    min-height: 38px;
    padding: 0 14px;
    border-radius: 5px;
    background: var(--brand) !important;
    color: #fff !important;
    font-weight: 900;
}
.odoo-products-controlbar {
    display: grid;
    grid-template-columns: minmax(320px, 1fr) auto;
    gap: 12px;
    align-items: center;
    padding: 8px 0;
    min-width: 0;
}
.odoo-product-searchbar {
    display: flex;
    align-items: center;
    min-height: 42px;
    border: 1px solid var(--border);
    border-radius: 7px;
    background: var(--card);
    overflow: hidden;
    max-width: 680px;
    min-width: 0;
    justify-self: stretch;
    width: 100%;
}
.odoo-product-searchbar:focus-within {
    border-color: var(--brand);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand) 14%, transparent);
}
.odoo-product-searchbar .search-icon {
    width: 42px;
    display: grid;
    place-items: center;
    font-weight: 950;
    font-size: 20px;
    color: var(--text);
}
.odoo-product-searchbar .search-chip {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 0 12px;
    border-radius: 4px;
    background: color-mix(in srgb, var(--brand) 86%, var(--card));
    color: #fff;
    font-weight: 900;
    margin-right: 4px;
}
.odoo-product-searchbar input {
    flex: 1;
    min-width: 80px;
    border: 0;
    outline: 0;
    background: transparent;
    color: var(--text);
    font-size: 15px;
    min-height: 40px;
}
.search-clear {
    width: 36px;
    border: 0;
    background: transparent;
    color: var(--muted);
    font-size: 22px;
    cursor: pointer;
}
.odoo-products-tools {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 6px;
    min-width: 0;
    max-width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    white-space: nowrap;
}
.odoo-tool-btn,
.odoo-page-btn,
.odoo-view-btn {
    min-width: 38px;
    height: 38px;
    border: 1px solid var(--border);
    border-radius: 5px;
    background: color-mix(in srgb, var(--card) 88%, var(--bg));
    color: var(--text);
    font-weight: 950;
    cursor: pointer;
}
.odoo-page-btn:disabled {
    opacity: .45;
    cursor: default;
}
.odoo-view-btn.active {
    border-color: var(--brand);
    box-shadow: inset 0 0 0 1px var(--brand);
    background: color-mix(in srgb, var(--brand) 10%, var(--card));
}
.stock-range {
    padding: 0 8px;
    font-weight: 800;
    color: var(--text);
}
.stock-column-picker { position: relative; }
.stock-column-menu {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    z-index: 50;
    width: 255px;
    max-height: min(520px, 78vh);
    overflow: auto;
    border: 1px solid var(--border);
    border-radius: 4px;
    background: var(--card);
    color: var(--text);
    box-shadow: 0 18px 45px rgba(15,23,42,.18);
    padding: 10px 0;
}
.stock-column-menu label,
.stock-column-add {
    min-height: 36px;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 0 18px;
    font-weight: 750;
    cursor: pointer;
}
.stock-column-menu label:hover,
.stock-column-add:hover { background: color-mix(in srgb, var(--soft) 42%, transparent); }
.stock-column-menu input {
    width: 18px;
    height: 18px;
    accent-color: var(--brand);
}
.stock-column-add {
    border-top: 1px solid var(--border);
    margin-top: 8px;
    padding-top: 8px;
    color: var(--brand-dark);
}
.odoo-advanced-filters[hidden] { display: none !important; }
.odoo-advanced-filters {
    margin-top: 0;
    border-radius: 10px;
    box-shadow: none;
}
.stock-filter-grid.compact {
    grid-template-columns: repeat(auto-fit, minmax(155px, 1fr));
}
.stock-secondary-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    min-width: 0;
    max-width: 100%;
    padding: 4px 0 8px;
}
.odoo-stock-summary {
    display: none;
}
.stock-list-view,
.stock-kanban-view { display: none; }
.odoo-products-page[data-view="list"] .stock-list-view { display: block; }
.odoo-products-page[data-view="kanban"] .stock-kanban-view { display: grid; }
.stock-list-view,
#stockItemsGridHost {
    min-width: 0;
    max-width: 100%;
}
.odoo-product-list-wrap {
    width: 100%;
    max-width: 100%;
    border: 1px solid var(--border);
    border-radius: 0;
    background: var(--card);
    overflow: auto;
}
.odoo-product-list {
    width: max-content;
    min-width: 100%;
    border-collapse: collapse;
    font-size: 15px;
}
.odoo-product-list th,
.odoo-product-list td {
    min-height: 48px;
    padding: 11px 12px;
    border-bottom: 1px solid var(--border);
    background: var(--card);
    color: var(--text);
    vertical-align: middle;
}
.odoo-product-list th {
    background: color-mix(in srgb, var(--soft) 45%, var(--card));
    font-weight: 950;
    position: sticky;
    top: 0;
    z-index: 2;
}
.odoo-product-list .select-col { width: 38px; text-align: center; }
.odoo-product-list .favorite-col {
    width: 38px;
    font-size: 22px;
    color: #64748b;
    text-align: center;
}
.product-name-th { min-width: 300px; }
.tax-pill {
    display: inline-flex;
    min-width: 40px;
    justify-content: center;
    padding: 4px 10px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--muted) 15%, var(--card));
    font-size: 13px;
    font-weight: 900;
}
.negative-stock { color: #ef4444 !important; }
.forecast-cell { font-weight: 950; }
.stock-kanban-view {
    grid-template-columns: repeat(3, minmax(260px, 1fr));
    gap: 10px 16px;
    padding: 8px 0 12px;
}
.stock-kanban-card {
    min-height: 126px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 94px;
    gap: 12px;
    align-items: start;
    border: 1px solid var(--border);
    background: var(--card);
    color: var(--text);
    padding: 12px;
    cursor: pointer;
    box-shadow: 0 1px 0 rgba(15,23,42,.03);
}
.stock-kanban-card:hover,
.stock-kanban-card.selected {
    border-color: var(--brand);
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--brand) 22%, transparent);
}
.kanban-title {
    display: flex;
    gap: 7px;
    align-items: start;
    font-size: 17px;
    line-height: 1.25;
}
.kanban-title span { color: #64748b; font-size: 20px; line-height: 1; }
.kanban-title strong { font-weight: 950; }
.kanban-code,
.kanban-line {
    margin-top: 5px;
    font-size: 14px;
    font-weight: 700;
}
.kanban-image {
    width: 86px;
    height: 86px;
    display: grid;
    place-items: center;
    justify-self: end;
    overflow: hidden;
    border-radius: 8px;
    background: color-mix(in srgb, var(--soft) 36%, var(--card));
}
.kanban-image img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}
.kanban-image span {
    width: 58px;
    height: 58px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: var(--brand);
    color: #fff;
    font-size: 24px;
    font-weight: 950;
}
.stock-empty-kanban {
    grid-column: 1 / -1;
    border: 1px dashed var(--border);
    border-radius: 10px;
    padding: 36px;
    text-align: center;
    color: var(--muted);
    font-weight: 900;
}
body.theme-dark .stock-column-menu,
body.theme-midnight .stock-column-menu,
body.theme-carbon .stock-column-menu,
body.theme-dark .odoo-product-searchbar,
body.theme-midnight .odoo-product-searchbar,
body.theme-carbon .odoo-product-searchbar,
body.theme-dark .stock-kanban-card,
body.theme-midnight .stock-kanban-card,
body.theme-carbon .stock-kanban-card,
body.theme-dark .odoo-product-list th,
body.theme-dark .odoo-product-list td,
body.theme-midnight .odoo-product-list th,
body.theme-midnight .odoo-product-list td,
body.theme-carbon .odoo-product-list th,
body.theme-carbon .odoo-product-list td {
    background: color-mix(in srgb, var(--card) 92%, #000);
    color: var(--text);
}
@media (max-width: 1100px) {
    .odoo-products-controlbar { grid-template-columns: 1fr; }
    .odoo-product-searchbar { justify-self: stretch; max-width: none; }
    .odoo-products-tools { justify-content: flex-start; flex-wrap: wrap; }
    .stock-kanban-view { grid-template-columns: repeat(2, minmax(240px, 1fr)); }
}
@media (max-width: 720px) {
    .odoo-product-topbar {
        align-items: flex-start;
        flex-direction: column;
    }
    .odoo-product-title { flex-wrap: wrap; }
    .odoo-product-title .stock-path {
        flex-basis: 100%;
        margin-left: 0;
    }
    .stock-secondary-actions {
        flex-wrap: nowrap;
        overflow-x: auto;
        padding-bottom: 10px;
    }
    .stock-secondary-actions .btn-secondary {
        flex: 0 0 auto;
    }
    .stock-kanban-view { grid-template-columns: 1fr; }
    .stock-kanban-card { grid-template-columns: 1fr 74px; }
    .kanban-image { width: 70px; height: 70px; }
}


/* Stock Items actual-column search dropdown and custom view */
.stock-custom-searchbar {
    position: relative;
    min-height: 42px;
    overflow: visible;
}
.stock-custom-searchbar .search-chip {
    white-space: nowrap;
}
.search-dropdown-btn {
    height: 100%;
    min-width: 42px;
    border: 0;
    border-left: 1px solid var(--border);
    background: color-mix(in srgb, var(--card) 88%, var(--bg));
    color: var(--text);
    font-weight: 900;
    cursor: pointer;
}
.stock-search-dropdown {
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    right: 0;
    z-index: 80;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    gap: 0;
    min-width: min(780px, 94vw);
    padding: 18px 20px;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--card);
    color: var(--text);
    box-shadow: 0 20px 55px rgba(15,23,42,.18);
}
.stock-search-dropdown[hidden] { display: none !important; }
.stock-search-column {
    display: grid;
    align-content: start;
    gap: 8px;
    padding: 0 20px;
    border-right: 1px solid var(--border);
}
.stock-search-column:last-child { border-right: 0; }
.stock-search-column h3 {
    margin: 0 0 6px;
    display: flex;
    gap: 8px;
    align-items: center;
    font-size: 1rem;
    font-weight: 950;
}
.stock-search-column button {
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: var(--text);
    text-align: left;
    padding: 7px 8px;
    font-size: .95rem;
    cursor: pointer;
}
.stock-search-column button:hover,
.stock-search-column button:focus {
    outline: none;
    background: color-mix(in srgb, var(--brand) 12%, var(--card));
}
.stock-items-grid th[data-col], .stock-items-grid td[data-col] { white-space: nowrap; }
.stock-items-grid .stock-name-cell { min-width: 280px; white-space: normal; }
.stock-column-menu label { white-space: nowrap; }
body.theme-dark .stock-search-dropdown,
body.theme-midnight .stock-search-dropdown,
body.theme-carbon .stock-search-dropdown {
    background: color-mix(in srgb, var(--card) 94%, #000);
    color: var(--text);
    border-color: rgba(255,255,255,.14);
}
body.theme-dark .search-dropdown-btn,
body.theme-midnight .search-dropdown-btn,
body.theme-carbon .search-dropdown-btn {
    background: color-mix(in srgb, var(--card) 86%, #000);
    color: var(--text);
}
@media (max-width: 980px) {
    .stock-search-dropdown { grid-template-columns: 1fr 1fr; }
    .stock-search-column:nth-child(2) { border-right: 0; }
}
@media (max-width: 640px) {
    .stock-search-dropdown { grid-template-columns: 1fr; }
    .stock-search-column { border-right: 0; border-bottom: 1px solid var(--border); padding: 12px 0; }
    .stock-search-column:last-child { border-bottom: 0; }
}


/* Stock Items searchable tags / Odoo custom search refinements */
.stock-custom-searchbar {
    min-height: 46px;
    align-items: center;
    gap: 6px;
}
.stock-search-tags {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
    max-width: 58%;
}
.stock-search-tag {
    min-height: 30px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    border: 0;
    border-radius: 6px;
    background: color-mix(in srgb, var(--brand) 82%, #0f766e);
    color: #fff;
    padding: 0 8px;
    font-weight: 800;
    cursor: pointer;
}
.stock-search-tag b {
    font-size: 16px;
    line-height: 1;
    opacity: .95;
}
.stock-custom-searchbar input#stockGlobalSearch {
    min-width: 170px;
    flex: 1 1 220px;
}
.odoo-product-search-menu {
    width: min(780px, 94vw);
    grid-template-columns: repeat(4, minmax(150px, 1fr));
}
.odoo-product-search-menu .stock-search-column button {
    text-align: left;
}
body.theme-dark .stock-search-tag,
body.theme-midnight .stock-search-tag,
body.theme-carbon .stock-search-tag {
    background: color-mix(in srgb, var(--brand) 80%, #083344) !important;
    color: #fff !important;
}
@media (max-width: 900px) {
    .stock-search-tags { max-width: 100%; }
    .odoo-product-search-menu { grid-template-columns: 1fr; }
}

@media (max-width: 720px) {
    .stock-custom-searchbar input#stockGlobalSearch {
        min-width: 120px;
    }
}

/* Desktop frmSales.vb conversion */
.sales-entry-page {
    --sales-accent: #087a8f;
    --sales-accent-dark: #075e70;
    --sales-soft: #e7f8fb;
    --sales-line: #c8e5ec;
    min-height: calc(100vh - 56px);
    color: #0b3040;
}

.sales-entry-topbar {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 12px;
}

.sales-entry-topbar h1 {
    margin: 2px 0 2px;
    font-size: 26px;
    line-height: 1.15;
    letter-spacing: 0;
}

.sales-entry-topbar p {
    margin: 0;
    color: #5e7480;
    font-size: 13px;
    font-weight: 700;
}

.sales-entry-path {
    color: var(--sales-accent-dark);
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
}

.sales-entry-actions,
.sales-grid-tools {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
}

.sales-action {
    min-height: 34px;
    border: 1px solid #b7d7df;
    border-radius: 6px;
    background: #fff;
    color: #0b3040;
    padding: 8px 12px;
    font-weight: 900;
    cursor: pointer;
    box-shadow: 0 1px 2px rgba(15, 23, 42, .05);
}

.sales-action.primary {
    background: var(--sales-accent);
    border-color: var(--sales-accent);
    color: #fff;
}

.sales-action.primary-outline {
    background: #e8fbff;
    border-color: var(--sales-accent);
    color: var(--sales-accent-dark);
}

.sales-action.small {
    min-height: 30px;
    padding: 6px 10px;
    font-size: 12px;
}

.sales-action.add-line {
    align-self: end;
    min-height: 38px;
    margin-top: 0;
    white-space: nowrap;
}

.sales-action:disabled,
.sales-action.is-busy {
    opacity: .58;
    cursor: not-allowed;
}

.sales-entry-status {
    margin-bottom: 10px;
    border-radius: 6px;
    border: 1px solid #b7d7df;
    background: #f8fdff;
    padding: 9px 12px;
    font-weight: 800;
}

.sales-entry-status.success {
    border-color: #9bd6b2;
    background: #effbf4;
    color: #126032;
}

.sales-entry-status.error {
    border-color: #f2b3b3;
    background: #fff1f1;
    color: #971d1d;
}

.sales-entry-status.tax-invoice-alert {
    border: 2px solid #dc2626;
    background: #fee2e2;
    color: #991b1b;
    box-shadow: 0 0 0 3px rgba(220, 38, 38, .12);
    font-weight: 400;
}

.sales-entry-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 330px;
    gap: 14px;
    align-items: start;
}

.sales-entry-main,
.sales-entry-side {
    min-width: 0;
    display: grid;
    gap: 12px;
}

.sales-panel {
    background: #fff;
    border: 1px solid var(--sales-line);
    border-radius: 8px;
    box-shadow: 0 10px 24px rgba(7, 94, 112, .07);
}

.sales-header-panel,
.sales-entry-strip,
.sales-grid-panel,
.sales-summary-panel,
.sales-payment-panel,
.sales-products-panel {
    padding: 12px;
}

.sales-form-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(145px, 1fr));
    gap: 10px;
}

.sales-form-grid label,
.sales-item-entry label,
.sales-payment-panel label {
    display: grid;
    gap: 4px;
    margin: 0;
    min-width: 0;
}

.sales-form-grid span,
.sales-item-entry span,
.sales-payment-panel label span {
    color: #47616d;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0;
    text-transform: uppercase;
}

.sales-input,
.sales-grid-input,
.sales-total-line input {
    width: 100%;
    min-height: 34px;
    border: 1px solid #c9dce2;
    border-radius: 6px;
    background: #fff;
    color: #0b3040;
    padding: 7px 9px;
    font: inherit;
    font-size: 13px;
}

.sales-input:focus,
.sales-grid-input:focus,
.sales-total-line input:focus {
    outline: 2px solid rgba(8, 122, 143, .16);
    border-color: var(--sales-accent);
}

.sales-input[readonly] {
    background: #f4fafc;
    font-weight: 900;
}

.sales-item-entry {
    display: grid;
    grid-template-columns: minmax(105px, .8fr) minmax(230px, 1.8fr) repeat(10, minmax(82px, 1fr)) minmax(92px, .9fr);
    gap: 8px;
    align-items: end;
}

.sales-item-entry .product-field {
    position: relative;
}

.sales-product-lookup {
    position: absolute;
    z-index: 30;
    top: calc(100% + 4px);
    left: 0;
    right: 0;
    max-height: 270px;
    overflow: auto;
    border: 1px solid #b7d7df;
    border-radius: 6px;
    background: #fff;
    box-shadow: 0 16px 34px rgba(15, 23, 42, .16);
}

.sales-product-option {
    width: 100%;
    display: grid;
    grid-template-columns: 85px minmax(0, 1fr) 74px;
    gap: 8px;
    align-items: center;
    border: 0;
    border-bottom: 1px solid #e3eef1;
    background: #fff;
    color: #0b3040;
    padding: 8px 10px;
    text-align: left;
    cursor: pointer;
}

.sales-product-option:hover,
.sales-product-option.is-active,
.sales-product-option[aria-selected="true"] {
    background: var(--sales-soft);
}

.sales-product-option.is-active,
.sales-product-option[aria-selected="true"] {
    outline: 2px solid var(--sales-accent);
    outline-offset: -2px;
}

.sales-product-option strong {
    color: var(--sales-accent-dark);
    font-size: 12px;
}

.sales-product-option span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 800;
    text-transform: none;
}

.sales-product-option b {
    text-align: right;
    font-size: 12px;
}

.sales-lookup-empty {
    padding: 14px;
    color: #647782;
    font-weight: 800;
}

.sales-grid-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
}

.sales-grid-head.compact {
    margin-bottom: 8px;
}

.sales-grid-head h2,
.sales-summary-panel h2,
.sales-payment-panel h2 {
    margin: 0;
    font-size: 15px;
    line-height: 1.2;
}

.sales-grid-head p,
.sales-grid-head span {
    margin: 2px 0 0;
    color: #647782;
    font-size: 12px;
    font-weight: 800;
}

.sales-grid-wrap {
    max-height: calc(100vh - 420px);
    min-height: 330px;
    overflow: auto;
    border: 1px solid #cde4ea;
    border-radius: 6px;
}

.sales-items-table {
    width: 100%;
    min-width: 1240px;
    border-collapse: collapse;
    table-layout: fixed;
    font-size: 13px;
}

.sales-items-table th,
.sales-items-table td {
    border-bottom: 1px solid #e1edf1;
    padding: 7px 8px;
    vertical-align: middle;
}

.sales-items-table th {
    position: sticky;
    top: 0;
    z-index: 2;
    background: #e9fbff;
    color: #0a6174;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: 0;
    text-transform: uppercase;
    white-space: nowrap;
}

.sales-items-table tbody tr {
    background: #fff;
}

.sales-items-table tbody tr:hover,
.sales-items-table tbody tr.selected {
    background: #f0fbfd;
}

.sales-items-table .stock-name {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 900;
}

.sales-items-table .center {
    text-align: center;
}

.sales-items-table .number,
.sales-grid-input.number {
    text-align: right;
}

.sales-items-table .strong {
    font-weight: 950;
}

.sales-empty-row td {
    height: 140px;
    color: #647782;
    font-weight: 900;
    text-align: center;
}

.sales-grid-input {
    min-height: 28px;
    padding: 4px 6px;
    border-radius: 4px;
    font-size: 12px;
}

.sales-summary-panel,
.sales-payment-panel,
.sales-products-panel {
    display: grid;
    gap: 9px;
}

.sales-total-line {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px;
    border-bottom: 1px solid #e5f1f4;
    padding: 6px 0;
}

.sales-total-line span {
    color: #49636e;
    font-size: 12px;
    font-weight: 900;
}

.sales-total-line strong {
    color: #0b3040;
    font-size: 14px;
    font-weight: 950;
    text-align: right;
}

.sales-total-line.input-line input {
    width: 118px;
    min-height: 28px;
    text-align: right;
}

.sales-total-line.grand {
    margin-top: 2px;
    border-top: 2px solid #b7d7df;
    border-bottom: 0;
    padding-top: 10px;
}

.sales-total-line.grand strong {
    color: var(--sales-accent-dark);
    font-size: 20px;
}

.sales-input.narration {
    min-height: 72px;
    resize: vertical;
}

.sales-payment-note {
    border-radius: 6px;
    background: #f3fbfd;
    color: #4f6771;
    padding: 8px;
    font-size: 12px;
    font-weight: 800;
}

.sales-lookup-list {
    max-height: 306px;
    overflow: auto;
    border: 1px solid #e0eef2;
    border-radius: 6px;
}

.sales-lookup-list .sales-product-option {
    grid-template-columns: 68px minmax(0, 1fr) 58px;
}

.sales-saving {
    cursor: wait;
}

@media (max-width: 1500px) {
    .sales-entry-layout {
        grid-template-columns: minmax(0, 1fr) 300px;
    }

    .sales-form-grid {
        grid-template-columns: repeat(3, minmax(145px, 1fr));
    }

    .sales-item-entry {
        grid-template-columns: repeat(6, minmax(110px, 1fr));
    }

    .sales-item-entry .product-field {
        grid-column: span 2;
    }
}

@media (max-width: 1100px) {
    .sales-entry-topbar,
    .sales-grid-head {
        align-items: stretch;
        flex-direction: column;
    }

    .sales-entry-actions,
    .sales-grid-tools {
        justify-content: flex-start;
    }

    .sales-entry-layout {
        grid-template-columns: 1fr;
    }

    .sales-entry-side {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .sales-products-panel {
        grid-column: 1 / -1;
    }

    .sales-grid-wrap {
        max-height: 460px;
    }
}

@media (max-width: 760px) {
    .sales-entry-topbar h1 {
        font-size: 22px;
    }

    .sales-form-grid,
    .sales-item-entry,
    .sales-entry-side {
        grid-template-columns: 1fr;
    }

    .sales-item-entry .product-field {
        grid-column: auto;
    }

    .sales-action {
        width: 100%;
    }
}

/* Odoo-style document layout for MVC POS ( SALES ). */
.sales-entry-page {
    --sales-odoo-purple: var(--theme-primary, var(--brand, #714b67));
    --sales-odoo-border: var(--border-color, #d8dadd);
    --sales-odoo-muted: var(--muted, #6b7280);
    --sales-odoo-ink: var(--text, #111827);
    --sales-odoo-link: var(--theme-primary, #017e84);
    background: var(--bg, #f8f9fa);
    color: var(--sales-odoo-ink);
}

.sales-odoo-mini {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    min-height: 42px;
    padding: 4px 0 8px;
}

.sales-mini-left {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    min-width: 0;
}

.sales-mini-document {
    min-width: 0;
}

.sales-mini-new {
    min-height: 28px;
    border: 1px solid #bfc3c7;
    border-radius: 2px;
    background: #fff;
    color: #111827;
    padding: 3px 9px;
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
}

.sales-mini-link {
    display: block;
    color: var(--sales-odoo-link);
    font-size: 12px;
    font-weight: 800;
    line-height: 1.1;
}

.sales-odoo-mini span {
    display: block;
    color: #111827;
    font-size: 12px;
    line-height: 1.15;
}

.sales-mini-company {
    margin-left: auto;
    max-width: min(42vw, 420px);
    text-align: right;
    color: var(--sales-odoo-ink);
    padding-right: 4px;
}

.sales-mini-company span {
    color: var(--sales-odoo-muted);
    font-size: 11px;
    font-weight: 800;
    text-transform: none;
}

.sales-mini-company strong {
    display: block;
    margin-top: 2px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 17px;
    font-weight: 700;
    line-height: 1.15;
}

.sales-odoo-actionbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    min-height: 42px;
    margin: 0 -28px;
    padding: 6px 28px;
    border-top: 1px solid var(--sales-odoo-border);
    border-bottom: 1px solid var(--sales-odoo-border);
    background: #f1f2f4;
}

.sales-odoo-actionbar .sales-entry-actions {
    justify-content: flex-start;
}

.sales-odoo-actionbar .sales-action,
.sales-line-links button,
.sales-summary-buttons button {
    min-height: 28px;
    border: 1px solid #d6d9dd;
    border-radius: 3px;
    background: #eceef1;
    color: #111827;
    padding: 5px 10px;
    box-shadow: none;
    font-size: 12px;
    font-weight: 800;
}

.sales-odoo-actionbar .sales-action.primary {
    border-color: var(--sales-odoo-purple);
    background: var(--sales-odoo-purple);
    color: #fff;
}

.sales-odoo-actionbar .sales-action.payment {
    border-color: #178d93;
    background: #e7f7f8;
    color: #075f66;
}

.sales-odoo-actionbar .sales-action.display {
    border-color: color-mix(in srgb, var(--sales-odoo-purple) 34%, #d6d9dd);
    background: color-mix(in srgb, var(--sales-odoo-purple) 9%, #fff);
    color: var(--sales-odoo-purple);
}

.sales-odoo-actionbar .sales-action.display:hover {
    background: color-mix(in srgb, var(--sales-odoo-purple) 15%, #fff);
}

.sales-odoo-actionbar .sales-action.payment:hover {
    background: #d5f0f2;
}

.sales-odoo-actionbar .sales-action.danger {
    border-color: #f1d4d4;
    color: #991b1b;
}

.sales-odoo-actionbar .sales-action.danger:hover {
    background: #fef2f2;
}

.sales-statusbar {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    min-width: 650px;
}

.sales-statusbar span {
    position: relative;
    min-width: 108px;
    height: 28px;
    display: grid;
    place-items: center;
    border: 1px solid var(--sales-odoo-border);
    border-left: 0;
    background: #e9ebef;
    color: #6b7280;
    font-size: 12px;
    font-weight: 800;
}

.sales-statusbar span:first-child {
    border-left: 1px solid var(--sales-odoo-border);
}

.sales-statusbar span.active {
    border-color: #27898f;
    background: #fff;
    color: #111827;
}

.sales-statusbar span[data-sales-status-step="Cancelled"].active {
    border-color: #dc2626;
    background: #fef2f2;
    color: #991b1b;
}

.sales-statusbar span[data-sales-status-step="Partial Paid"].active {
    border-color: #d97706;
    background: #fffbeb;
    color: #92400e;
}

.sales-statusbar span[data-sales-status-step="Paid"].active {
    border-color: #16a34a;
    background: #ecfdf5;
    color: #166534;
}

.sales-statusbar span[data-sales-status-step="Delivered"].active {
    border-color: var(--theme-primary, var(--brand, #714b67));
    background: color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 9%, #fff);
    color: var(--theme-primary, var(--brand, #714b67));
}

.sales-order-cancelled .sales-odoo-sheet {
    border-color: #f1d4d4;
}

.sales-odoo-sheet {
    border: 1px solid var(--sales-odoo-border);
    background: var(--card, #fff);
    min-height: 760px;
}

.sales-odoo-header {
    display: flex;
    justify-content: space-between;
    gap: 24px;
    padding: 18px 18px 8px;
}

.sales-entry-path {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
    color: var(--sales-odoo-muted);
    font-size: 12px;
    font-weight: 600;
    text-transform: none;
}

.sales-entry-path a {
    color: var(--sales-odoo-link);
    text-decoration: none;
}

.sales-entry-path a:hover {
    text-decoration: underline;
}

.sales-entry-path strong {
    color: var(--sales-odoo-ink);
    font-weight: 700;
}

.sales-document-number {
    width: min(100%, 360px);
    border: 0;
    background: transparent;
    color: #111827;
    padding: 4px 0;
    font-size: 34px;
    font-weight: 500;
    line-height: 1.1;
}

.sales-company-mark {
    min-width: 260px;
    text-align: right;
}

.sales-company-mark span {
    display: block;
    color: var(--sales-odoo-muted);
    font-size: 12px;
    font-weight: 800;
}

.sales-company-mark strong {
    display: block;
    margin-top: 4px;
    font-size: 22px;
    font-weight: 500;
}

.sales-odoo-fields {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 58px;
    padding: 0 18px 22px;
}

.sales-field-column {
    display: grid;
    align-content: start;
    gap: 10px;
}

.sales-field-row {
    display: grid;
    grid-template-columns: 150px minmax(0, 1fr);
    align-items: center;
    gap: 16px;
    min-height: 26px;
    margin: 0;
}

.sales-field-row.compact {
    grid-template-columns: 150px minmax(54px, 72px) 84px;
}

.sales-field-row span,
.sales-item-entry span,
.sales-terms label span,
.sales-payment-strip label span {
    color: #111827;
    font-size: 12px;
    font-weight: 800;
    text-transform: none;
}

.sales-field-row .sales-input,
.sales-odoo-entry .sales-input,
.sales-payment-strip .sales-input,
.sales-terms .sales-input {
    min-height: 28px;
    border: 0;
    border-bottom: 1px solid transparent;
    border-radius: 0;
    background: transparent;
    padding: 3px 2px;
    color: #111827;
    font-size: 13px;
}

.sales-field-row .sales-input:focus,
.sales-odoo-entry .sales-input:focus,
.sales-payment-strip .sales-input:focus,
.sales-terms .sales-input:focus {
    outline: 0;
    border-bottom-color: #017e84;
    background: #f7fbfc;
}

.sales-field-row strong {
    font-size: 13px;
    font-weight: 500;
}

.sales-field-row [data-bill-balance] {
    color: #dc2626;
    font-size: 14px;
    font-weight: 800;
}

.sales-field-row-refno,
.sales-field-row-billdate,
.sales-field-row-duedate,
.sales-field-row-pricelist {
    grid-template-columns: 170px minmax(180px, 1fr);
}

.sales-field-row-refno .sales-input,
.sales-field-row-billdate .sales-input,
.sales-field-row-duedate .sales-input,
.sales-field-row-pricelist .sales-input {
    min-width: 180px;
    font-size: 14px;
}

.sales-lookup-field {
    position: relative;
    display: block;
    min-width: 0;
}

.sales-field-dropdown {
    position: absolute;
    z-index: 3700;
    top: calc(100% + 4px);
    left: 0;
    width: min(520px, calc(100vw - 36px));
    max-height: 360px;
    overflow: auto;
    border: 1px solid var(--sales-odoo-border);
    border-radius: 4px;
    background: var(--card, #fff);
    box-shadow: 0 18px 45px rgba(15, 23, 42, .18);
}

.sales-field-dropdown[hidden] {
    display: none;
}

.sales-field-option {
    width: 100%;
    min-height: 42px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
    border: 0;
    border-bottom: 1px solid var(--sales-odoo-border);
    background: transparent;
    color: var(--sales-odoo-ink);
    padding: 8px 12px;
    text-align: left;
    cursor: pointer;
}

.sales-field-option:hover {
    background: color-mix(in srgb, var(--sales-odoo-purple) 8%, #fff);
}

.sales-field-option strong {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 13px;
    font-weight: 600;
}

.sales-field-option small {
    display: block;
    overflow: hidden;
    color: var(--sales-odoo-muted);
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 11px;
}

.sales-field-option b {
    color: var(--sales-odoo-muted);
    font-size: 12px;
    font-weight: 600;
}

.sales-field-option b.due {
    color: #dc2626;
    font-weight: 800;
}

.sales-field-show-more {
    width: 100%;
    min-height: 38px;
    border: 0;
    background: var(--card, #fff);
    color: var(--sales-odoo-link);
    padding: 8px 12px;
    text-align: left;
    font-size: 13px;
    cursor: pointer;
}

.sales-odoo-tabs {
    display: flex;
    align-items: flex-end;
    gap: 0;
    padding: 0 18px;
    border-top: 1px solid var(--sales-odoo-border);
    border-bottom: 1px solid var(--sales-odoo-border);
}

.sales-odoo-tabs button {
    min-height: 42px;
    border: 0;
    border-right: 1px solid var(--sales-odoo-border);
    background: #f8f9fa;
    color: #111827;
    padding: 0 18px;
    font-size: 12px;
    cursor: default;
}

.sales-odoo-tabs button:first-child {
    border-left: 1px solid var(--sales-odoo-border);
}

.sales-odoo-tabs button.active {
    border-top: 2px solid var(--sales-odoo-purple);
    background: #fff;
}

.sales-order-lines {
    padding: 0 18px 14px;
}

.sales-odoo-entry {
    display: grid;
    grid-template-columns: minmax(260px, 2.6fr) repeat(7, minmax(80px, 1fr)) 58px;
    gap: 8px;
    align-items: end;
    padding: 10px 0;
}

.sales-odoo-entry label {
    display: grid;
    gap: 2px;
    margin: 0;
    min-width: 0;
}

.sales-odoo-entry .product-field {
    position: relative;
}

.sales-advanced-entry {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(4, minmax(120px, 1fr));
    gap: 8px;
    padding-top: 2px;
}

.sales-odoo-entry .add-line {
    min-height: 30px;
    padding: 5px 10px;
    border-color: var(--sales-odoo-purple);
    background: var(--sales-odoo-purple);
    color: #fff;
}

.sales-grid-entry-hidden {
    display: none !important;
}

.sales-order-lines .sales-grid-wrap {
    max-height: min(46vh, 430px);
    min-height: 220px;
    overflow: auto;
    border: 0;
    border-radius: 0;
    position: relative;
}

.sales-order-lines .sales-items-table {
    width: 100%;
    min-width: 1180px;
    table-layout: fixed;
    border-collapse: collapse;
    font-size: 14px;
}

.sales-order-lines .sales-items-table th,
.sales-order-lines .sales-items-table td {
    border-bottom: 1px solid #d8dadd;
    padding: 7px 8px;
    vertical-align: middle;
}

.sales-order-lines .sales-items-table th {
    position: sticky;
    top: 0;
    z-index: 8;
    background: #fff;
    color: #111827;
    font-size: 12px;
    font-weight: 800;
    text-transform: none;
    box-shadow: 0 1px 0 #d8dadd;
}

.sales-order-lines .sales-items-table th:nth-child(1) { width: 28px; }
.sales-order-lines .sales-items-table th:nth-child(2) { width: 37%; }
.sales-order-lines .sales-items-table th:nth-child(3) { width: 8%; }
.sales-order-lines .sales-items-table th:nth-child(4) { width: 8%; }
.sales-order-lines .sales-items-table th:nth-child(5) { width: 9%; }
.sales-order-lines .sales-items-table th:nth-child(6) { width: 8%; }
.sales-order-lines .sales-items-table th:nth-child(7) { width: 8%; }
.sales-order-lines .sales-items-table th:nth-child(8) { width: 7%; }
.sales-order-lines .sales-items-table th:nth-child(9) { width: 7%; }
.sales-order-lines .sales-items-table th:nth-child(10) { width: 9%; }
.sales-order-lines .sales-items-table th:nth-child(11) { width: 9%; }
.sales-order-lines .sales-items-table th:nth-child(12) { width: 38px; }

.sales-order-lines .sales-items-table tbody tr:hover,
.sales-order-lines .sales-items-table tbody tr.selected {
    background: #f5f7f8;
}

.sales-order-lines .sales-items-table .stock-name {
    white-space: normal;
}

.sales-order-lines .sales-items-table .sales-grid-product-cell {
    position: relative;
    overflow: visible;
}

.sales-order-lines .sales-items-table .stock-name strong {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 500;
}

.sales-order-lines .sales-items-table .stock-name small {
    display: block;
    color: #6b7280;
    font-size: 11px;
}

.sales-row-handle {
    color: #a1a1aa;
    cursor: move;
    font-weight: 900;
}

.sales-row-delete {
    width: 24px;
    height: 24px;
    border: 0;
    border-radius: 3px;
    background: transparent;
    color: #4b5563;
    font-size: 16px;
    line-height: 1;
    cursor: pointer;
}

.sales-row-delete:hover {
    background: #fee2e2;
    color: #991b1b;
}

.sales-grid-input {
    min-height: 28px;
    border: 0;
    border-bottom: 1px solid transparent;
    border-radius: 0;
    background: transparent;
    padding: 3px 4px;
    font-size: 14px;
    font-weight: 500;
}

.sales-grid-input:focus {
    outline: 0;
    border-bottom-color: #017e84;
    background: #fff;
}

.sales-grid-product-input {
    font-weight: 700;
}

.sales-grid-product-input::placeholder {
    color: #8b949e;
}

.sales-grid-product-box {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 30px;
    align-items: center;
    gap: 6px;
}

.sales-product-open-btn {
    width: 28px;
    height: 28px;
    border: 1px solid #cbd5e1;
    border-radius: 999px;
    background: #fff;
    color: #017e84;
    font-size: 14px;
    font-weight: 900;
    line-height: 1;
    cursor: pointer;
}

.sales-product-open-btn:hover {
    background: #e6f7f9;
    border-color: #017e84;
}

.sales-grid-product-lookup {
    position: fixed;
    top: auto;
    left: auto;
    right: auto;
    width: min(780px, calc(100vw - 24px));
    min-width: min(680px, calc(100vw - 24px));
    max-height: min(340px, calc(100vh - 24px));
    overflow: auto;
    z-index: 3600;
}

.sales-grid-input.readonly-like {
    color: #111827;
    cursor: default;
}

.sales-grid-select {
    cursor: pointer;
    padding-right: 18px;
}

.sales-grid-select:disabled {
    color: #9ca3af;
    cursor: default;
}

.sales-grid-input.tax-pill-input {
    max-width: 52px;
    border: 0;
    border-radius: 999px;
    background: #eef0f2;
    padding: 2px 8px;
}

.sales-order-lines .sales-items-table tbody tr.sales-draft-row {
    background: #fcfcfd;
}

.sales-order-lines .sales-items-table tbody tr.sales-draft-row:hover {
    background: #f8fafc;
}

.sales-order-lines .sales-items-table tbody tr.dragging {
    opacity: .55;
}

.sales-order-lines .sales-items-table tbody tr.drag-over {
    outline: 2px solid color-mix(in srgb, var(--sales-odoo-purple) 55%, transparent);
    outline-offset: -2px;
}

.sales-draft-row .sales-row-handle {
    opacity: .35;
}

.sales-empty-row td {
    height: 96px;
    color: #6b7280;
    font-weight: 500;
}

.sales-line-links {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 14px;
    min-height: 42px;
    border-bottom: 1px solid var(--sales-odoo-border);
    padding: 8px 14px;
}

.sales-line-links button,
.sales-catalog-panel summary {
    border: 0;
    background: transparent;
    color: var(--sales-odoo-link);
    padding: 0;
    font-size: 12px;
    font-weight: 500;
    cursor: pointer;
}

.sales-line-links > span {
    margin-left: auto;
    color: var(--sales-odoo-muted);
    font-size: 12px;
}

.sales-catalog-panel {
    position: relative;
}

.sales-catalog-panel[open] .sales-lookup-list {
    display: block;
}

.sales-catalog-panel .sales-lookup-list {
    display: none;
    position: absolute;
    z-index: 40;
    top: 24px;
    left: 0;
    width: 440px;
    max-height: 320px;
    overflow: auto;
    border: 1px solid var(--sales-odoo-border);
    border-radius: 3px;
    background: #fff;
    box-shadow: 0 16px 34px rgba(15, 23, 42, .16);
}

.sales-product-lookup {
    border-color: var(--sales-odoo-border);
    border-radius: 3px;
    min-width: 420px;
    max-height: 340px;
}

.sales-product-option {
    grid-template-columns: minmax(0, 1fr) 72px;
    gap: 10px;
    min-height: 38px;
    border-bottom: 0;
    padding: 7px 12px;
}

.sales-product-option strong {
    display: none;
}

.sales-product-option span {
    min-width: 0;
    color: #111827;
    font-size: 13px;
    font-weight: 500;
}

.sales-product-option b {
    color: #6b7280;
    font-size: 12px;
    font-weight: 500;
}

.sales-product-lookup-head,
.sales-product-option {
    grid-template-columns: minmax(260px, 1fr) 112px 92px 110px;
}

.sales-product-lookup-head {
    position: sticky;
    top: 0;
    z-index: 2;
    display: grid;
    gap: 10px;
    border-bottom: 1px solid var(--sales-odoo-border);
    background: #f8fafc;
    color: #374151;
    padding: 7px 12px;
    font-size: 11px;
    font-weight: 800;
}

.sales-product-option .sales-product-name {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.sales-product-option .sales-product-name strong {
    display: block;
    overflow: hidden;
    color: #111827;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 13px;
    font-weight: 700;
}

.sales-product-option .sales-product-name small {
    overflow: hidden;
    color: #6b7280;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 11px;
}

.sales-product-option .sales-product-price,
.sales-product-option .sales-product-onhand,
.sales-product-option .sales-product-unit {
    overflow: hidden;
    color: #111827;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 12px;
    font-weight: 600;
}

.sales-product-more {
    width: 100%;
    min-height: 38px;
    border: 0;
    border-top: 1px solid var(--sales-odoo-border);
    background: #fff;
    color: var(--sales-odoo-link);
    padding: 8px 12px;
    text-align: left;
    font-size: 13px;
    cursor: pointer;
}

.sales-product-more:hover {
    background: #f5f7f8;
}

.sales-product-modal-backdrop {
    position: fixed;
    inset: 0;
    z-index: 4000;
    display: grid;
    place-items: center;
    background: rgba(17, 24, 39, .28);
    padding: 18px;
}

.sales-product-modal-backdrop[hidden] {
    display: none;
}

.sales-catalog-modal-backdrop {
    position: fixed;
    inset: 0;
    z-index: 4000;
    display: grid;
    place-items: center;
    background: rgba(17, 24, 39, .28);
    padding: 14px;
}

.sales-catalog-modal-backdrop[hidden] {
    display: none;
}

.sales-lookup-modal-backdrop {
    position: fixed;
    inset: 0;
    z-index: 4050;
    display: grid;
    place-items: center;
    background: rgba(17, 24, 39, .28);
    padding: 18px;
}

.sales-lookup-modal-backdrop[hidden] {
    display: none;
}

.sales-product-modal {
    width: min(1080px, 96vw);
    height: min(760px, 90vh);
    display: grid;
    grid-template-rows: auto auto minmax(0, 1fr) auto;
    border-radius: 4px;
    background: #fff;
    box-shadow: 0 30px 80px rgba(15, 23, 42, .30);
    overflow: hidden;
}

.sales-product-modal-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 62px;
    border-bottom: 1px solid var(--sales-odoo-border);
    padding: 0 18px;
}

.sales-product-modal-head h2 {
    margin: 0;
    color: #111827;
    font-size: 20px;
    font-weight: 800;
}

.sales-catalog-modal {
    width: min(1500px, 98vw);
    height: min(880px, 94vh);
    display: grid;
    grid-template-rows: auto auto minmax(0, 1fr) auto;
    border-radius: 4px;
    background: #fff;
    box-shadow: 0 30px 80px rgba(15, 23, 42, .30);
    overflow: hidden;
}

.sales-lookup-modal {
    width: min(760px, 94vw);
    height: min(650px, 86vh);
    display: grid;
    grid-template-rows: auto auto minmax(0, 1fr) auto;
    border-radius: 4px;
    background: var(--card, #fff);
    box-shadow: 0 30px 80px rgba(15, 23, 42, .30);
    overflow: hidden;
}

.sales-lookup-modal-list {
    min-height: 0;
    overflow: auto;
    background: var(--card, #fff);
}

.sales-catalog-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 56px;
    border-bottom: 1px solid var(--sales-odoo-border);
    padding: 0 16px;
}

.sales-catalog-head h2 {
    margin: 0;
    color: #111827;
    font-size: 18px;
    font-weight: 800;
}

.sales-product-modal-close {
    width: 38px;
    height: 38px;
    border: 0;
    background: transparent;
    color: #6b7280;
    font-size: 34px;
    line-height: 1;
    cursor: pointer;
}

.sales-product-modal-toolbar {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 18px;
    min-height: 66px;
    border-bottom: 1px solid var(--sales-odoo-border);
    background: #f8f9fa;
    padding: 10px 18px;
}

.sales-catalog-toolbar {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 18px;
    min-height: 58px;
    border-bottom: 1px solid var(--sales-odoo-border);
    background: #f8f9fa;
    padding: 8px 18px;
}

.sales-modal-search {
    position: relative;
    width: min(360px, 50vw);
    display: grid;
    grid-template-columns: 1fr;
    margin: 0;
}

.sales-modal-search span {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
}

.sales-modal-search .sales-input {
    min-height: 40px;
    border: 1px solid #8fb9bd;
    border-radius: 4px;
    background: #fff;
    padding: 8px 12px 8px 34px;
    font-size: 15px;
}

.sales-modal-search::before {
    content: "⌕";
    position: absolute;
    z-index: 1;
    margin: 9px 0 0 12px;
    color: #0f172a;
    font-size: 18px;
}

.sales-modal-pager {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-left: auto;
    color: #111827;
    font-size: 14px;
}

.sales-modal-pager button {
    width: 38px;
    height: 38px;
    border: 1px solid #d6d9dd;
    border-radius: 4px;
    background: #e9ebef;
    color: #111827;
    font-size: 28px;
    line-height: 1;
    cursor: pointer;
}

.sales-modal-pager button:disabled {
    opacity: .55;
    cursor: not-allowed;
}

.sales-product-modal-table-wrap {
    min-height: 0;
    overflow: auto;
}

.sales-catalog-grid-wrap {
    min-height: 0;
    overflow: auto;
    background: #fff;
}

.sales-catalog-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(230px, 1fr));
    gap: 8px 14px;
    padding: 12px;
}

.sales-catalog-card {
    position: relative;
    min-height: 148px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 58px;
    grid-template-rows: minmax(0, 1fr) auto;
    gap: 8px;
    border: 1px solid #d8dadd;
    background: #fff;
    padding: 12px 10px 10px;
}

.sales-catalog-card.selected {
    border-color: #017e84;
    background: #e9f9fb;
}

.sales-catalog-card-main {
    min-width: 0;
}

.sales-catalog-card h3 {
    margin: 0 0 8px;
    color: #111827;
    font-size: 14px;
    line-height: 1.45;
    font-weight: 800;
}

.sales-catalog-meta {
    display: flex;
    align-items: baseline;
    gap: 18px;
    color: #6b7280;
    font-size: 12px;
}

.sales-catalog-meta strong {
    color: #111827;
    font-size: 13px;
}

.sales-catalog-stock {
    margin-top: 4px;
    color: #4b5563;
    font-size: 12px;
}

.sales-catalog-image {
    width: 54px;
    height: 54px;
    object-fit: contain;
    justify-self: end;
}

.sales-catalog-image.placeholder {
    border-radius: 4px;
    background: #f3f4f6;
}

.sales-catalog-check {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 18px;
    height: 18px;
    display: grid;
    place-items: center;
    border-radius: 999px;
    background: #22c55e;
    color: #fff;
    font-size: 12px;
    font-weight: 900;
}

.sales-catalog-actions {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    min-height: 34px;
}

.sales-card-add,
.sales-card-remove,
.sales-card-step {
    min-height: 30px;
    border: 0;
    border-radius: 3px;
    background: #e9ebef;
    color: #111827;
    padding: 5px 12px;
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
}

.sales-card-step {
    width: 34px;
    padding: 0;
    background: var(--sales-odoo-purple);
    color: #fff;
    font-size: 18px;
    line-height: 1;
}

.sales-card-remove {
    margin-left: auto;
}

.sales-card-qty {
    width: 62px;
    min-height: 30px;
    border: 0;
    border-bottom: 1px solid #d8dadd;
    background: transparent;
    color: #111827;
    text-align: center;
    font-size: 13px;
}

.sales-card-qty:focus {
    outline: 0;
    border-bottom-color: #017e84;
    background: #fff;
}

.sales-card-unit {
    min-width: 54px;
    color: #6b7280;
    font-size: 12px;
}

.sales-product-modal-table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
    font-size: 14px;
}

.sales-product-modal-table th,
.sales-product-modal-table td {
    border-bottom: 1px solid #d8dadd;
    padding: 10px 14px;
    vertical-align: middle;
}

.sales-product-modal-table th {
    position: sticky;
    top: 0;
    z-index: 1;
    background: #fff;
    color: #111827;
    font-size: 14px;
    font-weight: 800;
    text-align: left;
}

.sales-product-modal-table tbody tr {
    cursor: pointer;
}

.sales-product-modal-table tbody tr:hover {
    background: #f5f7f8;
}

.sales-product-modal-table tbody tr.selected {
    background: #eeeeee;
}

.sales-product-modal-table .star-col {
    width: 42px;
    color: #a1a1aa;
    text-align: center;
    font-size: 22px;
}

.sales-product-modal-table .number {
    text-align: right;
}

.sales-product-modal-table td strong {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 500;
}

.sales-product-modal-table td small {
    display: block;
    color: #6b7280;
    font-size: 12px;
}

.sales-product-modal-table .strong {
    font-weight: 900;
}

.sales-modal-empty {
    height: 120px;
    color: #6b7280;
    text-align: center;
    font-weight: 500;
}

.sales-product-modal-foot {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
    min-height: 62px;
    border-top: 1px solid var(--sales-odoo-border);
    padding: 10px 18px;
    background: #fff;
}

.sales-odoo-footer {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 320px;
    gap: 24px;
    padding: 16px 18px 28px;
}

.sales-terms {
    display: grid;
    align-content: start;
    gap: 14px;
}

.sales-terms label {
    display: grid;
    grid-template-columns: 140px minmax(0, 1fr);
    align-items: start;
    gap: 12px;
    margin: 0;
}

.sales-terms .narration {
    min-height: 54px;
    resize: vertical;
}

.sales-payment-strip {
    display: grid;
    gap: 8px;
}

.sales-payment-strip label {
    display: grid;
    gap: 3px;
    margin: 0;
}

.sales-payment-strip .sales-total-line,
.sales-payment-note {
    grid-column: 1 / -1;
}

.sales-payment-modal-backdrop {
    z-index: 4200;
}

/* Keep Source Customer Credit above Received Payment when a payment reference is opened. */
.sales-credit-source-modal-backdrop {
    z-index: 4400;
}

.sales-payment-touch-modal {
    background: var(--card);
}

.sales-payment-touch-modal .pos-payment-touch-summary div,
.sales-payment-touch-modal .pos-payment-line-row,
.sales-payment-touch-modal .pos-payment-amount-display,
.sales-payment-touch-modal .pos-payment-keypad button,
.sales-payment-touch-modal .pos-payment-method-tile {
    border-radius: 6px;
}

.sales-payment-touch-modal .pos-payment-method-tile {
    min-height: 52px;
}

.sales-summary-panel {
    display: grid;
    align-content: start;
    gap: 3px;
    border: 0;
    background: transparent;
    box-shadow: none;
    padding: 0;
}

.sales-summary-buttons {
    display: flex;
    justify-content: flex-end;
    gap: 6px;
    margin-bottom: 8px;
}

.sales-total-line {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 116px;
    align-items: center;
    gap: 8px;
    border: 0;
    padding: 2px 0;
}

.sales-total-line span {
    color: #111827;
    font-size: 12px;
    font-weight: 500;
    text-align: right;
}

.sales-total-line strong {
    color: #111827;
    font-size: 12px;
    font-weight: 800;
    text-align: right;
}

.sales-total-line.input-line input {
    width: 116px;
    min-height: 24px;
    border: 0;
    border-bottom: 1px solid #d8dadd;
    border-radius: 0;
    background: transparent;
    padding: 2px 4px;
    text-align: right;
}

.sales-total-line.grand {
    border-top: 1px solid #d8dadd;
    margin-top: 4px;
    padding-top: 6px;
}

.sales-total-line.grand strong {
    color: #111827;
    font-size: 18px;
    font-weight: 900;
}

.sales-total-line.muted-total span,
.sales-total-line.muted-total strong {
    color: var(--sales-odoo-muted);
}

.sales-payment-note {
    border-radius: 3px;
    background: #f5f7f8;
    color: var(--sales-odoo-muted);
    padding: 7px 8px;
    font-size: 12px;
}

body.theme-dark .sales-entry-page,
body.theme-midnight .sales-entry-page,
body.theme-carbon .sales-entry-page {
    --sales-odoo-border: rgba(255, 255, 255, .12);
    --sales-odoo-ink: var(--text, #f8fafc);
    --sales-odoo-muted: color-mix(in srgb, var(--text, #f8fafc) 65%, transparent);
    background: var(--bg, #0f172a);
    color: var(--sales-odoo-ink);
}

body.theme-dark .sales-odoo-sheet,
body.theme-dark .sales-product-modal,
body.theme-dark .sales-catalog-modal,
body.theme-dark .sales-lookup-modal,
body.theme-dark .sales-field-dropdown,
body.theme-midnight .sales-odoo-sheet,
body.theme-midnight .sales-product-modal,
body.theme-midnight .sales-catalog-modal,
body.theme-midnight .sales-lookup-modal,
body.theme-midnight .sales-field-dropdown,
body.theme-carbon .sales-odoo-sheet,
body.theme-carbon .sales-product-modal,
body.theme-carbon .sales-catalog-modal,
body.theme-carbon .sales-lookup-modal,
body.theme-carbon .sales-field-dropdown {
    background: var(--card, #111827);
    border-color: var(--sales-odoo-border);
}

body.theme-dark .sales-odoo-actionbar,
body.theme-dark .sales-odoo-tabs,
body.theme-dark .sales-odoo-tabs button,
body.theme-dark .sales-order-lines .sales-items-table th,
body.theme-dark .sales-product-modal-toolbar,
body.theme-dark .sales-catalog-toolbar,
body.theme-dark .sales-product-modal-foot,
body.theme-dark .sales-payment-note,
body.theme-midnight .sales-odoo-actionbar,
body.theme-midnight .sales-odoo-tabs,
body.theme-midnight .sales-odoo-tabs button,
body.theme-midnight .sales-order-lines .sales-items-table th,
body.theme-midnight .sales-product-modal-toolbar,
body.theme-midnight .sales-catalog-toolbar,
body.theme-midnight .sales-product-modal-foot,
body.theme-midnight .sales-payment-note,
body.theme-carbon .sales-odoo-actionbar,
body.theme-carbon .sales-odoo-tabs,
body.theme-carbon .sales-odoo-tabs button,
body.theme-carbon .sales-order-lines .sales-items-table th,
body.theme-carbon .sales-product-modal-toolbar,
body.theme-carbon .sales-catalog-toolbar,
body.theme-carbon .sales-product-modal-foot,
body.theme-carbon .sales-payment-note {
    background: color-mix(in srgb, var(--card, #111827) 92%, #fff);
    border-color: var(--sales-odoo-border);
    color: var(--sales-odoo-ink);
}

body.theme-dark .sales-field-row .sales-input,
body.theme-dark .sales-grid-input,
body.theme-dark .sales-document-number,
body.theme-dark .sales-field-option,
body.theme-dark .sales-total-line input,
body.theme-dark .sales-total-line span,
body.theme-dark .sales-total-line strong,
body.theme-midnight .sales-field-row .sales-input,
body.theme-midnight .sales-grid-input,
body.theme-midnight .sales-document-number,
body.theme-midnight .sales-field-option,
body.theme-midnight .sales-total-line input,
body.theme-midnight .sales-total-line span,
body.theme-midnight .sales-total-line strong,
body.theme-carbon .sales-field-row .sales-input,
body.theme-carbon .sales-grid-input,
body.theme-carbon .sales-document-number,
body.theme-carbon .sales-field-option,
body.theme-carbon .sales-total-line input,
body.theme-carbon .sales-total-line span,
body.theme-carbon .sales-total-line strong {
    color: var(--sales-odoo-ink);
}

body.theme-dark .sales-field-option:hover,
body.theme-midnight .sales-field-option:hover,
body.theme-carbon .sales-field-option:hover {
    background: color-mix(in srgb, var(--sales-odoo-purple) 20%, transparent);
}

@media (max-width: 1200px) {
    .sales-odoo-fields,
    .sales-odoo-footer {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .sales-summary-panel {
        max-width: 360px;
        margin-left: auto;
    }

    .sales-odoo-entry {
        grid-template-columns: repeat(4, minmax(120px, 1fr));
    }

    .sales-odoo-entry .product-field {
        grid-column: span 2;
    }

    .sales-advanced-entry {
        grid-template-columns: repeat(2, minmax(120px, 1fr));
    }
}

@media (max-width: 760px) {
    .sales-odoo-actionbar,
    .sales-odoo-header {
        flex-direction: column;
        align-items: stretch;
    }

    .sales-statusbar {
        min-width: 0;
        justify-content: stretch;
    }

    .sales-statusbar span {
        min-width: 0;
        flex: 1;
    }

    .sales-company-mark {
        min-width: 0;
        text-align: left;
    }

    .sales-odoo-fields,
    .sales-odoo-entry,
    .sales-advanced-entry,
    .sales-payment-strip,
    .sales-terms label {
        grid-template-columns: 1fr;
    }

    .sales-field-row,
    .sales-field-row.compact {
        grid-template-columns: 1fr;
        gap: 2px;
    }

    .sales-summary-panel {
        max-width: none;
    }

    .sales-product-lookup {
        min-width: min(420px, calc(100vw - 48px));
        max-width: calc(100vw - 48px);
    }

    .sales-product-modal-backdrop {
        padding: 10px;
    }

    .sales-product-modal {
        width: 96vw;
        height: 88vh;
    }

    .sales-product-modal-toolbar {
        align-items: stretch;
        flex-direction: column;
        gap: 10px;
    }

    .sales-modal-search {
        width: 100%;
    }

    .sales-modal-pager {
        justify-content: flex-end;
        margin-left: 0;
    }

    .sales-product-modal-table {
        min-width: 760px;
    }
}


/* Stock Items create/edit page converted from CreateNewStockItem.vb */
.stock-item-edit-page { padding: 18px; }
.stock-item-form { display: grid; gap: 14px; }
.stock-edit-actions { display:flex; gap:10px; align-items:center; justify-content:flex-start; }
.stock-edit-layout { display:grid; grid-template-columns: minmax(0,1fr) 280px; gap:18px; align-items:start; }
.stock-edit-main { display:grid; gap:14px; }
.stock-form-card { background: var(--card); border:1px solid var(--border); border-radius:16px; padding:16px; box-shadow:0 10px 26px rgba(15,23,42,.06); }
.stock-form-card h2 { margin:0 0 12px; font-size:18px; color:var(--brand-dark); }
.stock-form-grid { display:grid; grid-template-columns: repeat(3, minmax(190px,1fr)); gap:12px; }
.stock-form-grid label { display:grid; gap:6px; font-weight:800; color:var(--text); }
.stock-form-grid label.wide { grid-column: span 2; }
.stock-form-grid span { color:var(--muted); font-size:.86rem; }
.stock-form-grid input, .stock-form-grid select, .stock-form-grid textarea { min-height:42px; border:1px solid var(--border); border-radius:10px; background:var(--card); color:var(--text); padding:9px 11px; outline:none; font-weight:700; }
.stock-form-grid input:focus, .stock-form-grid select:focus, .stock-form-grid textarea:focus { border-color:var(--brand); box-shadow:0 0 0 3px color-mix(in srgb, var(--brand) 18%, transparent); }
.stock-image-panel { position:sticky; top:14px; background:var(--card); border:1px solid var(--border); border-radius:16px; padding:14px; display:grid; gap:12px; }
.stock-image-preview { width:100%; aspect-ratio:1/1; display:grid; place-items:center; border:1px dashed var(--border); border-radius:14px; background:color-mix(in srgb, var(--soft) 45%, var(--card)); overflow:hidden; color:var(--muted); font-weight:900; }
.stock-image-preview img { width:100%; height:100%; object-fit:contain; }
.image-upload { display:grid; gap:8px; font-weight:900; }
.edit-checks { margin-top:12px; }
.validation-summary { padding:12px 14px; border-radius:12px; background:#fee2e2; color:#991b1b; font-weight:900; border:1px solid #fecaca; }
@media (max-width: 1100px) { .stock-edit-layout { grid-template-columns:1fr; } .stock-image-panel { position:relative; top:auto; } }
@media (max-width: 760px) { .stock-form-grid { grid-template-columns:1fr; } .stock-form-grid label.wide { grid-column:auto; } }


/* Odoo-style Stock Item create/edit tabs based on CreateNewStockItem.vb */
.stock-edit-topbar { align-items: center; gap: 14px; }
.stock-edit-titleline { min-width: 0; }
.stock-edit-titleline h1 { margin: 0; font-size: 1.05rem; max-width: 520px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.stock-edit-gear { font-size: 18px; color: var(--brand-dark); }
.stock-edit-smart-buttons { display: flex; align-items: stretch; gap: 0; margin-left: auto; border: 1px solid var(--border); border-radius: 8px; overflow: hidden; background: var(--card); }
.smart-button { min-width: 110px; display: grid; place-items: center; gap: 2px; padding: 7px 12px; border-right: 1px solid var(--border); font-size: .78rem; color: var(--muted); }
.smart-button:last-child { border-right: 0; }
.smart-button strong { color: var(--brand-dark); font-size: .95rem; }
.odoo-stock-edit-page { padding: 12px 16px 24px; }
.odoo-form-actions { margin-bottom: 10px; }
.odoo-product-sheet { border: 1px solid var(--border); border-radius: 8px; background: var(--card); color: var(--text); overflow: hidden; box-shadow: 0 8px 28px rgba(15,23,42,.05); }
.odoo-product-head { display: grid; grid-template-columns: minmax(0,1fr) 138px; gap: 18px; padding: 28px 30px 18px; }
.product-label { font-size: .95rem; font-weight: 900; color: var(--text); }
.product-main-line { display: grid; grid-template-columns: 44px minmax(0,1fr); gap: 12px; align-items: start; margin-top: 8px; }
.product-star { font-size: 44px; line-height: 1; color: #64748b; }
.product-title-input { width: 100%; border: 0 !important; border-bottom: 1px solid transparent !important; border-radius: 0 !important; background: transparent !important; color: var(--text) !important; font-size: clamp(2rem, 3.3vw, 3.1rem) !important; font-weight: 500 !important; padding: 0 0 4px !important; outline: none; }
.product-title-input:focus { border-bottom-color: var(--brand) !important; box-shadow: none !important; }
.product-code-row { display: grid; grid-template-columns: repeat(3, minmax(150px, 1fr)); gap: 10px; margin-top: 8px; }
.product-code-row label { display: grid; gap: 5px; color: var(--muted); font-weight: 800; font-size: .82rem; }
.product-code-row input { min-height: 38px; border: 1px solid var(--border); border-radius: 7px; background: var(--card); color: var(--text); padding: 7px 9px; font-weight: 800; }
.product-quick-flags { display: flex; gap: 16px; align-items: center; flex-wrap: wrap; margin: 16px 0 0 56px; font-weight: 900; }
.product-quick-flags input, .check-line input { accent-color: var(--brand); width: 18px; height: 18px; vertical-align: middle; }
.odoo-product-image-box { position: static; width: 112px; justify-self: end; padding: 0; border: 0; background: transparent; }
.odoo-product-image-box .stock-image-preview { width: 112px; height: 112px; aspect-ratio: auto; border-radius: 0; }
.odoo-product-image-box .image-upload { font-size: .75rem; }
.stock-edit-tabs { display: flex; align-items: stretch; gap: 0; padding: 0 30px; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); background: color-mix(in srgb, var(--soft) 24%, var(--card)); overflow-x: auto; }
.stock-edit-tabs button { min-height: 48px; padding: 0 22px; border: 0; border-left: 1px solid var(--border); background: transparent; color: var(--text); font-size: 1rem; cursor: pointer; }
.stock-edit-tabs button:last-child { border-right: 1px solid var(--border); }
.stock-edit-tabs button.active { background: var(--card); color: var(--brand-dark); box-shadow: inset 0 3px 0 var(--brand); font-weight: 900; }
.stock-tab-panel { display: none; padding: 24px 30px 30px; }
.stock-tab-panel.active { display: block; }
.odoo-two-col { display: grid; grid-template-columns: minmax(0,1fr) 280px; gap: 30px; align-items: start; }
.odoo-form-grid { grid-template-columns: repeat(2, minmax(220px, 1fr)); gap: 18px 40px; }
.odoo-form-grid.two-side { grid-template-columns: repeat(3, minmax(190px, 1fr)); }
.odoo-form-grid label { display: grid; grid-template-columns: 160px minmax(0,1fr); align-items: center; gap: 12px; }
.odoo-form-grid label.wide { grid-column: 1 / -1; grid-template-columns: 160px minmax(0,1fr); }
.odoo-form-grid label > span { color: var(--text); font-size: .95rem; font-weight: 900; }
.odoo-form-grid input, .odoo-form-grid select, .odoo-form-grid textarea { border: 0; border-bottom: 1px solid var(--border); border-radius: 0; background: transparent; color: var(--text); min-height: 36px; padding: 5px 4px; font-weight: 500; }
.odoo-form-grid input:focus, .odoo-form-grid select:focus, .odoo-form-grid textarea:focus { border-bottom-color: var(--brand); box-shadow: none; }
.odoo-form-grid .check-line { grid-template-columns: auto 1fr; justify-content: start; }
.field-note-box, .opening-stock-box { border: 1px solid var(--border); border-radius: 10px; background: color-mix(in srgb, var(--soft) 36%, var(--card)); padding: 16px; }
.field-note-box p { margin: 8px 0 0; color: var(--muted); line-height: 1.5; }
.opening-stock-box { margin-top: 22px; }
.opening-stock-box h3 { margin: 0 0 14px; font-size: 1.05rem; color: var(--brand-dark); }
body.theme-dark .odoo-product-sheet, body.theme-midnight .odoo-product-sheet, body.theme-carbon .odoo-product-sheet,
body.theme-dark .product-code-row input, body.theme-midnight .product-code-row input, body.theme-carbon .product-code-row input,
body.theme-dark .field-note-box, body.theme-midnight .field-note-box, body.theme-carbon .field-note-box,
body.theme-dark .opening-stock-box, body.theme-midnight .opening-stock-box, body.theme-carbon .opening-stock-box {
    background: color-mix(in srgb, var(--card) 92%, #000);
    color: var(--text);
}
@media (max-width: 1100px) {
    .stock-edit-smart-buttons { display: none; }
    .odoo-product-head, .odoo-two-col { grid-template-columns: 1fr; }
    .odoo-product-image-box { justify-self: start; }
    .odoo-form-grid, .odoo-form-grid.two-side { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
    .product-main-line { grid-template-columns: 1fr; }
    .product-star { display: none; }
    .product-code-row { grid-template-columns: 1fr; }
    .product-quick-flags { margin-left: 0; }
    .stock-tab-panel, .odoo-product-head { padding-left: 16px; padding-right: 16px; }
    .stock-edit-tabs { padding-left: 16px; padding-right: 16px; }
    .odoo-form-grid label, .odoo-form-grid label.wide { grid-template-columns: 1fr; }
}

/* CreateNewStockItem.vb conditional Odoo product form refinements */
.odoo-stock-form [hidden],
.odoo-stock-form .is-hidden-by-vb-rule { display: none !important; }
.odoo-stock-edit-page .validation-summary,
.field-warning-note {
    border: 1px solid color-mix(in srgb, #f59e0b 45%, var(--border));
    border-radius: 10px;
    background: color-mix(in srgb, #f59e0b 14%, var(--card));
    color: var(--text);
    padding: 10px 12px;
    font-weight: 800;
}
.odoo-stock-form input[readonly],
.odoo-stock-form select:disabled,
.odoo-stock-form input:disabled {
    opacity: .75;
    cursor: not-allowed;
    background: color-mix(in srgb, var(--soft) 70%, var(--card));
}
.odoo-stock-form .product-title-input {
    font-size: clamp(28px, 3.2vw, 44px);
    font-weight: 500;
    letter-spacing: -.03em;
}
.odoo-stock-form .product-code-row label,
.odoo-stock-form .product-quick-flags label {
    white-space: nowrap;
}
.odoo-stock-form .stock-tab-panel { display: none; }
.odoo-stock-form .stock-tab-panel.active { display: block; }
.odoo-stock-form .field-note-box {
    align-self: start;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: color-mix(in srgb, var(--soft) 44%, var(--card));
    padding: 14px;
    color: var(--text);
}
.odoo-stock-form .field-note-box p { margin: 8px 0 0; line-height: 1.45; }
.odoo-stock-form .opening-stock-box {
    margin-top: 14px;
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 14px;
    background: color-mix(in srgb, var(--soft) 34%, var(--card));
}
.odoo-stock-form .opening-stock-box h3 { margin: 0 0 12px; font-size: 17px; }
.odoo-stock-form .stock-form-grid.two-side { grid-template-columns: repeat(3, minmax(190px, 1fr)); }
@media (max-width: 980px) {
    .odoo-stock-form .stock-form-grid.two-side { grid-template-columns: repeat(2, minmax(180px, 1fr)); }
}
@media (max-width: 640px) {
    .odoo-stock-form .stock-form-grid.two-side { grid-template-columns: 1fr; }
    .odoo-stock-form .product-title-input { font-size: 28px; }
}
body.theme-dark .odoo-stock-form .field-note-box,
body.theme-midnight .odoo-stock-form .field-note-box,
body.theme-carbon .odoo-stock-form .field-note-box,
body.theme-dark .odoo-stock-form .opening-stock-box,
body.theme-midnight .odoo-stock-form .opening-stock-box,
body.theme-carbon .odoo-stock-form .opening-stock-box {
    background: color-mix(in srgb, var(--card) 88%, #000);
}

/* VB.NET CreateNewStockItem visual alignment inside Odoo-style page */
.vb-stock-edit-page { padding: 10px 14px 24px; }
.vb-stock-window {
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--card);
    overflow: hidden;
    box-shadow: 0 10px 28px rgba(15,23,42,.07);
}
.vb-stock-green-title {
    min-height: 30px;
    display: grid;
    place-items: center;
    background: linear-gradient(90deg, #027a18, #008c1c);
    color: #fff;
    font-size: 1.2rem;
    font-weight: 950;
    letter-spacing: .03em;
    text-transform: uppercase;
}
.vb-stock-navrow {
    display: grid;
    grid-template-columns: 78px 78px minmax(230px, 1fr) minmax(230px, 1fr) 78px 78px;
    gap: 10px;
    align-items: center;
    padding: 8px 26px;
    border-bottom: 1px solid var(--border);
    background: color-mix(in srgb, var(--soft) 28%, var(--card));
}
.vb-nav-btn {
    min-height: 36px;
    display: grid;
    place-items: center;
    background: #3f7fc4;
    color: #fff;
    border-radius: 0;
    font-weight: 900;
    text-decoration: none;
}
.vb-nav-btn.disabled { opacity: .85; pointer-events: none; }
.vb-item-code-picker,
.vb-item-size-picker {
    display: grid;
    grid-template-columns: 88px 1fr;
    align-items: center;
    gap: 8px;
    font-size: .86rem;
    font-weight: 900;
}
.vb-item-code-picker input,
.vb-item-size-picker input,
.vb-stock-sheet input,
.vb-stock-sheet select,
.vb-stock-sheet textarea {
    min-height: 30px;
    border: 1px solid color-mix(in srgb, var(--border) 90%, #94a3b8);
    border-radius: 3px;
    background: var(--card);
    color: var(--text);
    padding: 4px 7px;
    font-weight: 700;
}
.vb-stock-tabs { padding: 0 6px; background: color-mix(in srgb, var(--soft) 18%, var(--card)); }
.vb-stock-tabs button { min-height: 36px; padding: 0 10px; font-size: .86rem; font-weight: 900; text-transform: uppercase; }
.vb-stock-sheet { padding: 6px; background: color-mix(in srgb, var(--card) 96%, var(--bg)); }
.vb-stock-sheet .stock-tab-panel { padding: 0; }
.vb-basic-layout {
    display: grid;
    grid-template-columns: minmax(420px, 1.1fr) minmax(360px, .9fr);
    gap: 24px;
    align-items: start;
}
.vb-left-fields,
.vb-right-fields { display: grid; gap: 7px; }
.vb-right-fields label,
.vb-full,
.vb-price-inline label,
.vb-money-grid label {
    display: grid;
    grid-template-columns: 128px minmax(0, 1fr);
    align-items: center;
    gap: 8px;
    color: var(--text);
    font-weight: 900;
}
.vb-right-fields label > span,
.vb-full > span,
.vb-price-inline label > span,
.vb-money-grid label > span,
.vb-row-grid label > span { font-size: .86rem; color: var(--text); }
.vb-row-grid { display: grid; gap: 8px; align-items: center; }
.vb-row-4 { grid-template-columns: 170px minmax(150px, 1fr) 76px 160px; }
.vb-row-2 { grid-template-columns: minmax(220px, 1fr) minmax(150px, .7fr); }
.vb-row-grid label { display:grid; grid-template-columns: 80px minmax(0,1fr); align-items:center; gap:8px; font-weight:900; }
.vb-auto-btn,
.vb-link-btn,
.vb-photo-btn {
    min-height: 32px;
    border: 0;
    background: #3f7fc4;
    color: #fff;
    font-weight: 900;
    cursor: pointer;
    display: grid;
    place-items: center;
    text-align:center;
}
.vb-link-btn { background: transparent; color: #0000ee; text-decoration: underline; justify-self: start; }
.vb-status-label input { color: #008000; font-weight: 950; }
.vb-price-inline { display:grid; grid-template-columns: minmax(220px, 320px) 120px; align-items:center; gap:10px; margin-top: 42px; }
.vb-money-grid {
    margin-top: 70px;
    max-width: 420px;
    display:grid;
    grid-template-columns: 1fr 1fr;
    gap: 7px 12px;
}
.vb-money-grid label { grid-template-columns: 128px minmax(0, 1fr); }
.vb-money-grid label:nth-child(2) { grid-column: 2; grid-row: 1 / span 2; align-self: end; }
.vb-money-grid input { text-align: right; }
.vb-photo-area { display:grid; grid-template-columns: 96px 124px; justify-content: end; gap: 8px; align-items: start; }
.vb-image-preview { width: 96px !important; height: 96px !important; aspect-ratio: auto !important; border-radius: 2px !important; font-size: .78rem; }
.vb-photo-buttons { display:grid; gap:2px; }
.vb-photo-btn { min-height: 32px; }
.vb-photo-btn input { display:none; }
.vb-check { grid-template-columns: auto 1fr !important; justify-content: start; }
.vb-check input { min-height:auto; width:16px; height:16px; accent-color: var(--brand); }
.vb-packing-band {
    margin-top: 10px;
    border: 1px solid var(--border);
    padding: 4px 8px 6px;
    background: color-mix(in srgb, var(--soft) 20%, var(--card));
}
.vb-packing-band > strong { display:block; margin-bottom:4px; }
.vb-unit-table {
    display: grid;
    grid-template-columns: 90px 130px 34px 130px 34px 130px 130px;
    gap: 4px 8px;
    align-items: center;
    font-size: .83rem;
}
.vb-unit-table b { color: var(--text); }
.vb-unit-table input { min-height: 28px; }
.vb-section-heading { font-weight: 950; font-size: 1.05rem; color: var(--brand-dark); margin: 10px 0 16px; }
.vb-stock-footer-actions {
    display: grid;
    grid-template-columns: 150px 190px;
    justify-content: center;
    gap: 240px;
    padding: 10px 12px;
    border-top: 1px solid var(--border);
    background: color-mix(in srgb, var(--soft) 16%, var(--card));
}
.vb-close-btn,
.vb-save-btn { min-height: 52px; display:grid; place-items:center; font-size: 1rem; font-weight: 900; }
body.theme-dark .vb-stock-green-title,
body.theme-midnight .vb-stock-green-title,
body.theme-carbon .vb-stock-green-title { background: linear-gradient(90deg, #035914, #07801d); }
body.theme-dark .vb-link-btn,
body.theme-midnight .vb-link-btn,
body.theme-carbon .vb-link-btn { color: #93c5fd; }
@media (max-width: 1150px) {
    .vb-basic-layout { grid-template-columns: 1fr; }
    .vb-stock-navrow { grid-template-columns: repeat(2, 78px) 1fr; }
    .vb-item-size-picker, .vb-stock-navrow .vb-nav-btn:nth-last-child(-n+2) { display:none; }
    .vb-unit-table { grid-template-columns: 1fr 1fr; }
    .vb-unit-table > span { display:none; }
    .vb-stock-footer-actions { gap: 20px; }
}
@media (max-width: 700px) {
    .vb-row-4, .vb-row-2, .vb-price-inline, .vb-money-grid, .vb-photo-area { grid-template-columns: 1fr; }
    .vb-right-fields label, .vb-full, .vb-price-inline label, .vb-money-grid label, .vb-row-grid label { grid-template-columns: 1fr; }
    .vb-stock-footer-actions { grid-template-columns: 1fr; }
}


/* Stock item lookup inputs - replaces dropdowns with Alter Ledger style lookup picker */
.stock-item-edit-page label { position: relative; }
.stock-lookup-input {
    padding-right: 2.1rem !important;
    background-image: linear-gradient(45deg, transparent 50%, currentColor 50%), linear-gradient(135deg, currentColor 50%, transparent 50%);
    background-position: calc(100% - 17px) 50%, calc(100% - 11px) 50%;
    background-size: 6px 6px, 6px 6px;
    background-repeat: no-repeat;
}
.stock-lookup-suggestions {
    display: none;
    position: absolute;
    left: 0;
    right: 0;
    top: calc(100% + 4px);
    z-index: 30;
    padding: .35rem;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: var(--card);
    box-shadow: 0 14px 32px rgba(15,23,42,.18);
    max-height: 230px;
    overflow: auto;
}
.stock-lookup-suggestions.open { display: grid; gap: .25rem; }
.stock-lookup-option,
.stock-lookup-more {
    width: 100%;
    border: 0;
    border-radius: 9px;
    background: transparent;
    color: var(--text);
    text-align: left;
    padding: .52rem .6rem;
    cursor: pointer;
    font-weight: 700;
}
.stock-lookup-option:hover,
.stock-lookup-option:focus,
.stock-lookup-more:hover,
.stock-lookup-more:focus {
    background: color-mix(in srgb, var(--brand) 12%, var(--card));
    outline: none;
}
.stock-lookup-more {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-top: 1px solid var(--border);
    margin-top: .2rem;
    color: var(--brand);
}
.stock-lookup-empty { padding: .6rem; color: var(--muted); font-weight: 700; }
.stock-lookup-modal .erp-lookup-results { max-height: 58vh; }
body.theme-dark .stock-lookup-suggestions,
body.theme-midnight .stock-lookup-suggestions,
body.theme-carbon .stock-lookup-suggestions {
    background: var(--card);
    border-color: rgba(255,255,255,.16);
    box-shadow: 0 18px 40px rgba(0,0,0,.45);
}

/* Product create/edit polish: theme-based, web layout, always-available unit lookup fields */
.stock-edit-titleline .stock-breadcrumb-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--brand);
    font-weight: 950;
    text-decoration: none;
}
.stock-edit-titleline .stock-breadcrumb-link:hover,
.stock-edit-titleline .stock-breadcrumb-link:focus {
    color: var(--brand-dark);
    text-decoration: underline;
    outline: none;
}
.vb-stock-window {
    border-radius: 18px !important;
    border: 1px solid color-mix(in srgb, var(--border) 82%, var(--brand) 18%) !important;
    background: color-mix(in srgb, var(--card) 98%, var(--bg)) !important;
    box-shadow: 0 18px 48px rgba(15,23,42,.10) !important;
}
.vb-stock-green-title {
    min-height: 42px !important;
    background: linear-gradient(135deg, var(--brand), color-mix(in srgb, var(--brand) 70%, #111827)) !important;
    color: #fff !important;
    font-size: 1.05rem !important;
    letter-spacing: .045em !important;
}
.vb-stock-navrow {
    padding: 12px 18px !important;
    gap: 12px !important;
    background: color-mix(in srgb, var(--soft) 24%, var(--card)) !important;
}
.vb-nav-btn {
    border-radius: 12px !important;
    background: color-mix(in srgb, var(--brand) 90%, #1e293b) !important;
    box-shadow: 0 8px 18px color-mix(in srgb, var(--brand) 18%, transparent) !important;
}
.vb-stock-sheet {
    padding: 14px !important;
}
.vb-basic-layout {
    gap: 30px !important;
}
.vb-left-fields,
.vb-right-fields {
    gap: 12px !important;
}
.vb-right-fields label,
.vb-full,
.vb-price-inline label,
.vb-money-grid label,
.vb-row-grid label {
    gap: 10px !important;
}
.vb-stock-sheet input,
.vb-stock-sheet textarea,
.vb-stock-sheet select {
    min-height: 38px !important;
    border-radius: 10px !important;
    border: 1px solid color-mix(in srgb, var(--border) 88%, var(--brand) 12%) !important;
    background: color-mix(in srgb, var(--card) 96%, var(--bg)) !important;
    padding: 7px 10px !important;
    transition: border-color .15s ease, box-shadow .15s ease, background .15s ease;
}
.vb-stock-sheet input:focus,
.vb-stock-sheet textarea:focus,
.vb-stock-sheet select:focus {
    border-color: var(--brand) !important;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand) 18%, transparent) !important;
    outline: none !important;
}
.vb-photo-area {
    grid-template-columns: minmax(132px, 160px) minmax(136px, 150px) !important;
    justify-content: end !important;
    gap: 12px !important;
    padding: 10px !important;
    border: 1px solid color-mix(in srgb, var(--border) 80%, var(--brand) 20%);
    border-radius: 16px;
    background: color-mix(in srgb, var(--soft) 22%, var(--card));
}
.vb-image-preview {
    width: 144px !important;
    height: 144px !important;
    border-radius: 14px !important;
    border: 1px dashed color-mix(in srgb, var(--brand) 44%, var(--border)) !important;
    background: color-mix(in srgb, var(--card) 92%, var(--bg)) !important;
    color: var(--muted) !important;
}
.vb-image-preview img {
    object-fit: contain !important;
    padding: 6px;
}
.vb-photo-buttons {
    gap: 8px !important;
}
.vb-photo-btn {
    min-height: 40px !important;
    border-radius: 12px !important;
    border: 1px solid color-mix(in srgb, var(--brand) 42%, var(--border)) !important;
    background: color-mix(in srgb, var(--brand) 12%, var(--card)) !important;
    color: var(--text) !important;
    box-shadow: none !important;
}
.vb-photo-upload,
.vb-photo-btn:hover,
.vb-photo-btn:focus {
    background: var(--brand) !important;
    color: #fff !important;
}
.vb-photo-secondary {
    background: color-mix(in srgb, var(--soft) 40%, var(--card)) !important;
}
.vb-photo-danger {
    border-color: color-mix(in srgb, #dc2626 46%, var(--border)) !important;
    color: #dc2626 !important;
}
.vb-photo-danger:hover,
.vb-photo-danger:focus {
    background: #dc2626 !important;
    color: #fff !important;
}
.vb-packing-band {
    margin-top: 18px !important;
    padding: 14px !important;
    border-radius: 16px !important;
    background: color-mix(in srgb, var(--soft) 26%, var(--card)) !important;
}
.vb-packing-band > strong {
    margin-bottom: 12px !important;
    color: var(--brand-dark);
    font-size: .98rem;
}
.vb-unit-table {
    grid-template-columns: 90px minmax(115px,1fr) 42px minmax(115px,1fr) 42px minmax(115px,1fr) minmax(115px,1fr) !important;
    gap: 9px 10px !important;
}
.vb-unit-table input[name="MainUnit"],
.vb-unit-table input[name="SubUnit1"],
.vb-unit-table input[name="SubUnit2"] {
    pointer-events: auto !important;
    opacity: 1 !important;
    cursor: text !important;
}
.vb-stock-footer-actions {
    grid-template-columns: minmax(140px, 170px) minmax(170px, 210px) !important;
    gap: 28px !important;
    padding: 16px !important;
    background: color-mix(in srgb, var(--soft) 20%, var(--card)) !important;
}
.vb-close-btn,
.vb-save-btn {
    min-height: 46px !important;
    border-radius: 14px !important;
}
.vb-close-btn {
    border: 1px solid var(--border) !important;
    background: color-mix(in srgb, var(--card) 86%, var(--bg)) !important;
    color: var(--text) !important;
}
.vb-save-btn {
    background: var(--brand) !important;
    color: #fff !important;
    box-shadow: 0 12px 24px color-mix(in srgb, var(--brand) 22%, transparent) !important;
}
body.theme-dark .vb-stock-window,
body.theme-midnight .vb-stock-window,
body.theme-carbon .vb-stock-window,
body.theme-dark .vb-packing-band,
body.theme-midnight .vb-packing-band,
body.theme-carbon .vb-packing-band,
body.theme-dark .vb-photo-area,
body.theme-midnight .vb-photo-area,
body.theme-carbon .vb-photo-area {
    background: color-mix(in srgb, var(--card) 86%, #000) !important;
}
@media (max-width: 1180px) {
    .vb-basic-layout { grid-template-columns: 1fr !important; }
    .vb-photo-area { justify-content: start !important; }
}
@media (max-width: 760px) {
    .vb-stock-navrow,
    .vb-unit-table { grid-template-columns: 1fr !important; }
    .vb-unit-table span,
    .vb-unit-table b:empty { display: none; }
}


/* Product create/edit layout correction: compact fields and floating lookup suggestions */
.vb-stock-sheet {
    padding: 14px 18px 16px !important;
}
.vb-basic-layout {
    gap: 18px !important;
    grid-template-columns: minmax(430px, 1fr) minmax(390px, .9fr) !important;
}
.vb-left-fields,
.vb-right-fields {
    gap: 10px !important;
}
.vb-row-grid,
.vb-right-fields label,
.vb-full,
.vb-price-inline label,
.vb-money-grid label {
    min-height: 40px;
}
.vb-row-4 {
    grid-template-columns: 150px minmax(160px, 1fr) 74px minmax(130px, .55fr) !important;
}
.vb-row-2 {
    grid-template-columns: minmax(220px, 1fr) minmax(140px, .55fr) !important;
}
.vb-price-inline {
    margin-top: 18px !important;
    grid-template-columns: minmax(220px, 300px) minmax(120px, 160px) !important;
}
.vb-money-grid {
    margin-top: 18px !important;
    max-width: 520px !important;
    grid-template-columns: minmax(220px, 1fr) minmax(150px, .7fr) !important;
}
.vb-packing-band {
    margin-top: 18px !important;
    padding: 14px 16px 16px !important;
    border-radius: 14px;
}
.vb-unit-table {
    grid-template-columns: 88px minmax(150px, 1fr) 44px minmax(150px, 1fr) 44px minmax(150px, 1fr) minmax(150px, 1fr) !important;
    gap: 8px 10px !important;
}
.vb-unit-table input {
    min-height: 38px !important;
}
.stock-lookup-suggestions.stock-lookup-floating {
    position: fixed !important;
    right: auto !important;
    z-index: 99990 !important;
    max-height: 260px !important;
    overflow: auto !important;
    border-radius: 12px !important;
    box-shadow: 0 16px 34px rgba(15, 23, 42, .22) !important;
}
.stock-lookup-suggestions.stock-lookup-floating .stock-lookup-option,
.stock-lookup-suggestions.stock-lookup-floating .stock-lookup-more {
    min-height: 36px;
    padding: 8px 12px;
}
.stock-lookup-suggestions.stock-lookup-floating .stock-lookup-more {
    position: sticky;
    bottom: 0;
    background: var(--card);
}
.stock-item-edit-page input,
.stock-item-edit-page textarea {
    max-width: 100%;
}
@media (max-width: 1150px) {
    .vb-basic-layout { grid-template-columns: 1fr !important; }
    .vb-unit-table { grid-template-columns: 1fr 1fr !important; }
}


/* Product form compact navigation + Packing/Units readability fix */
.vb-stock-green-title { min-height: 34px !important; }
.vb-stock-navrow {
    grid-template-columns: 76px 76px minmax(360px, 1fr) minmax(360px, 1fr) 76px 76px !important;
    gap: 10px !important;
    padding: 9px 18px !important;
}
.vb-nav-btn { min-height: 36px !important; border-radius: 10px !important; }
.vb-item-code-picker,
.vb-item-size-picker { grid-template-columns: 86px 1fr !important; }
.vb-stock-sheet { padding: 10px 14px 12px !important; }
.vb-basic-layout { gap: 12px !important; }
.vb-left-fields, .vb-right-fields { gap: 7px !important; }
.vb-row-grid,
.vb-right-fields label,
.vb-full,
.vb-price-inline label,
.vb-money-grid label { min-height: 34px !important; }
.vb-stock-sheet input,
.vb-stock-sheet textarea,
.vb-stock-sheet select { min-height: 34px !important; padding: 5px 9px !important; }
.vb-price-inline { margin-top: 10px !important; }
.vb-money-grid { margin-top: 10px !important; gap: 6px 10px !important; }
.vb-packing-band { margin-top: 10px !important; padding: 10px 12px 12px !important; }
.vb-unit-table {
    grid-template-columns: 92px minmax(140px, 1fr) 42px minmax(140px, 1fr) 42px minmax(140px, 1fr) minmax(140px, 1fr) !important;
    gap: 6px 8px !important;
}
.vb-unit-table input { min-height: 32px !important; }
.vb-editable-conversion {
    background: color-mix(in srgb, var(--brand) 7%, var(--card)) !important;
    border-color: color-mix(in srgb, var(--brand) 45%, var(--border)) !important;
    font-weight: 900 !important;
    text-align: center;
}
.vb-readonly-summary,
.vb-unit-table input[readonly].vb-readonly-summary {
    background: color-mix(in srgb, var(--soft) 45%, var(--card)) !important;
    color: var(--muted) !important;
    cursor: default !important;
}
.vb-unit-table b { line-height: 1.05; }
@media (max-width: 1180px) {
    .vb-stock-navrow { grid-template-columns: repeat(2, 76px) minmax(220px,1fr) !important; }
    .vb-stock-navrow .vb-nav-btn:nth-last-child(-n+2), .vb-item-size-picker { display: none; }
}


/* Stock item tax/price four-field matrix and conversion field size fix */
.vb-price-matrix {
    max-width: 620px !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 5px !important;
}
.vb-price-matrix .vb-price-single {
    display: grid !important;
    grid-template-columns: 132px minmax(120px, 170px) !important;
    max-width: 310px;
    min-height: 32px !important;
}
.vb-price-matrix-head,
.vb-price-matrix-row {
    display: grid;
    grid-template-columns: 132px minmax(118px, 1fr) minmax(74px, .55fr) minmax(118px, 1fr);
    gap: 7px;
    align-items: center;
}
.vb-price-matrix-head {
    font-size: .74rem;
    color: var(--muted);
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .025em;
}
.vb-price-matrix-row > span {
    font-size: .86rem;
    color: var(--text);
    font-weight: 950;
}
.vb-price-matrix-row input,
.vb-price-matrix .vb-price-single input {
    text-align: right;
    min-height: 32px !important;
    padding: 5px 8px !important;
}
.vb-price-tax-value {
    color: #008000 !important;
    font-weight: 950 !important;
}
.vb-unit-table {
    grid-template-columns: 92px minmax(160px, 1fr) 58px minmax(160px, 1fr) 58px minmax(160px, 1fr) minmax(160px, 1fr) !important;
    gap: 7px 9px !important;
}
.vb-editable-conversion,
.vb-unit-table input.vb-editable-conversion,
.vb-unit-table input[data-unit-tax-price] {
    min-width: 58px !important;
    width: 58px !important;
    text-align: center !important;
    padding-left: 7px !important;
    padding-right: 7px !important;
    font-size: .92rem !important;
}
.vb-unit-table input[data-unit-tax-price] {
    background: color-mix(in srgb, var(--brand) 7%, var(--card)) !important;
    border-color: color-mix(in srgb, var(--brand) 45%, var(--border)) !important;
    font-weight: 900 !important;
}
@media (max-width: 980px) {
    .vb-price-matrix-head,
    .vb-price-matrix-row { grid-template-columns: 1fr; }
    .vb-price-matrix-head { display: none; }
}

/* Stock Item RackNo runtime lookup create support */
.stock-lookup-create-row {
    display: grid;
    gap: .35rem;
    padding: .7rem .9rem;
    border-bottom: 1px solid var(--border);
    background: color-mix(in srgb, var(--brand) 7%, var(--card));
}
.stock-lookup-create-row[hidden] { display: none !important; }
.stock-lookup-create-row small {
    color: var(--muted);
    font-weight: 700;
}
.stock-lookup-create-btn {
    justify-self: start;
    min-height: 38px;
    padding-inline: 1rem;
}
.stock-lookup-create-inline {
    color: var(--brand) !important;
    font-weight: 950 !important;
}
body.theme-dark .stock-lookup-create-row,
body.theme-midnight .stock-lookup-create-row,
body.theme-carbon .stock-lookup-create-row {
    background: color-mix(in srgb, var(--brand) 14%, var(--card));
}

/* Touch POS 2 unit selection dialog for StockDbf multi-unit products */
.pos-unit-modal {
    width: min(620px, calc(100vw - 32px));
    max-height: min(620px, calc(100vh - 48px));
}
.pos-unit-product-title {
    padding: 12px 16px 4px;
    font-weight: 700;
    color: var(--erp-text, #202124);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.pos-unit-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 12px;
    padding: 12px 16px 18px;
}
.pos-unit-card {
    text-align: left;
    border: 1px solid var(--erp-border, #d8dee8);
    background: var(--erp-card-bg, #fff);
    color: var(--erp-text, #202124);
    border-radius: 16px;
    min-height: 150px;
    padding: 14px;
    box-shadow: 0 8px 22px rgba(15, 23, 42, .08);
    cursor: pointer;
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.pos-unit-card:hover,
.pos-unit-card:focus-visible {
    border-color: var(--erp-primary, #5b7cfa);
    box-shadow: 0 12px 28px rgba(15, 23, 42, .14);
    outline: none;
}
.pos-unit-card.default {
    border-color: var(--erp-primary, #5b7cfa);
}
.pos-unit-card .pos-unit-label {
    font-size: 12px;
    opacity: .72;
    text-transform: uppercase;
    letter-spacing: .02em;
}
.pos-unit-card strong {
    font-size: 22px;
    line-height: 1.1;
}
.pos-unit-card small,
.pos-unit-card em {
    font-style: normal;
    font-size: 12px;
    opacity: .74;
}
.pos-unit-card b {
    margin-top: 5px;
    font-size: 20px;
    color: var(--erp-primary, #5b7cfa);
}
.pos-unit-card i {
    width: fit-content;
    margin-top: auto;
    border-radius: 999px;
    padding: 3px 8px;
    font-size: 11px;
    font-style: normal;
    background: rgba(34, 197, 94, .12);
    color: #15803d;
}
[data-theme="dark"] .pos-unit-card i,
.dark .pos-unit-card i {
    background: rgba(34, 197, 94, .18);
    color: #86efac;
}

/* Touch POS receipt preview: in-page modal avoids browser popup blocking and keeps the POS screen responsive. */
.pos-receipt-modal {
    width: min(520px, 94vw);
    height: min(860px, 94vh);
    max-height: min(860px, 94vh);
}
.pos-receipt-head { gap: 12px; }
.pos-receipt-actions {
    display: flex;
    align-items: center;
    gap: 8px;
}
.pos-receipt-print-btn {
    min-height: 36px;
    border: 0;
    border-radius: 10px;
    padding: 0 14px;
    background: var(--brand);
    color: var(--brand-contrast, #fff);
    font-weight: 900;
    cursor: pointer;
    box-shadow: 0 8px 16px color-mix(in srgb, var(--brand) 22%, transparent);
}
.pos-receipt-print-btn:hover { filter: brightness(.96); }
.pos-receipt-frame {
    flex: 1 1 auto;
    width: 100%;
    min-height: 0;
    border: 0;
    background: #eef2f7;
}
.pos-direct-receipt-frame {
    position: fixed;
    left: -10000px;
    top: 0;
    width: 520px;
    height: 860px;
    border: 0;
    opacity: 0;
    pointer-events: none;
}
@media (max-width: 640px) {
    .pos-receipt-modal {
        width: 100vw;
        height: 100vh;
        max-height: 100vh;
        border-radius: 0;
    }
    .pos-receipt-head { min-height: 54px; padding: 8px 10px; }
    .pos-receipt-print-btn { padding: 0 10px; }
}

/* Stock Items: restored In Trial Units sub-unit price display without rolling back POS receipt modal fixes. */
.stock-unit-price {
    white-space: nowrap;
    vertical-align: middle;
}
.stock-unit-price span {
    font-weight: 700;
}
.stock-unit-price small {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-left: 6px;
    padding: 2px 7px;
    min-width: 34px;
    border-radius: 999px;
    background: var(--theme-surface-muted, #f3f4f6);
    color: var(--theme-text-muted, #6b7280);
    border: 1px solid var(--theme-border, #d8dee9);
    font-size: 11px;
    line-height: 1.2;
}
.stock-unit-price.included small {
    background: color-mix(in srgb, var(--theme-primary, var(--brand)) 10%, white);
    color: var(--theme-primary, var(--brand));
    border-color: color-mix(in srgb, var(--theme-primary, var(--brand)) 28%, #d8dee9);
}
.kanban-line span {
    color: var(--theme-text-muted, #6b7280);
    font-size: 12px;
    margin-left: 3px;
}

/* Stock Items barcode auto-fill from public product barcode APIs. */
.barcode-lookup-status {
    grid-column: 1 / -1;
    margin: -4px 0 6px 96px;
    padding: 8px 12px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.3;
    border: 1px solid var(--border-color, #e8c58a);
    background: rgba(255,255,255,.72);
    color: var(--text-color, #3a281f);
}
.barcode-lookup-status.info { color: #8a4a10; }
.barcode-lookup-status.success { color: #227a2f; background: rgba(40, 167, 69, .08); }
.barcode-lookup-status.warning { color: #9a4b00; background: rgba(255, 193, 7, .10); }
.vb-row-grid .vb-auto-btn[data-barcode-autofill-button] {
    min-width: 74px;
    height: 34px;
    align-self: end;
}


.pos-load-warning {
    position: fixed;
    top: 72px;
    left: 24px;
    right: 24px;
    z-index: 2500;
    padding: 12px 16px;
    border-radius: 12px;
    border: 1px solid rgba(180, 83, 9, 0.35);
    background: #fff7ed;
    color: #7c2d12;
    box-shadow: 0 8px 24px rgba(0,0,0,.12);
    font-weight: 600;
}

/* Suppliers master advanced layout */
.supplier-list-shell .ledger-filter-form { grid-template-columns: minmax(220px, 1fr) minmax(160px, 220px) minmax(180px, 260px); }
.supplier-debit-row { background: color-mix(in srgb, var(--theme-warning, #f59e0b) 12%, transparent); }
.supplier-debit-card { box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--theme-warning, #f59e0b) 36%, transparent); }
.supplier-sheet { padding: 0; overflow: visible; }
.supplier-form-hero { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 18px; padding: 18px; border-bottom: 1px solid var(--border-color); background: color-mix(in srgb, var(--theme-primary, var(--brand)) 6%, transparent); }
.supplier-avatar-panel { display: flex; flex-direction: column; align-items: center; gap: 10px; text-align: center; }
.supplier-photo-placeholder { width: 118px; height: 118px; border-radius: 22px; display: grid; place-items: center; font-size: 48px; background: var(--card-bg); border: 1px solid var(--border-color); box-shadow: var(--soft-shadow); }
.supplier-title-fields { min-width: 0; display: flex; flex-direction: column; justify-content: center; gap: 14px; }
.supplier-title-fields .name-row { align-items: flex-start; }
.supplier-title-fields .odoo-title-input { font-size: 26px; font-weight: 700; min-height: 48px; }
.supplier-kpi-strip { display: grid; grid-template-columns: repeat(3, minmax(120px, 1fr)); gap: 12px; }
.supplier-kpi-strip > div { background: var(--card-bg); border: 1px solid var(--border-color); border-radius: 14px; padding: 12px 14px; }
.supplier-kpi-strip span { display: block; color: var(--muted-text); font-size: 12px; margin-bottom: 3px; }
.supplier-kpi-strip strong { font-size: 16px; }
.supplier-main-grid { padding: 18px; }
.supplier-tabs { margin: 0 18px; }
.supplier-tab-content { padding: 18px; }
.supplier-vat-card { border: 1px dashed var(--border-color); border-radius: 14px; padding: 14px; background: color-mix(in srgb, var(--theme-primary, var(--brand)) 5%, transparent); }
.supplier-opening-toolbar { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: 12px; }
.supplier-opening-toolbar h3 { margin: 0; }
.supplier-opening-card { overflow-x: auto; }
.supplier-opening-table input { min-width: 90px; }
.lookup-trigger-btn { border: 1px solid var(--border-color); background: var(--card-bg); border-radius: 8px; min-width: 38px; cursor: pointer; }
.supplier-account-lookup-shell { display: grid; grid-template-columns: minmax(0, 1fr) 40px; gap: 6px; position: relative; width: 100%; }
.supplier-account-lookup-shell .ledger-account-short-list { grid-column: 1 / -1; }
@media (max-width: 820px) {
  .supplier-form-hero { grid-template-columns: 1fr; }
  .supplier-kpi-strip { grid-template-columns: 1fr; }
  .supplier-list-shell .ledger-filter-form { grid-template-columns: 1fr; }
}

/* Supplier lookup fields: preserve existing lookup behavior instead of normal dropdowns */
.supplier-lookup-shell {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 40px;
    gap: 6px;
    position: relative;
    width: 100%;
}

.supplier-lookup-shell .supplier-lookup-shortlist {
    grid-column: 1 / -1;
}

.supplier-table-lookup {
    min-width: 220px;
}

.supplier-lookup-input[readonly] {
    background: var(--card-bg);
}

.supplier-vat-validation-card {
    display: grid;
    gap: 10px;
}

.vat-validation-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
    gap: 10px;
}

.vat-validation-actions {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.vat-validation-status {
    font-weight: 600;
}

.vat-validation-status.vat-valid {
    color: #15803d;
}

.vat-validation-status.vat-error {
    color: #b91c1c;
}

@media (max-width: 720px) {
    .vat-validation-grid {
        grid-template-columns: 1fr;
    }
}


/* Suppliers active/in-active status actions */
.supplier-status-toggle {
    width: auto;
    min-width: 78px;
    padding: 6px 10px;
    border-radius: 999px;
    font-size: 12px;
    line-height: 1;
}
.supplier-status-toggle.activate {
    border-color: rgba(46, 125, 50, .35);
}
.supplier-status-toggle.deactivate {
    border-color: rgba(198, 40, 40, .35);
}
.supplier-status-form {
    display: inline-flex;
}
.supplier-status-select {
    max-width: 180px;
}

/* Suppliers Odoo-style tab form and relaxed optional validation */
.supplier-required-hint {
    margin: 8px 18px 0;
    padding: 10px 14px;
    border-radius: 12px;
    border: 1px solid color-mix(in srgb, var(--theme-primary, var(--brand)) 22%, transparent);
    background: color-mix(in srgb, var(--theme-primary, var(--brand)) 5%, transparent);
    color: var(--muted-text);
    font-size: 13px;
}

.supplier-tabs.odoo-tabs {
    display: flex;
    gap: 0;
    margin: 0 18px;
    border-bottom: 1px solid var(--border-color);
    overflow-x: auto;
}

.supplier-tabs.odoo-tabs .tab-button {
    appearance: none;
    border: 0;
    border-bottom: 3px solid transparent;
    background: transparent;
    color: var(--muted-text);
    padding: 13px 18px 11px;
    font-weight: 700;
    cursor: pointer;
    white-space: nowrap;
}

.supplier-tabs.odoo-tabs .tab-button:hover {
    color: var(--theme-primary, var(--brand));
    background: color-mix(in srgb, var(--theme-primary, var(--brand)) 5%, transparent);
}

.supplier-tabs.odoo-tabs .tab-button.active {
    color: var(--theme-primary, var(--brand));
    border-bottom-color: var(--theme-primary, var(--brand));
    background: var(--card-bg);
}

.supplier-tab-content {
    padding: 18px;
    background: var(--card-bg);
    border-radius: 0 0 16px 16px;
}

.supplier-tab-content .tab-panel {
    display: none;
}

.supplier-tab-content .tab-panel.active {
    display: block;
}

.supplier-editor-form .field-validation-error,
.supplier-editor-form .validation {
    grid-column: 2 / -1;
}

/* Suppliers edit toolbar: keep Delete button visually aligned with Alter/Close actions */
.odoo-actions .odoo-danger {
    border: 0;
    background: color-mix(in srgb, var(--danger, #dc3545) 88%, var(--brand));
    color: #fff;
    border-radius: 4px;
    padding: 8px 18px;
    min-height: 34px;
    font-size: 14px;
    line-height: 18px;
    font-weight: 700;
    cursor: pointer;
    text-decoration: none;
    box-shadow: 0 8px 18px color-mix(in srgb, var(--danger, #dc3545) 22%, transparent);
    appearance: none;
    -webkit-appearance: none;
}

.odoo-actions .odoo-danger:hover {
    background: color-mix(in srgb, var(--danger, #dc3545) 78%, black);
    color: #fff;
}

.odoo-actions .odoo-danger:focus {
    outline: 2px solid color-mix(in srgb, var(--danger, #dc3545) 40%, white);
    outline-offset: 2px;
}

/* Advanced Settings full InventorySettings.vb tab layout */
.advanced-settings-sheet .settings-note {
    padding: 10px 12px;
    margin-bottom: 14px;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.45);
    border: 1px solid rgba(160, 78, 16, 0.18);
    font-weight: 600;
    color: var(--erp-muted, #5f5045);
}
.advanced-settings-grid .odoo-field-group {
    align-self: start;
}
.advanced-settings-grid .check-row {
    min-height: 34px;
}
.advanced-settings-grid .check-row input[type="checkbox"] {
    width: 20px;
    height: 20px;
    accent-color: var(--erp-primary, #9b3f0c);
}

/* Advanced Settings - InventorySettings.vb tab conversion */
.advanced-vb-statusbar {
    align-items: center;
    border-bottom: 1px solid var(--border-color, #ead18b);
    background: var(--surface-muted, #fff1be);
}
.advanced-vb-statusbar .odoo-actions {
    display: flex;
    gap: .75rem;
    align-items: center;
}
.advanced-vb-title {
    flex: 1;
    text-align: center;
    font-size: 1.35rem;
    color: var(--primary-color, #8f3f0c);
    letter-spacing: .02em;
}
.advanced-vb-sheet {
    padding: 0;
    overflow: hidden;
}
.advanced-vb-tabs {
    padding: 0 .25rem;
    border-bottom: 1px solid var(--border-color, #ead18b);
    background: var(--surface-color, #fff8dc);
}
.advanced-vb-tabs .tab-button {
    border: 1px solid transparent;
    border-bottom: none;
    background: transparent;
    padding: .45rem .75rem;
    color: var(--text-color, #2b1607);
    cursor: pointer;
}
.advanced-vb-tabs .tab-button.active {
    background: var(--card-bg, #fffbea);
    border-color: var(--border-color, #ead18b);
    color: var(--primary-color, #8f3f0c);
    font-weight: 700;
}
.advanced-vb-content .tab-panel {
    display: none;
}
.advanced-vb-content .tab-panel.active {
    display: block;
}
.advanced-vb-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 2.5rem;
    padding: 1.25rem 2rem 2rem;
}
.advanced-vb-column {
    display: flex;
    flex-direction: column;
    gap: .55rem;
}
.advanced-vb-row {
    display: grid;
    grid-template-columns: minmax(280px, 1fr) minmax(86px, 180px);
    align-items: center;
    gap: .75rem;
    min-height: 30px;
}
.advanced-vb-row label {
    text-align: right;
    font-weight: 600;
    color: var(--text-color, #2b1607);
    line-height: 1.15;
}
.advanced-vb-input,
.advanced-vb-row select,
.advanced-vb-row input[type="text"],
.advanced-vb-row input[type="number"] {
    width: 100%;
    min-height: 30px;
    border: 1px solid var(--border-color, #d8ba6b);
    border-radius: 4px;
    background: var(--input-bg, #fffdf5);
    color: var(--text-color, #2b1607);
    padding: .25rem .45rem;
}
.advanced-vb-row input[type="checkbox"] {
    justify-self: start;
    width: 18px;
    height: 18px;
}
@media (max-width: 1100px) {
    .advanced-vb-grid { grid-template-columns: 1fr; gap: 1rem; padding: 1rem; }
    .advanced-vb-row { grid-template-columns: minmax(180px, 1fr) minmax(86px, 180px); }
}
@media (max-width: 700px) {
    .advanced-vb-row { grid-template-columns: 1fr; gap: .25rem; }
    .advanced-vb-row label { text-align: left; }
}

/* Advanced Settings YES/NO toggle buttons */
.advanced-yn-toggle {
    position: relative;
    justify-self: start;
    display: inline-flex;
    align-items: center;
    width: 86px;
    height: 30px;
    cursor: pointer;
    user-select: none;
    margin: 0;
}
.advanced-yn-toggle-input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}
.advanced-yn-toggle-slider {
    position: absolute;
    inset: 0;
    border: 1px solid var(--border-color, #d8ba6b);
    border-radius: 999px;
    background: #efe4bf;
    box-shadow: inset 0 1px 2px rgba(0,0,0,.12);
    transition: background .18s ease, border-color .18s ease;
}
.advanced-yn-toggle-slider::before {
    content: "";
    position: absolute;
    top: 3px;
    left: 4px;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #fffdf5;
    box-shadow: 0 1px 4px rgba(0,0,0,.28);
    transition: transform .18s ease;
}
.advanced-yn-toggle-text {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: 1fr 1fr;
    width: 100%;
    padding: 0 9px;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .02em;
    line-height: 30px;
    color: var(--text-muted, #6b5744);
}
.advanced-yn-toggle-text .yes { text-align: left; opacity: .35; }
.advanced-yn-toggle-text .no { text-align: right; opacity: 1; }
.advanced-yn-toggle.is-on .advanced-yn-toggle-slider {
    background: var(--primary-color, #9b3f0c);
    border-color: var(--primary-color, #9b3f0c);
}
.advanced-yn-toggle.is-on .advanced-yn-toggle-slider::before {
    transform: translateX(56px);
}
.advanced-yn-toggle.is-on .advanced-yn-toggle-text {
    color: #fff;
}
.advanced-yn-toggle.is-on .advanced-yn-toggle-text .yes { opacity: 1; }
.advanced-yn-toggle.is-on .advanced-yn-toggle-text .no { opacity: .35; }
.advanced-yn-toggle-input:focus-visible + .advanced-yn-toggle-slider {
    outline: 3px solid rgba(155,63,12,.25);
    outline-offset: 2px;
}

/* Advanced Settings YES/NO toggle buttons */
.advanced-yn-toggle {
    position: relative;
    justify-self: start;
    display: inline-flex;
    align-items: center;
    width: 86px;
    height: 30px;
    cursor: pointer;
    user-select: none;
    margin: 0;
}
.advanced-yn-toggle-input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}
.advanced-yn-toggle-slider {
    position: absolute;
    inset: 0;
    border: 1px solid var(--border-color, #d8ba6b);
    border-radius: 999px;
    background: #efe4bf;
    box-shadow: inset 0 1px 2px rgba(0,0,0,.12);
    transition: background .18s ease, border-color .18s ease;
}
.advanced-yn-toggle-slider::before {
    content: "";
    position: absolute;
    top: 3px;
    left: 4px;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #fffdf5;
    box-shadow: 0 1px 4px rgba(0,0,0,.28);
    transition: transform .18s ease;
}
.advanced-yn-toggle-text {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: 1fr 1fr;
    width: 100%;
    padding: 0 9px;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .02em;
    line-height: 30px;
    color: var(--text-muted, #6b5744);
}
.advanced-yn-toggle-text .yes { text-align: left; opacity: .35; }
.advanced-yn-toggle-text .no { text-align: right; opacity: 1; }
.advanced-yn-toggle.is-on .advanced-yn-toggle-slider {
    background: var(--primary-color, #9b3f0c);
    border-color: var(--primary-color, #9b3f0c);
}
.advanced-yn-toggle.is-on .advanced-yn-toggle-slider::before {
    transform: translateX(56px);
}
.advanced-yn-toggle.is-on .advanced-yn-toggle-text {
    color: #fff;
}
.advanced-yn-toggle.is-on .advanced-yn-toggle-text .yes { opacity: 1; }
.advanced-yn-toggle.is-on .advanced-yn-toggle-text .no { opacity: .35; }
.advanced-yn-toggle-input:focus-visible + .advanced-yn-toggle-slider {
    outline: 3px solid rgba(155,63,12,.25);
    outline-offset: 2px;
}

/* Customers page styles mirrored from Suppliers conversion */
.customer-list-shell .ledger-filter-form { grid-template-columns: minmax(220px, 1fr) minmax(160px, 220px) minmax(180px, 260px); }
.customer-debit-row { background: color-mix(in srgb, var(--theme-warning, #f59e0b) 12%, transparent); }
.customer-debit-card { box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--theme-warning, #f59e0b) 36%, transparent); }
.customer-sheet { padding: 0; overflow: visible; }
.customer-form-hero { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 18px; padding: 18px; border-bottom: 1px solid var(--border-color); background: color-mix(in srgb, var(--theme-primary, var(--brand)) 6%, transparent); }
.customer-avatar-panel { display: flex; flex-direction: column; align-items: center; gap: 10px; text-align: center; }
.customer-photo-placeholder { width: 118px; height: 118px; border-radius: 22px; display: grid; place-items: center; font-size: 48px; background: var(--card-bg); border: 1px solid var(--border-color); box-shadow: var(--soft-shadow); }
.customer-title-fields { min-width: 0; display: flex; flex-direction: column; justify-content: center; gap: 14px; }
.customer-title-fields .name-row { align-items: flex-start; }
.customer-title-fields .odoo-title-input { font-size: 26px; font-weight: 700; min-height: 48px; }
.customer-kpi-strip { display: grid; grid-template-columns: repeat(3, minmax(120px, 1fr)); gap: 12px; }
.customer-kpi-strip > div { background: var(--card-bg); border: 1px solid var(--border-color); border-radius: 14px; padding: 12px 14px; }
.customer-kpi-strip span { display: block; color: var(--muted-text); font-size: 12px; margin-bottom: 3px; }
.customer-kpi-strip strong { font-size: 16px; }
.customer-main-grid { padding: 18px; }
.customer-tabs { margin: 0 18px; }
.customer-tab-content { padding: 18px; }
.customer-vat-card { border: 1px dashed var(--border-color); border-radius: 14px; padding: 14px; background: color-mix(in srgb, var(--theme-primary, var(--brand)) 5%, transparent); }
.customer-opening-toolbar { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: 12px; }
.customer-opening-toolbar h3 { margin: 0; }
.customer-opening-card { overflow-x: auto; }
.customer-opening-table input { min-width: 90px; }
.lookup-trigger-btn { border: 1px solid var(--border-color); background: var(--card-bg); border-radius: 8px; min-width: 38px; cursor: pointer; }
.customer-account-lookup-shell { display: grid; grid-template-columns: minmax(0, 1fr) 40px; gap: 6px; position: relative; width: 100%; }
.customer-account-lookup-shell .ledger-account-short-list { grid-column: 1 / -1; }
@media (max-width: 820px) {
  .customer-form-hero { grid-template-columns: 1fr; }
  .customer-kpi-strip { grid-template-columns: 1fr; }
  .customer-list-shell .ledger-filter-form { grid-template-columns: 1fr; }
}

/* Customer lookup fields: preserve existing lookup behavior instead of normal dropdowns */
.customer-lookup-shell {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 40px;
    gap: 6px;
    position: relative;
    width: 100%;
}

.customer-lookup-shell .customer-lookup-shortlist {
    grid-column: 1 / -1;
}

.customer-table-lookup {
    min-width: 220px;
}

.customer-lookup-input[readonly] {
    background: var(--card-bg);
}

.customer-vat-validation-card {
    display: grid;
    gap: 10px;
}

.vat-validation-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
    gap: 10px;
}

.vat-validation-actions {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.vat-validation-status {
    font-weight: 600;
}

.vat-validation-status.vat-valid {
    color: #15803d;
}

.vat-validation-status.vat-error {
    color: #b91c1c;
}

@media (max-width: 720px) {
    .vat-validation-grid {
        grid-template-columns: 1fr;
    }
}


/* Customers active/in-active status actions */
.customer-status-toggle {
    width: auto;
    min-width: 78px;
    padding: 6px 10px;
    border-radius: 999px;
    font-size: 12px;
    line-height: 1;
}
.customer-status-toggle.activate {
    border-color: rgba(46, 125, 50, .35);
}
.customer-status-toggle.deactivate {
    border-color: rgba(198, 40, 40, .35);
}
.customer-status-form {
    display: inline-flex;
}
.customer-status-select {
    max-width: 180px;
}

/* Customers Odoo-style tab form and relaxed optional validation */
.customer-required-hint {
    margin: 8px 18px 0;
    padding: 10px 14px;
    border-radius: 12px;
    border: 1px solid color-mix(in srgb, var(--theme-primary, var(--brand)) 22%, transparent);
    background: color-mix(in srgb, var(--theme-primary, var(--brand)) 5%, transparent);
    color: var(--muted-text);
    font-size: 13px;
}

.customer-tabs.odoo-tabs {
    display: flex;
    gap: 0;
    margin: 0 18px;
    border-bottom: 1px solid var(--border-color);
    overflow-x: auto;
}

.customer-tabs.odoo-tabs .tab-button {
    appearance: none;
    border: 0;
    border-bottom: 3px solid transparent;
    background: transparent;
    color: var(--muted-text);
    padding: 13px 18px 11px;
    font-weight: 700;
    cursor: pointer;
    white-space: nowrap;
}

.customer-tabs.odoo-tabs .tab-button:hover {
    color: var(--theme-primary, var(--brand));
    background: color-mix(in srgb, var(--theme-primary, var(--brand)) 5%, transparent);
}

.customer-tabs.odoo-tabs .tab-button.active {
    color: var(--theme-primary, var(--brand));
    border-bottom-color: var(--theme-primary, var(--brand));
    background: var(--card-bg);
}

.customer-tab-content {
    padding: 18px;
    background: var(--card-bg);
    border-radius: 0 0 16px 16px;
}

.customer-tab-content .tab-panel {
    display: none;
}

.customer-tab-content .tab-panel.active {
    display: block;
}

.customer-editor-form .field-validation-error,
.customer-editor-form .validation {
    grid-column: 2 / -1;
}

/* Customers edit toolbar: keep Delete button visually aligned with Alter/Close actions */
.odoo-actions .odoo-danger {
    border: 0;
    background: color-mix(in srgb, var(--danger, #dc3545) 88%, var(--brand));
    color: #fff;
    border-radius: 4px;
    padding: 8px 18px;
    min-height: 34px;
    font-size: 14px;
    line-height: 18px;
    font-weight: 700;
    cursor: pointer;
    text-decoration: none;
    box-shadow: 0 8px 18px color-mix(in srgb, var(--danger, #dc3545) 22%, transparent);
    appearance: none;
    -webkit-appearance: none;
}

.odoo-actions .odoo-danger:hover {
    background: color-mix(in srgb, var(--danger, #dc3545) 78%, black);
    color: #fff;
}

.odoo-actions .odoo-danger:focus {
    outline: 2px solid color-mix(in srgb, var(--danger, #dc3545) 40%, white);
    outline-offset: 2px;
}



/* Touch POS 2 payment buttons - universal icons for easier understanding */
.pos-pay-chip,
.pos-payment-method-tile {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .55rem;
}

.pos-pay-chip::before,
.pos-payment-method-tile::before {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.05rem;
    line-height: 1;
}

.pos-pay-chip[data-payment="Cash"]::before,
.pos-payment-method-tile[data-payment-method="Cash"]::before {
    content: "💵";
}

.pos-pay-chip[data-payment="Card"]::before,
.pos-payment-method-tile[data-payment-method="Card"]::before {
    content: "💳";
}

.pos-pay-chip[data-payment="On Account"]::before,
.pos-payment-method-tile[data-payment-method="On Account"]::before {
    content: "🧾";
}

.pos-pay-chip[data-payment="Card Terminal"]::before,
.pos-payment-method-tile[data-payment-method="Card Terminal"]::before {
    content: "🏧";
}

.pos-pay-chip[data-payment="Apple Pay"]::before,
.pos-payment-method-tile[data-payment-method="Apple Pay"]::before {
    content: "📱";
}

.pos-pay-chip[data-payment="Google Pay"]::before,
.pos-payment-method-tile[data-payment-method="Google Pay"]::before {
    content: "📲";
}


/* Touch POS 2 payment modal selected method status - small plain text aligned with Amount */
.pos-payment-amount-head {
    min-height: 24px;
    margin: 0 4px 4px;
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
}

.pos-payment-amount-head .pos-payment-amount-label {
    margin: 0;
}

.pos-payment-method-status {
    min-height: 0;
    margin: 0;
    padding: 0;
    flex: 0 0 auto;
    display: inline-flex;
    align-items: baseline;
    justify-content: flex-end;
    text-align: right;
    font-size: .9rem;
    font-weight: 950;
    letter-spacing: .02em;
    color: var(--brand-dark);
    background: transparent;
    border: 0;
}

/* Login PIN / Password card mode and responsive on-screen keypad */
.login-mode-cards {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin: 18px 0 8px;
}

.login-mode-card {
    min-height: 92px;
    border: 1px solid var(--border, #ccd3da);
    border-radius: 16px;
    background: color-mix(in srgb, var(--card, #fff) 88%, var(--bg, #f6f8fb));
    color: var(--text, #0f172a);
    display: grid;
    place-items: center;
    gap: 3px;
    padding: 12px 8px;
    cursor: pointer;
    box-shadow: 0 10px 24px rgba(15, 23, 42, .06);
    transition: transform .15s ease, border-color .15s ease, box-shadow .15s ease, background .15s ease;
}

.login-mode-card:hover,
.login-mode-card:focus {
    outline: none;
    transform: translateY(-1px);
    border-color: var(--brand, #714b67);
    box-shadow: 0 14px 30px rgba(15, 23, 42, .10);
}

.login-mode-card.active {
    background: var(--brand, #714b67);
    border-color: var(--brand, #714b67);
    color: #fff;
}

.login-mode-icon {
    font-size: 1.6rem;
    line-height: 1;
}

.login-mode-card strong {
    font-size: 1rem;
}

.login-mode-card small {
    opacity: .82;
    font-weight: 700;
}

.login-secret-input {
    text-align: center;
    font-size: 1.2rem;
    font-weight: 900;
    letter-spacing: .08em;
}

.login-input-hint {
    display: block;
    margin-top: 6px;
    color: var(--muted, #64748b);
    font-size: .82rem;
    font-weight: 700;
}

.login-keypad-panel {
    margin-top: 12px;
}

.login-pin-pad {
    display: grid;
    grid-template-columns: repeat(3, minmax(64px, 1fr));
    gap: 10px;
}

.login-password-keyboard {
    display: grid;
    gap: 8px;
}

.login-key-row {
    display: flex;
    gap: 7px;
    justify-content: center;
}

.login-pin-pad button,
.login-key-row button {
    min-height: 48px;
    border: 1px solid var(--border, #ccd3da);
    border-radius: 12px;
    background: color-mix(in srgb, var(--card, #fff) 86%, var(--bg, #f6f8fb));
    color: var(--text, #0f172a);
    font-size: 1.02rem;
    font-weight: 950;
    cursor: pointer;
}

.login-key-row button {
    min-width: 40px;
    padding: 0 10px;
}

.login-pin-pad button:hover,
.login-pin-pad button:focus,
.login-key-row button:hover,
.login-key-row button:focus,
.login-key-row button.active {
    outline: none;
    background: var(--brand, #714b67);
    color: #fff;
    border-color: var(--brand, #714b67);
}

.login-wide-key {
    min-width: 72px !important;
}

.login-symbol-row button {
    min-width: 46px;
}

@media (min-width: 820px) {
    .login-card {
        width: min(720px, calc(100vw - 40px));
    }
}

@media (max-width: 760px), (pointer: coarse) {
    .login-card {
        width: min(420px, calc(100vw - 24px));
        padding: 22px;
    }

    .login-mode-cards {
        gap: 10px;
    }

    .login-mode-card {
        min-height: 82px;
    }

    .desktop-login-keypads {
        display: none !important;
    }

    .login-secret-input {
        text-align: left;
        letter-spacing: normal;
    }
}

/* Login keypad click-only behavior */
.login-keypad-panel[hidden],
.login-pin-pad[hidden],
.login-password-keyboard[hidden] {
    display: none !important;
}

/* Touch POS 2 Customer Display */
.customer-display-body {
    margin: 0;
    min-height: 100vh;
    background: radial-gradient(circle at top left, color-mix(in srgb, var(--brand, #714b67) 18%, transparent), transparent 32%), var(--bg, #f6f8fb);
    color: var(--text, #0f172a);
    overflow: hidden;
}

.customer-display-page {
    min-height: 100vh;
    display: grid;
    grid-template-rows: auto auto 1fr;
    gap: 18px;
    padding: clamp(18px, 3vw, 34px);
}

.customer-display-header,
.customer-display-ticket-info,
.customer-display-lines-card,
.customer-display-summary-card {
    background: var(--card, #fff);
    border: 1px solid color-mix(in srgb, var(--brand, #714b67) 16%, transparent);
    box-shadow: 0 18px 45px rgba(15, 23, 42, .08);
    border-radius: 26px;
}

.customer-display-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: clamp(18px, 3vw, 28px);
}

.customer-display-brand {
    display: flex;
    align-items: center;
    gap: clamp(12px, 2vw, 22px);
    min-width: 0;
}

.customer-display-brand-text {
    min-width: 0;
}

.customer-display-header-logo-wrap {
    width: clamp(54px, 7vw, 92px);
    height: clamp(54px, 7vw, 92px);
    border-radius: 18px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    background: color-mix(in srgb, var(--brand, #714b67) 7%, var(--card, #fff));
    border: 1px solid color-mix(in srgb, var(--brand, #714b67) 18%, transparent);
    overflow: hidden;
}

.customer-display-header-logo-wrap img {
    max-width: 86%;
    max-height: 86%;
    object-fit: contain;
}

.customer-display-header-logo-fallback {
    color: var(--brand, #714b67);
    font-weight: 950;
    font-size: clamp(1.05rem, 2vw, 1.65rem);
    letter-spacing: .04em;
}

.customer-display-kicker {
    color: var(--brand, #714b67);
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
    font-size: .82rem;
}

.customer-display-header h1 {
    margin: 4px 0 4px;
    font-size: clamp(2rem, 4vw, 4.2rem);
    line-height: 1;
}

.customer-display-header p {
    margin: 0;
    color: var(--muted, #64748b);
    font-weight: 800;
}

.customer-display-status {
    min-width: 160px;
    text-align: center;
    background: var(--brand, #714b67);
    color: #fff;
    padding: 16px 22px;
    border-radius: 999px;
    font-weight: 950;
    font-size: clamp(1.1rem, 2vw, 1.6rem);
}

.customer-display-ticket-info {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    padding: 16px 22px;
}

.customer-display-ticket-info div,
.customer-display-summary-row,
.customer-display-total-row,
.customer-display-payments div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}

.customer-display-ticket-info span,
.customer-display-summary-row span,
.customer-display-payments span {
    color: var(--muted, #64748b);
    font-weight: 850;
}

.customer-display-ticket-info strong {
    font-size: clamp(1rem, 2vw, 1.4rem);
}

.customer-display-content {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(320px, 420px);
    gap: 18px;
    min-height: 0;
}

.customer-display-lines-card,
.customer-display-summary-card {
    padding: clamp(18px, 2vw, 26px);
    min-height: 0;
}

.customer-display-lines-card h2 {
    margin: 0 0 14px;
    font-size: clamp(1.5rem, 3vw, 2.4rem);
}

.customer-display-lines {
    display: grid;
    gap: 12px;
    max-height: calc(100vh - 310px);
    overflow: auto;
    padding-right: 4px;
}

.customer-display-line {
    display: grid;
    grid-template-columns: 1fr auto auto;
    gap: 20px;
    align-items: center;
    padding: 18px;
    background: color-mix(in srgb, var(--brand, #714b67) 6%, var(--card, #fff));
    border-radius: 18px;
    font-size: clamp(1.1rem, 2vw, 1.8rem);
}

.customer-display-line strong {
    display: block;
}

.customer-display-line small {
    display: block;
    margin-top: 3px;
    color: var(--muted, #64748b);
    font-weight: 700;
    font-size: .78em;
}

.customer-display-line b {
    font-size: 1.08em;
}

.customer-display-empty {
    display: grid;
    place-items: center;
    min-height: 260px;
    border: 2px dashed color-mix(in srgb, var(--brand, #714b67) 22%, transparent);
    border-radius: 22px;
    color: var(--muted, #64748b);
    font-weight: 900;
    font-size: clamp(1.2rem, 3vw, 2.3rem);
    text-align: center;
}

.customer-display-summary-card {
    display: grid;
    align-content: start;
    gap: 16px;
}

.customer-display-message {
    background: color-mix(in srgb, var(--brand, #714b67) 10%, var(--card, #fff));
    color: var(--brand, #714b67);
    border-radius: 18px;
    padding: 18px;
    font-weight: 950;
    font-size: clamp(1.1rem, 2.4vw, 2rem);
    text-align: center;
}

.customer-display-summary-row,
.customer-display-total-row {
    font-size: clamp(1.05rem, 2vw, 1.55rem);
}

.customer-display-total-row {
    padding: 20px 0;
    border-top: 1px solid color-mix(in srgb, var(--brand, #714b67) 18%, transparent);
    border-bottom: 1px solid color-mix(in srgb, var(--brand, #714b67) 18%, transparent);
}

.customer-display-total-row span,
.customer-display-total-row strong {
    font-size: clamp(1.7rem, 3vw, 2.8rem);
    font-weight: 950;
}

.customer-display-payments {
    display: grid;
    gap: 8px;
    border-top: 1px solid color-mix(in srgb, var(--brand, #714b67) 14%, transparent);
    padding-top: 14px;
}

@media (max-width: 900px) {
    .customer-display-body { overflow: auto; }
    .customer-display-content { grid-template-columns: 1fr; }
    .customer-display-ticket-info { grid-template-columns: 1fr; }
    .customer-display-lines { max-height: none; }
}

/* Touch POS 2 customer display QR payment panel */
.customer-display-qr-card {
    margin: 12px 0 16px;
    padding: 18px;
    border-radius: 22px;
    background: color-mix(in srgb, var(--card, #fff) 88%, var(--brand, #714b67));
    border: 1px solid color-mix(in srgb, var(--brand, #714b67) 28%, transparent);
    box-shadow: 0 18px 42px rgba(15, 23, 42, .16);
    display: grid;
    place-items: center;
    gap: 12px;
}

.customer-display-qr-card[hidden] {
    display: none !important;
}

.customer-display-qr-head {
    width: 100%;
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    font-weight: 900;
}

.customer-display-qr-head span {
    font-size: 1.05rem;
    color: var(--muted, #64748b);
}

.customer-display-qr-head strong {
    font-size: clamp(1.6rem, 4vw, 2.4rem);
    color: var(--brand, #714b67);
}

#cdQrCanvas {
    width: min(320px, 78vw);
    height: min(320px, 78vw);
    background: #fff;
    border-radius: 18px;
    padding: 12px;
    box-shadow: inset 0 0 0 1px rgba(15, 23, 42, .08);
}

.customer-display-qr-status {
    font-size: clamp(1.1rem, 2vw, 1.45rem);
    font-weight: 950;
    color: var(--text, #0f172a);
    text-align: center;
}

#cdQrReference {
    max-width: 100%;
    color: var(--muted, #64748b);
    font-weight: 700;
    text-align: center;
    overflow-wrap: anywhere;
}

@media (max-width: 820px) {
    .customer-display-qr-card {
        padding: 14px;
    }
}

/* Touch POS 2 customer display compact no-page-scroll layout */
.customer-display-body {
    width: 100vw;
    height: 100vh;
    height: 100dvh;
    min-height: 0;
    overflow: hidden !important;
}

.customer-display-page {
    width: 100vw;
    height: 100vh;
    height: 100dvh;
    min-height: 0;
    overflow: hidden;
    grid-template-rows: auto auto minmax(0, 1fr);
    gap: clamp(6px, 1.2vh, 10px);
    padding: clamp(6px, 1.4vw, 12px);
    box-sizing: border-box;
}

.customer-display-header,
.customer-display-ticket-info,
.customer-display-lines-card,
.customer-display-summary-card {
    border-radius: clamp(12px, 1.8vw, 18px);
    box-shadow: 0 8px 22px rgba(15, 23, 42, .07);
}

.customer-display-header {
    padding: clamp(8px, 1.4vh, 12px) clamp(10px, 1.6vw, 16px);
}

.customer-display-brand {
    gap: clamp(8px, 1.2vw, 14px);
}

.customer-display-header-logo-wrap {
    width: clamp(38px, 5vw, 56px);
    height: clamp(38px, 5vw, 56px);
    border-radius: 12px;
}

.customer-display-kicker {
    font-size: clamp(.58rem, 1.2vw, .72rem);
}

.customer-display-header h1 {
    margin: 1px 0;
    font-size: clamp(1.25rem, 2.8vw, 2.15rem);
    line-height: 1.02;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 62vw;
}

.customer-display-header p {
    font-size: clamp(.68rem, 1.3vw, .82rem);
}

.customer-display-status {
    min-width: 90px;
    padding: clamp(6px, 1.2vh, 9px) clamp(10px, 1.4vw, 14px);
    font-size: clamp(.82rem, 1.7vw, 1.05rem);
}

.customer-display-ticket-info {
    grid-template-columns: 1fr 1fr auto;
    gap: clamp(4px, .8vw, 8px);
    padding: clamp(6px, 1.1vh, 9px) clamp(8px, 1.4vw, 12px);
}

.customer-display-ticket-info div,
.customer-display-summary-row,
.customer-display-total-row,
.customer-display-payments div {
    gap: 8px;
}

.customer-display-ticket-info span,
.customer-display-summary-row span,
.customer-display-payments span {
    font-size: clamp(.62rem, 1.15vw, .78rem);
}

.customer-display-ticket-info strong {
    font-size: clamp(.78rem, 1.55vw, .98rem);
    max-width: 24vw;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.customer-display-content {
    grid-template-columns: minmax(0, 1fr) minmax(250px, 32vw);
    gap: clamp(6px, 1.2vw, 10px);
    min-height: 0;
    overflow: hidden;
}

.customer-display-lines-card,
.customer-display-summary-card {
    padding: clamp(8px, 1.4vw, 12px);
    min-height: 0;
    overflow: hidden;
}

.customer-display-lines-card h2 {
    margin: 0 0 clamp(5px, 1vh, 8px);
    font-size: clamp(1rem, 2vw, 1.35rem);
    line-height: 1;
}

.customer-display-lines {
    gap: clamp(4px, .8vh, 7px);
    max-height: none;
    height: calc(100% - 28px);
    overflow: hidden;
    padding-right: 0;
    align-content: start;
}

.customer-display-line {
    grid-template-columns: minmax(0, 1fr) auto auto;
    gap: clamp(6px, 1vw, 10px);
    padding: clamp(6px, 1.1vh, 9px) clamp(8px, 1.2vw, 11px);
    border-radius: clamp(10px, 1.4vw, 14px);
    font-size: clamp(.78rem, 1.45vw, 1.05rem);
    line-height: 1.12;
}

.customer-display-line strong {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}

.customer-display-line small {
    margin-top: 1px;
    font-size: .66em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.customer-display-line b {
    font-size: 1em;
    white-space: nowrap;
}

.customer-display-more-lines {
    padding: 5px 8px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--brand, #714b67) 9%, var(--card, #fff));
    color: var(--muted, #64748b);
    font-weight: 900;
    text-align: center;
    font-size: clamp(.72rem, 1.25vw, .9rem);
}

.customer-display-empty {
    min-height: 0;
    height: 100%;
    font-size: clamp(.95rem, 2vw, 1.4rem);
    border-radius: 16px;
}

.customer-display-summary-card {
    gap: clamp(4px, .75vh, 7px);
}

.customer-display-message {
    padding: clamp(6px, 1.2vh, 9px);
    border-radius: clamp(10px, 1.4vw, 14px);
    font-size: clamp(.78rem, 1.45vw, 1.02rem);
    line-height: 1.12;
    min-height: 0;
}

.customer-display-summary-row,
.customer-display-total-row {
    font-size: clamp(.76rem, 1.35vw, .98rem);
    line-height: 1.1;
}

.customer-display-total-row {
    padding: clamp(6px, 1.2vh, 10px) 0;
}

.customer-display-total-row span,
.customer-display-total-row strong {
    font-size: clamp(1.05rem, 2.2vw, 1.55rem);
}

.customer-display-payments {
    gap: 4px;
    padding-top: 6px;
    min-height: 0;
    overflow: hidden;
}

.customer-display-payments div:nth-child(n+4) {
    display: none;
}

.customer-display-qr-card {
    margin: clamp(2px, .5vh, 5px) 0 clamp(3px, .7vh, 6px);
    padding: clamp(6px, 1.1vh, 9px);
    border-radius: clamp(12px, 1.6vw, 16px);
    gap: clamp(4px, .8vh, 7px);
    box-shadow: 0 8px 24px rgba(15, 23, 42, .12);
}

.customer-display-qr-head span {
    font-size: clamp(.7rem, 1.2vw, .9rem);
}

.customer-display-qr-head strong {
    font-size: clamp(1rem, 2.2vw, 1.4rem);
}

#cdQrCanvas {
    width: clamp(118px, min(22vh, 22vw), 190px);
    height: clamp(118px, min(22vh, 22vw), 190px);
    border-radius: clamp(10px, 1.5vw, 14px);
    padding: clamp(4px, .8vw, 8px);
}

.customer-display-qr-status {
    font-size: clamp(.78rem, 1.3vw, 1rem);
    line-height: 1.1;
}

#cdQrReference {
    max-height: 2.2em;
    overflow: hidden;
    font-size: clamp(.58rem, 1vw, .72rem);
    line-height: 1.1;
}

@media (max-height: 620px) {
    .customer-display-page { gap: 5px; padding: 5px; }
    .customer-display-header { padding: 6px 9px; }
    .customer-display-ticket-info { padding: 5px 8px; }
    .customer-display-lines-card, .customer-display-summary-card { padding: 7px; }
    .customer-display-message { display: none; }
    .customer-display-line small { display: none; }
    #cdQrCanvas { width: clamp(104px, min(20vh, 20vw), 150px); height: clamp(104px, min(20vh, 20vw), 150px); }
    .customer-display-summary-row { font-size: clamp(.7rem, 1.2vw, .88rem); }
    .customer-display-total-row span, .customer-display-total-row strong { font-size: clamp(.98rem, 2vw, 1.3rem); }
}

@media (max-width: 820px) {
    .customer-display-body { overflow: hidden !important; }
    .customer-display-content {
        grid-template-columns: minmax(0, 1fr) minmax(190px, 36vw);
    }
    .customer-display-ticket-info {
        grid-template-columns: 1fr 1fr;
    }
    .customer-display-ticket-info div:last-child {
        display: none;
    }
    .customer-display-header h1 { max-width: 54vw; }
}

@media (max-width: 560px) {
    .customer-display-content {
        grid-template-columns: 1fr;
        grid-template-rows: minmax(0, 1fr) auto;
    }
    .customer-display-summary-card {
        grid-template-columns: 1fr 1fr;
        align-content: start;
    }
    .customer-display-message,
    .customer-display-payments { display: none; }
    .customer-display-qr-card {
        grid-column: 1 / -1;
    }
    #cdQrCanvas { width: 110px; height: 110px; }
}

.odoo-hint-line {
    margin: .35rem 0 .85rem;
    color: var(--muted, #64748b);
    font-size: .875rem;
    font-weight: 600;
}


/* Touch POS 2 customer display: QR covers the full items area while header/totals stay visible */
.customer-display-has-qr .customer-display-content {
    min-height: 0;
    overflow: hidden;
}

.customer-display-has-qr .customer-display-lines-card {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    min-height: 0;
    overflow: hidden;
}

.customer-display-has-qr .customer-display-lines-card h2 {
    text-align: center;
    margin-bottom: clamp(4px, .8vh, 8px);
}

.customer-display-has-qr .customer-display-lines {
    display: none !important;
}

.customer-display-has-qr .customer-display-qr-main,
.customer-display-qr-main:not([hidden]) {
    height: 100%;
    min-height: 0;
    margin: 0;
    padding: clamp(8px, 1.8vmin, 18px);
    border-radius: clamp(14px, 2vmin, 22px);
    display: grid;
    grid-template-rows: auto minmax(0, auto) auto auto;
    place-items: center;
    align-content: center;
    justify-content: center;
    gap: clamp(5px, 1vmin, 12px);
    overflow: hidden;
}

.customer-display-has-qr .customer-display-qr-head {
    width: min(100%, 680px);
    display: grid;
    grid-template-columns: 1fr;
    justify-items: center;
    align-items: center;
    gap: clamp(1px, .4vh, 4px);
    text-align: center;
}

.customer-display-has-qr .customer-display-qr-head span {
    font-size: clamp(.82rem, 1.8vmin, 1.25rem);
    line-height: 1.05;
}

.customer-display-has-qr .customer-display-qr-head strong {
    font-size: clamp(1.6rem, 5vmin, 3.5rem);
    line-height: 1;
}

.customer-display-has-qr #cdQrCanvas {
    width: min(52vh, 48vw, 520px);
    height: min(52vh, 48vw, 520px);
    max-width: 100%;
    max-height: 100%;
    padding: clamp(6px, 1.1vmin, 14px);
    border-radius: clamp(12px, 1.8vmin, 22px);
}

.customer-display-has-qr .customer-display-qr-status {
    font-size: clamp(.9rem, 2vmin, 1.4rem);
    line-height: 1.05;
    margin: 0;
}

.customer-display-has-qr #cdQrReference {
    max-width: min(100%, 720px);
    max-height: 2.2em;
    font-size: clamp(.62rem, 1.25vmin, .86rem);
    line-height: 1.1;
    overflow: hidden;
    text-overflow: ellipsis;
}

.customer-display-has-qr .customer-display-summary-card {
    min-height: 0;
    overflow: hidden;
}

@media (max-height: 650px) {
    .customer-display-has-qr .customer-display-qr-main,
    .customer-display-qr-main:not([hidden]) {
        padding: clamp(5px, 1.2vmin, 10px);
        gap: clamp(3px, .7vmin, 7px);
    }
    .customer-display-has-qr #cdQrCanvas {
        width: min(48vh, 42vw, 360px);
        height: min(48vh, 42vw, 360px);
    }
    .customer-display-has-qr .customer-display-qr-head strong {
        font-size: clamp(1.25rem, 4vmin, 2.3rem);
    }
}

@media (max-width: 560px) {
    .customer-display-has-qr .customer-display-content {
        grid-template-columns: 1fr;
        grid-template-rows: minmax(0, 1fr) auto;
    }
    .customer-display-has-qr #cdQrCanvas {
        width: min(74vw, 40vh, 340px);
        height: min(74vw, 40vh, 340px);
    }
}

/* ERP session/logout customer display idle screen */
.customer-display-idle-screen {
    position: fixed;
    inset: 0;
    z-index: 50;
    display: grid;
    place-items: center;
    align-content: center;
    gap: clamp(10px, 2.2vh, 22px);
    padding: clamp(18px, 4vw, 42px);
    text-align: center;
    background: radial-gradient(circle at center top, color-mix(in srgb, var(--brand, #714b67) 14%, transparent), transparent 44%), var(--bg, #f6f8fb);
    color: var(--text, #0f172a);
}

.customer-display-idle-screen[hidden] {
    display: none !important;
}

.customer-display-logged-out > .customer-display-header,
.customer-display-logged-out > .customer-display-ticket-info,
.customer-display-logged-out > .customer-display-content {
    display: none !important;
}

.customer-display-idle-logo-wrap {
    width: clamp(112px, 18vw, 230px);
    height: clamp(112px, 18vw, 230px);
    border-radius: clamp(22px, 4vw, 44px);
    display: grid;
    place-items: center;
    background: var(--card, #fff);
    border: 1px solid color-mix(in srgb, var(--brand, #714b67) 22%, transparent);
    box-shadow: 0 18px 48px rgba(15, 23, 42, .14);
    overflow: hidden;
}

.customer-display-idle-logo-wrap img {
    max-width: 86%;
    max-height: 86%;
    object-fit: contain;
}

.customer-display-idle-logo-fallback {
    font-size: clamp(2.1rem, 6vw, 5.2rem);
    font-weight: 950;
    color: var(--brand, #714b67);
    letter-spacing: .04em;
}

.customer-display-idle-screen h1 {
    margin: 0;
    font-size: clamp(1.6rem, 5vw, 4.4rem);
    line-height: 1;
    font-weight: 950;
    max-width: 90vw;
    overflow-wrap: anywhere;
}

.customer-display-idle-screen p {
    margin: 0;
    color: var(--muted, #64748b);
    font-size: clamp(.9rem, 2.4vw, 1.55rem);
    font-weight: 800;
    max-width: 84vw;
}

.customer-display-idle-screen time {
    color: var(--brand, #714b67);
    font-size: clamp(.95rem, 2.2vw, 1.5rem);
    font-weight: 900;
}


/* Customer Display invoice/customer/date compact inline labels */
.customer-display-ticket-info {
    grid-template-columns: minmax(0, 1fr) minmax(150px, auto) minmax(0, 1fr);
    align-items: center;
    gap: clamp(6px, 1.4vw, 16px);
}

.customer-display-ticket-info .customer-display-ticket-field {
    justify-content: flex-start;
    gap: 6px;
    min-width: 0;
}

.customer-display-ticket-info .customer-display-ticket-field:first-child {
    justify-self: start;
    text-align: left;
}

.customer-display-ticket-info .customer-display-ticket-customer {
    justify-self: center;
    justify-content: center;
    text-align: center;
}

.customer-display-ticket-info .customer-display-ticket-field span {
    white-space: nowrap;
}

.customer-display-ticket-info .customer-display-ticket-field strong {
    max-width: min(32vw, 520px);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.customer-display-ticket-info .customer-display-ticket-time {
    display: flex !important;
    justify-self: end;
    justify-content: flex-end;
    text-align: right;
}

.customer-display-ticket-info .customer-display-ticket-time strong {
    max-width: min(34vw, 360px);
    font-size: clamp(.72rem, 1.35vw, .98rem);
}

@media (max-width: 820px) {
    .customer-display-ticket-info {
        grid-template-columns: minmax(0, 1fr) minmax(70px, auto) minmax(0, 1fr);
        gap: 5px;
    }
    .customer-display-ticket-info .customer-display-ticket-time {
        display: flex !important;
    }
    .customer-display-ticket-info .customer-display-ticket-time span {
        display: none;
    }
    .customer-display-ticket-info .customer-display-ticket-field {
        gap: 4px;
    }
    .customer-display-ticket-info .customer-display-ticket-field span {
        font-size: clamp(.56rem, 1.8vw, .72rem);
    }
    .customer-display-ticket-info .customer-display-ticket-field strong {
        font-size: clamp(.64rem, 2vw, .88rem);
    }
    .customer-display-ticket-info .customer-display-ticket-customer strong {
        max-width: 25vw;
    }
    .customer-display-ticket-info .customer-display-ticket-time strong {
        max-width: 31vw;
    }
}

.customer-display-message {
    white-space: normal;
}

.customer-display-lines-card {
    display: flex;
    flex-direction: column;
}

.customer-display-lines-card h2 {
    flex: 0 0 auto;
}

.customer-display-lines {
    flex: 1 1 auto;
    min-height: 0;
    height: auto;
}

.customer-display-thankyou {
    flex: 1 1 auto;
    min-height: clamp(220px, 52vh, 620px);
    display: grid;
    place-items: center;
    margin: 0;
    padding: clamp(22px, 5vw, 60px);
    border-radius: clamp(12px, 1.8vw, 18px);
    background: color-mix(in srgb, var(--brand, #714b67) 4%, var(--card, #fff));
    color: var(--text, #0f172a);
    font-size: clamp(1.9rem, 4.5vw, 4.6rem);
    font-weight: 950;
    line-height: 1.05;
    text-align: center;
    text-wrap: balance;
    text-shadow: 0 1px 2px rgba(15, 23, 42, .2);
}

.customer-display-thankyou[hidden] {
    display: none !important;
}

.pos-save-btn:disabled,
.pos-payment-btn:disabled,
.pos-save-btn.is-busy,
.pos-payment-btn.is-busy {
    cursor: wait;
    opacity: .62;
    pointer-events: none;
}

/* Daily Sales Report conversion */
.daily-sales-report-page {
    display: grid;
    gap: 16px;
}

.daily-sales-results-host {
    min-width: 0;
    transition: opacity .16s ease;
}

.daily-sales-results-host.loading {
    opacity: .58;
    pointer-events: none;
}

.daily-sales-results {
    display: grid;
    gap: 16px;
    min-width: 0;
}

.daily-sales-filter-bar {
    display: grid;
    grid-template-columns: repeat(6, minmax(140px, 1fr)) auto;
    gap: 10px;
    align-items: end;
    padding: 14px;
    background: var(--card-bg, #fff);
    border: 1px solid color-mix(in srgb, var(--brand, #714b67) 14%, transparent);
    border-radius: 8px;
    box-shadow: 0 10px 26px rgba(15, 23, 42, .06);
}

.daily-sales-filter-bar label {
    display: grid;
    gap: 5px;
    min-width: 0;
    font-weight: 800;
    color: var(--text, #0f172a);
}

.daily-sales-filter-bar label span {
    font-size: 12px;
    color: var(--muted, #64748b);
}

.daily-sales-filter-bar input,
.daily-sales-filter-bar select {
    min-height: 34px;
    width: 100%;
    border: 1px solid color-mix(in srgb, var(--brand, #714b67) 18%, #d1d5db);
    border-radius: 6px;
    padding: 6px 8px;
    background: var(--card-bg, #fff);
    color: var(--text, #0f172a);
}

.daily-sales-filter-actions {
    display: flex;
    gap: 8px;
    align-items: center;
    flex-wrap: wrap;
}

.daily-sales-print-head {
    display: none;
    text-align: center;
}

.daily-sales-summary-grid {
    display: grid;
    grid-template-columns: repeat(9, minmax(100px, 1fr));
    gap: 10px;
}

.daily-sales-summary-grid article {
    padding: 12px;
    border: 1px solid color-mix(in srgb, var(--brand, #714b67) 14%, transparent);
    border-radius: 8px;
    background: var(--card-bg, #fff);
}

.daily-sales-summary-grid span {
    display: block;
    color: var(--muted, #64748b);
    font-size: 12px;
    font-weight: 800;
}

.daily-sales-summary-grid strong {
    display: block;
    margin-top: 4px;
    font-size: 18px;
    color: var(--text, #0f172a);
}

.daily-sales-card {
    padding: 0;
    overflow: hidden;
}

.daily-sales-documents-card {
    min-width: 0;
}

.daily-sales-card-title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    padding: 14px 16px;
    border-bottom: 1px solid color-mix(in srgb, var(--brand, #714b67) 12%, transparent);
}

.daily-sales-card-title h2 {
    margin: 0;
    font-size: 18px;
}

.daily-sales-card-title p {
    margin: 2px 0 0;
}

.daily-sales-record-count {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 4px 10px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--brand, #714b67) 8%, var(--card-bg, #fff));
    color: var(--brand, #714b67);
    font-size: 12px;
    font-weight: 900;
    white-space: nowrap;
}

.daily-sales-table-wrap {
    overflow: auto;
    max-height: calc(100vh - 330px);
    scrollbar-gutter: stable;
}

.daily-sales-item-wrap {
    overflow: auto;
    max-height: min(52vh, 520px);
}

.daily-sales-table {
    width: 100%;
    min-width: 100%;
    table-layout: fixed;
    border-collapse: separate;
    border-spacing: 0;
}

.daily-sales-items-table {
    min-width: 860px;
}

.daily-sales-table .num,
.daily-sales-items-table .num {
    text-align: right;
    white-space: nowrap;
}

.daily-sales-table .strong {
    font-weight: 900;
}

.daily-sales-customer {
    min-width: 0;
}

.daily-sales-document-no {
    font-weight: 900;
    color: var(--brand, #714b67);
}

.daily-sales-table tr.selected-row {
    background: color-mix(in srgb, var(--brand, #714b67) 10%, var(--card-bg, #fff));
}

.daily-sales-table th {
    position: sticky;
    top: 0;
    z-index: 6;
    height: 42px;
    background: color-mix(in srgb, var(--brand, #714b67) 8%, var(--card-bg, #fff));
    box-shadow: inset 0 -1px 0 rgba(15, 23, 42, .12), 0 2px 4px rgba(15, 23, 42, .04);
    line-height: 1.15;
}

.daily-sales-action-col {
    text-align: center;
    width: 70px;
    min-width: 70px;
}

.daily-sales-item-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 28px;
    padding: 4px 10px;
    border-radius: 6px;
    background: var(--brand, #714b67);
    color: #fff;
    font-size: 12px;
    font-weight: 900;
    text-decoration: none;
}

.daily-sales-item-link:hover {
    filter: brightness(.95);
}

.daily-sales-lookup-backdrop {
    position: fixed;
    inset: 0;
    z-index: 80;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 22px;
    background: rgba(15, 23, 42, .44);
}

.daily-sales-lookup-backdrop.open {
    display: flex;
}

.daily-sales-lookup {
    width: min(1160px, 96vw);
    max-height: 88vh;
    display: grid;
    grid-template-rows: auto auto auto minmax(0, 1fr);
    overflow: hidden;
    background: var(--card-bg, #fff);
    color: var(--text, #0f172a);
    border-radius: 8px;
    box-shadow: 0 24px 70px rgba(15, 23, 42, .28);
}

.daily-sales-lookup-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 18px;
    padding: 18px 20px;
    border-bottom: 1px solid color-mix(in srgb, var(--brand, #714b67) 12%, transparent);
}

.daily-sales-lookup-head span {
    color: var(--muted, #64748b);
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
}

.daily-sales-lookup-head h2 {
    margin: 2px 0 3px;
    font-size: 24px;
}

.daily-sales-lookup-head p {
    margin: 0;
    color: var(--muted, #64748b);
    font-weight: 800;
}

.daily-sales-lookup-close {
    width: 34px;
    height: 34px;
    display: inline-grid;
    place-items: center;
    border-radius: 50%;
    background: color-mix(in srgb, var(--brand, #714b67) 8%, var(--card-bg, #fff));
    color: var(--text, #0f172a);
    font-size: 26px;
    line-height: 1;
    text-decoration: none;
}

.daily-sales-lookup-summary {
    display: grid;
    grid-template-columns: repeat(5, minmax(130px, 1fr));
    gap: 10px;
    padding: 14px 20px 8px;
}

.daily-sales-lookup-summary article {
    padding: 10px 12px;
    border: 1px solid color-mix(in srgb, var(--brand, #714b67) 12%, transparent);
    border-radius: 6px;
    background: color-mix(in srgb, var(--brand, #714b67) 4%, var(--card-bg, #fff));
}

.daily-sales-lookup-summary span {
    display: block;
    color: var(--muted, #64748b);
    font-size: 11px;
    font-weight: 900;
}

.daily-sales-lookup-summary strong {
    display: block;
    margin-top: 3px;
    overflow: hidden;
    color: var(--text, #0f172a);
    font-size: 15px;
    font-weight: 950;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.daily-sales-lookup-actions {
    display: flex;
    justify-content: flex-end;
    padding: 0 20px 12px;
}

.daily-sales-status {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 78px;
    padding: 3px 8px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 900;
    white-space: nowrap;
}

.daily-sales-status.invoiced {
    background: #16a34a;
    color: #fff;
}

.daily-sales-status.cancelled {
    background: #dc2626;
    color: #fff;
}

.daily-sales-status.pending {
    background: #fef3c7;
    color: #b45309;
}

.daily-sales-odoo-toolbar {
    display: grid;
    grid-template-columns: auto minmax(320px, 1fr) auto;
    gap: 10px;
    align-items: center;
    padding: 8px 12px 12px;
    border: 1px solid color-mix(in srgb, var(--brand, #714b67) 12%, transparent);
    border-radius: 8px;
    background: var(--card-bg, #fff);
    box-shadow: 0 10px 24px rgba(15, 23, 42, .05);
}

.daily-sales-toolbar-left,
.daily-sales-toolbar-tools {
    display: flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
}

.daily-sales-toolbar-left {
    flex-wrap: wrap;
}

.daily-sales-toolbar-left button.odoo-discard {
    border: 0;
    background: transparent;
    cursor: pointer;
    font: inherit;
}

.daily-sales-toolbar-left button.odoo-discard:disabled {
    cursor: default;
    opacity: .48;
}

.daily-sales-toolbar-tools {
    justify-content: flex-end;
    white-space: nowrap;
}

.daily-sales-searchbar {
    min-height: 38px;
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr);
    align-items: center;
    border: 1px solid color-mix(in srgb, var(--brand, #714b67) 16%, #d1d5db);
    border-radius: 4px;
    background: var(--card-bg, #fff);
}

.daily-sales-searchbar .search-icon {
    display: grid;
    place-items: center;
    color: var(--muted, #64748b);
    font-weight: 900;
}

.daily-sales-searchbar input {
    min-width: 0;
    min-height: 36px;
    border: 0;
    outline: 0;
    background: transparent;
    color: var(--text, #0f172a);
    font-weight: 700;
}

.daily-sales-range {
    padding: 0 8px;
    color: var(--text, #0f172a);
    font-weight: 900;
}

.daily-sales-toolbar-tools .odoo-page-btn.disabled {
    pointer-events: none;
    opacity: .45;
}

.daily-sales-filter-strip {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(6, minmax(135px, 1fr));
    gap: 8px;
    padding-top: 6px;
}

.daily-sales-filter-strip label {
    display: grid;
    gap: 4px;
    min-width: 0;
    color: var(--text, #0f172a);
    font-weight: 850;
}

.daily-sales-filter-strip label span {
    color: var(--muted, #64748b);
    font-size: 11px;
    font-weight: 900;
}

.daily-sales-filter-strip input,
.daily-sales-filter-strip select {
    min-height: 32px;
    width: 100%;
    border: 1px solid color-mix(in srgb, var(--brand, #714b67) 15%, #d1d5db);
    border-radius: 4px;
    padding: 5px 7px;
    background: var(--card-bg, #fff);
    color: var(--text, #0f172a);
    font-weight: 700;
}

.daily-sales-column-picker .daily-sales-column-menu {
    width: 235px;
}

.daily-sales-table {
    width: 100%;
    min-width: 100%;
    table-layout: fixed;
    border-collapse: separate !important;
    border-spacing: 0;
}

.daily-sales-table th,
.daily-sales-table td,
.daily-sales-items-table th,
.daily-sales-items-table td {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    vertical-align: middle;
}

.daily-sales-table thead th {
    padding-top: 11px;
    padding-right: 18px;
    padding-bottom: 11px;
    background: color-mix(in srgb, var(--brand, #714b67) 8%, var(--card-bg, #fff));
}

.daily-sales-table thead th[data-daily-sales-col] {
    user-select: none;
}

.daily-sales-resize-handle {
    position: absolute;
    top: 0;
    right: -4px;
    bottom: 0;
    z-index: 10;
    width: 9px;
    cursor: col-resize;
    touch-action: none;
}

.daily-sales-resize-handle::after {
    content: "";
    position: absolute;
    top: 9px;
    right: 4px;
    bottom: 9px;
    width: 1px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--brand, #714b67) 45%, #94a3b8);
    opacity: .42;
}

.daily-sales-table thead th[data-daily-sales-col]:hover .daily-sales-resize-handle::after,
.daily-sales-table thead th.is-resizing .daily-sales-resize-handle::after {
    width: 2px;
    opacity: .95;
}

body.daily-sales-column-resizing,
body.daily-sales-column-resizing * {
    cursor: col-resize !important;
    user-select: none !important;
}

.daily-sales-table tbody td {
    height: 50px;
    background: var(--card-bg, #fff);
}

.daily-sales-table tbody tr:hover td {
    background: color-mix(in srgb, var(--brand, #714b67) 5%, var(--card-bg, #fff));
}

.daily-sales-table tbody tr.is-selected {
    background: color-mix(in srgb, var(--brand, #714b67) 9%, var(--card-bg, #fff));
}

.daily-sales-table tbody tr.is-selected td {
    background: color-mix(in srgb, var(--brand, #714b67) 9%, var(--card-bg, #fff));
}

.daily-sales-check-col {
    width: 42px;
    min-width: 42px;
    text-align: center;
}

.daily-sales-check-col input {
    width: 16px;
    height: 16px;
    accent-color: var(--brand, #714b67);
}

.daily-sales-sno-col {
    width: 54px;
    min-width: 54px;
}

.daily-sales-date-col {
    width: 136px;
    min-width: 136px;
}

.daily-sales-delivery-col,
.daily-sales-invoice-col {
    width: 112px;
    min-width: 112px;
}

.daily-sales-customer-col {
    width: 180px;
    min-width: 180px;
    max-width: none;
}

.daily-sales-money-col {
    width: 84px;
    min-width: 84px;
}

.daily-sales-tin-col {
    width: 82px;
    min-width: 82px;
}

.daily-sales-doc-type-col,
.daily-sales-status-col {
    width: 92px;
    min-width: 92px;
}

.daily-sales-created-by-col {
    width: 92px;
    min-width: 92px;
}

.daily-sales-customer {
    overflow: hidden;
    text-overflow: ellipsis;
}

.daily-sales-selected-bar {
    position: sticky;
    bottom: 0;
    z-index: 3;
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    padding: 10px 14px;
    border-top: 1px solid color-mix(in srgb, var(--brand, #714b67) 14%, transparent);
    background: color-mix(in srgb, var(--card-bg, #fff) 94%, var(--brand, #714b67));
    color: var(--text, #0f172a);
    box-shadow: 0 -8px 20px rgba(15, 23, 42, .06);
}

.daily-sales-selected-bar strong {
    color: var(--brand, #714b67);
    font-size: 14px;
}

.daily-sales-selected-bar span {
    color: var(--muted, #64748b);
    font-size: 12px;
    font-weight: 900;
}

.daily-sales-selected-bar b {
    display: inline-block;
    margin-left: 4px;
    color: var(--text, #0f172a);
    font-size: 13px;
}

.daily-sales-selected-bar:not(.has-selection) {
    opacity: .74;
}

.daily-sales-clear-selection {
    min-height: 28px;
    margin-left: auto;
    border: 1px solid color-mix(in srgb, var(--brand, #714b67) 18%, #d1d5db);
    border-radius: 4px;
    padding: 4px 10px;
    background: var(--card-bg, #fff);
    color: var(--text, #0f172a);
    font-weight: 850;
    cursor: pointer;
}

.daily-sales-clear-selection:hover {
    border-color: var(--brand, #714b67);
    color: var(--brand, #714b67);
}

.daily-sales-selected-footer td {
    position: sticky;
    bottom: 0;
    z-index: 5;
    height: 44px;
    border-top: 2px solid color-mix(in srgb, var(--brand, #714b67) 28%, transparent);
    border-bottom: 0;
    background: color-mix(in srgb, var(--brand, #714b67) 5%, var(--card-bg, #fff));
    box-shadow: 0 -5px 14px rgba(15, 23, 42, .06);
}

.daily-sales-selected-footer:not(.has-selection) td {
    color: var(--muted, #64748b);
}

.daily-sales-selected-footer strong {
    display: block;
    color: var(--brand, #714b67);
    font-size: 12px;
    font-weight: 950;
    text-align: right;
}

.daily-sales-selected-footer b {
    color: var(--text, #0f172a);
    font-size: 13px;
    font-weight: 950;
}

.daily-sales-selected-label {
    text-align: right;
}

.daily-sales-selected-footer .daily-sales-clear-selection {
    width: 24px;
    height: 24px;
    min-height: 24px;
    margin-left: 0;
    padding: 0;
    border-radius: 4px;
    line-height: 1;
}

@media (max-width: 1200px) {
    .daily-sales-odoo-toolbar {
        grid-template-columns: 1fr;
    }
    .daily-sales-toolbar-tools {
        justify-content: flex-start;
    }
    .daily-sales-filter-strip {
        grid-template-columns: repeat(2, minmax(150px, 1fr));
    }
    .daily-sales-filter-bar {
        grid-template-columns: repeat(3, minmax(150px, 1fr));
    }
    .daily-sales-filter-actions {
        grid-column: 1 / -1;
    }
    .daily-sales-summary-grid {
        grid-template-columns: repeat(3, minmax(100px, 1fr));
    }
    .daily-sales-lookup-summary {
        grid-template-columns: repeat(2, minmax(130px, 1fr));
    }
}

@media print {
    body {
        background: #fff !important;
    }
    .erp-sidebar,
    .mobile-sidebar-toggle,
    .daily-sales-report-topbar,
    .daily-sales-filter-bar,
    .daily-sales-odoo-toolbar,
    .daily-sales-lookup-backdrop,
    .daily-sales-selected-bar,
    .daily-sales-selected-footer,
    .daily-sales-check-col,
    .daily-sales-action-col,
    .daily-sales-card-title .btn-secondary,
    .user-panel {
        display: none !important;
    }
    .main-area,
    .daily-sales-report-page,
    .daily-sales-card,
    .table-card {
        display: block !important;
        padding: 0 !important;
        margin: 0 !important;
        box-shadow: none !important;
        border: 0 !important;
        background: #fff !important;
    }
    .daily-sales-print-head {
        display: block;
        margin-bottom: 10px;
    }
    .daily-sales-print-head h2,
    .daily-sales-print-head p {
        margin: 0 0 4px;
    }
    .daily-sales-summary-grid {
        grid-template-columns: repeat(5, 1fr);
        margin-bottom: 8px;
    }
    .daily-sales-summary-grid article {
        box-shadow: none;
        border: 1px solid #d1d5db;
        padding: 6px;
    }
    .daily-sales-table-wrap {
        max-height: none;
        overflow: visible;
    }
    .daily-sales-table {
        min-width: 0 !important;
        width: 100% !important;
        font-size: 10px;
    }
    .daily-sales-table th {
        position: static;
    }
    .daily-sales-table th,
    .daily-sales-table td {
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
        padding: 4px 5px;
    }
}

/* frmSales additions: customer detail, payment due summary, status ribbon, vehicle/detail entry. */
.sales-odoo-sheet {
    position: relative;
    overflow: hidden;
    padding-top: 6px;
}

.sales-customer-detail-card {
    grid-column: 1 / -1;
    display: grid;
    gap: 2px;
    min-height: 52px;
    margin: -4px 0 4px 166px;
    padding: 6px 8px;
    border-left: 3px solid color-mix(in srgb, var(--sales-odoo-purple) 45%, #d8dadd);
    color: #111827;
    background: color-mix(in srgb, var(--sales-odoo-purple) 4%, #fff);
    font-size: 13px;
    line-height: 1.28;
    white-space: pre-line;
}

.sales-customer-detail-card strong {
    display: block;
    font-size: 14px;
    font-weight: 800;
}

.sales-customer-detail-card span {
    display: block;
    color: #374151;
    font-size: 13px;
    font-weight: 600;
}

.sales-status-ribbon {
    position: absolute;
    z-index: 12;
    top: 24px;
    right: -58px;
    width: 220px;
    height: 38px;
    display: grid;
    place-items: center;
    transform: rotate(45deg);
    background: #6b7280;
    color: #fff;
    box-shadow: 0 2px 8px rgba(15, 23, 42, .22);
    font-size: 12px;
    font-weight: 950;
    letter-spacing: .035em;
    text-transform: uppercase;
    pointer-events: none;
}

.sales-status-ribbon.paid { background: #16a34a; }
.sales-status-ribbon.delivered { background: var(--theme-primary, var(--brand, #714b67)); }
.sales-status-ribbon.partial-paid { background: #d97706; }
.sales-status-ribbon.on-account { background: #7c3aed; }
.sales-status-ribbon.cancelled { background: #dc2626; }
.sales-status-ribbon.draft,
.sales-status-ribbon.un-paid { background: #64748b; }

.sales-total-line.sales-paid-line {
    margin-top: 8px;
    color: #017e84;
    font-style: italic;
    font-weight: 700;
}

.sales-total-line.sales-paid-line strong {
    color: #111827;
    font-style: normal;
}

.sales-total-line.amount-due strong {
    color: #111827;
    font-size: 18px;
    font-weight: 900;
}

.pos-payment-amount-display {
    width: 100%;
    text-align: right;
    appearance: textfield;
}

.pos-payment-amount-display::-webkit-outer-spin-button,
.pos-payment-amount-display::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

@media (max-width: 760px) {
    .sales-customer-detail-card { margin-left: 0; }
    .sales-status-ribbon { top: 18px; right: -70px; width: 220px; height: 36px; font-size: 11px; }
}
.pos-payment-amount-display[data-payment-amount-input] {
    display: block;
    min-height: 68px;
}

/* Theme bridge for POS (Sales), Touch POS, payment popups, lookup/load modals, and form screens.
   Keep every converted screen on the selected ERP theme instead of hard-coded Odoo/POS colors. */
.sales-entry-page,
.pos-touch-page,
.odoo-form-shell,
.scaffold-page,
.customer-page,
.customers-page,
.suppliers-page,
.stock-item-edit-page,
.ledger-page,
.pos-payment-touch-modal,
.pos-orders-modal,
.sales-product-modal,
.sales-catalog-modal,
.sales-lookup-modal,
.erp-lookup-modal {
    --sales-accent: var(--theme-primary, var(--brand, #714b67));
    --sales-accent-dark: var(--theme-secondary, var(--brand-dark, #52364b));
    --sales-soft: color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 10%, var(--card, #fff));
    --sales-line: var(--border, #e5e7eb);
    --sales-odoo-purple: var(--theme-primary, var(--brand, #714b67));
    --sales-odoo-border: var(--border, #e5e7eb);
    --sales-odoo-muted: var(--muted, #6b7280);
    --sales-odoo-ink: var(--text, #111827);
    --sales-odoo-link: var(--theme-primary, var(--brand, #714b67));
}

.sales-entry-page .sales-odoo-actionbar,
.sales-entry-page .sales-odoo-tabs,
.sales-entry-page .sales-order-lines .sales-items-table th,
.pos-touch-page .pos-topbar,
.pos-touch-page .pos-left-panel,
.pos-touch-page .pos-cart-panel,
.pos-touch-page .pos-orders-head,
.pos-payment-touch-modal .pos-payment-touch-head,
.pos-orders-modal .pos-orders-head,
.sales-product-modal .sales-product-modal-head,
.sales-catalog-modal .sales-catalog-head,
.sales-lookup-modal .sales-lookup-head {
    background: color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 8%, var(--card, #fff));
    border-color: var(--border, #e5e7eb);
    color: var(--text, #111827);
}

.sales-entry-page .sales-mini-new,
.sales-entry-page .sales-odoo-actionbar .sales-action,
.sales-entry-page .sales-line-links button,
.sales-entry-page .sales-summary-buttons button,
.pos-touch-page .pos-save-btn,
.pos-touch-page .pos-payment-btn,
.pos-touch-page .pos-open-orders-btn,
.pos-orders-modal button,
.pos-payment-touch-modal button,
.erp-lookup-modal button {
    border-color: color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 24%, var(--border, #e5e7eb));
    color: var(--text, #111827);
}

.sales-entry-page .sales-mini-new:hover,
.sales-entry-page .sales-odoo-actionbar .sales-action:hover,
.pos-touch-page .pos-save-btn:hover,
.pos-touch-page .pos-open-orders-btn:hover,
.pos-orders-modal button:hover,
.pos-payment-touch-modal button:hover,
.erp-lookup-modal button:hover {
    background: color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 13%, var(--card, #fff));
}

.sales-entry-page .sales-odoo-actionbar .sales-action.primary,
.sales-entry-page .sales-card-step,
.sales-entry-page .sales-product-modal-close,
.sales-entry-page .sales-catalog-close,
.pos-touch-page .pos-payment-btn,
.pos-touch-page .pos-primary-action,
.pos-payment-touch-modal .pos-payment-btn,
.pos-payment-touch-modal .pos-payment-method-tile.active,
.pos-orders-modal .pos-orders-row.active {
    background: var(--theme-primary, var(--brand, #714b67));
    border-color: var(--theme-primary, var(--brand, #714b67));
    color: #fff;
}

.sales-entry-page input,
.sales-entry-page select,
.sales-entry-page textarea,
.pos-touch-page input,
.pos-touch-page select,
.pos-touch-page textarea,
.pos-payment-touch-modal input,
.pos-payment-touch-modal select,
.pos-orders-modal input,
.sales-product-modal input,
.sales-catalog-modal input,
.sales-lookup-modal input,
.erp-lookup-modal input {
    background: var(--card, #fff);
    color: var(--text, #111827);
    border-color: var(--border, #e5e7eb);
}

.sales-entry-page input:focus,
.sales-entry-page select:focus,
.sales-entry-page textarea:focus,
.pos-touch-page input:focus,
.pos-payment-touch-modal input:focus,
.pos-orders-modal input:focus,
.sales-product-modal input:focus,
.sales-catalog-modal input:focus,
.sales-lookup-modal input:focus,
.erp-lookup-modal input:focus {
    border-color: var(--theme-primary, var(--brand, #714b67));
    outline: 0;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 18%, transparent);
}

.sales-entry-page .sales-paid-line span,
.sales-entry-page .sales-paid-line strong {
    color: var(--theme-primary, var(--brand, #714b67));
    font-weight: 800;
}

.sales-entry-page .amount-due strong,
.sales-entry-page [data-bill-balance] {
    color: var(--theme-secondary, var(--brand-dark, #52364b));
}

body.theme-dark .sales-entry-page input,
body.theme-dark .sales-entry-page select,
body.theme-dark .sales-entry-page textarea,
body.theme-dark .pos-touch-page input,
body.theme-dark .pos-payment-touch-modal input,
body.theme-dark .pos-orders-modal input,
body.theme-midnight .sales-entry-page input,
body.theme-midnight .sales-entry-page select,
body.theme-midnight .sales-entry-page textarea,
body.theme-midnight .pos-touch-page input,
body.theme-midnight .pos-payment-touch-modal input,
body.theme-midnight .pos-orders-modal input,
body.theme-carbon .sales-entry-page input,
body.theme-carbon .sales-entry-page select,
body.theme-carbon .sales-entry-page textarea,
body.theme-carbon .pos-touch-page input,
body.theme-carbon .pos-payment-touch-modal input,
body.theme-carbon .pos-orders-modal input {
    background: color-mix(in srgb, var(--card, #111827) 92%, #fff);
    color: var(--text, #f8fafc);
}

/* frmSales.vb TabControl1 conversion - POS (Sales) notebook panels */
.sales-odoo-tabs {
    overflow-x: auto;
    scrollbar-width: thin;
}
.sales-odoo-tabs button {
    cursor: pointer;
    white-space: nowrap;
}
.sales-tab-panel {
    padding: 14px 18px 16px;
    background: var(--card, #fff);
    border-bottom: 1px solid var(--sales-odoo-border, var(--border, #e5e7eb));
}
.sales-tab-panel[hidden] {
    display: none !important;
}
.sales-tab-grid {
    display: grid;
    gap: 16px;
}
.sales-tab-grid.two {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}
.sales-tab-card {
    border: 1px solid var(--sales-odoo-border, var(--border, #e5e7eb));
    border-radius: 14px;
    background: color-mix(in srgb, var(--card, #fff) 94%, var(--theme-primary, var(--brand, #714b67)));
    padding: 14px;
    box-shadow: 0 10px 24px rgba(15, 23, 42, .04);
}
.sales-tab-card h3 {
    margin: 0 0 12px;
    font-size: 14px;
    color: var(--sales-odoo-purple, var(--theme-primary, #714b67));
    font-weight: 800;
}
.sales-tab-fields {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px 12px;
}
.sales-tab-fields.compact {
    grid-template-columns: repeat(2, minmax(130px, 1fr));
}
.sales-tab-fields.with-button {
    grid-template-columns: minmax(170px, 1fr) minmax(140px, 1fr) auto;
    align-items: end;
}
.sales-tab-fields label,
.sales-product-detail-grid label {
    display: grid;
    gap: 4px;
    margin: 0;
    color: var(--sales-odoo-muted, #6b7280);
    font-size: 12px;
    font-weight: 700;
}
.sales-tab-fields label.wide {
    grid-column: 1 / -1;
}
.sales-tab-hint {
    margin-top: 10px;
    color: var(--sales-odoo-muted, #6b7280);
    font-size: 12px;
}
.sales-mini-table-wrap {
    overflow: auto;
    border: 1px solid var(--sales-odoo-border, var(--border, #e5e7eb));
    border-radius: 12px;
    background: var(--card, #fff);
}
.sales-mini-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 12px;
}
.sales-mini-table th,
.sales-mini-table td {
    padding: 9px 10px;
    border-bottom: 1px solid var(--sales-odoo-border, var(--border, #e5e7eb));
    text-align: left;
}
.sales-mini-table th {
    color: var(--sales-odoo-purple, var(--theme-primary, #714b67));
    background: color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 7%, var(--card, #fff));
    font-weight: 800;
}
.sales-mini-table .number {
    text-align: right;
}
.sales-mini-table .empty {
    color: var(--sales-odoo-muted, #6b7280);
    text-align: center;
    padding: 18px;
}
.sales-product-detail-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px 12px;
}
.sales-signature-pad {
    min-height: 160px;
    width: 100%;
    border: 1px dashed color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 50%, var(--border, #e5e7eb));
    border-radius: 12px;
    padding: 12px;
    resize: vertical;
    background: var(--card, #fff);
    color: var(--text, #111827);
}
.sales-tab-actions {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 10px;
}
@media (max-width: 900px) {
    .sales-tab-grid.two,
    .sales-tab-fields,
    .sales-tab-fields.compact,
    .sales-tab-fields.with-button,
    .sales-product-detail-grid {
        grid-template-columns: 1fr;
    }
}

/* POS (Sales) order line custom columns - matches Odoo-style column chooser. */
.sales-order-lines .sales-items-table {
    min-width: 1420px;
}

.sales-order-lines .sales-items-table th[data-sales-line-col="handle"] { width: 28px; }
.sales-order-lines .sales-items-table th[data-sales-line-col="product"] { width: 330px; }
.sales-order-lines .sales-items-table th[data-sales-line-col="productVariant"] { width: 145px; }
.sales-order-lines .sales-items-table th[data-sales-line-col="description"] { width: 210px; }
.sales-order-lines .sales-items-table th[data-sales-line-col="routes"] { width: 110px; }
.sales-order-lines .sales-items-table th[data-sales-line-col="quantity"] { width: 90px; }
.sales-order-lines .sales-items-table th[data-sales-line-col="lastPrice"] { width: 100px; }
.sales-order-lines .sales-items-table th[data-sales-line-col="delivered"] { width: 95px; }
.sales-order-lines .sales-items-table th[data-sales-line-col="invoiced"] { width: 95px; }
.sales-order-lines .sales-items-table th[data-sales-line-col="unit"] { width: 105px; }
.sales-order-lines .sales-items-table th[data-sales-line-col="weight"] { width: 95px; }
.sales-order-lines .sales-items-table th[data-sales-line-col="leadTime"] { width: 105px; }
.sales-order-lines .sales-items-table th[data-sales-line-col="unitPrice"] { width: 105px; }
.sales-order-lines .sales-items-table th[data-sales-line-col="cost"] { width: 90px; }
.sales-order-lines .sales-items-table th[data-sales-line-col="margin"] { width: 95px; }
.sales-order-lines .sales-items-table th[data-sales-line-col="marginPct"] { width: 105px; }
.sales-order-lines .sales-items-table th[data-sales-line-col="taxes"] { width: 85px; }
.sales-order-lines .sales-items-table th[data-sales-line-col="disc"] { width: 85px; }
.sales-order-lines .sales-items-table th[data-sales-line-col="amount"] { width: 105px; }
.sales-order-lines .sales-items-table th[data-sales-line-col="taxIncl"] { width: 110px; }
.sales-order-lines .sales-items-table th[data-sales-line-col="actions"] { width: 46px; }

.sales-line-column-picker {
    position: relative;
    display: inline-flex;
    justify-content: center;
    align-items: center;
}

.sales-column-picker-btn {
    width: 26px;
    height: 26px;
    border: 1px solid color-mix(in srgb, var(--brand, #714b67) 35%, #cbd5e1);
    border-radius: 7px;
    background: var(--card-bg, #fff);
    color: var(--brand, #714b67);
    font-size: 14px;
    font-weight: 900;
    line-height: 1;
    cursor: pointer;
}

.sales-column-picker-btn:hover {
    background: color-mix(in srgb, var(--brand, #714b67) 10%, #fff);
    border-color: var(--brand, #714b67);
}

.sales-line-column-menu {
    position: absolute;
    top: 32px;
    right: 0;
    z-index: 80;
    width: 245px;
    max-height: min(430px, calc(100vh - 220px));
    overflow: auto;
    text-align: left;
}

.sales-line-column-menu label {
    white-space: nowrap;
}

.sales-line-column-menu input[type="checkbox"] {
    accent-color: var(--brand, #714b67);
}

.sales-order-lines .sales-items-table td[data-sales-line-col="productVariant"],
.sales-order-lines .sales-items-table td[data-sales-line-col="description"],
.sales-order-lines .sales-items-table td[data-sales-line-col="routes"],
.sales-order-lines .sales-items-table td[data-sales-line-col="leadTime"] {
    color: var(--text, #111827);
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sales-order-lines .sales-items-table td[hidden],
.sales-order-lines .sales-items-table th[hidden] {
    display: none !important;
}

body.theme-dark .sales-column-picker-btn,
body.theme-midnight .sales-column-picker-btn,
body.theme-carbon .sales-column-picker-btn {
    background: var(--card-bg, #1f2937);
    color: var(--brand-contrast, #fff);
    border-color: color-mix(in srgb, var(--brand, #714b67) 45%, #475569);
}


/* frmSales ribbon/company placement fix: company name now lives in the top-right sales mini bar, so the ribbon has clear space. */
.sales-odoo-header .sales-company-mark {
    display: none;
}

@media (max-width: 760px) {
    .sales-odoo-mini { flex-wrap: wrap; }
    .sales-mini-company { width: 100%; max-width: 100%; text-align: left; margin-left: 0; }
}

/* frmSales POS (Sales) grid/header/menu/theme refinement. */
.sales-entry-page .sales-odoo-sheet {
    overflow: visible;
}

.sales-entry-page .sales-order-lines,
.sales-entry-page .sales-tab-panel[data-sales-tab-panel="lines"] {
    overflow: visible;
}

.sales-entry-page .sales-order-lines .sales-grid-wrap {
    max-height: min(48vh, 460px);
    min-height: 250px;
    overflow: auto;
    position: relative;
    border-top: 1px solid var(--sales-odoo-border, var(--border, #e5e7eb));
    border-bottom: 1px solid var(--sales-odoo-border, var(--border, #e5e7eb));
    background: var(--card, #fff);
}

.sales-entry-page .sales-order-lines .sales-items-table {
    border-collapse: separate !important;
    border-spacing: 0;
}

.sales-entry-page .sales-order-lines .sales-items-table thead th,
.sales-entry-page .sales-items-table thead th {
    position: sticky !important;
    top: 0 !important;
    z-index: 60 !important;
    background: color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 8%, var(--card, #fff)) !important;
    color: var(--text, #111827) !important;
    border-bottom: 1px solid var(--border, #e5e7eb) !important;
    box-shadow: 0 2px 0 var(--border, #e5e7eb);
}

.sales-entry-page .sales-column-picker-cell {
    overflow: visible;
    z-index: 65 !important;
}

.sales-entry-page .sales-line-column-picker {
    position: relative;
    overflow: visible;
}

.sales-entry-page .sales-line-column-menu {
    position: fixed !important;
    z-index: 2147483000 !important;
    min-width: 250px;
    max-width: min(330px, calc(100vw - 24px));
    max-height: min(72vh, 540px);
    overflow: auto;
    padding: 10px 0;
    border: 1px solid color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 22%, var(--border, #e5e7eb));
    border-radius: 8px;
    background: var(--card, #fff);
    color: var(--text, #111827);
    box-shadow: 0 18px 40px rgba(15, 23, 42, .22);
}

.sales-entry-page .sales-line-column-menu label {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 14px;
    color: var(--text, #111827);
    font-weight: 700;
    white-space: nowrap;
}

.sales-entry-page .sales-line-column-menu label:hover {
    background: color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 10%, var(--card, #fff));
}

.sales-entry-page .sales-line-column-menu input[type="checkbox"] {
    accent-color: var(--theme-primary, var(--brand, #714b67));
}

.sales-entry-page .sales-odoo-tabs button.active,
.sales-entry-page .sales-card-step.active,
.sales-entry-page .sales-statusbar span.active {
    border-color: var(--theme-primary, var(--brand, #714b67)) !important;
    color: var(--theme-primary, var(--brand, #714b67)) !important;
}

.sales-entry-page .sales-mini-link,
.sales-entry-page .sales-line-links button,
.sales-entry-page .sales-entry-path a,
.sales-entry-page .stock-name,
.sales-entry-page .sales-items-table .stock-name {
    color: var(--theme-primary, var(--brand, #714b67)) !important;
}

.sales-entry-page .sales-input,
.sales-entry-page select.sales-input,
.sales-entry-page textarea.sales-input,
.sales-entry-page input.sales-input {
    border-color: color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 22%, var(--border, #e5e7eb));
}

.sales-entry-page .sales-input:focus,
.sales-entry-page select.sales-input:focus,
.sales-entry-page textarea.sales-input:focus,
.sales-entry-page input.sales-input:focus {
    border-color: var(--theme-primary, var(--brand, #714b67));
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 17%, transparent);
}

.pos-touch-page .pos-payment-method-tile,
.pos-payment-touch-modal .pos-payment-method-tile,
.sales-entry-page .pos-payment-method-tile {
    background: color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 14%, var(--card, #fff));
    border-color: color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 28%, var(--border, #e5e7eb));
    color: var(--text, #111827);
}

.pos-touch-page .pos-payment-method-tile.active,
.pos-payment-touch-modal .pos-payment-method-tile.active,
.sales-entry-page .pos-payment-method-tile.active {
    background: var(--theme-primary, var(--brand, #714b67));
    border-color: var(--theme-primary, var(--brand, #714b67));
    color: #fff;
}

/* Broad theme bridge for converted account, customer, supplier, stock, ledger, report and settings forms. */
.odoo-form-shell,
.scaffold-page,
.customer-page,
.customers-page,
.suppliers-page,
.stock-item-edit-page,
.ledger-page,
.daily-sales-page,
.advanced-settings-page,
.pos-touch-page,
.sales-entry-page {
    --form-accent: var(--theme-primary, var(--brand, #714b67));
    --form-accent-soft: color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 9%, var(--card, #fff));
}

.odoo-form-shell .btn-primary,
.scaffold-page .btn-primary,
.customer-page .btn-primary,
.customers-page .btn-primary,
.suppliers-page .btn-primary,
.stock-item-edit-page .btn-primary,
.ledger-page .btn-primary,
.daily-sales-page .btn-primary,
.advanced-settings-page .btn-primary {
    background: var(--form-accent);
    border-color: var(--form-accent);
    color: #fff;
}

.odoo-form-shell table thead th,
.scaffold-page table thead th,
.customer-page table thead th,
.customers-page table thead th,
.suppliers-page table thead th,
.stock-item-edit-page table thead th,
.ledger-page table thead th,
.daily-sales-page table thead th,
.advanced-settings-page table thead th {
    background: var(--form-accent-soft);
    color: var(--text, #111827);
}

/* POS (Sales) save/payment, ribbon and theme correction. */
.sales-entry-page {
    --sales-accent: var(--brand, #714b67) !important;
    --sales-accent-dark: var(--brand-dark, #52364b) !important;
    --sales-soft: var(--soft, #f8eef6) !important;
    --sales-odoo-purple: var(--brand, #714b67) !important;
    --theme-primary: var(--brand, #714b67) !important;
    --theme-secondary: var(--brand-dark, #52364b) !important;
}

.sales-entry-page .sales-action,
.sales-entry-page .sales-mini-new,
.sales-entry-page .sales-line-links button,
.sales-entry-page .sales-summary-buttons button,
.sales-entry-page .pos-save-btn,
.sales-entry-page .pos-payment-btn {
    border: 1px solid color-mix(in srgb, var(--brand, #714b67) 28%, var(--border, #e5e7eb)) !important;
    background: color-mix(in srgb, var(--brand, #714b67) 8%, var(--card, #fff)) !important;
    color: var(--brand-dark, #52364b) !important;
    box-shadow: none !important;
}

.sales-entry-page .sales-action.primary,
.sales-entry-page .sales-action.payment,
.sales-entry-page .pos-payment-btn,
.sales-entry-page .pos-payment-method-tile.active {
    background: var(--brand, #714b67) !important;
    border-color: var(--brand, #714b67) !important;
    color: #fff !important;
}

.sales-entry-page .sales-action.delivered {
    background: var(--theme-primary, var(--brand, #714b67)) !important;
    border-color: var(--theme-primary, var(--brand, #714b67)) !important;
    color: #fff !important;
    opacity: .9;
}

.sales-entry-page .sales-action.danger {
    background: color-mix(in srgb, #dc2626 9%, var(--card, #fff)) !important;
    border-color: color-mix(in srgb, #dc2626 35%, var(--border, #e5e7eb)) !important;
    color: #991b1b !important;
}

.sales-entry-page .sales-action:hover,
.sales-entry-page .sales-mini-new:hover,
.sales-entry-page .sales-line-links button:hover,
.sales-entry-page .sales-summary-buttons button:hover,
.sales-entry-page .pos-save-btn:hover {
    background: color-mix(in srgb, var(--brand, #714b67) 14%, var(--card, #fff)) !important;
}

.sales-status-ribbon,
.sales-status-ribbon.draft,
.sales-status-ribbon.un-paid,
.sales-status-ribbon.paid,
.sales-status-ribbon.delivered,
.sales-status-ribbon.partial-paid,
.sales-status-ribbon.on-account,
.sales-status-ribbon.cancelled {
    top: 18px !important;
    right: 22px !important;
    width: auto !important;
    min-width: 112px !important;
    max-width: 210px !important;
    height: 32px !important;
    padding: 0 16px !important;
    border-radius: 999px !important;
    transform: none !important;
    font-size: 12px !important;
    line-height: 32px !important;
    letter-spacing: .035em !important;
    box-shadow: 0 8px 20px rgba(15, 23, 42, .15) !important;
    white-space: nowrap !important;
    overflow: visible !important;
}

.sales-status-ribbon.draft,
.sales-status-ribbon.un-paid { background: #64748b !important; }
.sales-status-ribbon.paid { background: #16a34a !important; }
.sales-status-ribbon.delivered { background: var(--theme-primary, var(--brand, #714b67)) !important; }
.sales-status-ribbon.partial-paid { background: #d97706 !important; }
.sales-status-ribbon.on-account { background: var(--brand, #714b67) !important; }
.sales-status-ribbon.cancelled { background: #dc2626 !important; }

.sales-entry-page .sales-odoo-header {
    padding-right: 170px !important;
}

.sales-entry-page .sales-order-lines .sales-grid-wrap {
    overflow: auto !important;
    isolation: isolate;
}

.sales-entry-page .sales-order-lines .sales-items-table thead,
.sales-entry-page .sales-order-lines .sales-items-table thead tr {
    position: sticky !important;
    top: 0 !important;
    z-index: 70 !important;
}

.sales-entry-page .sales-order-lines .sales-items-table thead th {
    position: sticky !important;
    top: 0 !important;
    z-index: 75 !important;
    background: color-mix(in srgb, var(--brand, #714b67) 8%, var(--card, #fff)) !important;
}

.sales-entry-page .sales-line-column-menu {
    position: fixed !important;
    z-index: 2147483000 !important;
    display: block;
    overflow: auto !important;
    background: var(--card, #fff) !important;
    color: var(--text, #111827) !important;
}

.sales-entry-page .sales-line-column-menu[hidden] {
    display: none !important;
}

.sales-wallet-qr-panel {
    margin-top: 10px;
    padding: 12px;
    border: 1px solid color-mix(in srgb, var(--brand, #714b67) 24%, var(--border, #e5e7eb));
    border-radius: 12px;
    background: color-mix(in srgb, var(--brand, #714b67) 6%, var(--card, #fff));
    text-align: center;
}

.sales-wallet-qr-panel canvas {
    display: block;
    margin: 8px auto;
    background: #fff;
    border-radius: 8px;
    padding: 6px;
}

.sales-wallet-qr-panel .pos-wallet-qr-head,
.sales-wallet-qr-panel .pos-wallet-qr-meta {
    display: flex;
    justify-content: space-between;
    gap: 8px;
    align-items: center;
}

.sales-wallet-qr-panel .pos-wallet-qr-meta {
    margin-top: 8px;
    display: grid;
    grid-template-columns: auto 1fr;
    text-align: left;
}


/* POS (Sales) save-line/product lookup fix: keep product shortlist anchored to the active grid cell. */
.sales-entry-page .sales-grid-product-cell {
    position: relative;
    overflow: visible !important;
}
.sales-entry-page .sales-grid-product-lookup {
    position: fixed !important;
    z-index: 2147483000 !important;
    display: block;
    min-width: min(620px, calc(100vw - 20px));
    max-width: calc(100vw - 20px);
    overflow: auto !important;
    border: 1px solid color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 25%, var(--border, #d1d5db));
    background: var(--card, #fff) !important;
    color: var(--text, #111827) !important;
    box-shadow: 0 18px 44px rgba(15, 23, 42, .22);
}
.sales-entry-page .sales-grid-product-lookup[hidden] {
    display: none !important;
}
.sales-entry-page .sales-grid-product-lookup .sales-product-lookup-head,
.sales-entry-page .sales-grid-product-lookup .sales-product-option {
    grid-template-columns: minmax(220px, 1fr) 100px 90px 70px !important;
}
.sales-entry-page .sales-grid-product-lookup .sales-product-option strong {
    display: block !important;
}

/* frmSales Last Price History + natural page-height order line list. */
.sales-entry-page .sales-last-price-cell {
    display: flex;
    align-items: center;
    gap: 4px;
}

.sales-entry-page .sales-last-price-cell .sales-grid-input {
    min-width: 72px;
}

.sales-entry-page .sales-history-icon {
    width: 24px;
    height: 24px;
    min-width: 24px;
    border: 1px solid var(--border, #d1d5db);
    border-radius: 999px;
    background: color-mix(in srgb, var(--brand, #714b67) 8%, var(--card, #fff));
    color: var(--brand, #714b67);
    font-size: 13px;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.sales-entry-page .sales-history-icon:hover {
    background: var(--brand, #714b67);
    color: var(--brand-contrast, #fff);
    border-color: var(--brand, #714b67);
}

.sales-last-price-modal {
    width: min(980px, calc(100vw - 28px));
}

.sales-last-price-subtitle {
    padding: 8px 14px 0;
    color: var(--muted, #6b7280);
    font-size: 13px;
}

.sales-last-price-grid-wrap {
    max-height: min(62vh, 520px);
    overflow: auto;
}

.sales-last-price-grid .number {
    text-align: right;
}

.sales-last-price-grid .strong {
    font-weight: 700;
    color: var(--brand, #714b67);
}

/* User requested no separate vertical scrollbar for added product/order lines: the page grows and the main page scroll handles it. */
.sales-entry-page .sales-order-lines .sales-grid-wrap {
    max-height: none !important;
    overflow-y: visible !important;
    overflow-x: auto !important;
    min-height: 0 !important;
}

/* POS (Sales) catalog: make the product under the pointer visually obvious without shifting the grid. */
.sales-entry-page .sales-catalog-card {
    cursor: pointer;
    isolation: isolate;
    transition: transform .16s ease, border-color .16s ease, background-color .16s ease, box-shadow .16s ease;
}

.sales-entry-page .sales-catalog-card .sales-catalog-image {
    transition: transform .16s ease, filter .16s ease;
}

.sales-entry-page .sales-catalog-card h3,
.sales-entry-page .sales-catalog-card .sales-card-add {
    transition: color .16s ease, background-color .16s ease, border-color .16s ease, transform .16s ease, box-shadow .16s ease;
}

.sales-entry-page .sales-catalog-card:hover,
.sales-entry-page .sales-catalog-card:focus-within {
    z-index: 2;
    transform: translateY(-3px);
    border-color: var(--theme-primary, var(--brand, #017e84));
    background: color-mix(in srgb, var(--theme-primary, var(--brand, #017e84)) 4%, var(--card, #fff));
    box-shadow: 0 10px 24px color-mix(in srgb, var(--theme-primary, var(--brand, #017e84)) 18%, transparent);
}

.sales-entry-page .sales-catalog-card:hover h3,
.sales-entry-page .sales-catalog-card:focus-within h3 {
    color: var(--theme-primary, var(--brand, #017e84));
}

.sales-entry-page .sales-catalog-card:hover .sales-catalog-image,
.sales-entry-page .sales-catalog-card:focus-within .sales-catalog-image {
    transform: scale(1.07);
    filter: drop-shadow(0 4px 5px rgba(17, 24, 39, .14));
}

.sales-entry-page .sales-catalog-card:not(.selected):hover .sales-card-add,
.sales-entry-page .sales-catalog-card:not(.selected):focus-within .sales-card-add {
    transform: translateY(-1px);
    background: var(--theme-primary, var(--brand, #017e84));
    color: var(--theme-primary-contrast, #fff);
    box-shadow: 0 4px 10px color-mix(in srgb, var(--theme-primary, var(--brand, #017e84)) 20%, transparent);
}

.sales-entry-page .sales-catalog-card:not(.selected) .sales-card-add:hover {
    transform: translateY(-2px);
}

@media (prefers-reduced-motion: reduce) {
    .sales-entry-page .sales-catalog-card,
    .sales-entry-page .sales-catalog-card .sales-catalog-image,
    .sales-entry-page .sales-catalog-card h3,
    .sales-entry-page .sales-catalog-card .sales-card-add {
        transition: none;
    }

    .sales-entry-page .sales-catalog-card:hover,
    .sales-entry-page .sales-catalog-card:focus-within,
    .sales-entry-page .sales-catalog-card:hover .sales-catalog-image,
    .sales-entry-page .sales-catalog-card:focus-within .sales-catalog-image,
    .sales-entry-page .sales-catalog-card:not(.selected):hover .sales-card-add,
    .sales-entry-page .sales-catalog-card:not(.selected):focus-within .sales-card-add {
        transform: none;
    }
}

/* POS (Sales) catalog: make already-added products obvious using current theme. */
.sales-entry-page .sales-catalog-card.selected {
    border-color: var(--theme-primary, var(--brand, #017e84)) !important;
    background: color-mix(in srgb, var(--theme-primary, var(--brand, #017e84)) 10%, var(--card, #fff)) !important;
}

.sales-entry-page .sales-catalog-selected-qty {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-top: 7px;
    padding: 3px 8px;
    border-radius: 999px;
    background: var(--theme-primary, var(--brand, #017e84));
    color: var(--theme-primary-contrast, #fff);
    font-size: 12px;
    font-weight: 800;
    line-height: 1.2;
}

.sales-entry-page .sales-catalog-check {
    background: var(--theme-primary, var(--brand, #017e84)) !important;
    color: var(--theme-primary-contrast, #fff) !important;
}

/* POS Sales activity log / document chatter */
.sales-entry-page .sales-activity-card {
    border: 1px solid var(--border, #e5e7eb);
    background: var(--card, #fff);
}
.sales-entry-page .sales-activity-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 12px;
}
.sales-entry-page .sales-activity-header h3 {
    margin: 0 0 4px;
}
.sales-entry-page .sales-activity-header p {
    margin: 0;
    color: var(--muted, #6b7280);
    font-size: 12px;
}
.sales-entry-page .sales-activity-list {
    display: grid;
    gap: 10px;
}
.sales-entry-page .sales-activity-item {
    display: grid;
    grid-template-columns: 34px 1fr;
    gap: 10px;
    padding: 10px 12px;
    border: 1px solid color-mix(in srgb, var(--border, #e5e7eb) 80%, transparent);
    border-radius: 12px;
    background: color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 4%, var(--card, #fff));
}
.sales-entry-page .sales-activity-icon {
    width: 30px;
    height: 30px;
    border-radius: 999px;
    display: grid;
    place-items: center;
    background: color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 12%, var(--card, #fff));
    border: 1px solid color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 24%, var(--border, #e5e7eb));
}
.sales-entry-page .sales-activity-title {
    font-weight: 700;
    color: var(--text, #111827);
}
.sales-entry-page .sales-activity-desc,
.sales-entry-page .sales-activity-change {
    margin-top: 3px;
    font-size: 12px;
    color: var(--text, #111827);
}
.sales-entry-page .sales-activity-meta {
    margin-top: 6px;
    color: var(--muted, #6b7280);
    font-size: 11px;
}
.sales-entry-page .sales-activity-empty {
    padding: 16px;
    border: 1px dashed var(--border, #e5e7eb);
    border-radius: 12px;
    color: var(--muted, #6b7280);
    background: color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 3%, var(--card, #fff));
}

/* POS Sales Odoo-style bottom chatter grouped by date */
.sales-entry-page .sales-activity-tab-note {
    border: 1px solid var(--border, #e5e7eb);
    background: var(--card, #fff);
}

.sales-entry-page .sales-activity-tab-note h3 {
    margin: 0 0 6px;
}

.sales-entry-page .sales-activity-tab-note p {
    margin: 0 0 12px;
    color: var(--muted, #6b7280);
    font-size: 13px;
}

.sales-entry-page .sales-chatter-panel {
    margin-top: 14px;
    border-top: 1px solid var(--border, #e5e7eb);
    background: var(--surface, #f8fafc);
    padding: 8px 0 18px;
}

.sales-entry-page .sales-chatter-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
}

.sales-entry-page .sales-chatter-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}

.sales-entry-page .sales-chatter-actions button,
.sales-entry-page .sales-chatter-icon {
    border: 1px solid var(--border, #e5e7eb);
    background: color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 6%, var(--card, #fff));
    color: var(--text, #111827);
    border-radius: 6px;
    padding: 7px 12px;
    font-weight: 700;
    cursor: pointer;
}

.sales-entry-page .sales-chatter-actions button.active {
    background: var(--theme-primary, var(--brand, #714b67));
    color: var(--theme-primary-contrast, #fff);
    border-color: var(--theme-primary, var(--brand, #714b67));
}

.sales-entry-page .sales-chatter-icon {
    width: 34px;
    height: 34px;
    display: inline-grid;
    place-items: center;
    padding: 0;
}

.sales-entry-page .sales-chatter-list {
    display: block;
    min-height: 110px;
}

.sales-entry-page .sales-activity-date-group {
    margin: 8px 0 16px;
}

.sales-entry-page .sales-activity-date-heading {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 8px 8px 12px;
    color: var(--muted, #6b7280);
    font-size: 12px;
}

.sales-entry-page .sales-activity-date-heading::before,
.sales-entry-page .sales-activity-date-heading::after {
    content: "";
    height: 1px;
    flex: 1 1 auto;
    background: var(--border, #e5e7eb);
}

.sales-entry-page .sales-activity-date-heading span {
    padding: 0 4px;
    white-space: nowrap;
}

.sales-entry-page .sales-activity-item {
    display: grid;
    grid-template-columns: 32px 1fr;
    gap: 8px;
    padding: 6px 0;
    border: 0;
    border-radius: 0;
    background: transparent;
}

.sales-entry-page .sales-activity-avatar {
    width: 30px;
    height: 30px;
    border-radius: 7px;
    display: grid;
    place-items: center;
    background: var(--theme-primary, var(--brand, #714b67));
    color: var(--theme-primary-contrast, #fff);
    font-size: 13px;
    font-weight: 800;
    line-height: 1;
}

.sales-entry-page .sales-activity-content {
    min-width: 0;
}

.sales-entry-page .sales-activity-title {
    margin-top: 2px;
    font-weight: 500;
    color: var(--text, #111827);
}

.sales-entry-page .sales-activity-desc,
.sales-entry-page .sales-activity-change {
    margin-top: 2px;
    font-size: 12px;
    color: var(--text, #111827);
}

.sales-entry-page .sales-activity-change strong {
    color: var(--text, #111827);
}

.sales-entry-page .sales-activity-meta {
    margin-top: 0;
    color: var(--muted, #6b7280);
    font-size: 12px;
}

.sales-entry-page .sales-activity-meta strong {
    color: var(--text, #111827);
    font-weight: 700;
}

.sales-entry-page .sales-activity-meta span {
    color: var(--muted, #6b7280);
    font-size: 11px;
}

/* POS (SALES) item ArtStatus menu */
.sales-order-lines .sales-items-table th[data-sales-line-col="artStatus"] { width: 80px; }
.sales-art-status-btn {
    min-width: 58px;
    border: 1px solid var(--border-color, #d8dee9);
    border-radius: 999px;
    background: var(--surface-color, #ffffff);
    color: var(--text-color, #1f2937);
    font-size: 0.75rem;
    font-weight: 700;
    line-height: 1.2;
    padding: 0.2rem 0.45rem;
    cursor: pointer;
}
.sales-art-status-btn:hover { box-shadow: 0 1px 4px rgba(15, 23, 42, 0.18); }
.sales-art-status-reste { background: #fee2e2; border-color: #fca5a5; color: #991b1b; }
.sales-art-status-ok { background: #dcfce7; border-color: #86efac; color: #166534; }
.sales-art-status-n { background: #fef9c3; border-color: #fde68a; color: #854d0e; }
.sales-art-status-menu {
    background: var(--surface-color, #ffffff);
    color: var(--text-color, #111827);
    border: 1px solid var(--border-color, #d8dee9);
    border-radius: 0.45rem;
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.18);
    padding: 0.25rem;
}
.sales-art-status-menu button {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.65rem;
    border: 0;
    background: transparent;
    color: inherit;
    text-align: left;
    font-size: 0.82rem;
    padding: 0.42rem 0.55rem;
    border-radius: 0.35rem;
    cursor: pointer;
}
.sales-art-status-menu button:hover { background: var(--hover-bg, rgba(15, 23, 42, 0.08)); }
.sales-art-status-menu small { opacity: 0.7; font-size: 0.72rem; }

/* Global grid/list page-height and responsive-column fix.
   All master/document forms should behave like POS (Sales): the page grows with loaded rows,
   inner grids/lists do not create their own vertical scrollbars, and table columns fit the page
   without a horizontal scrollbar. Lookup popups and modal result lists keep their own scrolling. */
html,
body,
.shell,
.app-shell,
.main-area {
    max-width: 100%;
}

body {
    overflow-x: hidden;
}

.main-area {
    overflow: visible !important;
}

.main-area .odoo-list-shell,
.main-area .scaffold-page,
.main-area .company-form,
.main-area .themed-form,
.main-area .sales-entry-page,
.main-area .daily-sales-page,
.main-area .stock-items-page,
.main-area .supplier-list-shell {
    max-width: 100%;
    overflow: visible !important;
}

.main-area .table-card,
.main-area .country-table-card,
.main-area .scaffold-content-card,
.main-area .daily-sales-card,
.main-area .daily-sales-documents-card,
.main-area .supplier-opening-card,
.main-area .maintenance-result-table,
.main-area .table-responsive,
.main-area .ajax-list-results,
.main-area .sales-grid-panel,
.main-area .sales-order-lines,
.main-area .sales-grid-wrap,
.main-area .daily-sales-table-wrap,
.main-area .daily-sales-item-wrap {
    max-height: none !important;
    overflow-y: visible !important;
    overflow-x: visible !important;
}

.main-area table,
.main-area .odoo-list-table,
.main-area .countries-list-table,
.main-area .ledger-list-table,
.main-area .supplier-list-table,
.main-area .supplier-opening-table,
.main-area .daily-sales-table,
.main-area .daily-sales-items-table,
.main-area .sales-items-table,
.main-area .pos-orders-grid,
.main-area .vb-unit-table {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    table-layout: auto !important;
}

.main-area table th,
.main-area table td,
.main-area .odoo-list-table th,
.main-area .odoo-list-table td,
.main-area .sales-items-table th,
.main-area .sales-items-table td,
.main-area .daily-sales-table th,
.main-area .daily-sales-table td,
.main-area .supplier-opening-table th,
.main-area .supplier-opening-table td,
.main-area .pos-orders-grid th,
.main-area .pos-orders-grid td {
    min-width: 0 !important;
    max-width: none !important;
    white-space: normal !important;
    overflow-wrap: anywhere;
    word-break: normal;
}

.main-area table th,
.main-area .odoo-list-table th,
.main-area .sales-items-table th,
.main-area .daily-sales-table th,
.main-area .supplier-opening-table th,
.main-area .pos-orders-grid th {
    resize: none;
    overflow: hidden;
}

.main-area .sales-order-lines .sales-grid-wrap,
.main-area .sales-entry-page .sales-order-lines .sales-grid-wrap {
    max-height: none !important;
    min-height: 0 !important;
    overflow-y: visible !important;
    overflow-x: visible !important;
}

.main-area .sales-order-lines .sales-items-table,
.main-area .sales-entry-page .sales-items-table,
.main-area .daily-sales-items-table {
    min-width: 0 !important;
}

.main-area .sales-order-lines .sales-items-table th,
.main-area .sales-order-lines .sales-items-table td,
.main-area .sales-items-table th,
.main-area .sales-items-table td,
.main-area .daily-sales-table th,
.main-area .daily-sales-table td,
.main-area .supplier-opening-table th,
.main-area .supplier-opening-table td {
    width: auto !important;
}

.main-area .num,
.main-area .number,
.main-area .sales-total-line,
.main-area .balance-chip,
.main-area .daily-sales-record-count,
.main-area .status-pill,
.main-area .table-action-group,
.main-area .country-kanban-actions,
.main-area .sales-row-delete,
.main-area .table-icon-action {
    white-space: nowrap !important;
}

.main-area table input,
.main-area table select,
.main-area table textarea,
.main-area .sales-grid-input,
.main-area .odoo-input {
    min-width: 0 !important;
    max-width: 100%;
}

/* Keep popup/lookup/modal lists usable: these are not main-page grids. */
.erp-lookup-modal .erp-lookup-results,
.stock-lookup-modal .erp-lookup-results,
.sales-lookup-modal .sales-lookup-results,
.sales-field-dropdown,
.sales-product-lookup,
.ledger-account-shortlist,
.supplier-lookup-shortlist,
.pos-orders-modal .pos-orders-grid-wrap,
.pos-payment-touch-modal .pos-payment-lines-list,
.sales-last-price-modal .sales-last-price-grid-wrap,
.folder-picker-modal .folder-list {
    overflow: auto;
}

@media (max-width: 900px) {
    .main-area table,
    .main-area .odoo-list-table,
    .main-area .sales-items-table,
    .main-area .daily-sales-table,
    .main-area .supplier-opening-table {
        font-size: 12px;
    }

    .main-area table th,
    .main-area table td {
        padding-left: 6px;
        padding-right: 6px;
    }
}

/* Extend the same no-inner-scroll rule to stock/customer opening grids and any remaining list tables. */
.main-area .stock-grid-shell,
.main-area .stock-grid-wrap,
.main-area .customer-opening-card,
.main-area .supplier-opening-card {
    max-height: none !important;
    overflow-y: visible !important;
    overflow-x: visible !important;
}

.main-area .stock-items-grid,
.main-area .customer-list-table,
.main-area .customer-opening-table,
.main-area .supplier-list-table,
.main-area .supplier-opening-table,
.main-area .odoo-product-list,
.main-area .sales-old-invoices-grid,
.main-area .sales-product-modal-table,
.main-area .sales-last-price-grid,
.main-area .sales-mini-table {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    table-layout: auto !important;
}

.main-area .stock-items-grid th,
.main-area .stock-items-grid td,
.main-area .customer-list-table th,
.main-area .customer-list-table td,
.main-area .customer-opening-table th,
.main-area .customer-opening-table td,
.main-area .supplier-list-table th,
.main-area .supplier-list-table td,
.main-area .supplier-opening-table th,
.main-area .supplier-opening-table td,
.main-area .odoo-product-list th,
.main-area .odoo-product-list td,
.main-area .sales-old-invoices-grid th,
.main-area .sales-old-invoices-grid td,
.main-area .sales-product-modal-table th,
.main-area .sales-product-modal-table td,
.main-area .sales-last-price-grid th,
.main-area .sales-last-price-grid td,
.main-area .sales-mini-table th,
.main-area .sales-mini-table td {
    width: auto !important;
    min-width: 0 !important;
    white-space: normal !important;
    overflow-wrap: anywhere;
}

.main-area .stock-name-cell,
.main-area .stock-image-cell,
.main-area .customer-opening-table input,
.main-area .supplier-opening-table input,
.main-area .customer-table-lookup,
.main-area .supplier-table-lookup {
    min-width: 0 !important;
}

/* POS (Sales) column-width restore.
   The global responsive grid rule must not override the POS (Sales) order-line grid.
   These values restore the confirmed layout from ERPWebMvc_POS_Sales_Confirm_Unsaved_Draft_Block_Fix. */
.main-area .sales-entry-page .sales-order-lines .sales-items-table,
.sales-entry-page .sales-order-lines .sales-items-table {
    width: 100% !important;
    min-width: 1420px !important;
    max-width: none !important;
    table-layout: fixed !important;
}

.main-area .sales-entry-page .sales-order-lines .sales-items-table th,
.main-area .sales-entry-page .sales-order-lines .sales-items-table td,
.sales-entry-page .sales-order-lines .sales-items-table th,
.sales-entry-page .sales-order-lines .sales-items-table td {
    max-width: none !important;
    white-space: nowrap !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
}

.main-area .sales-entry-page .sales-order-lines .sales-items-table th[data-sales-line-col="handle"],
.sales-entry-page .sales-order-lines .sales-items-table th[data-sales-line-col="handle"] { width: 28px !important; }
.main-area .sales-entry-page .sales-order-lines .sales-items-table th[data-sales-line-col="product"],
.sales-entry-page .sales-order-lines .sales-items-table th[data-sales-line-col="product"] { width: 330px !important; }
.main-area .sales-entry-page .sales-order-lines .sales-items-table th[data-sales-line-col="productVariant"],
.sales-entry-page .sales-order-lines .sales-items-table th[data-sales-line-col="productVariant"] { width: 145px !important; }
.main-area .sales-entry-page .sales-order-lines .sales-items-table th[data-sales-line-col="description"],
.sales-entry-page .sales-order-lines .sales-items-table th[data-sales-line-col="description"] { width: 210px !important; }
.main-area .sales-entry-page .sales-order-lines .sales-items-table th[data-sales-line-col="routes"],
.sales-entry-page .sales-order-lines .sales-items-table th[data-sales-line-col="routes"] { width: 110px !important; }
.main-area .sales-entry-page .sales-order-lines .sales-items-table th[data-sales-line-col="quantity"],
.sales-entry-page .sales-order-lines .sales-items-table th[data-sales-line-col="quantity"] { width: 90px !important; }
.main-area .sales-entry-page .sales-order-lines .sales-items-table th[data-sales-line-col="lastPrice"],
.sales-entry-page .sales-order-lines .sales-items-table th[data-sales-line-col="lastPrice"] { width: 100px !important; }
.main-area .sales-entry-page .sales-order-lines .sales-items-table th[data-sales-line-col="delivered"],
.sales-entry-page .sales-order-lines .sales-items-table th[data-sales-line-col="delivered"] { width: 95px !important; }
.main-area .sales-entry-page .sales-order-lines .sales-items-table th[data-sales-line-col="invoiced"],
.sales-entry-page .sales-order-lines .sales-items-table th[data-sales-line-col="invoiced"] { width: 95px !important; }
.main-area .sales-entry-page .sales-order-lines .sales-items-table th[data-sales-line-col="unit"],
.sales-entry-page .sales-order-lines .sales-items-table th[data-sales-line-col="unit"] { width: 105px !important; }
.main-area .sales-entry-page .sales-order-lines .sales-items-table th[data-sales-line-col="leadTime"],
.sales-entry-page .sales-order-lines .sales-items-table th[data-sales-line-col="leadTime"] { width: 105px !important; }
.main-area .sales-entry-page .sales-order-lines .sales-items-table th[data-sales-line-col="unitPrice"],
.sales-entry-page .sales-order-lines .sales-items-table th[data-sales-line-col="unitPrice"] { width: 105px !important; }
.main-area .sales-entry-page .sales-order-lines .sales-items-table th[data-sales-line-col="cost"],
.sales-entry-page .sales-order-lines .sales-items-table th[data-sales-line-col="cost"] { width: 90px !important; }
.main-area .sales-entry-page .sales-order-lines .sales-items-table th[data-sales-line-col="margin"],
.sales-entry-page .sales-order-lines .sales-items-table th[data-sales-line-col="margin"] { width: 95px !important; }
.main-area .sales-entry-page .sales-order-lines .sales-items-table th[data-sales-line-col="marginPct"],
.sales-entry-page .sales-order-lines .sales-items-table th[data-sales-line-col="marginPct"] { width: 105px !important; }
.main-area .sales-entry-page .sales-order-lines .sales-items-table th[data-sales-line-col="taxes"],
.sales-entry-page .sales-order-lines .sales-items-table th[data-sales-line-col="taxes"] { width: 85px !important; }
.main-area .sales-entry-page .sales-order-lines .sales-items-table th[data-sales-line-col="disc"],
.sales-entry-page .sales-order-lines .sales-items-table th[data-sales-line-col="disc"] { width: 85px !important; }
.main-area .sales-entry-page .sales-order-lines .sales-items-table th[data-sales-line-col="amount"],
.sales-entry-page .sales-order-lines .sales-items-table th[data-sales-line-col="amount"] { width: 105px !important; }
.main-area .sales-entry-page .sales-order-lines .sales-items-table th[data-sales-line-col="taxIncl"],
.sales-entry-page .sales-order-lines .sales-items-table th[data-sales-line-col="taxIncl"] { width: 110px !important; }
.main-area .sales-entry-page .sales-order-lines .sales-items-table th[data-sales-line-col="artStatus"],
.sales-entry-page .sales-order-lines .sales-items-table th[data-sales-line-col="artStatus"] { width: 80px !important; }
.main-area .sales-entry-page .sales-order-lines .sales-items-table th[data-sales-line-col="actions"],
.sales-entry-page .sales-order-lines .sales-items-table th[data-sales-line-col="actions"] { width: 46px !important; }

.main-area .sales-entry-page .sales-order-lines .sales-grid-wrap,
.sales-entry-page .sales-order-lines .sales-grid-wrap {
    max-height: none !important;
    overflow-y: visible !important;
    overflow-x: auto !important;
    min-height: 0 !important;
}

.main-area .sales-entry-page .sales-order-lines .sales-items-table .stock-name,
.sales-entry-page .sales-order-lines .sales-items-table .stock-name {
    white-space: normal !important;
    overflow-wrap: anywhere !important;
}


/* WhatsApp preferences on customer master */
.customer-whatsapp-panel { display:grid; gap:18px; }
.customer-whatsapp-head { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; }
.customer-whatsapp-head h3 { margin:0 0 5px; }
.customer-whatsapp-head p { margin:0; }
.customer-whatsapp-badge { padding:7px 12px; border-radius:999px; background:var(--theme-accent); color:var(--theme-primary); font-weight:800; white-space:nowrap; }
.customer-whatsapp-options .check-row { min-height:42px; padding:7px 10px; border:1px solid var(--border); border-radius:8px; }
.customer-whatsapp-options .check-row label { flex:1; }
.customer-whatsapp-consent { border-left:4px solid var(--theme-primary) !important; background:var(--theme-accent); }
.customer-whatsapp-note { display:flex; gap:9px; align-items:flex-start; padding:12px 14px; border:1px solid var(--border); border-radius:9px; background:var(--surface-soft, #f8fafc); }
.customer-whatsapp-note span { color:var(--muted); }
@media (max-width:700px) { .customer-whatsapp-head,.customer-whatsapp-note { flex-direction:column; } }


/* Functional main-page table column resizing.
   JavaScript adds drag handles without changing any existing column widths until the user drags.
   The resized column and its neighbour share the available width, so no horizontal scrollbar is introduced. */
.main-area table th.erp-resizable-column-header {
    position: relative;
}

.erp-column-resize-handle {
    position: absolute;
    top: 0;
    right: -4px;
    bottom: 0;
    z-index: 20;
    width: 9px;
    cursor: col-resize;
    touch-action: none;
}

.erp-column-resize-handle::after {
    content: "";
    position: absolute;
    top: 8px;
    right: 4px;
    bottom: 8px;
    width: 1px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--brand, #714b67) 48%, #94a3b8);
    opacity: .34;
}

.erp-resizable-column-header:hover > .erp-column-resize-handle::after,
.erp-resizable-column-header.erp-column-is-resizing > .erp-column-resize-handle::after {
    width: 2px;
    opacity: .95;
}

body.erp-table-column-resizing,
body.erp-table-column-resizing * {
    cursor: col-resize !important;
    user-select: none !important;
}

/* Daily Sales has its own persistent resizer. Anchor its handle to each header cell. */
.daily-sales-table thead th[data-daily-sales-col] {
    position: relative;
}

.daily-sales-document-link {
    color: var(--brand, #714b67);
    font-weight: 800;
    text-decoration: none;
}

.daily-sales-document-link:hover,
.daily-sales-document-link:focus-visible {
    text-decoration: underline;
}


/* Customer multiple addresses: legacy CreateCustomers / tblLedgerAddress workflow */
.customer-multiple-address-action {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
.customer-multiple-address-action span,
.customer-address-tab-count {
    display: inline-grid;
    place-items: center;
    min-width: 22px;
    height: 22px;
    padding: 0 6px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--theme-primary, var(--brand)) 14%, transparent);
    color: var(--theme-primary, var(--brand));
    font-size: 12px;
    font-weight: 800;
}
.customer-address-toolbar {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 16px;
}
.customer-address-toolbar h3 { margin: 0 0 4px; }
.customer-address-add-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
}
.customer-address-empty {
    border: 1px dashed var(--border-color);
    border-radius: 14px;
    padding: 24px;
    text-align: center;
    color: var(--muted-text);
    background: color-mix(in srgb, var(--theme-primary, var(--brand)) 4%, transparent);
}
.customer-address-empty.is-hidden { display: none; }
.customer-additional-addresses {
    display: grid;
    gap: 16px;
}
.customer-address-card {
    border: 1px solid var(--border-color);
    border-radius: 16px;
    background: var(--card-bg);
    box-shadow: var(--soft-shadow);
    overflow: visible;
}
.customer-address-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 13px 16px;
    border-bottom: 1px solid var(--border-color);
    background: color-mix(in srgb, var(--theme-primary, var(--brand)) 6%, transparent);
}
.customer-address-card-header > div:first-child {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}
.customer-address-number {
    color: var(--muted-text);
    font-size: 12px;
    font-weight: 700;
    white-space: nowrap;
}
.customer-address-card-title {
    overflow-wrap: anywhere;
}
.customer-address-card-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: flex-end;
}
.customer-address-fields {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px 20px;
    padding: 16px;
}
.customer-address-fields .odoo-row {
    min-width: 0;
}
.customer-address-fields .customer-lookup-shell,
.customer-address-fields .odoo-input {
    min-width: 0;
    width: 100%;
}
@media (max-width: 900px) {
    .customer-address-toolbar,
    .customer-address-card-header {
        align-items: stretch;
        flex-direction: column;
    }
    .customer-address-add-actions,
    .customer-address-card-actions {
        justify-content: flex-start;
    }
    .customer-address-fields {
        grid-template-columns: 1fr;
    }
}

/* Touch POS 2 payment confirmation view: preserve existing page structure, refine only payment controls. */
.pos-payment-confirmation-view {
    width: min(940px, 97vw);
}
.pos-payment-confirmation-view .pos-payment-six-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}
.pos-payment-confirmation-view .pos-payment-method-tile {
    min-height: 64px;
    padding: 10px 8px;
    border-radius: 12px;
    font-size: 15px;
    line-height: 1.15;
    white-space: normal;
}
.pos-payment-confirmation-view .pos-payment-touch-actions .pos-save-btn,
.pos-payment-confirmation-view .pos-payment-touch-actions .pos-payment-btn {
    border-radius: 8px;
    font-weight: 900;
}
.pos-payment-confirmation-view .pos-wallet-send-btn {
    background: color-mix(in srgb, var(--brand) 86%, #4f46e5);
    border-color: color-mix(in srgb, var(--brand) 86%, #4f46e5);
    color: #fff;
}
.pos-payment-confirmation-view .pos-terminal-send-btn {
    background: color-mix(in srgb, var(--card) 84%, var(--brand));
    border-color: var(--brand);
    color: var(--text);
}
.pos-payment-confirmation-view .pos-payment-method-tile[data-payment-method="On Account"] {
    background: color-mix(in srgb, var(--muted) 28%, var(--card));
}
.pos-payment-confirmation-view .pos-wallet-qr-panel {
    margin-top: 10px;
}
@media (max-width: 720px) {
    .pos-payment-confirmation-view .pos-payment-six-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* Touch POS 2 attractive payment tiles and reliable selected state. */
.pos-payment-confirmation-view .pos-payment-method-tile {
    position: relative;
    min-height: 82px;
    padding: 10px 12px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 7px;
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--border) 72%, var(--brand));
    border-radius: 16px;
    background: linear-gradient(145deg,
        color-mix(in srgb, var(--card) 94%, white),
        color-mix(in srgb, var(--soft) 68%, var(--card)));
    color: var(--text);
    box-shadow: 0 5px 14px color-mix(in srgb, var(--text) 9%, transparent);
    transform: translateY(0);
    transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease, background .16s ease, color .16s ease;
    appearance: none;
    -webkit-appearance: none;
}
.pos-payment-confirmation-view .pos-payment-method-tile::before { content: none !important; }
.pos-payment-confirmation-view .pos-payment-method-tile:hover,
.pos-payment-confirmation-view .pos-payment-method-tile:focus-visible {
    transform: translateY(-2px);
    border-color: var(--brand);
    box-shadow: 0 8px 20px color-mix(in srgb, var(--brand) 22%, transparent);
    outline: none;
}
.pos-payment-confirmation-view .pos-payment-method-tile.active,
.pos-payment-confirmation-view .pos-payment-method-tile[aria-pressed="true"] {
    color: #fff;
    border-color: var(--brand);
    background: linear-gradient(145deg,
        color-mix(in srgb, var(--brand) 88%, white),
        color-mix(in srgb, var(--brand) 88%, black));
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand) 22%, transparent),
                0 10px 22px color-mix(in srgb, var(--brand) 28%, transparent);
    transform: translateY(-2px);
}
.pos-payment-confirmation-view .pos-payment-method-icon {
    width: 38px;
    height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    font-size: 22px;
    background: color-mix(in srgb, var(--brand) 12%, var(--card));
    color: var(--brand);
}
.pos-payment-confirmation-view .pos-payment-method-tile.active .pos-payment-method-icon,
.pos-payment-confirmation-view .pos-payment-method-tile[aria-pressed="true"] .pos-payment-method-icon {
    color: #fff;
    background: rgba(255,255,255,.18);
}
.pos-payment-confirmation-view .pos-payment-method-caption {
    display: block;
    font-size: 14px;
    font-weight: 900;
    line-height: 1.15;
    text-align: center;
}
.pos-payment-confirmation-view .pos-payment-method-tile[data-payment-method="Cash"] .pos-payment-method-icon { color: #16833f; }
.pos-payment-confirmation-view .pos-payment-method-tile[data-payment-method="CARD"] .pos-payment-method-icon { color: var(--brand); }
.pos-payment-confirmation-view .pos-payment-method-tile[data-payment-method="Bank Transfer"] .pos-payment-method-icon { color: #0b70b7; }
.pos-payment-confirmation-view .pos-payment-method-tile[data-payment-method="G Pay"] .pos-payment-method-icon { color: #2867d6; }
.pos-payment-confirmation-view .pos-payment-method-tile[data-payment-method="Apple Pay"] .pos-payment-method-icon { color: #111; }
.pos-payment-confirmation-view .pos-payment-method-tile[data-payment-method="On Account"] .pos-payment-method-icon { color: #7b5a28; }
.pos-payment-confirmation-view .pos-payment-method-tile.active .pos-payment-method-icon,
.pos-payment-confirmation-view .pos-payment-method-tile[aria-pressed="true"] .pos-payment-method-icon { color: #fff; }
body.theme-dark .pos-payment-confirmation-view .pos-payment-method-tile[data-payment-method="Apple Pay"] .pos-payment-method-icon,
body.theme-midnight .pos-payment-confirmation-view .pos-payment-method-tile[data-payment-method="Apple Pay"] .pos-payment-method-icon,
body.theme-carbon .pos-payment-confirmation-view .pos-payment-method-tile[data-payment-method="Apple Pay"] .pos-payment-method-icon { color: #fff; }


/* Touch POS 2 compact QR overlay: the active QR temporarily replaces the Already Paid list. */
.pos-payment-confirmation-view .pos-payment-lines-list[hidden] { display: none !important; }
.pos-payment-confirmation-view .pos-wallet-qr-panel {
    min-height: 0;
    margin-top: 12px;
    padding: 14px;
    border: 1px solid color-mix(in srgb, var(--brand) 38%, var(--border));
    border-radius: 16px;
    background: linear-gradient(145deg,
        color-mix(in srgb, var(--card) 96%, white),
        color-mix(in srgb, var(--soft) 72%, var(--card)));
    box-shadow: 0 8px 22px color-mix(in srgb, var(--brand) 12%, transparent);
}
.pos-payment-confirmation-view .pos-wallet-qr-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
}
.pos-payment-confirmation-view .pos-wallet-qr-head strong { font-size: 16px; }
.pos-payment-confirmation-view .pos-wallet-qr-head span {
    padding: 5px 10px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--brand) 13%, var(--card));
    color: var(--brand);
    font-weight: 900;
}
.pos-payment-confirmation-view .pos-wallet-qr-body {
    grid-template-columns: minmax(142px, 168px) minmax(0, 1fr);
    align-items: center;
    gap: 14px;
}
.pos-payment-confirmation-view .pos-wallet-qr-details > div {
    padding: 8px 10px;
    border-radius: 10px;
    background: color-mix(in srgb, var(--soft) 58%, var(--card));
}
.pos-payment-confirmation-view .pos-wallet-qr-panel small {
    display: block;
    margin-top: 10px;
    padding: 8px 10px;
    border-radius: 10px;
    background: color-mix(in srgb, var(--brand) 8%, var(--card));
}
@media (max-width: 720px) {
    .pos-payment-confirmation-view .pos-wallet-qr-body { grid-template-columns: 1fr; }
    .pos-payment-confirmation-view .pos-wallet-qr-panel canvas { margin-inline: auto; }
}

/* Touch POS 2 payment-purpose tiles, QR visibility and CARD manual/terminal actions. */
.pos-payment-confirmation-view .pos-payment-method-tile {
    min-height: 96px;
    padding: 12px 10px 10px;
    gap: 4px;
    isolation: isolate;
}
.pos-payment-confirmation-view .pos-payment-method-icon {
    width: 44px;
    height: 44px;
    border-radius: 14px;
    padding: 7px;
}
.pos-payment-confirmation-view .pos-payment-method-icon svg {
    width: 100%;
    height: 100%;
    fill: none;
    stroke: currentColor;
    stroke-width: 2.6;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.pos-payment-confirmation-view .pos-payment-method-caption {
    font-size: 14px;
    letter-spacing: .01em;
}
.pos-payment-confirmation-view .pos-payment-method-subcaption {
    display: block;
    max-width: 100%;
    color: var(--muted);
    font-size: 10.5px;
    font-weight: 700;
    line-height: 1.1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.pos-payment-confirmation-view .pos-payment-method-tile.active .pos-payment-method-subcaption,
.pos-payment-confirmation-view .pos-payment-method-tile[aria-pressed="true"] .pos-payment-method-subcaption {
    color: rgba(255,255,255,.84);
}
.pos-payment-confirmation-view .pos-payment-selected-mark {
    position: absolute;
    top: 7px;
    right: 8px;
    width: 22px;
    height: 22px;
    display: none;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #fff;
    color: var(--brand);
    font-size: 13px;
    font-weight: 1000;
    box-shadow: 0 3px 9px rgba(0,0,0,.16);
}
.pos-payment-confirmation-view .pos-payment-method-tile.active .pos-payment-selected-mark,
.pos-payment-confirmation-view .pos-payment-method-tile[aria-pressed="true"] .pos-payment-selected-mark {
    display: inline-flex;
}
.pos-payment-confirmation-view .pos-payment-touch-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}
.pos-payment-confirmation-view .pos-payment-touch-actions .pos-save-btn,
.pos-payment-confirmation-view .pos-payment-touch-actions .pos-payment-btn {
    min-height: 54px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-size: 15px;
    box-shadow: 0 5px 13px color-mix(in srgb, var(--text) 8%, transparent);
}
.pos-payment-confirmation-view .pos-wallet-send-btn,
.pos-payment-confirmation-view .pos-payment-btn {
    grid-column: 1 / -1;
}
.pos-payment-confirmation-view .pos-terminal-send-btn {
    grid-column: 1 / -1;
    color: #fff;
    background: linear-gradient(135deg, color-mix(in srgb, var(--brand) 82%, #2563eb), color-mix(in srgb, var(--brand) 80%, #0f4fa8));
    border-color: var(--brand);
}
.pos-payment-confirmation-view .pos-full-cash-btn {
    background: color-mix(in srgb, #22c55e 11%, var(--card));
    border-color: color-mix(in srgb, #22c55e 46%, var(--border));
}
.pos-payment-confirmation-view .pos-add-payment-btn {
    background: color-mix(in srgb, var(--brand) 9%, var(--card));
    border-color: color-mix(in srgb, var(--brand) 45%, var(--border));
}
.pos-payment-confirmation-view .pos-wallet-qr-head-actions {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
.pos-payment-confirmation-view .pos-wallet-qr-close {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    border: 1px solid var(--border);
    background: var(--card);
    color: var(--text);
    font-size: 20px;
    line-height: 1;
    cursor: pointer;
}
.pos-payment-confirmation-view .pos-wallet-qr-close:hover { border-color: var(--brand); color: var(--brand); }
.pos-action-spinner {
    width: 16px;
    height: 16px;
    border: 2px solid rgba(255,255,255,.45);
    border-top-color: #fff;
    border-radius: 50%;
    animation: posActionSpin .75s linear infinite;
}
@keyframes posActionSpin { to { transform: rotate(360deg); } }
@media (max-width: 720px) {
    .pos-payment-confirmation-view .pos-payment-method-tile { min-height: 86px; }
    .pos-payment-confirmation-view .pos-payment-method-subcaption { display: none; }
}

/* Touch POS 2 final purpose-payment tiles: robust icons and exact reference layout. */
.pos-payment-confirmation-view .pos-payment-six-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 12px !important;
}
.pos-payment-confirmation-view .pos-payment-method-tile {
    min-height: 112px !important;
    padding: 12px 8px !important;
    border: 1px solid color-mix(in srgb, var(--brand) 28%, var(--border)) !important;
    border-radius: 14px !important;
    background: linear-gradient(180deg, color-mix(in srgb, var(--card) 98%, white), color-mix(in srgb, var(--soft) 42%, var(--card))) !important;
    box-shadow: 0 4px 12px rgba(15, 45, 75, .08) !important;
    color: var(--text) !important;
}
.pos-payment-confirmation-view .pos-payment-method-tile:hover,
.pos-payment-confirmation-view .pos-payment-method-tile:focus-visible {
    border-color: var(--brand) !important;
    box-shadow: 0 7px 18px color-mix(in srgb, var(--brand) 20%, transparent) !important;
}
.pos-payment-confirmation-view .pos-payment-method-tile.active,
.pos-payment-confirmation-view .pos-payment-method-tile[aria-pressed="true"] {
    color: #fff !important;
    border-color: color-mix(in srgb, var(--brand) 82%, white) !important;
    background: linear-gradient(145deg, color-mix(in srgb, var(--brand) 92%, #1595df), color-mix(in srgb, var(--brand) 82%, #075ca8)) !important;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand) 22%, transparent), 0 10px 22px color-mix(in srgb, var(--brand) 28%, transparent) !important;
}
.pos-payment-confirmation-view .pos-purpose-icon {
    width: 58px !important;
    height: 50px !important;
    padding: 0 !important;
    border-radius: 14px !important;
    background: color-mix(in srgb, var(--brand) 8%, #fff) !important;
    overflow: hidden;
}
.pos-payment-confirmation-view .pos-purpose-emoji {
    font-size: 38px;
    line-height: 1;
    filter: saturate(1.08);
}
.pos-payment-confirmation-view .pos-purpose-brand {
    width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; gap: 2px;
    border-radius: 13px; background: #fff; color: #111; font-weight: 900;
}
.pos-payment-confirmation-view .pos-purpose-brand b { font-size: 28px; line-height: 1; }
.pos-payment-confirmation-view .pos-purpose-brand small { font-size: 14px; font-weight: 900; }
.pos-payment-confirmation-view .pos-purpose-gpay b { color: #4285f4; }
.pos-payment-confirmation-view .pos-purpose-apple b { color: #111; font-size: 30px; }
.pos-payment-confirmation-view .pos-payment-method-caption { font-size: 16px !important; font-weight: 900 !important; }
.pos-payment-confirmation-view .pos-payment-method-subcaption { font-size: 10px !important; }
.pos-payment-confirmation-view .pos-payment-method-tile.active .pos-purpose-icon,
.pos-payment-confirmation-view .pos-payment-method-tile[aria-pressed="true"] .pos-purpose-icon { background: #fff !important; }
.pos-payment-confirmation-view .pos-payment-method-tile.active .pos-payment-method-caption,
.pos-payment-confirmation-view .pos-payment-method-tile[aria-pressed="true"] .pos-payment-method-caption { color: #fff !important; }
.pos-payment-confirmation-view .pos-payment-method-tile.active .pos-payment-method-subcaption,
.pos-payment-confirmation-view .pos-payment-method-tile[aria-pressed="true"] .pos-payment-method-subcaption { color: rgba(255,255,255,.86) !important; }
.pos-payment-confirmation-view .pos-wallet-qr-panel:not([hidden]) { display: block !important; }
.pos-payment-confirmation-view .pos-terminal-send-btn:not([hidden]),
.pos-payment-confirmation-view .pos-wallet-send-btn:not([hidden]) { display: inline-flex !important; }
@media (max-width: 720px) {
  .pos-payment-confirmation-view .pos-payment-six-grid { grid-template-columns: repeat(3, minmax(0,1fr)) !important; gap: 8px !important; }
  .pos-payment-confirmation-view .pos-payment-method-tile { min-height: 88px !important; }
  .pos-payment-confirmation-view .pos-purpose-icon { width: 46px !important; height: 40px !important; }
  .pos-payment-confirmation-view .pos-purpose-emoji { font-size: 30px; }
  .pos-payment-confirmation-view .pos-payment-method-caption { font-size: 13px !important; }
}


/* Touch POS 2 compact action layout: keep every payment action and Validate & Save visible. */
.pos-payment-confirmation-view {
    width: min(940px, 98vw) !important;
    max-height: min(760px, 96vh) !important;
}
.pos-payment-confirmation-view .pos-payment-touch-summary {
    padding: 10px 14px !important;
    gap: 10px !important;
}
.pos-payment-confirmation-view .pos-payment-touch-summary div {
    padding: 8px 11px !important;
}
.pos-payment-confirmation-view .pos-payment-touch-summary strong {
    font-size: 18px !important;
}
.pos-payment-confirmation-view .pos-payment-touch-body {
    grid-template-columns: minmax(300px, .98fr) minmax(390px, 1.02fr) !important;
    gap: 12px !important;
    padding: 12px 14px 14px !important;
    overflow: hidden !important;
}
.pos-payment-confirmation-view .pos-payment-left,
.pos-payment-confirmation-view .pos-payment-right {
    min-height: 0 !important;
}
.pos-payment-confirmation-view .pos-payment-six-grid {
    gap: 10px !important;
    margin-bottom: 10px !important;
}
.pos-payment-confirmation-view .pos-payment-method-tile {
    min-height: 94px !important;
    padding: 8px 7px !important;
}
.pos-payment-confirmation-view .pos-purpose-icon {
    width: 50px !important;
    height: 43px !important;
}
.pos-payment-confirmation-view .pos-purpose-emoji { font-size: 32px !important; }
.pos-payment-confirmation-view .pos-payment-method-caption { font-size: 14px !important; }
.pos-payment-confirmation-view .pos-payment-method-subcaption { font-size: 9px !important; }
.pos-payment-confirmation-view .pos-payment-amount-display {
    min-height: 60px !important;
    font-size: 28px !important;
}
.pos-payment-confirmation-view .pos-payment-keypad {
    gap: 7px !important;
    margin-top: 8px !important;
}
.pos-payment-confirmation-view .pos-payment-keypad button {
    min-height: 54px !important;
    border-radius: 13px !important;
    font-size: 21px !important;
}
.pos-payment-confirmation-view .pos-payment-touch-actions {
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
    gap: 8px !important;
    margin-top: 8px !important;
}
.pos-payment-confirmation-view .pos-payment-touch-actions .pos-save-btn,
.pos-payment-confirmation-view .pos-payment-touch-actions .pos-payment-btn {
    min-height: 48px !important;
    font-size: 14px !important;
    padding: 8px 10px !important;
    margin: 0 !important;
}
.pos-payment-confirmation-view .pos-full-cash-btn { grid-column: 1 !important; grid-row: 1 !important; }
.pos-payment-confirmation-view .pos-add-payment-btn { grid-column: 2 !important; grid-row: 1 !important; }
.pos-payment-confirmation-view .pos-terminal-send-btn { grid-column: 1 !important; grid-row: 2 !important; }
.pos-payment-confirmation-view .pos-wallet-send-btn { grid-column: 2 !important; grid-row: 2 !important; }
.pos-payment-confirmation-view .pos-payment-btn {
    grid-column: 1 / -1 !important;
    grid-row: 3 !important;
    min-height: 54px !important;
    font-size: 16px !important;
}
.pos-payment-confirmation-view .pos-terminal-send-btn[disabled],
.pos-payment-confirmation-view .pos-wallet-send-btn[disabled] {
    display: inline-flex !important;
    opacity: .48 !important;
    filter: grayscale(.2) !important;
    cursor: not-allowed !important;
    box-shadow: none !important;
}
.pos-payment-confirmation-view .pos-payment-lines-list {
    max-height: 180px !important;
    overflow: auto !important;
}
.pos-payment-confirmation-view .pos-wallet-qr-panel {
    max-height: 260px !important;
    overflow: auto !important;
}
@media (max-height: 720px) {
    .pos-payment-confirmation-view { max-height: 98vh !important; }
    .pos-payment-confirmation-view .pos-payment-method-tile { min-height: 82px !important; }
    .pos-payment-confirmation-view .pos-purpose-icon { width: 44px !important; height: 37px !important; }
    .pos-payment-confirmation-view .pos-payment-method-subcaption { display: none !important; }
    .pos-payment-confirmation-view .pos-payment-keypad button { min-height: 47px !important; }
    .pos-payment-confirmation-view .pos-payment-touch-actions .pos-save-btn,
    .pos-payment-confirmation-view .pos-payment-touch-actions .pos-payment-btn { min-height: 43px !important; }
    .pos-payment-confirmation-view .pos-payment-btn { min-height: 48px !important; }
}

/* Touch POS 2 final visual correction: purpose-built tiles and fully visible QR panel. */
.pos-payment-confirmation-view .pos-payment-six-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 10px !important;
}
.pos-payment-confirmation-view .pos-payment-method-tile {
    min-height: 88px !important;
    padding: 9px 8px !important;
    border: 1px solid color-mix(in srgb, var(--brand) 34%, var(--border)) !important;
    border-radius: 15px !important;
    background: linear-gradient(180deg,
        color-mix(in srgb, var(--card) 98%, #fff),
        color-mix(in srgb, var(--soft) 52%, var(--card))) !important;
    color: var(--text) !important;
    box-shadow: 0 4px 12px rgba(20, 55, 85, .09) !important;
    outline: none !important;
    appearance: none !important;
    -webkit-appearance: none !important;
}
.pos-payment-confirmation-view .pos-payment-method-tile:hover,
.pos-payment-confirmation-view .pos-payment-method-tile:focus-visible {
    border-color: var(--brand) !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 7px 18px color-mix(in srgb, var(--brand) 20%, transparent) !important;
}
.pos-payment-confirmation-view .pos-payment-method-tile.active,
.pos-payment-confirmation-view .pos-payment-method-tile[aria-pressed="true"] {
    color: #fff !important;
    border-color: color-mix(in srgb, var(--brand) 78%, #fff) !important;
    background: linear-gradient(145deg,
        color-mix(in srgb, var(--brand) 92%, #20a4e8),
        color-mix(in srgb, var(--brand) 84%, #075a9f)) !important;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand) 20%, transparent),
                0 9px 20px color-mix(in srgb, var(--brand) 28%, transparent) !important;
}
.pos-payment-confirmation-view .pos-purpose-icon {
    width: 48px !important;
    height: 42px !important;
    padding: 7px !important;
    border-radius: 13px !important;
    background: color-mix(in srgb, var(--brand) 9%, #fff) !important;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.75) !important;
}
.pos-payment-confirmation-view .pos-purpose-icon svg {
    width: 100% !important;
    height: 100% !important;
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 2.7 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
}
.pos-payment-confirmation-view .pos-payment-method-caption {
    font-size: 14px !important;
    font-weight: 900 !important;
    line-height: 1.05 !important;
}
.pos-payment-confirmation-view .pos-payment-method-subcaption {
    font-size: 9px !important;
    line-height: 1 !important;
    margin-top: 1px !important;
}
.pos-payment-confirmation-view .pos-payment-selected-mark {
    top: 7px !important;
    right: 7px !important;
}

/* QR replaces the payment list but never creates an internal scroll area. */
.pos-payment-confirmation-view .pos-wallet-qr-panel {
    max-height: none !important;
    overflow: visible !important;
    margin-top: 10px !important;
    padding: 11px !important;
    border-radius: 15px !important;
}
.pos-payment-confirmation-view .pos-wallet-qr-head {
    margin-bottom: 8px !important;
}
.pos-payment-confirmation-view .pos-wallet-qr-head strong {
    font-size: 15px !important;
}
.pos-payment-confirmation-view .pos-wallet-qr-head span {
    padding: 4px 9px !important;
    font-size: 12px !important;
}
.pos-payment-confirmation-view .pos-wallet-qr-body {
    display: grid !important;
    grid-template-columns: 148px minmax(0, 1fr) !important;
    align-items: stretch !important;
    gap: 10px !important;
}
.pos-payment-confirmation-view .pos-wallet-qr-panel canvas {
    width: 148px !important;
    height: 148px !important;
    max-width: 100% !important;
    border-radius: 10px !important;
    background: #fff !important;
    padding: 5px !important;
}
.pos-payment-confirmation-view .pos-wallet-qr-details {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 6px !important;
    min-width: 0 !important;
}
.pos-payment-confirmation-view .pos-wallet-qr-details > div {
    min-height: 0 !important;
    padding: 7px 9px !important;
    border-radius: 10px !important;
}
.pos-payment-confirmation-view .pos-wallet-qr-details label {
    display: block !important;
    margin-bottom: 1px !important;
    font-size: 10px !important;
    line-height: 1 !important;
}
.pos-payment-confirmation-view .pos-wallet-qr-details strong {
    display: block !important;
    font-size: 12px !important;
    line-height: 1.15 !important;
    overflow-wrap: anywhere !important;
}
.pos-payment-confirmation-view .pos-wallet-qr-panel small {
    margin-top: 8px !important;
    padding: 7px 9px !important;
    font-size: 11px !important;
}

/* Keep all actions visible in the existing modal height. */
.pos-payment-confirmation-view .pos-payment-touch-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 7px !important;
    margin-top: 7px !important;
}
.pos-payment-confirmation-view .pos-payment-touch-actions .pos-save-btn,
.pos-payment-confirmation-view .pos-payment-touch-actions .pos-payment-btn {
    min-height: 45px !important;
    padding: 7px 8px !important;
    border-radius: 11px !important;
    font-size: 13px !important;
}
.pos-payment-confirmation-view .pos-payment-btn {
    min-height: 49px !important;
    font-size: 15px !important;
}

@media (max-height: 720px) {
    .pos-payment-confirmation-view .pos-payment-method-tile { min-height: 76px !important; }
    .pos-payment-confirmation-view .pos-purpose-icon { width: 42px !important; height: 36px !important; padding: 6px !important; }
    .pos-payment-confirmation-view .pos-wallet-qr-body { grid-template-columns: 128px minmax(0,1fr) !important; }
    .pos-payment-confirmation-view .pos-wallet-qr-panel canvas { width: 128px !important; height: 128px !important; }
    .pos-payment-confirmation-view .pos-wallet-qr-details > div { padding: 5px 7px !important; }
    .pos-payment-confirmation-view .pos-payment-keypad button { min-height: 44px !important; }
}

/* POS (Sales) received payment aligned with Touch POS 2. */
.sales-payment-touch-modal.pos-payment-confirmation-view { width:min(940px,98vw)!important; max-height:min(760px,96vh)!important; }
.sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-six-grid { grid-template-columns:repeat(3,minmax(0,1fr))!important; gap:10px!important; }
.sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile { min-height:94px!important; padding:8px 7px!important; border-radius:14px!important; border:1px solid color-mix(in srgb,var(--brand) 28%,var(--border))!important; background:linear-gradient(180deg,color-mix(in srgb,var(--card) 98%,white),color-mix(in srgb,var(--soft) 42%,var(--card)))!important; box-shadow:0 4px 12px rgba(15,45,75,.08)!important; display:flex!important; flex-direction:column!important; align-items:center!important; justify-content:center!important; gap:3px!important; position:relative!important; }
.sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile.active { color:#fff!important; background:linear-gradient(145deg,color-mix(in srgb,var(--brand) 92%,#1595df),color-mix(in srgb,var(--brand) 82%,#075ca8))!important; box-shadow:0 0 0 3px color-mix(in srgb,var(--brand) 22%,transparent),0 10px 22px color-mix(in srgb,var(--brand) 28%,transparent)!important; }
.sales-payment-touch-modal .pos-purpose-icon { width:50px!important; height:43px!important; border-radius:13px!important; background:#fff!important; display:flex!important; align-items:center!important; justify-content:center!important; overflow:hidden!important; }
.sales-payment-touch-modal .pos-purpose-emoji { font-size:32px!important; line-height:1!important; }
.sales-payment-touch-modal .pos-purpose-brand { width:100%;height:100%;display:flex;align-items:center;justify-content:center;gap:2px;background:#fff;color:#111;font-weight:900; }
.sales-payment-touch-modal .pos-purpose-brand b{font-size:27px;line-height:1}.sales-payment-touch-modal .pos-purpose-brand small{font-size:13px;font-weight:900}.sales-payment-touch-modal .pos-purpose-gpay b{color:#4285f4}
.sales-payment-touch-modal .pos-payment-method-caption{font-size:14px!important;font-weight:900!important}.sales-payment-touch-modal .pos-payment-method-subcaption{font-size:9px!important}.sales-payment-touch-modal .pos-payment-selected-mark{display:none;position:absolute;right:8px;top:8px;width:22px;height:22px;border-radius:50%;background:#fff;color:var(--brand);align-items:center;justify-content:center;font-weight:900}.sales-payment-touch-modal .pos-payment-method-tile.active .pos-payment-selected-mark{display:flex}
.sales-payment-touch-modal .pos-wallet-qr-panel{max-height:none!important;overflow:visible!important;border-radius:14px!important;padding:12px!important}.sales-payment-touch-modal .pos-wallet-qr-panel:not([hidden]){display:grid!important;grid-template-columns:178px 1fr;gap:12px;align-items:start}.sales-payment-touch-modal .pos-wallet-qr-head,.sales-payment-touch-modal .pos-wallet-qr-panel small{grid-column:1/-1}.sales-payment-touch-modal .pos-wallet-qr-panel canvas{width:168px!important;height:168px!important}.sales-payment-touch-modal .pos-wallet-qr-meta{display:grid!important;grid-template-columns:1fr!important;gap:5px!important}.sales-payment-touch-modal .pos-payment-touch-actions{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}.sales-payment-touch-modal .pos-payment-touch-actions .pos-payment-btn{grid-column:1/-1!important}.sales-payment-touch-modal .pos-terminal-send-btn[disabled],.sales-payment-touch-modal .pos-wallet-send-btn[disabled]{display:inline-flex!important;opacity:.48!important;cursor:not-allowed!important}

/* POS payment forms: project theme only + validation progress lock. */
.pos-payment-touch-modal,
.pos-payment-confirmation-view,
.sales-payment-touch-modal {
    --payment-primary: var(--theme-primary, var(--brand, #0b83c6));
    --payment-primary-contrast: var(--theme-primary-text, #fff);
    --payment-surface: var(--card, #fff);
    --payment-soft: var(--soft, #f4f7fb);
    --payment-border: var(--border, #cbd8e6);
    --payment-text: var(--text, #102a43);
    --payment-muted: var(--muted, #61758a);
    background: var(--payment-surface) !important;
    color: var(--payment-text) !important;
}
.pos-payment-touch-modal .pos-orders-head,
.pos-payment-confirmation-view .pos-orders-head {
    background: var(--payment-surface) !important;
    color: var(--payment-text) !important;
    border-bottom-color: var(--payment-border) !important;
}
.pos-payment-touch-modal .pos-payment-touch-summary div,
.pos-payment-touch-modal .pos-payment-amount-display,
.pos-payment-touch-modal .pos-payment-keypad button,
.pos-payment-touch-modal .pos-payment-method-tile,
.pos-payment-touch-modal .pos-payment-lines-list,
.pos-payment-touch-modal .pos-wallet-qr-panel {
    background: var(--payment-surface) !important;
    color: var(--payment-text) !important;
    border-color: var(--payment-border) !important;
}
.pos-payment-touch-modal .pos-payment-method-tile:hover,
.pos-payment-touch-modal .pos-payment-keypad button:hover {
    background: var(--payment-soft) !important;
    border-color: var(--payment-primary) !important;
}
.pos-payment-touch-modal .pos-payment-method-tile.active {
    background: var(--payment-primary) !important;
    color: var(--payment-primary-contrast) !important;
    border-color: var(--payment-primary) !important;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--payment-primary) 22%, transparent) !important;
}
.pos-payment-touch-modal .pos-payment-btn,
.pos-payment-touch-modal .pos-save-btn:not(:disabled) {
    border-color: var(--payment-primary) !important;
}
.pos-payment-touch-modal .pos-payment-btn {
    background: var(--payment-primary) !important;
    color: var(--payment-primary-contrast) !important;
}
.pos-payment-touch-modal .pos-save-btn {
    background: var(--payment-soft) !important;
    color: var(--payment-text) !important;
}
.pos-payment-touch-modal .pos-save-btn:hover:not(:disabled) {
    background: color-mix(in srgb, var(--payment-primary) 12%, var(--payment-surface)) !important;
}
.pos-payment-touch-modal button:disabled {
    opacity: .55 !important;
    cursor: not-allowed !important;
}

.sales-payment-touch-modal { position: relative !important; }
.sales-payment-validation-overlay[hidden] { display: none !important; }
.sales-payment-validation-overlay {
    position: absolute;
    inset: 0;
    z-index: 80;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    border-radius: inherit;
    background: color-mix(in srgb, var(--payment-surface) 78%, transparent);
    backdrop-filter: blur(3px);
}
.sales-payment-validation-card {
    width: min(390px, 92%);
    display: grid;
    justify-items: center;
    gap: 10px;
    padding: 24px 22px;
    border: 1px solid var(--payment-border);
    border-radius: 18px;
    background: var(--payment-surface);
    color: var(--payment-text);
    box-shadow: 0 18px 50px rgba(15, 35, 55, .18);
    text-align: center;
}
.sales-payment-validation-card strong { font-size: 19px; }
.sales-payment-validation-card span:last-child { color: var(--payment-muted); line-height: 1.45; }
.sales-payment-validation-spinner {
    width: 46px;
    height: 46px;
    border-radius: 50%;
    border: 5px solid color-mix(in srgb, var(--payment-primary) 22%, var(--payment-border));
    border-top-color: var(--payment-primary);
    animation: sales-payment-spin .8s linear infinite;
}
@keyframes sales-payment-spin { to { transform: rotate(360deg); } }
.sales-payment-touch-modal.payment-validation-busy .pos-payment-touch-body,
.sales-payment-touch-modal.payment-validation-busy .pos-payment-touch-summary {
    pointer-events: none;
    user-select: none;
}
.pos-payment-touch-modal .is-busy { cursor: wait !important; }


/* POS (Sales): non-blocking payment validation progress. */
.sales-payment-validation-overlay {
    pointer-events: none !important;
    align-items: flex-start !important;
    justify-content: center !important;
    padding-top: 74px !important;
    background: transparent !important;
    backdrop-filter: none !important;
}
.sales-payment-validation-card {
    width: min(430px, calc(100% - 32px)) !important;
    grid-template-columns: auto 1fr !important;
    justify-items: start !important;
    text-align: left !important;
    padding: 14px 18px !important;
    gap: 4px 12px !important;
    box-shadow: 0 12px 34px rgba(15,35,55,.18) !important;
}
.sales-payment-validation-spinner {
    grid-row: 1 / span 2 !important;
    width: 34px !important;
    height: 34px !important;
    border-width: 4px !important;
}
.sales-payment-touch-modal.payment-validation-progress .pos-payment-touch-body,
.sales-payment-touch-modal.payment-validation-progress .pos-payment-touch-summary {
    pointer-events: auto !important;
    user-select: auto !important;
}

/* POS (Sales) customer selection stability/performance fix.
   Prevent browser scroll anchoring from moving the full sheet while customer details arrive,
   and keep the existing address area in place while a replacement address is loading. */
.sales-entry-page {
    overflow-anchor: none;
}

.sales-customer-address-row,
.sales-customer-address-preview {
    transition: opacity .12s ease;
}

.sales-customer-address-row.is-loading,
.sales-customer-address-preview.is-loading {
    opacity: .58;
    pointer-events: none;
}

.sales-address-refresh:disabled {
    cursor: wait;
    opacity: .58;
}

/* Customer request / backorder notification shortcut
   Icon-only and placed in normal page flow so it never covers page fields/labels/buttons. */
.erp-notification-slot {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    min-height: 0;
    margin: 0 0 8px;
    pointer-events: none;
}
.erp-notification-bell {
    position: relative;
    z-index: 3;
    width: 40px;
    height: 40px;
    min-width: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border-radius: 999px;
    border: 1px solid var(--border, #dbe4ee);
    background: var(--card, #fff);
    color: var(--theme-primary, var(--brand, #2563eb));
    box-shadow: 0 12px 28px rgba(15,23,42,.12);
    text-decoration: none;
    font-size: 18px;
    line-height: 1;
    pointer-events: auto;
    transition: transform .14s ease, box-shadow .14s ease, border-color .14s ease, background .14s ease, color .14s ease;
}
.erp-notification-bell:hover,
.erp-notification-bell:focus-visible {
    transform: translateY(-1px);
    color: var(--card, #fff);
    background: var(--theme-primary, var(--brand, #2563eb));
    border-color: var(--theme-primary, var(--brand, #2563eb));
    box-shadow: 0 16px 35px rgba(15,23,42,.16);
    outline: none;
}
.erp-notification-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1em;
    height: 1em;
}
.erp-notification-text {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}
.erp-notification-count {
    position: absolute;
    top: -5px;
    right: -5px;
    min-width: 18px;
    height: 18px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 5px;
    border-radius: 999px;
    background: var(--theme-danger, #ef4444);
    color: #fff;
    border: 2px solid var(--card, #fff);
    font-size: 10px;
    font-weight: 900;
    line-height: 1;
    box-shadow: 0 5px 12px rgba(15,23,42,.16);
}
.pos-sidebar-hidden .erp-notification-slot,
.sales-entry-page ~ .erp-notification-slot {
    margin-bottom: 6px;
}
@media (max-width: 720px) {
    .erp-notification-slot { margin-bottom: 6px; }
    .erp-notification-bell { width: 36px; height: 36px; min-width: 36px; font-size: 16px; }
}

/* Active user theme readability hardening
   Keep all controls using selected project theme variables; no fixed external/Odoo colors. */
:root {
    --theme-primary: var(--brand);
    --theme-secondary: var(--brand-dark);
    --theme-accent: var(--soft);
    --theme-surface: var(--card);
    --theme-text: var(--text);
    --theme-muted: var(--muted);
    --theme-border: var(--border);
    --theme-input-bg: var(--card);
    --theme-grid-head-bg: color-mix(in srgb, var(--brand) 8%, var(--card));
    --theme-grid-row-hover: color-mix(in srgb, var(--brand) 6%, var(--card));
    --theme-success-bg: color-mix(in srgb, #22c55e 18%, var(--card));
    --theme-success-text: color-mix(in srgb, #16a34a 78%, var(--text));
    --theme-warning-bg: color-mix(in srgb, #f59e0b 18%, var(--card));
    --theme-warning-text: color-mix(in srgb, #92400e 72%, var(--text));
    --theme-danger-bg: color-mix(in srgb, #ef4444 18%, var(--card));
    --theme-danger-text: color-mix(in srgb, #b91c1c 72%, var(--text));
}

body.theme-dark,
body.theme-midnight,
body.theme-carbon {
    --theme-input-bg: color-mix(in srgb, var(--card) 84%, #ffffff 4%);
    --theme-grid-head-bg: color-mix(in srgb, var(--brand) 16%, var(--card));
    --theme-grid-row-hover: color-mix(in srgb, var(--brand) 12%, var(--card));
    --theme-success-bg: color-mix(in srgb, #22c55e 20%, var(--card));
    --theme-success-text: #bbf7d0;
    --theme-warning-bg: color-mix(in srgb, #f59e0b 22%, var(--card));
    --theme-warning-text: #fde68a;
    --theme-danger-bg: color-mix(in srgb, #ef4444 20%, var(--card));
    --theme-danger-text: #fecaca;
}

body,
.app-shell,
.page-card,
.form-card,
.customer-requests-page,
.customer-display-body {
    color: var(--theme-text, var(--text));
}

input,
select,
textarea,
button,
.erp-input,
.erp-select,
.odoo-input,
.form-control,
.lookup-input,
.sales-input,
.sales-select,
.touch-pos-page input,
.touch-pos-page select,
.touch-pos-page textarea,
.customer-requests-page input,
.customer-requests-page select,
.customer-requests-page textarea {
    border-color: var(--theme-border, var(--border)) !important;
}

input,
select,
textarea,
.erp-input,
.erp-select,
.odoo-input,
.form-control,
.lookup-input,
.sales-input,
.sales-select,
.customer-requests-page input,
.customer-requests-page select,
.customer-requests-page textarea {
    background: var(--theme-input-bg, var(--card)) !important;
    color: var(--theme-text, var(--text)) !important;
}

input::placeholder,
textarea::placeholder,
.customer-requests-page input::placeholder {
    color: color-mix(in srgb, var(--theme-muted, var(--muted)) 86%, transparent) !important;
    opacity: 1;
}

button,
.btn,
.odoo-save,
.erp-btn,
.sales-action,
.pos-action-tile,
.customer-requests-page .cr-action,
.customer-requests-page .cr-filters button {
    background-color: var(--theme-primary, var(--brand)) ;
    color: #fff;
}

button:disabled,
.btn:disabled,
.sales-action:disabled,
.pos-action-tile:disabled {
    background: color-mix(in srgb, var(--theme-muted, var(--muted)) 24%, var(--theme-card, var(--card))) !important;
    color: color-mix(in srgb, var(--theme-muted, var(--muted)) 86%, var(--theme-text, var(--text))) !important;
    border-color: var(--theme-border, var(--border)) !important;
}

/* Shared Advanced UI fallback for legacy Odoo primary actions.
   This removes the inherited filled Odoo button color on pages that have not yet
   received a page-specific Advanced UI conversion. More-specific page styles that
   appear later in this stylesheet continue to take precedence, preserving prior fixes. */
.odoo-save,
.odoo-new {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 36px;
    padding: 7px 14px;
    border: 1px solid color-mix(in srgb, var(--theme-primary, var(--brand)) 42%, var(--theme-border, var(--border)));
    border-radius: 9px;
    background: color-mix(in srgb, var(--theme-primary, var(--brand)) 4%, var(--theme-card, var(--card)));
    color: var(--theme-primary, var(--brand));
    text-decoration: none;
    font-weight: 850;
    line-height: 1;
    box-shadow: 0 5px 14px color-mix(in srgb, var(--theme-text, var(--text)) 7%, transparent),
                inset 0 1px 0 color-mix(in srgb, #fff 24%, transparent);
    cursor: pointer;
    overflow: hidden;
    transition: transform .16s ease, border-color .16s ease, background .16s ease,
                color .16s ease, box-shadow .16s ease;
}

.odoo-save::after,
.odoo-new::after {
    content: "";
    position: absolute;
    left: 12px;
    right: 12px;
    bottom: 0;
    height: 2px;
    border-radius: 999px;
    background: var(--theme-primary, var(--brand));
    opacity: 0;
    transform: scaleX(.25);
    transition: opacity .16s ease, transform .16s ease;
}

.odoo-save:hover,
.odoo-save:focus-visible,
.odoo-new:hover,
.odoo-new:focus-visible {
    border-color: var(--theme-primary, var(--brand));
    background: color-mix(in srgb, var(--theme-primary, var(--brand)) 10%, var(--theme-card, var(--card)));
    color: var(--theme-primary, var(--brand));
    box-shadow: 0 9px 22px color-mix(in srgb, var(--theme-primary, var(--brand)) 14%, transparent),
                inset 0 0 0 1px color-mix(in srgb, var(--theme-primary, var(--brand)) 10%, transparent);
    transform: translateY(-1px);
    outline: none;
}

.odoo-save:hover::after,
.odoo-save:focus-visible::after,
.odoo-new:hover::after,
.odoo-new:focus-visible::after {
    opacity: 1;
    transform: scaleX(1);
}

.odoo-save:active,
.odoo-new:active {
    background: color-mix(in srgb, var(--theme-primary, var(--brand)) 14%, var(--theme-card, var(--card)));
    transform: translateY(0);
}

.odoo-save:disabled,
.odoo-save[disabled],
.odoo-new:disabled,
.odoo-new[disabled],
.odoo-save.disabled,
.odoo-new.disabled {
    border-color: var(--theme-border, var(--border));
    background: transparent;
    color: var(--theme-muted, var(--muted));
    box-shadow: none;
    cursor: not-allowed;
    pointer-events: none;
    opacity: .55;
    transform: none;
}

.odoo-save:disabled::after,
.odoo-save[disabled]::after,
.odoo-new:disabled::after,
.odoo-new[disabled]::after,
.odoo-save.disabled::after,
.odoo-new.disabled::after {
    display: none;
}

table,
.erp-table,
.odoo-list-table,
.sales-lines-table,
.cr-table {
    color: var(--theme-text, var(--text));
}

th,
.erp-table th,
.odoo-list-table th,
.sales-lines-table th,
.cr-table th {
    background: var(--theme-grid-head-bg, color-mix(in srgb, var(--brand) 8%, var(--card))) !important;
    color: var(--theme-muted, var(--muted)) !important;
}

td,
.erp-table td,
.odoo-list-table td,
.sales-lines-table td,
.cr-table td {
    border-color: var(--theme-border, var(--border)) !important;
}

tr:hover,
.erp-table tbody tr:hover,
.odoo-list-table tbody tr:hover,
.sales-lines-table tbody tr:hover,
.cr-table tbody tr:hover {
    background: var(--theme-grid-row-hover, color-mix(in srgb, var(--brand) 6%, var(--card))) !important;
}

.erp-modal,
.erp-dialog,
.erp-confirm-dialog,
.erp-prompt-dialog,
.lookup-panel,
.lookup-modal,
.modal-content,
.customer-requests-page .cr-table-card,
.customer-requests-page .cr-hero,
.customer-requests-page .cr-cards div,
.customer-display-header,
.customer-display-ticket-info,
.customer-display-lines-card,
.customer-display-summary-card {
    background: var(--theme-surface, var(--card)) !important;
    color: var(--theme-text, var(--text)) !important;
    border-color: var(--theme-border, var(--border)) !important;
}

.customer-requests-page .cr-export {
    background: var(--theme-secondary, var(--brand-dark)) !important;
    color: #fff !important;
}

.customer-requests-page .cr-badge.available,
.badge.available,
.status-available {
    background: var(--theme-success-bg) !important;
    color: var(--theme-success-text) !important;
}

.customer-requests-page .cr-badge.pending,
.badge.pending,
.status-pending,
.status-warning {
    background: var(--theme-warning-bg) !important;
    color: var(--theme-warning-text) !important;
}

.customer-requests-page .cr-badge.closed,
.status-danger,
.status-cancelled {
    background: var(--theme-danger-bg) !important;
    color: var(--theme-danger-text) !important;
}

body.theme-dark .customer-display-line,
body.theme-midnight .customer-display-line,
body.theme-carbon .customer-display-line,
body.theme-dark .customer-display-message,
body.theme-midnight .customer-display-message,
body.theme-carbon .customer-display-message,
body.theme-dark .customer-display-qr-card,
body.theme-midnight .customer-display-qr-card,
body.theme-carbon .customer-display-qr-card {
    background: color-mix(in srgb, var(--brand) 14%, var(--card)) !important;
    color: var(--theme-text, var(--text)) !important;
}

body.theme-dark .customer-display-empty,
body.theme-midnight .customer-display-empty,
body.theme-carbon .customer-display-empty {
    color: var(--theme-muted, var(--muted)) !important;
    border-color: color-mix(in srgb, var(--brand) 42%, var(--border)) !important;
}

/* Complete title tooltip fallback: keep truncated text visible via native title and prevent clipping when possible. */
[title] {
    text-decoration-thickness: .08em;
}

.full-text,
.cr-table td,
.cr-table th,
.customer-requests-page [title] {
    overflow-wrap: anywhere;
}


/* Session/theme hardening: selected ERP theme on login, backorders and every standard control. */
.login-wrapper {
    background:
        radial-gradient(circle at top left, color-mix(in srgb, var(--brand) 20%, transparent), transparent 34%),
        radial-gradient(circle at bottom right, color-mix(in srgb, var(--brand-dark) 16%, transparent), transparent 32%),
        var(--bg);
    color: var(--text);
}

.login-card,
.login-mode-card,
.login-keypad-panel,
.customer-requests-page .cr-hero,
.customer-requests-page .cr-table-card,
.customer-requests-page .cr-cards div {
    background: var(--card) !important;
    color: var(--text) !important;
    border-color: var(--border) !important;
}

.login-card h1,
.customer-requests-page h1,
.customer-requests-page h2,
.customer-requests-page strong,
.customer-requests-page td,
.customer-requests-page th {
    color: var(--text) !important;
}

.login-card label,
.login-input-hint,
.customer-requests-page p,
.customer-requests-page small,
.customer-requests-page .cr-path,
.customer-requests-page .cr-cards span,
.customer-requests-page .cr-table-head span {
    color: var(--muted) !important;
}

.login-card .input,
.login-card select,
.login-card input,
.customer-requests-page input,
.customer-requests-page select,
.customer-requests-page textarea,
.form-card input,
.form-card select,
.form-card textarea,
.page-card input,
.page-card select,
.page-card textarea {
    background: var(--theme-input-bg, var(--card)) !important;
    color: var(--text) !important;
    border-color: var(--border) !important;
    caret-color: var(--brand) !important;
}

.login-card .input:focus,
.login-card select:focus,
.login-card input:focus,
.customer-requests-page input:focus,
.customer-requests-page select:focus,
.customer-requests-page textarea:focus,
.form-card input:focus,
.form-card select:focus,
.form-card textarea:focus,
.page-card input:focus,
.page-card select:focus,
.page-card textarea:focus {
    outline: 2px solid color-mix(in srgb, var(--brand) 34%, transparent) !important;
    border-color: var(--brand) !important;
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--brand) 12%, transparent) !important;
}

.login-mode-card,
.login-pin-pad button,
.login-key-row button,
.cr-actions-cell button,
.customer-requests-page .cr-link {
    color: var(--text) !important;
}

.login-mode-card:hover,
.login-mode-card:focus,
.login-mode-card.active,
.login-pin-pad button:hover,
.login-pin-pad button:focus,
.login-key-row button:hover,
.login-key-row button:focus,
.login-key-row button.active,
.customer-requests-page .cr-action,
.customer-requests-page .cr-filters button,
.btn,
.btn-secondary {
    background: var(--brand) !important;
    color: #fff !important;
    border-color: var(--brand) !important;
}

.customer-requests-page .cr-export,
.logout-btn {
    background: var(--brand-dark) !important;
    color: #fff !important;
}

.cr-actions-cell button {
    background: var(--soft) !important;
    border-color: var(--border) !important;
    color: var(--brand) !important;
}

.cr-actions-cell button:hover,
.cr-actions-cell button:focus {
    background: var(--brand) !important;
    color: #fff !important;
}

.cr-table tbody tr,
.cr-table td,
.cr-table th {
    background-color: transparent;
}

body.theme-dark .login-wrapper,
body.theme-midnight .login-wrapper,
body.theme-carbon .login-wrapper {
    background:
        radial-gradient(circle at top left, color-mix(in srgb, var(--brand) 18%, transparent), transparent 34%),
        radial-gradient(circle at bottom right, color-mix(in srgb, var(--brand) 14%, transparent), transparent 32%),
        var(--bg) !important;
}

body.theme-dark .login-card,
body.theme-midnight .login-card,
body.theme-carbon .login-card,
body.theme-dark .customer-requests-page .cr-hero,
body.theme-midnight .customer-requests-page .cr-hero,
body.theme-carbon .customer-requests-page .cr-hero,
body.theme-dark .customer-requests-page .cr-table-card,
body.theme-midnight .customer-requests-page .cr-table-card,
body.theme-carbon .customer-requests-page .cr-table-card,
body.theme-dark .customer-requests-page .cr-cards div,
body.theme-midnight .customer-requests-page .cr-cards div,
body.theme-carbon .customer-requests-page .cr-cards div {
    box-shadow: 0 18px 45px rgba(0, 0, 0, .42) !important;
}

body.theme-dark option,
body.theme-midnight option,
body.theme-carbon option {
    background: var(--card) !important;
    color: var(--text) !important;
}

/* POS (Sales) product/order list column resizing and persistent user widths. */
.sales-entry-page .sales-order-lines .sales-items-table th.sales-line-resizable-header {
    position: sticky !important;
    overflow: visible;
}

.sales-line-column-resize-handle {
    position: absolute;
    top: 0;
    right: -4px;
    bottom: 0;
    z-index: 90;
    width: 9px;
    cursor: col-resize;
    touch-action: none;
}

.sales-line-column-resize-handle::after {
    content: "";
    position: absolute;
    top: 7px;
    right: 4px;
    bottom: 7px;
    width: 1px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 50%, var(--muted, #94a3b8));
    opacity: .34;
}

.sales-entry-page .sales-items-table th.sales-line-resizable-header:hover > .sales-line-column-resize-handle::after,
.sales-entry-page .sales-items-table th.sales-line-resizable-header.is-resizing > .sales-line-column-resize-handle::after {
    width: 2px;
    opacity: .95;
}

body.sales-line-column-resizing,
body.sales-line-column-resizing * {
    cursor: col-resize !important;
    user-select: none !important;
}

body.theme-dark .sales-line-column-resize-handle::after,
body.theme-midnight .sales-line-column-resize-handle::after,
body.theme-carbon .sales-line-column-resize-handle::after {
    background: color-mix(in srgb, var(--theme-primary, var(--brand, #a78bfa)) 60%, var(--text, #f8fafc));
    opacity: .62;
}

/* Global active-theme control coverage: all pages/forms/lookups/modals must use the selected ERP theme. */
body {
    --erp-control-bg: var(--theme-input-bg, var(--card));
    --erp-control-text: var(--text);
    --erp-control-muted: var(--muted);
    --erp-control-border: var(--border);
    --erp-control-focus: var(--brand);
    --erp-control-soft: var(--soft);
    --erp-control-primary: var(--brand);
    --erp-control-primary-dark: var(--brand-dark);
}

body input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
body select,
body textarea,
body .form-control,
body .input,
body .lookup-input,
body .erp-lookup-input,
body .lookup-field,
body .lookup-search,
body .search-input,
body .grid-filter,
body .page-card input,
body .page-card select,
body .page-card textarea,
body .form-card input,
body .form-card select,
body .form-card textarea,
body .odoo-section input,
body .odoo-section select,
body .odoo-section textarea,
body .pos-touch-page input:not([type="checkbox"]):not([type="radio"]),
body .pos-touch-page select,
body .pos-touch-page textarea,
body .sales-entry-page input:not([type="checkbox"]):not([type="radio"]),
body .sales-entry-page select,
body .sales-entry-page textarea,
body .customer-requests-page input,
body .customer-requests-page select,
body .customer-requests-page textarea {
    background: var(--erp-control-bg) !important;
    color: var(--erp-control-text) !important;
    border-color: var(--erp-control-border) !important;
    caret-color: var(--erp-control-focus) !important;
}

body input::placeholder,
body textarea::placeholder,
body .pos-touch-page input::placeholder,
body .sales-entry-page input::placeholder,
body .customer-requests-page input::placeholder {
    color: color-mix(in srgb, var(--erp-control-muted) 82%, transparent) !important;
    opacity: 1 !important;
}

body input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):focus,
body select:focus,
body textarea:focus,
body .lookup-input:focus,
body .erp-lookup-input:focus,
body .search-input:focus,
body .pos-touch-page input:focus,
body .sales-entry-page input:focus,
body .customer-requests-page input:focus,
body .customer-requests-page select:focus {
    outline: 2px solid color-mix(in srgb, var(--erp-control-focus) 34%, transparent) !important;
    border-color: var(--erp-control-focus) !important;
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--erp-control-focus) 12%, transparent) !important;
}

body .modal,
body .modal-content,
body .lookup-modal,
body .lookup-panel,
body .lookup-dropdown,
body .lookup-results,
body .erp-lookup-panel,
body .pos-orders-modal,
body .pos-confirm-card,
body .pos-customer-modal,
body .pos-action-modal,
body .page-card,
body .form-card,
body .odoo-section,
body .table-card,
body .list-card,
body .grid-card,
body .customer-requests-page .cr-hero,
body .customer-requests-page .cr-table-card,
body .customer-requests-page .cr-cards div {
    background: var(--card) !important;
    color: var(--text) !important;
    border-color: var(--border) !important;
}

body table,
body .table,
body .erp-grid,
body .list-grid,
body .data-grid,
body .lookup-table,
body .pos-orders-grid,
body .cr-table,
body .sales-items-table {
    color: var(--text) !important;
    border-color: var(--border) !important;
}

body table th,
body table td,
body .erp-grid th,
body .erp-grid td,
body .list-grid th,
body .list-grid td,
body .data-grid th,
body .data-grid td,
body .lookup-table th,
body .lookup-table td,
body .pos-orders-grid th,
body .pos-orders-grid td,
body .cr-table th,
body .cr-table td,
body .sales-items-table th,
body .sales-items-table td {
    color: var(--text) !important;
    border-color: var(--border) !important;
}

body table thead th,
body .erp-grid thead th,
body .list-grid thead th,
body .data-grid thead th,
body .lookup-table thead th,
body .pos-orders-grid thead th,
body .cr-table thead th,
body .sales-items-table thead th {
    background: color-mix(in srgb, var(--soft) 72%, var(--card)) !important;
    color: var(--text) !important;
}

body table tbody tr:hover,
body .erp-grid tbody tr:hover,
body .list-grid tbody tr:hover,
body .data-grid tbody tr:hover,
body .lookup-table tbody tr:hover,
body .pos-orders-grid tbody tr:hover,
body .cr-table tbody tr:hover,
body .sales-items-table tbody tr:hover {
    background: color-mix(in srgb, var(--brand) 8%, var(--card)) !important;
}

body .btn,
body .btn-primary,
body .action-btn,
body .primary-btn,
body .save-btn,
body .pos-save-btn,
body .pos-payment-btn,
body .pos-mini-btn,
body .pos-icon-btn,
body .pos-orders-pager button,
body .pos-customer-footer button,
body .pos-action-tile,
body .cr-action,
body .cr-export,
body .customer-requests-page button,
body .lookup-actions button,
body .erp-modal-actions button {
    border-color: color-mix(in srgb, var(--brand) 50%, var(--border)) !important;
}

body .btn-primary,
body .primary-btn,
body .save-btn,
body .pos-payment-btn,
body .cr-action,
body .customer-requests-page .cr-filters button,
body .login-card .btn {
    background: linear-gradient(135deg,
        color-mix(in srgb, var(--brand) 94%, #ffffff 6%),
        color-mix(in srgb, var(--brand) 82%, var(--brand-dark))) !important;
    color: var(--theme-primary-text, #fff) !important;
}

body button:disabled,
body .btn:disabled,
body .pos-save-btn:disabled,
body .pos-payment-btn:disabled,
body .pos-payment-touch-modal button:disabled {
    background: color-mix(in srgb, var(--soft) 72%, var(--card)) !important;
    color: color-mix(in srgb, var(--muted) 84%, var(--text)) !important;
    border-color: var(--border) !important;
    opacity: .78 !important;
}

body .badge,
body .pill,
body .status-pill,
body .lookup-pill,
body .pos-stock-pill,
body .cr-status,
body .cr-badge {
    background: color-mix(in srgb, var(--brand) 13%, var(--card)) !important;
    color: var(--brand) !important;
    border-color: color-mix(in srgb, var(--brand) 35%, var(--border)) !important;
}

/* Touch POS 2 receive-payment advanced theme UI. No fixed Odoo colors; selected theme drives every button/control. */
.pos-payment-touch-modal.pos-payment-confirmation-view {
    --payment-primary: var(--brand);
    --payment-primary-dark: var(--brand-dark);
    --payment-primary-contrast: var(--theme-primary-text, #fff);
    --payment-surface: var(--card);
    --payment-soft: var(--soft);
    --payment-border: var(--border);
    --payment-text: var(--text);
    --payment-muted: var(--muted);
    background:
        radial-gradient(circle at top left, color-mix(in srgb, var(--payment-primary) 10%, transparent), transparent 36%),
        var(--payment-surface) !important;
    color: var(--payment-text) !important;
    border: 1px solid color-mix(in srgb, var(--payment-primary) 24%, var(--payment-border)) !important;
    box-shadow: 0 26px 74px color-mix(in srgb, var(--payment-primary-dark) 24%, transparent) !important;
}

.pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-summary div,
.pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-lines-list,
.pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-amount-display,
.pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-keypad button,
.pos-payment-touch-modal.pos-payment-confirmation-view .pos-wallet-qr-panel {
    background: linear-gradient(180deg,
        color-mix(in srgb, var(--payment-surface) 97%, var(--payment-soft)),
        color-mix(in srgb, var(--payment-soft) 36%, var(--payment-surface))) !important;
    color: var(--payment-text) !important;
    border-color: color-mix(in srgb, var(--payment-primary) 20%, var(--payment-border)) !important;
}

.pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile {
    min-height: 96px !important;
    padding: 12px 10px !important;
    border-radius: 18px !important;
    border: 1px solid color-mix(in srgb, var(--payment-primary) 28%, var(--payment-border)) !important;
    background:
        linear-gradient(145deg,
            color-mix(in srgb, var(--payment-surface) 94%, var(--payment-soft)),
            color-mix(in srgb, var(--payment-soft) 66%, var(--payment-surface))) !important;
    color: var(--payment-text) !important;
    box-shadow: 0 8px 18px color-mix(in srgb, var(--payment-primary-dark) 10%, transparent) !important;
    transform: translateY(0);
    transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease, background .16s ease !important;
}

.pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile:hover,
.pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile:focus-visible {
    transform: translateY(-2px);
    border-color: var(--payment-primary) !important;
    background:
        linear-gradient(145deg,
            color-mix(in srgb, var(--payment-primary) 9%, var(--payment-surface)),
            color-mix(in srgb, var(--payment-soft) 84%, var(--payment-surface))) !important;
    box-shadow: 0 14px 26px color-mix(in srgb, var(--payment-primary) 22%, transparent) !important;
    outline: none !important;
}

.pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile.active,
.pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile[aria-pressed="true"] {
    background:
        linear-gradient(145deg,
            color-mix(in srgb, var(--payment-primary) 96%, #ffffff 4%),
            color-mix(in srgb, var(--payment-primary) 78%, var(--payment-primary-dark))) !important;
    color: var(--payment-primary-contrast) !important;
    border-color: var(--payment-primary) !important;
    box-shadow:
        0 0 0 3px color-mix(in srgb, var(--payment-primary) 24%, transparent),
        0 18px 34px color-mix(in srgb, var(--payment-primary) 32%, transparent) !important;
}

.pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-icon,
.pos-payment-touch-modal.pos-payment-confirmation-view .pos-purpose-icon {
    background: color-mix(in srgb, var(--payment-primary) 12%, var(--payment-surface)) !important;
    color: var(--payment-primary) !important;
    border: 1px solid color-mix(in srgb, var(--payment-primary) 20%, transparent) !important;
    box-shadow: inset 0 1px 0 color-mix(in srgb, #fff 22%, transparent) !important;
}

.pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile.active .pos-payment-method-icon,
.pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile[aria-pressed="true"] .pos-payment-method-icon,
.pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile.active .pos-purpose-icon,
.pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile[aria-pressed="true"] .pos-purpose-icon {
    background: rgba(255,255,255,.18) !important;
    color: var(--payment-primary-contrast) !important;
    border-color: rgba(255,255,255,.26) !important;
}

.pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-caption,
.pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-subcaption,
.pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-amount-label,
.pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-status {
    color: inherit !important;
}

.pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-subcaption,
.pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-summary span,
.pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-empty {
    color: var(--payment-muted) !important;
}

.pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile.active .pos-payment-method-subcaption,
.pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile[aria-pressed="true"] .pos-payment-method-subcaption {
    color: color-mix(in srgb, var(--payment-primary-contrast) 86%, transparent) !important;
}

.pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-keypad button {
    min-height: 54px !important;
    border-radius: 14px !important;
    font-size: 22px !important;
    font-weight: 950 !important;
}

.pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-keypad button:hover,
.pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-keypad button:focus-visible {
    background: color-mix(in srgb, var(--payment-primary) 12%, var(--payment-surface)) !important;
    border-color: var(--payment-primary) !important;
    color: var(--payment-primary) !important;
}

.pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-actions .pos-save-btn,
.pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-actions .pos-payment-btn {
    min-height: 48px !important;
    border-radius: 14px !important;
    font-weight: 950 !important;
    letter-spacing: .01em;
}

.pos-payment-touch-modal.pos-payment-confirmation-view .pos-full-cash-btn,
.pos-payment-touch-modal.pos-payment-confirmation-view .pos-add-payment-btn,
.pos-payment-touch-modal.pos-payment-confirmation-view .pos-terminal-send-btn,
.pos-payment-touch-modal.pos-payment-confirmation-view .pos-wallet-send-btn {
    background: color-mix(in srgb, var(--payment-primary) 9%, var(--payment-surface)) !important;
    color: var(--payment-text) !important;
    border-color: color-mix(in srgb, var(--payment-primary) 38%, var(--payment-border)) !important;
}

.pos-payment-touch-modal.pos-payment-confirmation-view .pos-full-cash-btn:hover:not(:disabled),
.pos-payment-touch-modal.pos-payment-confirmation-view .pos-add-payment-btn:hover:not(:disabled),
.pos-payment-touch-modal.pos-payment-confirmation-view .pos-terminal-send-btn:hover:not(:disabled),
.pos-payment-touch-modal.pos-payment-confirmation-view .pos-wallet-send-btn:hover:not(:disabled) {
    background: color-mix(in srgb, var(--payment-primary) 15%, var(--payment-surface)) !important;
    color: var(--payment-primary) !important;
}

.pos-payment-touch-modal.pos-payment-confirmation-view #posConfirmPaymentButton {
    background: linear-gradient(135deg,
        color-mix(in srgb, var(--payment-primary) 94%, #ffffff 6%),
        color-mix(in srgb, var(--payment-primary) 78%, var(--payment-primary-dark))) !important;
    color: var(--payment-primary-contrast) !important;
    border-color: var(--payment-primary) !important;
    box-shadow: 0 10px 22px color-mix(in srgb, var(--payment-primary) 24%, transparent) !important;
}

body.theme-dark .pos-payment-touch-modal.pos-payment-confirmation-view,
body.theme-midnight .pos-payment-touch-modal.pos-payment-confirmation-view,
body.theme-carbon .pos-payment-touch-modal.pos-payment-confirmation-view {
    --erp-control-bg: color-mix(in srgb, var(--card) 88%, #ffffff 5%);
    --payment-surface: var(--card);
    --payment-soft: color-mix(in srgb, var(--soft) 74%, #ffffff 4%);
    box-shadow: 0 26px 80px rgba(0,0,0,.56) !important;
}

body.theme-dark .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-amount-display,
body.theme-midnight .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-amount-display,
body.theme-carbon .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-amount-display,
body.theme-dark .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-keypad button,
body.theme-midnight .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-keypad button,
body.theme-carbon .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-keypad button,
body.theme-dark .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile,
body.theme-midnight .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile,
body.theme-carbon .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile {
    color: var(--text) !important;
}

body.theme-dark .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile.active,
body.theme-midnight .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile.active,
body.theme-carbon .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile.active {
    color: var(--payment-primary-contrast) !important;
}

/* Touch POS 2 Receive Payment modern themed UI final override.
   Style-only patch: no payment/save JavaScript or business logic changed. */
body .pos-payment-touch-modal.pos-payment-confirmation-view,
body .sales-payment-touch-modal.pos-payment-confirmation-view {
    --payment-primary: var(--theme-primary, var(--brand, #714b67));
    --payment-primary-dark: var(--theme-secondary, var(--brand-dark, #52364b));
    --payment-primary-contrast: var(--theme-primary-text, #ffffff);
    --payment-surface: var(--card, #ffffff);
    --payment-page: var(--bg, #f4f6fb);
    --payment-soft: var(--soft, #eef2ff);
    --payment-border: color-mix(in srgb, var(--payment-primary) 20%, var(--border, #dbe3f1));
    --payment-border-strong: color-mix(in srgb, var(--payment-primary) 42%, var(--border, #dbe3f1));
    --payment-text: var(--text, #0f172a);
    --payment-muted: var(--muted, #64748b);
    width: min(1040px, 97vw) !important;
    border: 1px solid var(--payment-border) !important;
    border-radius: 22px !important;
    background:
        radial-gradient(circle at 0 0, color-mix(in srgb, var(--payment-primary) 8%, transparent), transparent 34%),
        linear-gradient(180deg, color-mix(in srgb, var(--payment-surface) 98%, var(--payment-soft)), var(--payment-surface)) !important;
    color: var(--payment-text) !important;
    box-shadow: 0 28px 78px color-mix(in srgb, var(--payment-text) 18%, transparent) !important;
    overflow: hidden !important;
}

body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-orders-head,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-orders-head,
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-confirmation-head,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-confirmation-head {
    min-height: 68px !important;
    padding: 16px 24px !important;
    border-bottom: 1px solid var(--payment-border) !important;
    background: linear-gradient(180deg, color-mix(in srgb, var(--payment-surface) 96%, #fff), color-mix(in srgb, var(--payment-surface) 86%, var(--payment-soft))) !important;
    color: var(--payment-text) !important;
}

body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-orders-head strong,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-orders-head strong {
    color: var(--payment-text) !important;
    font-size: clamp(20px, 2vw, 27px) !important;
    font-weight: 950 !important;
    letter-spacing: -.02em !important;
}

body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-orders-close,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-orders-close {
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    border: 1px solid var(--payment-border) !important;
    border-radius: 999px !important;
    background: color-mix(in srgb, var(--payment-surface) 88%, var(--payment-soft)) !important;
    color: var(--payment-primary) !important;
    box-shadow: 0 8px 18px color-mix(in srgb, var(--payment-text) 8%, transparent) !important;
    font-size: 25px !important;
    font-weight: 800 !important;
}

body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-orders-close:hover,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-orders-close:hover {
    background: color-mix(in srgb, var(--payment-primary) 12%, var(--payment-surface)) !important;
    border-color: var(--payment-primary) !important;
}

body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-summary,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-summary {
    gap: 14px !important;
    padding: 16px 24px 14px !important;
    border-bottom: 0 !important;
}

body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-summary div,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-summary div {
    min-height: 76px !important;
    display: grid !important;
    grid-template-columns: 52px minmax(0, 1fr) !important;
    grid-template-rows: auto auto !important;
    align-items: center !important;
    gap: 2px 12px !important;
    padding: 13px 16px !important;
    border: 1px solid var(--payment-border) !important;
    border-radius: 16px !important;
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--payment-surface) 98%, #fff), color-mix(in srgb, var(--payment-soft) 28%, var(--payment-surface))) !important;
    box-shadow: 0 8px 20px color-mix(in srgb, var(--payment-text) 6%, transparent) !important;
}

body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-summary div::before,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-summary div::before {
    grid-row: 1 / span 2;
    content: "▤";
    width: 48px;
    height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 15px;
    background: color-mix(in srgb, var(--payment-primary) 10%, var(--payment-surface));
    color: var(--payment-primary);
    border: 1px solid color-mix(in srgb, var(--payment-primary) 16%, transparent);
    font-size: 24px;
    font-weight: 900;
}
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-summary div:nth-child(2)::before,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-summary div:nth-child(2)::before { content: "▣"; }
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-summary div:nth-child(3)::before,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-summary div:nth-child(3)::before { content: "◔"; }
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-summary div:nth-child(4)::before,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-summary div:nth-child(4)::before { content: "↩"; }

body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-summary span,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-summary span {
    color: var(--payment-muted) !important;
    font-size: 15px !important;
    font-weight: 900 !important;
}
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-summary strong,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-summary strong {
    color: var(--payment-text) !important;
    font-size: 20px !important;
    font-weight: 950 !important;
}

body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-body,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-body {
    grid-template-columns: minmax(420px, .98fr) minmax(420px, 1fr) !important;
    gap: 16px !important;
    padding: 0 24px 24px !important;
    overflow: auto !important;
}

body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-left,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-left,
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-right,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-right {
    border: 1px solid var(--payment-border) !important;
    border-radius: 18px !important;
    background: color-mix(in srgb, var(--payment-surface) 96%, var(--payment-soft)) !important;
    box-shadow: inset 0 1px 0 color-mix(in srgb, #fff 34%, transparent), 0 10px 24px color-mix(in srgb, var(--payment-text) 5%, transparent) !important;
}

body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-left,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-left {
    padding: 14px !important;
    grid-template-rows: auto auto 1fr !important;
}
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-right,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-right {
    padding: 14px !important;
}

body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-six-grid,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-six-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 12px !important;
    margin: 0 0 14px !important;
}

body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile,
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile[data-payment-method="On Account"],
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile[data-payment-method="On Account"] {
    position: relative !important;
    min-height: 126px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    padding: 14px 10px !important;
    border: 1px solid var(--payment-border) !important;
    border-radius: 18px !important;
    background:
        radial-gradient(circle at 20% 0, color-mix(in srgb, var(--payment-primary) 8%, transparent), transparent 35%),
        linear-gradient(180deg, color-mix(in srgb, var(--payment-surface) 99%, #fff), color-mix(in srgb, var(--payment-soft) 22%, var(--payment-surface))) !important;
    color: var(--payment-text) !important;
    box-shadow: 0 10px 20px color-mix(in srgb, var(--payment-text) 6%, transparent) !important;
    cursor: pointer !important;
    transform: translateY(0) !important;
    transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease, background .16s ease, color .16s ease !important;
}

body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile:hover,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile:hover,
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile:focus-visible,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile:focus-visible {
    border-color: var(--payment-primary) !important;
    background: color-mix(in srgb, var(--payment-primary) 10%, var(--payment-surface)) !important;
    box-shadow: 0 16px 28px color-mix(in srgb, var(--payment-primary) 16%, transparent) !important;
    transform: translateY(-1px) !important;
    color: var(--payment-text) !important;
    outline: none !important;
}

body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile.active,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile.active,
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile[aria-pressed="true"],
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile[aria-pressed="true"],
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile[data-payment-method="On Account"].active,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile[data-payment-method="On Account"].active {
    background:
        linear-gradient(145deg,
            color-mix(in srgb, var(--payment-primary) 96%, #ffffff 4%),
            color-mix(in srgb, var(--payment-primary) 76%, var(--payment-primary-dark))) !important;
    border-color: var(--payment-primary) !important;
    color: var(--payment-primary-contrast) !important;
    box-shadow:
        0 0 0 3px color-mix(in srgb, var(--payment-primary) 22%, transparent),
        0 18px 34px color-mix(in srgb, var(--payment-primary) 30%, transparent) !important;
}

body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-icon,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-icon,
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-purpose-icon,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-purpose-icon {
    width: 54px !important;
    height: 48px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 16px !important;
    background: color-mix(in srgb, var(--payment-primary) 10%, var(--payment-surface)) !important;
    color: var(--payment-primary) !important;
    border: 1px solid color-mix(in srgb, var(--payment-primary) 18%, transparent) !important;
    box-shadow: inset 0 1px 0 color-mix(in srgb, #fff 28%, transparent) !important;
    overflow: hidden !important;
}

body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile.active .pos-payment-method-icon,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile.active .pos-payment-method-icon,
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile.active .pos-purpose-icon,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile.active .pos-purpose-icon,
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile[aria-pressed="true"] .pos-payment-method-icon,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile[aria-pressed="true"] .pos-payment-method-icon,
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile[aria-pressed="true"] .pos-purpose-icon,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile[aria-pressed="true"] .pos-purpose-icon {
    background: rgba(255,255,255,.18) !important;
    color: var(--payment-primary-contrast) !important;
    border-color: rgba(255,255,255,.28) !important;
}

body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-purpose-icon svg,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-purpose-icon svg {
    width: 32px !important;
    height: 32px !important;
    stroke: currentColor !important;
    fill: none !important;
    stroke-width: 3 !important;
}

body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-purpose-brand,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-purpose-brand {
    width: auto !important;
    min-width: 64px !important;
    height: 40px !important;
    padding: 0 10px !important;
    border-radius: 12px !important;
    background: var(--payment-surface) !important;
    border: 1px solid var(--payment-border) !important;
    color: var(--payment-text) !important;
    box-shadow: 0 6px 12px color-mix(in srgb, var(--payment-text) 7%, transparent) !important;
}

body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-caption,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-caption {
    color: inherit !important;
    font-size: 15px !important;
    font-weight: 950 !important;
    line-height: 1.05 !important;
    text-align: center !important;
}

body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-subcaption,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-subcaption {
    color: var(--payment-muted) !important;
    font-size: 11px !important;
    font-weight: 850 !important;
    line-height: 1.05 !important;
    text-align: center !important;
}

body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile.active .pos-payment-method-subcaption,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile.active .pos-payment-method-subcaption,
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile[aria-pressed="true"] .pos-payment-method-subcaption,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile[aria-pressed="true"] .pos-payment-method-subcaption {
    color: color-mix(in srgb, var(--payment-primary-contrast) 86%, transparent) !important;
}

body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-lines-list,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-lines-list {
    max-height: 260px !important;
    border: 0 !important;
    border-radius: 16px !important;
    background: transparent !important;
}

body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-line-row,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-line-row {
    min-height: 58px !important;
    border-radius: 14px !important;
    border: 1px solid var(--payment-border) !important;
    background: linear-gradient(180deg, var(--payment-surface), color-mix(in srgb, var(--payment-soft) 22%, var(--payment-surface))) !important;
    color: var(--payment-text) !important;
    box-shadow: 0 8px 18px color-mix(in srgb, var(--payment-text) 6%, transparent) !important;
}
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-line-row span,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-line-row span {
    color: var(--payment-primary) !important;
}
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-line-row button,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-line-row button {
    width: 36px !important;
    height: 36px !important;
    border-radius: 12px !important;
    border: 1px solid var(--payment-border) !important;
    background: color-mix(in srgb, var(--payment-soft) 55%, var(--payment-surface)) !important;
    color: var(--payment-text) !important;
}

body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-empty,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-empty {
    border: 1px dashed var(--payment-border-strong) !important;
    border-radius: 16px !important;
    background: color-mix(in srgb, var(--payment-surface) 72%, transparent) !important;
    color: var(--payment-muted) !important;
    font-weight: 900 !important;
}

body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-amount-head,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-amount-head {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    margin-bottom: 8px !important;
}
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-amount-label,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-amount-label,
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-status,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-status {
    color: var(--payment-text) !important;
    font-size: 15px !important;
    font-weight: 950 !important;
}
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-status,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-status {
    color: var(--payment-primary) !important;
    text-transform: uppercase !important;
}

body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-amount-display,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-amount-display {
    min-height: 74px !important;
    border-radius: 16px !important;
    border: 1px solid var(--payment-border) !important;
    background: linear-gradient(180deg, color-mix(in srgb, var(--payment-surface) 99%, #fff), color-mix(in srgb, var(--payment-soft) 18%, var(--payment-surface))) !important;
    color: var(--payment-primary) !important;
    box-shadow: inset 0 1px 0 color-mix(in srgb, #fff 30%, transparent) !important;
    font-size: 34px !important;
    font-weight: 950 !important;
    text-align: right !important;
}

body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-keypad,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-keypad {
    gap: 10px !important;
    margin-top: 14px !important;
}
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-keypad button,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-keypad button {
    min-height: 61px !important;
    border-radius: 16px !important;
    border: 1px solid var(--payment-border) !important;
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--payment-surface) 98%, #fff), color-mix(in srgb, var(--payment-soft) 18%, var(--payment-surface))) !important;
    color: var(--payment-primary-dark) !important;
    box-shadow: 0 8px 16px color-mix(in srgb, var(--payment-text) 4%, transparent) !important;
    font-size: 25px !important;
    font-weight: 950 !important;
    transition: transform .12s ease, background .12s ease, border-color .12s ease !important;
}
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-keypad button:hover,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-keypad button:hover,
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-keypad button:focus-visible,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-keypad button:focus-visible {
    background: color-mix(in srgb, var(--payment-primary) 12%, var(--payment-surface)) !important;
    border-color: var(--payment-primary) !important;
    color: var(--payment-primary) !important;
    transform: translateY(-1px) !important;
    outline: none !important;
}

body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-actions,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
    margin-top: 14px !important;
}
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-full-cash-btn,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-full-cash-btn { grid-column: 1 !important; grid-row: 1 !important; }
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-add-payment-btn,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-add-payment-btn { grid-column: 2 !important; grid-row: 1 !important; }
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-terminal-send-btn,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-terminal-send-btn { grid-column: 1 !important; grid-row: 2 !important; }
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-wallet-send-btn,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-wallet-send-btn { grid-column: 2 !important; grid-row: 2 !important; }
body .pos-payment-touch-modal.pos-payment-confirmation-view #posConfirmPaymentButton,
body .sales-payment-touch-modal.pos-payment-confirmation-view #posConfirmPaymentButton { grid-column: 1 / -1 !important; grid-row: 3 !important; }

body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-actions .pos-save-btn,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-actions .pos-save-btn,
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-actions .pos-payment-btn,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-actions .pos-payment-btn {
    min-height: 54px !important;
    border-radius: 16px !important;
    border: 1px solid var(--payment-border-strong) !important;
    background: linear-gradient(180deg, color-mix(in srgb, var(--payment-primary) 8%, var(--payment-surface)), color-mix(in srgb, var(--payment-soft) 42%, var(--payment-surface))) !important;
    color: var(--payment-primary-dark) !important;
    font-size: 15px !important;
    font-weight: 950 !important;
    letter-spacing: .01em !important;
    box-shadow: 0 9px 18px color-mix(in srgb, var(--payment-text) 6%, transparent) !important;
    transform: translateY(0) !important;
    transition: transform .14s ease, box-shadow .14s ease, background .14s ease, color .14s ease !important;
}

body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-actions .pos-save-btn:hover:not(:disabled),
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-actions .pos-save-btn:hover:not(:disabled),
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-actions .pos-payment-btn:hover:not(:disabled),
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-actions .pos-payment-btn:hover:not(:disabled) {
    background: color-mix(in srgb, var(--payment-primary) 14%, var(--payment-surface)) !important;
    color: var(--payment-primary) !important;
    box-shadow: 0 14px 26px color-mix(in srgb, var(--payment-primary) 14%, transparent) !important;
    transform: translateY(-1px) !important;
}

body .pos-payment-touch-modal.pos-payment-confirmation-view #posConfirmPaymentButton,
body .sales-payment-touch-modal.pos-payment-confirmation-view #posConfirmPaymentButton {
    min-height: 64px !important;
    border-radius: 16px !important;
    background: linear-gradient(135deg,
        color-mix(in srgb, var(--payment-primary) 96%, #ffffff 4%),
        color-mix(in srgb, var(--payment-primary) 78%, var(--payment-primary-dark))) !important;
    color: var(--payment-primary-contrast) !important;
    border-color: var(--payment-primary) !important;
    box-shadow: 0 18px 34px color-mix(in srgb, var(--payment-primary) 28%, transparent) !important;
    font-size: 16px !important;
}

body .pos-payment-touch-modal.pos-payment-confirmation-view button:disabled,
body .sales-payment-touch-modal.pos-payment-confirmation-view button:disabled,
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-terminal-send-btn[disabled],
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-terminal-send-btn[disabled],
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-wallet-send-btn[disabled],
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-wallet-send-btn[disabled] {
    display: inline-flex !important;
    opacity: 1 !important;
    cursor: not-allowed !important;
    background: linear-gradient(180deg, color-mix(in srgb, var(--payment-surface) 75%, var(--payment-border)), color-mix(in srgb, var(--payment-soft) 56%, var(--payment-surface))) !important;
    color: color-mix(in srgb, var(--payment-muted) 88%, var(--payment-text)) !important;
    border-color: color-mix(in srgb, var(--payment-border) 88%, var(--payment-muted)) !important;
    box-shadow: none !important;
    filter: none !important;
}

body.theme-dark .pos-payment-touch-modal.pos-payment-confirmation-view,
body.theme-midnight .pos-payment-touch-modal.pos-payment-confirmation-view,
body.theme-carbon .pos-payment-touch-modal.pos-payment-confirmation-view,
body.theme-dark .sales-payment-touch-modal.pos-payment-confirmation-view,
body.theme-midnight .sales-payment-touch-modal.pos-payment-confirmation-view,
body.theme-carbon .sales-payment-touch-modal.pos-payment-confirmation-view {
    --payment-surface: var(--card, #0f172a);
    --payment-page: var(--bg, #020617);
    --payment-soft: color-mix(in srgb, var(--soft, #1e293b) 78%, #ffffff 4%);
    --payment-border: color-mix(in srgb, var(--payment-primary) 24%, var(--border, #334155));
    --payment-text: var(--text, #f8fafc);
    --payment-muted: color-mix(in srgb, var(--muted, #94a3b8) 78%, #ffffff);
    box-shadow: 0 30px 82px rgba(0,0,0,.62) !important;
}

body.theme-dark .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile,
body.theme-midnight .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile,
body.theme-carbon .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile,
body.theme-dark .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-keypad button,
body.theme-midnight .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-keypad button,
body.theme-carbon .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-keypad button,
body.theme-dark .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-amount-display,
body.theme-midnight .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-amount-display,
body.theme-carbon .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-amount-display {
    color: var(--payment-text) !important;
}

body.theme-dark .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-amount-display,
body.theme-midnight .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-amount-display,
body.theme-carbon .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-amount-display,
body.theme-dark .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-keypad button,
body.theme-midnight .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-keypad button,
body.theme-carbon .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-keypad button {
    color: var(--payment-primary) !important;
}

@media (max-width: 940px) {
    body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-summary,
    body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-summary { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
    body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-body,
    body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-body { grid-template-columns: 1fr !important; }
}
@media (max-width: 620px) {
    body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-six-grid,
    body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-six-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
    body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-summary,
    body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-summary { grid-template-columns: 1fr !important; }
}

/* Final project-theme control hardening. Keeps all pages/forms/lookups readable and theme-driven. */
body input:not([type="checkbox"]):not([type="radio"]),
body select,
body textarea,
body .form-control,
body .erp-input,
body .lookup-input,
body .search-input,
body .filter-input,
body .grid-input,
body .pos-search-wrap input,
body .pos-line-input,
body .sales-line-input,
body .touchpos-input {
    background: var(--card) !important;
    color: var(--text) !important;
    border-color: color-mix(in srgb, var(--brand) 20%, var(--border)) !important;
}
body input::placeholder,
body textarea::placeholder {
    color: color-mix(in srgb, var(--muted) 82%, transparent) !important;
}
body input:not([type="checkbox"]):not([type="radio"]):focus,
body select:focus,
body textarea:focus,
body .form-control:focus,
body .erp-input:focus,
body .lookup-input:focus,
body .search-input:focus {
    border-color: var(--brand) !important;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand) 18%, transparent) !important;
    outline: none !important;
}
body .erp-modal,
body .erp-dialog,
body .lookup-panel,
body .lookup-modal,
body .modal-content,
body .pos-orders-modal,
body .customer-requests-page,
body .cr-card,
body .list-card,
body .grid-card,
body .settings-card,
body .form-card {
    background: var(--card) !important;
    color: var(--text) !important;
    border-color: color-mix(in srgb, var(--brand) 20%, var(--border)) !important;
}
body table,
body .erp-grid,
body .list-grid,
body .data-grid,
body .lookup-table,
body .cr-table,
body .sales-items-table {
    color: var(--text) !important;
    border-color: var(--border) !important;
}
body table th,
body .erp-grid th,
body .list-grid th,
body .data-grid th,
body .lookup-table th,
body .cr-table th,
body .sales-items-table th {
    background: color-mix(in srgb, var(--brand) 9%, var(--card)) !important;
    color: color-mix(in srgb, var(--brand) 78%, var(--text)) !important;
    border-color: var(--border) !important;
}
body table td,
body .erp-grid td,
body .list-grid td,
body .data-grid td,
body .lookup-table td,
body .cr-table td,
body .sales-items-table td {
    color: var(--text) !important;
    border-color: var(--border) !important;
}
body.theme-dark table th,
body.theme-midnight table th,
body.theme-carbon table th,
body.theme-dark .erp-grid th,
body.theme-midnight .erp-grid th,
body.theme-carbon .erp-grid th,
body.theme-dark .lookup-table th,
body.theme-midnight .lookup-table th,
body.theme-carbon .lookup-table th,
body.theme-dark .cr-table th,
body.theme-midnight .cr-table th,
body.theme-carbon .cr-table th {
    color: var(--text) !important;
    background: color-mix(in srgb, var(--brand) 17%, var(--card)) !important;
}

/* Touch POS 2 Receive Payment layout-safe modern UI correction.
   Keeps the approved visual direction but prevents modal growth/scroll at 1024x768.
   Style-only: no payment/save/ledger/session JavaScript or business logic changed. */
body .pos-payment-touch-modal.pos-payment-confirmation-view,
body .sales-payment-touch-modal.pos-payment-confirmation-view {
    --payment-primary: var(--brand, #5b4ce2);
    --payment-primary-dark: var(--brand-dark, #2f257f);
    --payment-primary-contrast: #ffffff;
    --payment-surface: var(--card, #ffffff);
    --payment-page: var(--bg, #f6f8ff);
    --payment-soft: var(--soft, #eef2ff);
    --payment-border: color-mix(in srgb, var(--payment-primary) 22%, var(--border, #d7def5));
    --payment-border-strong: color-mix(in srgb, var(--payment-primary) 48%, var(--border, #d7def5));
    --payment-text: var(--text, #0b113d);
    --payment-muted: var(--muted, #66728e);
    width: min(1010px, calc(100vw - 18px)) !important;
    max-width: calc(100vw - 18px) !important;
    max-height: calc(100vh - 18px) !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
    border-radius: 22px !important;
    background:
        radial-gradient(circle at 0 0, color-mix(in srgb, var(--payment-primary) 7%, transparent), transparent 34%),
        linear-gradient(180deg, color-mix(in srgb, var(--payment-surface) 98%, var(--payment-soft)), var(--payment-surface)) !important;
    color: var(--payment-text) !important;
    border: 1px solid var(--payment-border) !important;
    box-shadow: 0 24px 62px color-mix(in srgb, var(--payment-text) 16%, transparent) !important;
}

body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-confirmation-head,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-confirmation-head {
    flex: 0 0 auto !important;
    min-height: 58px !important;
    padding: 12px 22px !important;
    background: linear-gradient(180deg, color-mix(in srgb, var(--payment-surface) 98%, #fff), color-mix(in srgb, var(--payment-soft) 26%, var(--payment-surface))) !important;
    border-bottom: 1px solid var(--payment-border) !important;
}
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-confirmation-head strong,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-confirmation-head strong {
    color: var(--payment-text) !important;
    font-size: clamp(20px, 2vw, 25px) !important;
    font-weight: 950 !important;
    letter-spacing: -.02em !important;
}
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-orders-close,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-orders-close {
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    border-radius: 999px !important;
    border: 1px solid var(--payment-border) !important;
    background: color-mix(in srgb, var(--payment-surface) 88%, var(--payment-soft)) !important;
    color: var(--payment-primary) !important;
    box-shadow: 0 7px 16px color-mix(in srgb, var(--payment-text) 8%, transparent) !important;
}

body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-summary,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-summary {
    flex: 0 0 auto !important;
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 12px !important;
    padding: 14px 22px 12px !important;
    border-bottom: 0 !important;
}
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-summary div,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-summary div {
    min-height: 68px !important;
    padding: 10px 14px !important;
    grid-template-columns: 44px minmax(0,1fr) !important;
    border-radius: 16px !important;
    background: linear-gradient(180deg, color-mix(in srgb, var(--payment-surface) 98%, #fff), color-mix(in srgb, var(--payment-soft) 24%, var(--payment-surface))) !important;
    border: 1px solid var(--payment-border) !important;
    box-shadow: 0 7px 18px color-mix(in srgb, var(--payment-text) 5%, transparent) !important;
}
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-summary div::before,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-summary div::before {
    width: 40px !important;
    height: 40px !important;
    border-radius: 13px !important;
    background: color-mix(in srgb, var(--payment-primary) 9%, var(--payment-surface)) !important;
    color: var(--payment-primary) !important;
    border: 1px solid color-mix(in srgb, var(--payment-primary) 16%, transparent) !important;
    font-size: 21px !important;
}
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-summary span,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-summary span {
    color: var(--payment-muted) !important;
    font-size: 14px !important;
    font-weight: 900 !important;
}
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-summary strong,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-summary strong {
    color: var(--payment-text) !important;
    font-size: 19px !important;
    font-weight: 950 !important;
}

body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-body,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-body {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    display: grid !important;
    grid-template-columns: minmax(0, .98fr) minmax(0, 1.04fr) !important;
    gap: 14px !important;
    padding: 0 22px 18px !important;
    overflow: hidden !important;
}
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-left,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-left,
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-right,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-right {
    min-width: 0 !important;
    min-height: 0 !important;
    overflow: hidden !important;
    border-radius: 18px !important;
    border: 1px solid var(--payment-border) !important;
    background: color-mix(in srgb, var(--payment-surface) 96%, var(--payment-soft)) !important;
    box-shadow: 0 8px 20px color-mix(in srgb, var(--payment-text) 5%, transparent) !important;
}
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-left,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-left,
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-right,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-right {
    padding: 14px !important;
}

body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-six-grid,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-six-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 11px !important;
    margin: 0 0 14px !important;
}
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile,
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile[data-payment-method="On Account"],
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile[data-payment-method="On Account"] {
    min-height: 112px !important;
    padding: 12px 8px !important;
    gap: 7px !important;
    border-radius: 17px !important;
    border: 1px solid var(--payment-border) !important;
    background:
        radial-gradient(circle at 20% 0, color-mix(in srgb, var(--payment-primary) 7%, transparent), transparent 35%),
        linear-gradient(180deg, color-mix(in srgb, var(--payment-surface) 99%, #fff), color-mix(in srgb, var(--payment-soft) 20%, var(--payment-surface))) !important;
    color: var(--payment-text) !important;
    box-shadow: 0 8px 18px color-mix(in srgb, var(--payment-text) 5%, transparent) !important;
    overflow: hidden !important;
}
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile:hover,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile:hover,
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile:focus-visible,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile:focus-visible {
    border-color: var(--payment-primary) !important;
    background: color-mix(in srgb, var(--payment-primary) 8%, var(--payment-surface)) !important;
    box-shadow: 0 12px 24px color-mix(in srgb, var(--payment-primary) 13%, transparent) !important;
    color: var(--payment-text) !important;
    transform: translateY(-1px) !important;
}
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile.active,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile.active,
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile[aria-pressed="true"],
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile[aria-pressed="true"] {
    background:
        radial-gradient(circle at 20% 0, color-mix(in srgb, var(--payment-primary) 13%, transparent), transparent 36%),
        linear-gradient(180deg, color-mix(in srgb, var(--payment-primary) 9%, var(--payment-surface)), color-mix(in srgb, var(--payment-soft) 32%, var(--payment-surface))) !important;
    color: var(--payment-text) !important;
    border-color: var(--payment-primary) !important;
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--payment-primary) 20%, transparent), 0 14px 26px color-mix(in srgb, var(--payment-primary) 14%, transparent) !important;
}
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-icon,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-icon,
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-purpose-icon,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-purpose-icon {
    width: 52px !important;
    height: 44px !important;
    border-radius: 15px !important;
    background: color-mix(in srgb, var(--payment-primary) 9%, var(--payment-surface)) !important;
    color: var(--payment-primary) !important;
    border: 1px solid color-mix(in srgb, var(--payment-primary) 17%, transparent) !important;
    box-shadow: inset 0 1px 0 color-mix(in srgb, #fff 24%, transparent) !important;
}
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile.active .pos-payment-method-icon,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile.active .pos-payment-method-icon,
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile[aria-pressed="true"] .pos-payment-method-icon,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile[aria-pressed="true"] .pos-payment-method-icon,
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile.active .pos-purpose-icon,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile.active .pos-purpose-icon,
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile[aria-pressed="true"] .pos-purpose-icon,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile[aria-pressed="true"] .pos-purpose-icon {
    background: color-mix(in srgb, var(--payment-primary) 13%, var(--payment-surface)) !important;
    color: var(--payment-primary) !important;
    border-color: color-mix(in srgb, var(--payment-primary) 28%, transparent) !important;
}
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-purpose-icon svg,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-purpose-icon svg {
    width: 31px !important;
    height: 31px !important;
    stroke: currentColor !important;
    fill: none !important;
    stroke-width: 3 !important;
}
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-purpose-brand,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-purpose-brand {
    background: var(--payment-surface) !important;
    color: var(--payment-text) !important;
    border: 1px solid var(--payment-border) !important;
    box-shadow: 0 5px 12px color-mix(in srgb, var(--payment-text) 7%, transparent) !important;
}
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-caption,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-caption {
    font-size: 15px !important;
    font-weight: 950 !important;
    color: var(--payment-text) !important;
}
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-subcaption,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-subcaption,
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile.active .pos-payment-method-subcaption,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile.active .pos-payment-method-subcaption,
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile[aria-pressed="true"] .pos-payment-method-subcaption,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile[aria-pressed="true"] .pos-payment-method-subcaption {
    color: var(--payment-muted) !important;
    font-size: 11px !important;
    font-weight: 850 !important;
}
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-selected-mark,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-selected-mark {
    display: none !important;
}

body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-lines-list,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-lines-list {
    min-height: 0 !important;
    max-height: none !important;
    overflow: auto !important;
    border: 0 !important;
    background: transparent !important;
}
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-line-row,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-line-row {
    min-height: 50px !important;
    border-radius: 15px !important;
    border: 1px solid var(--payment-border) !important;
    background: linear-gradient(180deg, var(--payment-surface), color-mix(in srgb, var(--payment-soft) 20%, var(--payment-surface))) !important;
    color: var(--payment-text) !important;
    box-shadow: 0 7px 16px color-mix(in srgb, var(--payment-text) 5%, transparent) !important;
}
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-line-row span,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-line-row span {
    color: var(--payment-primary) !important;
}
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-line-row button,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-line-row button {
    width: 34px !important;
    height: 34px !important;
    border-radius: 12px !important;
    background: color-mix(in srgb, var(--payment-soft) 55%, var(--payment-surface)) !important;
    color: var(--payment-text) !important;
    border: 1px solid var(--payment-border) !important;
}

body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-amount-display,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-amount-display {
    min-height: 62px !important;
    height: 62px !important;
    border-radius: 16px !important;
    background: linear-gradient(180deg, color-mix(in srgb, var(--payment-surface) 99%, #fff), color-mix(in srgb, var(--payment-soft) 18%, var(--payment-surface))) !important;
    color: var(--payment-primary) !important;
    border: 1px solid var(--payment-border) !important;
    font-size: 32px !important;
    font-weight: 950 !important;
    text-align: right !important;
}
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-keypad,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-keypad {
    gap: 9px !important;
    margin-top: 12px !important;
}
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-keypad button,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-keypad button {
    min-height: 52px !important;
    height: 52px !important;
    border-radius: 16px !important;
    background: linear-gradient(180deg, color-mix(in srgb, var(--payment-surface) 98%, #fff), color-mix(in srgb, var(--payment-soft) 18%, var(--payment-surface))) !important;
    color: var(--payment-primary-dark) !important;
    border: 1px solid var(--payment-border) !important;
    box-shadow: 0 7px 15px color-mix(in srgb, var(--payment-text) 4%, transparent) !important;
    font-size: 24px !important;
    font-weight: 950 !important;
}
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-keypad button:hover,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-keypad button:hover,
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-keypad button:focus-visible,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-keypad button:focus-visible {
    background: color-mix(in srgb, var(--payment-primary) 10%, var(--payment-surface)) !important;
    color: var(--payment-primary) !important;
    border-color: var(--payment-primary) !important;
}
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-actions,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-actions {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
    gap: 9px !important;
    margin-top: 12px !important;
}
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-full-cash-btn,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-full-cash-btn { grid-column: 1 !important; grid-row: 1 !important; }
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-add-payment-btn,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-add-payment-btn { grid-column: 2 !important; grid-row: 1 !important; }
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-terminal-send-btn,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-terminal-send-btn { grid-column: 1 !important; grid-row: 2 !important; }
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-wallet-send-btn,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-wallet-send-btn { grid-column: 2 !important; grid-row: 2 !important; }
body .pos-payment-touch-modal.pos-payment-confirmation-view #posConfirmPaymentButton,
body .sales-payment-touch-modal.pos-payment-confirmation-view #posConfirmPaymentButton { grid-column: 1 / -1 !important; grid-row: 3 !important; }
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-actions .pos-save-btn,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-actions .pos-save-btn,
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-actions .pos-payment-btn,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-actions .pos-payment-btn {
    min-height: 48px !important;
    height: 48px !important;
    border-radius: 16px !important;
    border: 1px solid var(--payment-border-strong) !important;
    background: linear-gradient(180deg, color-mix(in srgb, var(--payment-primary) 7%, var(--payment-surface)), color-mix(in srgb, var(--payment-soft) 38%, var(--payment-surface))) !important;
    color: var(--payment-primary-dark) !important;
    font-size: 15px !important;
    font-weight: 950 !important;
    box-shadow: 0 7px 16px color-mix(in srgb, var(--payment-text) 5%, transparent) !important;
}
body .pos-payment-touch-modal.pos-payment-confirmation-view #posConfirmPaymentButton,
body .sales-payment-touch-modal.pos-payment-confirmation-view #posConfirmPaymentButton {
    min-height: 58px !important;
    height: 58px !important;
    background: linear-gradient(135deg, color-mix(in srgb, var(--payment-primary) 96%, #ffffff 4%), color-mix(in srgb, var(--payment-primary) 76%, var(--payment-primary-dark))) !important;
    color: var(--payment-primary-contrast) !important;
    border-color: var(--payment-primary) !important;
    box-shadow: 0 16px 30px color-mix(in srgb, var(--payment-primary) 25%, transparent) !important;
}
body .pos-payment-touch-modal.pos-payment-confirmation-view button:disabled,
body .sales-payment-touch-modal.pos-payment-confirmation-view button:disabled,
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-terminal-send-btn[disabled],
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-terminal-send-btn[disabled],
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-wallet-send-btn[disabled],
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-wallet-send-btn[disabled] {
    opacity: 1 !important;
    background: linear-gradient(180deg, color-mix(in srgb, var(--payment-surface) 78%, var(--payment-border)), color-mix(in srgb, var(--payment-soft) 52%, var(--payment-surface))) !important;
    color: color-mix(in srgb, var(--payment-muted) 88%, var(--payment-text)) !important;
    border-color: color-mix(in srgb, var(--payment-border) 88%, var(--payment-muted)) !important;
    box-shadow: none !important;
    cursor: not-allowed !important;
}

@media (max-height: 820px), (max-width: 1120px) {
    body .pos-payment-touch-modal.pos-payment-confirmation-view,
    body .sales-payment-touch-modal.pos-payment-confirmation-view {
        width: min(1000px, calc(100vw - 12px)) !important;
        max-height: calc(100vh - 12px) !important;
        border-radius: 18px !important;
    }
    body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-confirmation-head,
    body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-confirmation-head {
        min-height: 52px !important;
        padding: 9px 18px !important;
    }
    body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-orders-head strong,
    body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-orders-head strong { font-size: 23px !important; }
    body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-orders-close,
    body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-orders-close { width: 38px !important; height: 38px !important; min-width: 38px !important; }
    body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-summary,
    body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-summary {
        gap: 10px !important;
        padding: 10px 18px 9px !important;
    }
    body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-summary div,
    body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-summary div {
        min-height: 59px !important;
        padding: 8px 12px !important;
        grid-template-columns: 38px minmax(0,1fr) !important;
    }
    body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-summary div::before,
    body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-summary div::before {
        width: 34px !important;
        height: 34px !important;
        border-radius: 11px !important;
        font-size: 18px !important;
    }
    body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-summary span,
    body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-summary span { font-size: 13px !important; }
    body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-summary strong,
    body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-summary strong { font-size: 18px !important; }
    body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-body,
    body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-body {
        gap: 12px !important;
        padding: 0 18px 12px !important;
    }
    body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-left,
    body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-left,
    body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-right,
    body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-right { padding: 12px !important; }
    body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-six-grid,
    body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-six-grid {
        gap: 10px !important;
        margin-bottom: 12px !important;
    }
    body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile,
    body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile,
    body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile[data-payment-method="On Account"],
    body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile[data-payment-method="On Account"] {
        min-height: 88px !important;
        padding: 8px 6px !important;
        gap: 3px !important;
        border-radius: 14px !important;
    }
    body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-icon,
    body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-icon,
    body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-purpose-icon,
    body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-purpose-icon {
        width: 44px !important;
        height: 38px !important;
        border-radius: 13px !important;
    }
    body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-purpose-icon svg,
    body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-purpose-icon svg { width: 27px !important; height: 27px !important; }
    body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-caption,
    body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-caption { font-size: 13px !important; }
    body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-subcaption,
    body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-subcaption { font-size: 9px !important; }
    body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-line-row,
    body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-line-row { min-height: 44px !important; }
    body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-amount-display,
    body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-amount-display {
        min-height: 54px !important;
        height: 54px !important;
        font-size: 30px !important;
    }
    body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-keypad,
    body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-keypad { gap: 8px !important; margin-top: 10px !important; }
    body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-keypad button,
    body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-keypad button {
        min-height: 46px !important;
        height: 46px !important;
        font-size: 22px !important;
        border-radius: 14px !important;
    }
    body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-actions,
    body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-actions { gap: 8px !important; margin-top: 10px !important; }
    body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-actions .pos-save-btn,
    body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-actions .pos-save-btn,
    body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-actions .pos-payment-btn,
    body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-actions .pos-payment-btn {
        min-height: 43px !important;
        height: 43px !important;
        font-size: 14px !important;
        border-radius: 14px !important;
    }
    body .pos-payment-touch-modal.pos-payment-confirmation-view #posConfirmPaymentButton,
    body .sales-payment-touch-modal.pos-payment-confirmation-view #posConfirmPaymentButton {
        min-height: 52px !important;
        height: 52px !important;
    }
}

@media (max-width: 720px) {
    body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-summary,
    body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-summary { grid-template-columns: repeat(2, minmax(0,1fr)) !important; }
    body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-body,
    body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-touch-body { grid-template-columns: 1fr !important; overflow: auto !important; }
}

body.theme-dark .pos-payment-touch-modal.pos-payment-confirmation-view,
body.theme-midnight .pos-payment-touch-modal.pos-payment-confirmation-view,
body.theme-carbon .pos-payment-touch-modal.pos-payment-confirmation-view,
body.theme-dark .sales-payment-touch-modal.pos-payment-confirmation-view,
body.theme-midnight .sales-payment-touch-modal.pos-payment-confirmation-view,
body.theme-carbon .sales-payment-touch-modal.pos-payment-confirmation-view {
    --payment-surface: var(--card, #0f172a);
    --payment-page: var(--bg, #020617);
    --payment-soft: color-mix(in srgb, var(--soft, #1e293b) 78%, #ffffff 4%);
    --payment-border: color-mix(in srgb, var(--payment-primary) 24%, var(--border, #334155));
    --payment-border-strong: color-mix(in srgb, var(--payment-primary) 45%, var(--border, #334155));
    --payment-text: var(--text, #f8fafc);
    --payment-muted: color-mix(in srgb, var(--muted, #94a3b8) 80%, #ffffff);
}
body.theme-dark .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile,
body.theme-midnight .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile,
body.theme-carbon .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile,
body.theme-dark .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile,
body.theme-midnight .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile,
body.theme-carbon .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-method-tile,
body.theme-dark .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-keypad button,
body.theme-midnight .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-keypad button,
body.theme-carbon .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-keypad button,
body.theme-dark .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-keypad button,
body.theme-midnight .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-keypad button,
body.theme-carbon .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-keypad button {
    color: var(--payment-text) !important;
}
body.theme-dark .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-amount-display,
body.theme-midnight .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-amount-display,
body.theme-carbon .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-amount-display,
body.theme-dark .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-amount-display,
body.theme-midnight .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-amount-display,
body.theme-carbon .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-amount-display,
body.theme-dark .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-keypad button,
body.theme-midnight .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-keypad button,
body.theme-carbon .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-keypad button,
body.theme-dark .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-keypad button,
body.theme-midnight .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-keypad button,
body.theme-carbon .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-keypad button {
    color: color-mix(in srgb, var(--payment-primary) 88%, #ffffff) !important;
}

/* E-Invoice / Peppol developer setup fields */
.e-invoice-settings-card {
    display: grid;
    gap: .7rem;
    margin: .75rem 0;
    padding: 1rem;
    border: 1px solid var(--border, #d9dce8);
    border-radius: 18px;
    background: linear-gradient(180deg, color-mix(in srgb, var(--card, #fff) 96%, var(--brand, var(--brand-dark)) 4%), var(--card, #fff));
    box-shadow: 0 12px 28px rgba(15, 23, 42, .08);
    color: var(--text, #111827);
}
.e-invoice-settings-card > strong {
    font-size: 1rem;
    color: var(--text, #111827);
}
.e-invoice-settings-card .muted {
    margin: 0;
    color: var(--muted, #6b7280);
}
.e-invoice-settings-card .e-invoice-verify-btn {
    justify-self: flex-start;
}

.sales-einvoice-backdrop {
    position: fixed;
    inset: 0;
    z-index: 3000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    background: rgba(15, 23, 42, .28);
}
.sales-einvoice-backdrop[hidden] { display: none !important; }
.sales-einvoice-modal {
    width: min(980px, calc(100vw - 2rem));
    max-height: min(92vh, 760px);
    display: flex;
    flex-direction: column;
    border: 1px solid var(--border, #d9dce8);
    border-radius: 18px;
    background: var(--card, #fff);
    color: var(--text, #111827);
    box-shadow: 0 24px 80px rgba(15, 23, 42, .22);
    overflow: hidden;
}
.sales-einvoice-head,
.sales-einvoice-foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    padding: 1rem 1.2rem;
    border-bottom: 1px solid var(--border, #d9dce8);
    background: color-mix(in srgb, var(--card, #fff) 96%, var(--brand, var(--brand-dark)) 4%);
}
.sales-einvoice-foot {
    border-bottom: 0;
    border-top: 1px solid var(--border, #d9dce8);
    justify-content: flex-start;
}
.sales-einvoice-head h2 { margin: 0; font-size: 1.25rem; color: var(--text, #111827); }
.sales-einvoice-close {
    width: 36px;
    height: 36px;
    border-radius: 999px;
    border: 1px solid var(--border, #d9dce8);
    background: var(--card, #fff);
    color: var(--text, #111827);
    font-size: 1.5rem;
    line-height: 1;
    cursor: pointer;
}
.sales-einvoice-body {
    display: grid;
    gap: 1rem;
    padding: 1rem 1.2rem;
    overflow: auto;
}
.sales-einvoice-options {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}
.sales-einvoice-options label {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    color: var(--text, #111827);
    font-weight: 700;
}
.sales-einvoice-options input[type="checkbox"] { accent-color: var(--brand, var(--brand-dark)); }
.sales-einvoice-field {
    display: grid;
    grid-template-columns: 90px minmax(0, 1fr);
    align-items: center;
    gap: .8rem;
}
.sales-einvoice-field > span {
    font-weight: 700;
    color: var(--text, #111827);
}
.sales-einvoice-message { align-items: flex-start; }
.sales-einvoice-message textarea { min-height: 130px; resize: vertical; }
.sales-einvoice-recipient-editor {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .45rem;
    min-height: 42px;
    padding: .35rem .45rem;
    border: 1px solid var(--border, #d9dce8);
    border-radius: 10px;
    background: var(--card, #fff);
}
.sales-einvoice-recipient-editor:focus-within {
    border-color: var(--brand, #714b67);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand, #714b67) 14%, transparent);
}
.sales-einvoice-recipient-editor > .sales-input {
    flex: 1 1 210px;
    min-width: 160px;
    border: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
}
.sales-einvoice-recipient-chips { display: contents; }
.sales-einvoice-recipient-chip {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    max-width: 100%;
    padding: .3rem .45rem .3rem .6rem;
    border: 1px solid color-mix(in srgb, var(--brand, #714b67) 30%, var(--border, #d9dce8));
    border-radius: 999px;
    background: color-mix(in srgb, var(--brand, #714b67) 9%, var(--card, #fff));
    color: var(--text, #111827);
    font-weight: 700;
    overflow-wrap: anywhere;
}
.sales-einvoice-recipient-chip button {
    width: 22px;
    height: 22px;
    border: 0;
    border-radius: 999px;
    background: transparent;
    color: var(--muted, #64748b);
    cursor: pointer;
    font-size: 1rem;
    line-height: 1;
}
.sales-einvoice-options input:disabled + span { opacity: .62; }
.sales-einvoice-attachments {
    display: grid;
    grid-template-columns: repeat(2, minmax(220px, 1fr));
    gap: .75rem;
}
.sales-einvoice-attachment[hidden] { display: none !important; }
.sales-einvoice-attachment {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: .7rem;
    min-height: 44px;
    padding: .65rem .8rem;
    border: 1px solid var(--border, #d9dce8);
    border-radius: 12px;
    background: color-mix(in srgb, var(--card, #fff) 92%, var(--soft, #f4f4f8) 8%);
    color: var(--text, #111827);
}
.sales-einvoice-file-icon {
    display: inline-grid;
    place-items: center;
    width: 34px;
    height: 34px;
    border-radius: 10px;
    font-size: .7rem;
    font-weight: 900;
    background: color-mix(in srgb, var(--brand, var(--brand-dark)) 12%, var(--card, #fff));
    color: var(--brand, var(--brand-dark));
    border: 1px solid color-mix(in srgb, var(--brand, var(--brand-dark)) 35%, var(--border, #d9dce8));
}
.sales-einvoice-file-icon.xml { color: var(--brand-dark, #4e2e47); }
.sales-einvoice-attachment button {
    width: 28px;
    height: 28px;
    border-radius: 999px;
    border: 1px solid var(--border, #d9dce8);
    background: var(--card, #fff);
    color: var(--text, #111827);
}
.sales-einvoice-status {
    padding: .75rem .9rem;
    border-radius: 12px;
    border: 1px solid var(--border, #d9dce8);
    background: color-mix(in srgb, var(--soft, #f4f4f8) 80%, var(--card, #fff));
    color: var(--text, #111827);
    font-size: 13px;
    font-weight: 500;
    line-height: 1.35;
}
.sales-einvoice-status.success {
    border-color: #84cc16;
    background: #d9ff57;
    color: #14532d;
    font-size: 13px;
    font-weight: 500;
}
.sales-einvoice-status.error {
    border-color: #ef4444;
    color: #991b1b;
    background: #fef2f2;
    font-size: 13px;
    font-weight: 500;
}

@media (max-width: 720px) {
    .sales-einvoice-field { grid-template-columns: 1fr; gap: .35rem; }
    .sales-einvoice-attachments { grid-template-columns: 1fr; }
}

/* E-Invoice create/test result rows */
.sales-chatter-actions [hidden] { display: none !important; }
.sales-einvoice-test-list {
    display: grid;
    gap: .45rem;
    margin-top: .65rem;
}
.sales-einvoice-test-row {
    display: grid;
    grid-template-columns: 80px minmax(120px, .8fr) minmax(0, 1.4fr);
    align-items: center;
    gap: .55rem;
    padding: .45rem .55rem;
    border: 1px solid var(--border, #d9dce8);
    border-radius: 10px;
    background: color-mix(in srgb, var(--card, #fff) 90%, var(--soft, #f4f4f8) 10%);
    color: var(--text, #111827);
}
.sales-einvoice-test-row strong {
    font-size: .75rem;
    letter-spacing: .03em;
}
.sales-einvoice-test-row span { font-weight: 800; }
.sales-einvoice-test-row em {
    color: var(--muted, #64748b);
    font-style: normal;
    font-weight: 600;
}
.sales-einvoice-test-row.pass strong { color: #047857; }
.sales-einvoice-test-row.warning strong { color: #b45309; }
.sales-einvoice-test-row.fail strong { color: #b91c1c; }
@media (max-width: 720px) {
    .sales-einvoice-test-row { grid-template-columns: 1fr; }
}

/* Create Invoice action: keep it in the main toolbar before Save and theme it without touching logic. */
.sales-entry-page .sales-odoo-actionbar .sales-action.e-invoice-create-action {
    background: color-mix(in srgb, var(--brand, #714b67) 12%, var(--card, #fff)) !important;
    border-color: color-mix(in srgb, var(--brand, #714b67) 38%, var(--border, #e5e7eb)) !important;
    color: var(--brand-dark, #52364b) !important;
    box-shadow: 0 8px 18px color-mix(in srgb, var(--brand, #714b67) 13%, transparent) !important;
}

.sales-entry-page .sales-odoo-actionbar .sales-action.e-invoice-create-action:not(:disabled):hover,
.sales-entry-page .sales-odoo-actionbar .sales-action.e-invoice-create-action:not(:disabled):focus-visible {
    background: color-mix(in srgb, var(--brand, #714b67) 20%, var(--card, #fff)) !important;
    border-color: var(--brand, #714b67) !important;
    transform: translateY(-1px);
}

.sales-entry-page .sales-odoo-actionbar .sales-action.e-invoice-create-action:disabled {
    opacity: .64 !important;
    box-shadow: none !important;
}

/* Daily Sales Report date picker visibility + active theme button fix.
   Uses an ERP-owned calendar instead of the browser native date popup so day numbers
   stay visible on every Windows/Chrome theme and zoom setting. */
.daily-sales-report-page {
    --daily-sales-accent: var(--theme-primary, var(--brand, #714b67));
    --daily-sales-accent-dark: var(--theme-secondary, var(--brand-dark, #52364b));
    --daily-sales-card: var(--theme-card, var(--card, #fff));
    --daily-sales-bg: var(--theme-bg, var(--bg, #f8fafc));
    --daily-sales-text: var(--theme-text, var(--text, #0f172a));
    --daily-sales-muted: var(--theme-muted, var(--muted, #64748b));
    --daily-sales-border: var(--theme-border, var(--border, #dbeafe));
}

.daily-sales-report-page .daily-sales-toolbar-left .odoo-save,
.daily-sales-report-page .daily-sales-toolbar-left button.odoo-save,
.daily-sales-report-page .daily-sales-toolbar-left a.odoo-save,
.daily-sales-report-page .daily-sales-item-link {
    position: relative;
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--daily-sales-accent) 48%, var(--daily-sales-border)) !important;
    border-radius: 9px !important;
    background: color-mix(in srgb, var(--daily-sales-accent) 4%, var(--daily-sales-card)) !important;
    color: var(--daily-sales-accent) !important;
    box-shadow: 0 5px 14px color-mix(in srgb, var(--daily-sales-text) 7%, transparent),
                inset 0 1px 0 color-mix(in srgb, #fff 24%, transparent) !important;
    transition: transform .16s ease, border-color .16s ease, background .16s ease,
                color .16s ease, box-shadow .16s ease !important;
}

.daily-sales-report-page .daily-sales-toolbar-left .odoo-save:hover,
.daily-sales-report-page .daily-sales-toolbar-left .odoo-save:focus-visible,
.daily-sales-report-page .daily-sales-toolbar-left button.odoo-save:hover,
.daily-sales-report-page .daily-sales-toolbar-left button.odoo-save:focus-visible,
.daily-sales-report-page .daily-sales-toolbar-left a.odoo-save:hover,
.daily-sales-report-page .daily-sales-toolbar-left a.odoo-save:focus-visible,
.daily-sales-report-page .daily-sales-item-link:hover,
.daily-sales-report-page .daily-sales-item-link:focus-visible {
    border-color: var(--daily-sales-accent) !important;
    background: color-mix(in srgb, var(--daily-sales-accent) 11%, var(--daily-sales-card)) !important;
    color: var(--daily-sales-accent) !important;
    box-shadow: 0 9px 22px color-mix(in srgb, var(--daily-sales-accent) 15%, transparent),
                inset 0 0 0 1px color-mix(in srgb, var(--daily-sales-accent) 10%, transparent) !important;
    filter: none;
    transform: translateY(-1px);
    outline: none;
}

.daily-sales-report-page .daily-sales-toolbar-left .odoo-discard,
.daily-sales-report-page .daily-sales-toolbar-left button.odoo-discard,
.daily-sales-report-page .daily-sales-toolbar-left a.odoo-discard,
.daily-sales-report-page .daily-sales-clear-selection,
.daily-sales-report-page .daily-sales-toolbar-tools .odoo-page-btn,
.daily-sales-report-page .daily-sales-toolbar-tools .odoo-view-btn,
.daily-sales-report-page .daily-sales-column-menu label {
    border: 1px solid color-mix(in srgb, var(--daily-sales-accent) 20%, var(--daily-sales-border)) !important;
    border-radius: 6px;
    background: color-mix(in srgb, var(--daily-sales-accent) 7%, var(--daily-sales-card)) !important;
    color: var(--daily-sales-text) !important;
    font-weight: 850;
}

.daily-sales-report-page .daily-sales-toolbar-left .odoo-discard,
.daily-sales-report-page .daily-sales-toolbar-left button.odoo-discard,
.daily-sales-report-page .daily-sales-toolbar-left a.odoo-discard {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: 7px 13px;
    text-decoration: none;
}

.daily-sales-report-page .daily-sales-toolbar-left .odoo-discard:hover,
.daily-sales-report-page .daily-sales-toolbar-left button.odoo-discard:hover,
.daily-sales-report-page .daily-sales-toolbar-left a.odoo-discard:hover,
.daily-sales-report-page .daily-sales-clear-selection:hover,
.daily-sales-report-page .daily-sales-toolbar-tools .odoo-page-btn:hover,
.daily-sales-report-page .daily-sales-toolbar-tools .odoo-view-btn:hover {
    border-color: var(--daily-sales-accent) !important;
    background: color-mix(in srgb, var(--daily-sales-accent) 13%, var(--daily-sales-card)) !important;
    color: var(--daily-sales-accent) !important;
}

.daily-sales-report-page .daily-sales-toolbar-left button:disabled,
.daily-sales-report-page .daily-sales-toolbar-left [disabled],
.daily-sales-report-page .daily-sales-toolbar-tools .odoo-page-btn.disabled {
    background: color-mix(in srgb, var(--daily-sales-muted) 14%, var(--daily-sales-card)) !important;
    color: color-mix(in srgb, var(--daily-sales-muted) 82%, var(--daily-sales-text)) !important;
    border-color: var(--daily-sales-border) !important;
    opacity: .72 !important;
    box-shadow: none !important;
    transform: none !important;
}

.daily-sales-report-page .daily-sales-filter-strip input[data-daily-sales-date] {
    cursor: pointer;
    color-scheme: light;
}

.daily-sales-date-picker {
    position: fixed;
    z-index: 5000;
    display: grid;
    gap: 8px;
    padding: 12px;
    border: 1px solid color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 26%, var(--theme-border, var(--border, #dbeafe)));
    border-radius: 12px;
    background: var(--theme-card, var(--card, #fff));
    color: var(--theme-text, var(--text, #0f172a));
    box-shadow: 0 24px 60px rgba(15, 23, 42, .22);
}

.daily-sales-date-picker-head,
.daily-sales-date-picker-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.daily-sales-date-picker-head strong {
    flex: 1;
    text-align: center;
    color: var(--theme-text, var(--text, #0f172a));
    font-size: 14px;
    font-weight: 950;
}

.daily-sales-date-picker button {
    border: 1px solid color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 22%, var(--theme-border, var(--border, #dbeafe))) !important;
    border-radius: 8px;
    background: color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 7%, var(--theme-card, var(--card, #fff))) !important;
    color: var(--theme-text, var(--text, #0f172a)) !important;
    font-weight: 900;
    cursor: pointer;
}

.daily-sales-date-picker-head > button {
    width: 34px;
    height: 32px;
    font-size: 20px;
    line-height: 1;
}

.daily-sales-date-picker-weekdays,
.daily-sales-date-picker-grid {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 5px;
}

.daily-sales-date-picker-weekdays span {
    color: var(--theme-muted, var(--muted, #64748b));
    font-size: 11px;
    font-weight: 950;
    text-align: center;
}

.daily-sales-date-picker-day {
    min-width: 0;
    height: 34px;
    padding: 0;
    font-size: 13px;
}

.daily-sales-date-picker-day.outside-month {
    color: color-mix(in srgb, var(--theme-muted, var(--muted, #64748b)) 62%, transparent) !important;
    background: color-mix(in srgb, var(--theme-muted, var(--muted, #64748b)) 5%, var(--theme-card, var(--card, #fff))) !important;
}

.daily-sales-date-picker-day.is-today {
    border-color: var(--theme-primary, var(--brand, #714b67)) !important;
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 46%, transparent);
}

.daily-sales-date-picker-day.is-selected,
.daily-sales-date-picker-day:hover,
.daily-sales-date-picker-actions button:hover,
.daily-sales-date-picker-head button:hover {
    background: linear-gradient(135deg, var(--theme-primary, var(--brand, #714b67)), var(--theme-secondary, var(--brand-dark, #52364b))) !important;
    color: #fff !important;
    border-color: var(--theme-primary, var(--brand, #714b67)) !important;
}

.daily-sales-date-picker-actions button {
    min-height: 30px;
    padding: 5px 12px;
}

body.theme-dark .daily-sales-date-picker,
body.theme-midnight .daily-sales-date-picker,
body.theme-carbon .daily-sales-date-picker {
    background: var(--card) !important;
    color: var(--text) !important;
    border-color: var(--border) !important;
}

/* Ledger Accounts report (LedgerTransactionsReportForm.vb conversion) */
.ledger-accounts-report-page {
    --ledger-accent: var(--theme-primary, var(--brand, #714b67));
    --ledger-accent-dark: var(--theme-secondary, var(--brand-dark, #52364b));
    --ledger-card: var(--theme-card, var(--card, #fff));
    --ledger-bg: var(--theme-bg, var(--bg, #f8fafc));
    --ledger-text: var(--theme-text, var(--text, #0f172a));
    --ledger-muted: var(--theme-muted, var(--muted, #64748b));
    --ledger-border: var(--theme-border, var(--border, #dbeafe));
    --ledger-soft: var(--theme-soft, var(--soft, #eef2ff));
    color: var(--ledger-text);
}

.ledger-accounts-toolbar {
    display: grid;
    gap: 12px;
    padding: 14px;
    border: 1px solid var(--ledger-border);
    border-radius: 18px;
    background: var(--ledger-card);
    box-shadow: 0 10px 26px rgba(15, 23, 42, .08);
    margin-bottom: 14px;
}

.ledger-accounts-toolbar-left,
.ledger-accounts-toolbar-tools,
.ledger-accounts-options-row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}

.ledger-accounts-toolbar-left .odoo-save,
.ledger-accounts-toolbar-left button.odoo-save {
    border: 1px solid color-mix(in srgb, var(--ledger-accent) 38%, var(--ledger-border));
    background: linear-gradient(135deg, var(--ledger-accent), var(--ledger-accent-dark));
    color: #fff;
    border-radius: 999px;
    padding: 8px 15px;
    font-weight: 800;
}

.ledger-accounts-toolbar-left .odoo-discard,
.ledger-accounts-toolbar-tools .odoo-page-btn,
.ledger-lookup-show-more {
    border: 1px solid color-mix(in srgb, var(--ledger-accent) 22%, var(--ledger-border));
    background: color-mix(in srgb, var(--ledger-accent) 7%, var(--ledger-card));
    color: var(--ledger-text);
    border-radius: 999px;
    padding: 8px 13px;
    font-weight: 700;
    text-decoration: none;
}

.ledger-accounts-toolbar-left .odoo-discard:hover,
.ledger-accounts-toolbar-tools .odoo-page-btn:hover,
.ledger-lookup-show-more:hover {
    border-color: var(--ledger-accent);
    color: var(--ledger-accent);
}

.ledger-accounts-toolbar-left button:disabled,
.ledger-accounts-toolbar-tools .odoo-page-btn.disabled {
    pointer-events: none;
    opacity: .55;
}

.ledger-accounts-toolbar-tools {
    justify-content: flex-end;
}

.ledger-accounts-record-count {
    color: var(--ledger-muted);
    font-weight: 700;
}

.ledger-accounts-page-size {
    min-width: 110px;
}

.ledger-accounts-filter-strip {
    display: grid;
    grid-template-columns: minmax(260px, 1.5fr) repeat(3, minmax(150px, 1fr));
    gap: 10px;
}

.ledger-accounts-filter-strip label,
.ledger-accounts-options-row label {
    display: grid;
    gap: 5px;
    color: var(--ledger-muted);
    font-size: .82rem;
    font-weight: 800;
}

.ledger-accounts-options-row label {
    display: inline-flex;
    align-items: center;
    color: var(--ledger-text);
    border: 1px solid var(--ledger-border);
    border-radius: 999px;
    padding: 7px 10px;
    background: color-mix(in srgb, var(--ledger-accent) 5%, var(--ledger-card));
}

.ledger-accounts-options-row label.disabled-option {
    opacity: .65;
}

.ledger-accounts-filter-strip input,
.ledger-accounts-filter-strip select,
.ledger-accounts-page-size,
.ledger-lookup-modal-search input {
    width: 100%;
    min-height: 38px;
    border: 1px solid var(--ledger-border);
    border-radius: 11px;
    background: var(--ledger-card);
    color: var(--ledger-text);
    padding: 8px 10px;
}

.ledger-lookup-input-wrap {
    position: relative;
    display: flex;
    gap: 6px;
}

.ledger-lookup-input-wrap input {
    min-width: 0;
}

.ledger-lookup-show-more {
    white-space: nowrap;
    min-height: 38px;
}

.ledger-lookup-suggestions {
    position: absolute;
    z-index: 40;
    top: calc(100% + 6px);
    left: 0;
    right: 0;
    max-height: 320px;
    overflow: auto;
    border: 1px solid var(--ledger-border);
    border-radius: 14px;
    background: var(--ledger-card);
    box-shadow: 0 18px 35px rgba(15, 23, 42, .18);
    padding: 6px;
}

.ledger-lookup-option {
    display: grid;
    width: 100%;
    gap: 2px;
    border: 0;
    background: transparent;
    color: var(--ledger-text);
    text-align: left;
    border-radius: 10px;
    padding: 9px 10px;
    cursor: pointer;
}

.ledger-lookup-option span {
    color: var(--ledger-muted);
    font-size: .78rem;
}

.ledger-lookup-option:hover,
.ledger-lookup-option.active {
    background: color-mix(in srgb, var(--ledger-accent) 13%, var(--ledger-card));
    color: var(--ledger-accent);
}

.ledger-accounts-message {
    margin: 12px 0;
    border-radius: 14px;
    padding: 10px 12px;
}

.ledger-accounts-print-head {
    display: none;
}

.ledger-accounts-summary-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(140px, 1fr));
    gap: 10px;
    margin-bottom: 14px;
}

.ledger-accounts-summary-grid article {
    border: 1px solid var(--ledger-border);
    border-radius: 16px;
    padding: 12px;
    background: var(--ledger-card);
    box-shadow: 0 8px 20px rgba(15, 23, 42, .06);
}

.ledger-accounts-summary-grid span {
    display: block;
    color: var(--ledger-muted);
    font-weight: 800;
    font-size: .78rem;
    margin-bottom: 5px;
}

.ledger-accounts-summary-grid strong {
    color: var(--ledger-text);
    font-size: 1.05rem;
}

.ledger-accounts-net-card {
    background: linear-gradient(135deg, color-mix(in srgb, var(--ledger-accent) 12%, var(--ledger-card)), var(--ledger-card)) !important;
}

.ledger-accounts-card {
    border: 1px solid var(--ledger-border);
    border-radius: 18px;
    background: var(--ledger-card);
    box-shadow: 0 10px 26px rgba(15, 23, 42, .08);
    overflow: hidden;
}

.ledger-accounts-card-title {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    padding: 13px 15px;
    border-bottom: 1px solid var(--ledger-border);
}

.ledger-accounts-card-title h2 {
    margin: 0;
    font-size: 1.05rem;
}

.ledger-accounts-card-title p {
    margin: 4px 0 0;
    color: var(--ledger-muted);
    font-size: .84rem;
}

.ledger-accounts-table-wrap {
    overflow-x: auto;
}

.ledger-accounts-table {
    width: 100%;
    min-width: 1050px;
    border-collapse: separate;
    border-spacing: 0;
}

.ledger-accounts-table th,
.ledger-accounts-table td {
    border-bottom: 1px solid var(--ledger-border);
    padding: 9px 10px;
    vertical-align: top;
    color: var(--ledger-text);
}

.ledger-accounts-table thead th {
    position: sticky;
    top: 0;
    z-index: 2;
    background: color-mix(in srgb, var(--ledger-accent) 9%, var(--ledger-card));
    color: var(--ledger-text);
    font-size: .78rem;
    text-transform: uppercase;
    letter-spacing: .04em;
    white-space: nowrap;
}

.ledger-accounts-table tbody tr:hover td {
    background: color-mix(in srgb, var(--ledger-accent) 6%, var(--ledger-card));
}

.ledger-accounts-sno-col { width: 70px; }
.ledger-accounts-date-col { width: 110px; white-space: nowrap; }
.ledger-accounts-doc-col { width: 105px; white-space: nowrap; }
.ledger-accounts-details-col { min-width: 260px; white-space: pre-line; }
.ledger-accounts-voucher-col { width: 135px; }
.ledger-accounts-voucher-name-col { width: 145px; }
.ledger-accounts-money-col { width: 110px; text-align: right; white-space: nowrap; }
.ledger-accounts-total-label { text-align: right; font-weight: 800; color: var(--ledger-text); }

.ledger-accounts-document-link,
.ledger-modal-pick {
    color: var(--ledger-accent);
    font-weight: 800;
    text-decoration: none;
    border: 0;
    background: transparent;
    cursor: pointer;
    padding: 0;
}

.ledger-accounts-document-link:hover,
.ledger-modal-pick:hover {
    text-decoration: underline;
}

.ledger-lookup-backdrop {
    position: fixed;
    inset: 0;
    z-index: 1050;
    background: color-mix(in srgb, var(--text) 48%, transparent);
    display: none;
    align-items: center;
    justify-content: center;
    padding: 18px;
}

.ledger-lookup-backdrop.open {
    display: flex;
}

.ledger-lookup-modal {
    width: min(920px, calc(100vw - 30px));
    max-height: min(720px, calc(100vh - 30px));
    display: grid;
    grid-template-rows: auto auto 1fr;
    border-radius: 20px;
    background: var(--ledger-card);
    border: 1px solid var(--ledger-border);
    box-shadow: 0 24px 60px rgba(15, 23, 42, .28);
    overflow: hidden;
}

.ledger-lookup-modal-head,
.ledger-lookup-modal-search {
    display: flex;
    align-items: center;
    gap: 10px;
    justify-content: space-between;
    padding: 13px 15px;
    border-bottom: 1px solid var(--ledger-border);
}

.ledger-lookup-modal-head span {
    color: var(--ledger-muted);
    font-weight: 800;
    font-size: .78rem;
    text-transform: uppercase;
}

.ledger-lookup-modal-head h2 {
    margin: 2px 0 0;
    font-size: 1.1rem;
}

.ledger-lookup-close {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: 1px solid var(--ledger-border);
    background: var(--ledger-card);
    color: var(--ledger-text);
    font-size: 1.3rem;
    cursor: pointer;
}

.ledger-lookup-modal-search input {
    flex: 1;
}

.ledger-lookup-modal-results {
    overflow: auto;
    padding: 10px;
}

.ledger-lookup-modal-results table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
}

.ledger-lookup-modal-results th,
.ledger-lookup-modal-results td {
    padding: 9px 10px;
    border-bottom: 1px solid var(--ledger-border);
}

.ledger-lookup-modal-results th {
    text-align: left;
    color: var(--ledger-muted);
    font-size: .78rem;
    text-transform: uppercase;
}

@media (max-width: 1100px) {
    .ledger-accounts-filter-strip {
        grid-template-columns: repeat(2, minmax(180px, 1fr));
    }
    .ledger-accounts-summary-grid {
        grid-template-columns: repeat(2, minmax(160px, 1fr));
    }
}

@media (max-width: 700px) {
    .ledger-accounts-filter-strip,
    .ledger-accounts-summary-grid {
        grid-template-columns: 1fr;
    }
    .ledger-lookup-input-wrap {
        display: grid;
    }
    .ledger-accounts-toolbar-tools {
        justify-content: flex-start;
    }
}

@media print {
    .ledger-accounts-report-topbar,
    .ledger-accounts-toolbar,
    .ledger-lookup-backdrop,
    .sidebar,
    .user-panel {
        display: none !important;
    }
    .ledger-accounts-report-page,
    .ledger-accounts-card {
        border: 0 !important;
        box-shadow: none !important;
        background: #fff !important;
    }
    .ledger-accounts-print-head {
        display: block;
        text-align: center;
        margin-bottom: 10px;
    }
    .ledger-accounts-print-head h2,
    .ledger-accounts-print-head p {
        margin: 2px 0;
        color: #000;
    }
    .ledger-accounts-summary-grid {
        grid-template-columns: repeat(5, 1fr);
    }
    .ledger-accounts-table-wrap {
        overflow: visible;
    }
    .ledger-accounts-table {
        min-width: 0;
        font-size: 10px;
    }
    .ledger-accounts-table th,
    .ledger-accounts-table td {
        padding: 4px 5px;
        color: #000 !important;
    }
}

/* Global ERP themed date picker - replaces browser-native date calendars project-wide. */
input[data-erp-date-picker] {
    cursor: pointer;
    color-scheme: light;
}

body.theme-dark input[data-erp-date-picker],
body.theme-midnight input[data-erp-date-picker],
body.theme-carbon input[data-erp-date-picker] {
    color-scheme: dark;
}

/* Ledger Accounts report responsive layout refinement. */
.ledger-accounts-report-page .ledger-accounts-toolbar {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
    gap: 9px 12px;
    padding: 12px;
}

.ledger-accounts-report-page .ledger-accounts-toolbar-left {
    grid-column: 1;
}

.ledger-accounts-report-page .ledger-accounts-toolbar-tools {
    grid-column: 2;
}

.ledger-accounts-report-page .ledger-accounts-filter-strip,
.ledger-accounts-report-page .ledger-accounts-options-row {
    grid-column: 1 / -1;
}

.ledger-accounts-report-page .ledger-accounts-filter-strip {
    grid-template-columns:
        minmax(270px, 1.35fr)
        minmax(140px, .7fr)
        minmax(128px, 136px)
        minmax(128px, 136px)
        minmax(210px, 1.1fr)
        minmax(145px, .75fr)
        minmax(150px, .8fr);
    align-items: end;
    gap: 8px;
}

.ledger-accounts-report-page .ledger-accounts-filter-strip label,
.ledger-accounts-report-page .ledger-accounts-options-row label {
    min-width: 0;
}

.ledger-accounts-report-page .ledger-accounts-filter-strip label > span {
    line-height: 1.1;
    white-space: nowrap;
}

.ledger-accounts-report-page .ledger-filter-date input[data-erp-date-picker] {
    min-width: 0;
    width: 132px;
    max-width: 132px;
    font-variant-numeric: tabular-nums;
}

.ledger-accounts-report-page .ledger-filter-user select,
.ledger-accounts-report-page .ledger-filter-location select {
    min-width: 0;
    max-width: 180px;
}

.ledger-accounts-report-page .ledger-filter-activity select {
    min-width: 0;
}

.ledger-accounts-report-page .ledger-filter-details input {
    min-width: 0;
}

.ledger-accounts-report-page .ledger-lookup-input-wrap {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 6px;
}

.ledger-accounts-report-page .ledger-lookup-show-more,
.ledger-accounts-report-page .ledger-accounts-toolbar-left .odoo-save,
.ledger-accounts-report-page .ledger-accounts-toolbar-left .odoo-discard,
.ledger-accounts-report-page .ledger-accounts-toolbar-tools .odoo-page-btn {
    min-height: 34px;
    padding: 7px 11px;
}

.ledger-accounts-report-page .ledger-lookup-suggestions {
    right: auto;
    width: min(460px, calc(100vw - 42px));
    max-width: 100%;
    max-height: min(230px, 42vh);
    border-radius: 12px;
    padding: 4px;
    box-shadow: 0 14px 28px rgba(15, 23, 42, .18);
}

.ledger-accounts-report-page .ledger-lookup-option {
    padding: 7px 9px;
    gap: 1px;
}

.ledger-accounts-report-page .ledger-lookup-option strong,
.ledger-accounts-report-page .ledger-lookup-option span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ledger-accounts-report-page .ledger-lookup-option span {
    font-size: .75rem;
}

.ledger-accounts-report-page .ledger-accounts-options-row {
    gap: 6px;
}

.ledger-accounts-report-page .ledger-accounts-options-row label {
    padding: 6px 9px;
    font-size: .78rem;
}

.ledger-accounts-report-page .ledger-accounts-summary-grid {
    grid-template-columns: repeat(5, minmax(120px, 1fr));
    gap: 8px;
    margin-bottom: 10px;
}

.ledger-accounts-report-page .ledger-accounts-summary-grid article {
    padding: 9px 10px;
    border-radius: 13px;
}

.ledger-accounts-report-page .ledger-accounts-summary-grid span {
    margin-bottom: 3px;
    font-size: .74rem;
}

.ledger-accounts-report-page .ledger-accounts-summary-grid strong {
    font-size: .98rem;
}

.ledger-accounts-report-page .ledger-accounts-card-title {
    padding: 10px 12px;
}

.ledger-accounts-report-page .ledger-accounts-card-title p {
    margin-top: 2px;
    font-size: .78rem;
}

.ledger-accounts-report-page .ledger-accounts-table-wrap {
    overflow-x: visible;
}

.ledger-accounts-report-page .ledger-accounts-table {
    width: 100%;
    min-width: 0;
    table-layout: auto;
}

.ledger-accounts-report-page .ledger-accounts-table th,
.ledger-accounts-report-page .ledger-accounts-table td {
    padding: 8px 8px;
}

.ledger-accounts-report-page .ledger-accounts-sno-col { width: 54px; }
.ledger-accounts-report-page .ledger-accounts-date-col { width: 94px; }
.ledger-accounts-report-page .ledger-accounts-doc-col { width: 82px; }
.ledger-accounts-report-page .ledger-accounts-voucher-col { width: 106px; }
.ledger-accounts-report-page .ledger-accounts-voucher-name-col { width: 122px; }
.ledger-accounts-report-page .ledger-accounts-money-col { width: 92px; }
.ledger-accounts-report-page .ledger-accounts-details-col {
    min-width: 340px;
    width: auto;
}

.ledger-accounts-report-page .ledger-accounts-details-col span {
    overflow-wrap: anywhere;
}

@media (max-width: 1240px) {
    .ledger-accounts-report-page .ledger-accounts-filter-strip {
        grid-template-columns:
            minmax(260px, 1.3fr)
            minmax(140px, .75fr)
            minmax(128px, 132px)
            minmax(128px, 132px)
            minmax(210px, 1fr);
    }

    .ledger-accounts-report-page .ledger-filter-user,
    .ledger-accounts-report-page .ledger-filter-location {
        grid-column: span 1;
    }
}

@media (max-width: 980px) {
    .ledger-accounts-report-page .ledger-accounts-toolbar {
        grid-template-columns: 1fr;
    }

    .ledger-accounts-report-page .ledger-accounts-toolbar-left,
    .ledger-accounts-report-page .ledger-accounts-toolbar-tools {
        grid-column: 1;
        justify-content: flex-start;
    }

    .ledger-accounts-report-page .ledger-accounts-filter-strip {
        grid-template-columns: minmax(240px, 1fr) minmax(128px, 136px) minmax(128px, 136px);
    }

    .ledger-accounts-report-page .ledger-filter-ledger,
    .ledger-accounts-report-page .ledger-filter-details {
        grid-column: span 3;
    }

    .ledger-accounts-report-page .ledger-accounts-table-wrap {
        overflow-x: auto;
    }

    .ledger-accounts-report-page .ledger-accounts-table {
        min-width: 940px;
    }
}

@media (max-width: 720px) {
    .ledger-accounts-report-page .ledger-accounts-filter-strip {
        grid-template-columns: 1fr 1fr;
    }

    .ledger-accounts-report-page .ledger-filter-ledger,
    .ledger-accounts-report-page .ledger-filter-details,
    .ledger-accounts-report-page .ledger-filter-activity,
    .ledger-accounts-report-page .ledger-filter-user,
    .ledger-accounts-report-page .ledger-filter-location {
        grid-column: 1 / -1;
    }

    .ledger-accounts-report-page .ledger-filter-date input[data-erp-date-picker] {
        width: 100%;
        max-width: 100%;
    }

    .ledger-accounts-report-page .ledger-filter-user select,
    .ledger-accounts-report-page .ledger-filter-location select {
        max-width: 100%;
    }

    .ledger-accounts-report-page .ledger-lookup-input-wrap {
        grid-template-columns: 1fr;
    }

    .ledger-accounts-report-page .ledger-lookup-suggestions {
        width: min(100%, calc(100vw - 34px));
    }

    .ledger-accounts-report-page .ledger-accounts-summary-grid {
        grid-template-columns: repeat(2, minmax(130px, 1fr));
    }
}

@media (max-width: 460px) {
    .ledger-accounts-report-page .ledger-accounts-filter-strip,
    .ledger-accounts-report-page .ledger-accounts-summary-grid {
        grid-template-columns: 1fr;
    }
}

/* Ledger Accounts report: compact filters, single-line transactions, and user-resizable columns. */
.ledger-accounts-report-page .ledger-accounts-toolbar {
    gap: 7px 10px;
    padding: 10px;
}

.ledger-accounts-report-page .ledger-accounts-toolbar-left,
.ledger-accounts-report-page .ledger-accounts-toolbar-tools {
    gap: 6px;
}

.ledger-accounts-report-page .ledger-accounts-page-size-wrap {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin: 0;
    color: var(--ledger-muted);
    font-size: .74rem;
    font-weight: 800;
    white-space: nowrap;
}

.ledger-accounts-report-page .ledger-accounts-page-size-wrap > span {
    line-height: 1;
}

.ledger-accounts-report-page .ledger-accounts-page-size {
    width: 54px;
    min-width: 54px;
    max-width: 54px;
    min-height: 32px;
    padding: 4px 6px;
    border-radius: 9px;
    font-weight: 800;
}

.ledger-accounts-report-page .ledger-accounts-record-count {
    font-size: .78rem;
    white-space: nowrap;
}

.ledger-accounts-report-page .ledger-accounts-filter-strip {
    grid-template-columns:
        minmax(220px, 1.08fr)
        minmax(112px, .52fr)
        minmax(112px, 118px)
        minmax(112px, 118px)
        minmax(170px, .82fr)
        minmax(106px, .42fr)
        minmax(112px, .46fr);
    gap: 6px;
}

.ledger-accounts-report-page .ledger-accounts-filter-strip label,
.ledger-accounts-report-page .ledger-accounts-options-row label {
    gap: 3px;
}

.ledger-accounts-report-page .ledger-accounts-filter-strip input,
.ledger-accounts-report-page .ledger-accounts-filter-strip select,
.ledger-accounts-report-page .ledger-lookup-modal-search input {
    min-height: 34px;
    padding: 6px 8px;
    border-radius: 9px;
    font-size: .84rem;
}

.ledger-accounts-report-page .ledger-filter-date input[data-erp-date-picker] {
    width: 116px;
    max-width: 116px;
}

.ledger-accounts-report-page .ledger-filter-user select,
.ledger-accounts-report-page .ledger-filter-location select {
    width: 100%;
    max-width: 132px;
}

.ledger-accounts-report-page .ledger-filter-activity select {
    max-width: 132px;
}

.ledger-accounts-report-page .ledger-filter-details input {
    max-width: 210px;
}

.ledger-accounts-report-page .ledger-lookup-input-wrap {
    grid-template-columns: minmax(0, 1fr) auto;
}

.ledger-accounts-report-page .ledger-lookup-show-more,
.ledger-accounts-report-page .ledger-accounts-toolbar-left .odoo-save,
.ledger-accounts-report-page .ledger-accounts-toolbar-left .odoo-discard,
.ledger-accounts-report-page .ledger-accounts-toolbar-tools .odoo-page-btn {
    min-height: 32px;
    padding: 6px 10px;
    border-radius: 999px;
    font-size: .82rem;
}

.ledger-accounts-report-page .ledger-lookup-suggestions {
    width: min(380px, calc(100vw - 42px));
    max-height: min(205px, 40vh);
}

.ledger-accounts-report-page .ledger-accounts-options-row {
    gap: 5px;
}

.ledger-accounts-report-page .ledger-accounts-options-row label {
    padding: 5px 8px;
    font-size: .75rem;
}

.ledger-accounts-report-page .ledger-accounts-card-title {
    padding: 8px 10px;
}

.ledger-accounts-report-page .ledger-accounts-table-wrap {
    overflow-x: auto;
}

.ledger-accounts-report-page .ledger-accounts-table {
    table-layout: fixed !important;
    min-width: 1170px;
}

.ledger-accounts-report-page .ledger-accounts-table th,
.ledger-accounts-report-page .ledger-accounts-table td {
    white-space: nowrap !important;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: middle;
    padding: 6px 8px;
    height: 32px;
    line-height: 1.18;
}

.ledger-accounts-report-page .ledger-accounts-table td {
    max-width: 0;
}

.ledger-accounts-report-page .ledger-accounts-details-col {
    white-space: nowrap !important;
    min-width: 180px;
}

.ledger-accounts-report-page .ledger-accounts-details-col span,
.ledger-accounts-report-page .ledger-accounts-document-link,
.ledger-accounts-report-page .ledger-accounts-table td > b {
    display: inline-block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    vertical-align: bottom;
}

.ledger-accounts-report-page .ledger-accounts-resizable-header {
    padding-right: 15px !important;
}

.ledger-accounts-report-page .ledger-accounts-column-resize-handle {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 10px;
    cursor: col-resize;
    touch-action: none;
    opacity: .5;
    z-index: 3;
}

.ledger-accounts-report-page .ledger-accounts-column-resize-handle::after {
    content: "";
    position: absolute;
    top: 7px;
    bottom: 7px;
    right: 3px;
    width: 2px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--ledger-accent) 46%, var(--ledger-border));
}

.ledger-accounts-report-page .ledger-accounts-column-resize-handle:hover,
.ledger-accounts-report-page .ledger-accounts-resizable-header.is-resizing .ledger-accounts-column-resize-handle {
    opacity: 1;
}

.ledger-accounts-report-page .ledger-accounts-resizable-header.is-resizing {
    background: color-mix(in srgb, var(--ledger-accent) 18%, var(--ledger-card)) !important;
}

body.ledger-accounts-column-resizing {
    cursor: col-resize !important;
    user-select: none !important;
}

body.ledger-accounts-column-resizing * {
    cursor: col-resize !important;
}

@media (max-width: 1340px) {
    .ledger-accounts-report-page .ledger-accounts-filter-strip {
        grid-template-columns:
            minmax(220px, 1fr)
            minmax(112px, 132px)
            minmax(112px, 118px)
            minmax(112px, 118px)
            minmax(170px, 1fr);
    }

    .ledger-accounts-report-page .ledger-filter-user,
    .ledger-accounts-report-page .ledger-filter-location {
        grid-column: span 1;
    }
}

@media (max-width: 980px) {
    .ledger-accounts-report-page .ledger-accounts-filter-strip {
        grid-template-columns: minmax(210px, 1fr) minmax(112px, 118px) minmax(112px, 118px);
    }

    .ledger-accounts-report-page .ledger-filter-ledger,
    .ledger-accounts-report-page .ledger-filter-details {
        grid-column: span 3;
    }

    .ledger-accounts-report-page .ledger-filter-details input,
    .ledger-accounts-report-page .ledger-filter-activity select,
    .ledger-accounts-report-page .ledger-filter-user select,
    .ledger-accounts-report-page .ledger-filter-location select {
        max-width: 100%;
    }
}

@media (max-width: 720px) {
    .ledger-accounts-report-page .ledger-accounts-filter-strip {
        grid-template-columns: 1fr 1fr;
    }

    .ledger-accounts-report-page .ledger-filter-ledger,
    .ledger-accounts-report-page .ledger-filter-details,
    .ledger-accounts-report-page .ledger-filter-activity,
    .ledger-accounts-report-page .ledger-filter-user,
    .ledger-accounts-report-page .ledger-filter-location {
        grid-column: 1 / -1;
    }

    .ledger-accounts-report-page .ledger-filter-date input[data-erp-date-picker],
    .ledger-accounts-report-page .ledger-filter-details input,
    .ledger-accounts-report-page .ledger-filter-activity select,
    .ledger-accounts-report-page .ledger-filter-user select,
    .ledger-accounts-report-page .ledger-filter-location select {
        width: 100%;
        max-width: 100%;
    }
}

/* Ledger Accounts report: AJAX/silent search and filter loading. */
.ledger-accounts-report-page {
    position: relative;
}

.ledger-accounts-ajax-zone {
    position: relative;
    transition: opacity .16s ease, filter .16s ease;
}

.ledger-accounts-report-page.is-ajax-loading .ledger-accounts-ajax-zone {
    opacity: .58;
    filter: saturate(.85);
    pointer-events: none;
}

.ledger-accounts-loading-overlay {
    position: absolute;
    inset: 104px 12px auto 12px;
    z-index: 35;
    display: flex;
    justify-content: center;
    pointer-events: none;
}

.ledger-accounts-loading-overlay[hidden] {
    display: none !important;
}

.ledger-accounts-loading-card {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    min-height: 38px;
    padding: 8px 14px;
    border: 1px solid color-mix(in srgb, var(--ledger-accent) 34%, var(--ledger-border));
    border-radius: 999px;
    background: color-mix(in srgb, var(--ledger-card) 92%, white);
    color: var(--ledger-text);
    box-shadow: 0 16px 34px rgba(15, 23, 42, .16);
    font-size: .84rem;
    font-weight: 900;
}

.ledger-accounts-loading-spinner {
    width: 16px;
    height: 16px;
    border-radius: 999px;
    border: 2px solid color-mix(in srgb, var(--ledger-accent) 22%, transparent);
    border-top-color: var(--ledger-accent);
    animation: ledgerAccountsSpin .7s linear infinite;
}

@keyframes ledgerAccountsSpin {
    to { transform: rotate(360deg); }
}

body.theme-dark .ledger-accounts-loading-card,
body.theme-midnight .ledger-accounts-loading-card,
body.theme-carbon .ledger-accounts-loading-card {
    background: color-mix(in srgb, var(--ledger-card) 88%, black);
}

/* Touch POS 2 Receive Payment method tiles - final targeted UI fix.
   Keep POS (Sales) Receive Payment untouched and make Touch POS 2 tiles follow the active user theme. */
body .pos-payment-touch-modal.pos-payment-confirmation-view:not(.sales-payment-touch-modal) #posPaymentMethodGrid.pos-touch-payment-method-grid,
body .pos-payment-touch-modal.pos-payment-confirmation-view:not(.sales-payment-touch-modal) .pos-payment-method-grid.pos-touch-payment-method-grid.pos-payment-six-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 12px !important;
    margin: 0 0 14px !important;
    align-items: stretch !important;
}

body .pos-payment-touch-modal.pos-payment-confirmation-view:not(.sales-payment-touch-modal) #posPaymentMethodGrid.pos-touch-payment-method-grid .pos-payment-method-tile,
body .pos-payment-touch-modal.pos-payment-confirmation-view:not(.sales-payment-touch-modal) #posPaymentMethodGrid.pos-touch-payment-method-grid .pos-payment-method-tile.pos-wallet-method-tile,
body .pos-payment-touch-modal.pos-payment-confirmation-view:not(.sales-payment-touch-modal) #posPaymentMethodGrid.pos-touch-payment-method-grid .pos-payment-method-tile.pos-terminal-method-tile,
body .pos-payment-touch-modal.pos-payment-confirmation-view:not(.sales-payment-touch-modal) #posPaymentMethodGrid.pos-touch-payment-method-grid .pos-payment-method-tile[data-payment-method="On Account"] {
    --touch-payment-accent: var(--theme-primary, var(--brand, #059669));
    --touch-payment-accent-dark: var(--theme-secondary, var(--brand-dark, #047857));
    position: relative !important;
    min-height: 112px !important;
    height: auto !important;
    padding: 12px 8px 10px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;
    border-radius: 18px !important;
    border: 1px solid color-mix(in srgb, var(--touch-payment-accent) 32%, var(--border, #d8e3dc)) !important;
    background:
        radial-gradient(circle at 20% 0, color-mix(in srgb, var(--touch-payment-accent) 8%, transparent), transparent 34%),
        linear-gradient(180deg, color-mix(in srgb, var(--card, #ffffff) 98%, #ffffff), color-mix(in srgb, var(--soft, #f8fafc) 30%, var(--card, #ffffff))) !important;
    color: var(--text, #111827) !important;
    box-shadow: 0 8px 18px color-mix(in srgb, var(--text, #111827) 5%, transparent) !important;
    overflow: hidden !important;
    cursor: pointer !important;
    text-align: center !important;
    transform: translateY(0) !important;
    transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease, background .16s ease !important;
}

body .pos-payment-touch-modal.pos-payment-confirmation-view:not(.sales-payment-touch-modal) #posPaymentMethodGrid.pos-touch-payment-method-grid .pos-payment-method-tile::before,
body .pos-payment-touch-modal.pos-payment-confirmation-view:not(.sales-payment-touch-modal) #posPaymentMethodGrid.pos-touch-payment-method-grid .pos-payment-method-tile::after {
    content: none !important;
    display: none !important;
}

body .pos-payment-touch-modal.pos-payment-confirmation-view:not(.sales-payment-touch-modal) #posPaymentMethodGrid.pos-touch-payment-method-grid .pos-payment-method-tile:hover,
body .pos-payment-touch-modal.pos-payment-confirmation-view:not(.sales-payment-touch-modal) #posPaymentMethodGrid.pos-touch-payment-method-grid .pos-payment-method-tile:focus-visible {
    border-color: var(--touch-payment-accent) !important;
    background:
        radial-gradient(circle at 20% 0, color-mix(in srgb, var(--touch-payment-accent) 12%, transparent), transparent 36%),
        linear-gradient(180deg, color-mix(in srgb, var(--touch-payment-accent) 7%, var(--card, #ffffff)), color-mix(in srgb, var(--soft, #f8fafc) 34%, var(--card, #ffffff))) !important;
    box-shadow: 0 12px 24px color-mix(in srgb, var(--touch-payment-accent) 14%, transparent) !important;
    color: var(--text, #111827) !important;
    outline: none !important;
    transform: translateY(-1px) !important;
}

body .pos-payment-touch-modal.pos-payment-confirmation-view:not(.sales-payment-touch-modal) #posPaymentMethodGrid.pos-touch-payment-method-grid .pos-payment-method-tile.active,
body .pos-payment-touch-modal.pos-payment-confirmation-view:not(.sales-payment-touch-modal) #posPaymentMethodGrid.pos-touch-payment-method-grid .pos-payment-method-tile[aria-pressed="true"] {
    border-color: var(--touch-payment-accent) !important;
    background:
        radial-gradient(circle at 18% 0, color-mix(in srgb, var(--touch-payment-accent) 14%, transparent), transparent 37%),
        linear-gradient(180deg, color-mix(in srgb, var(--touch-payment-accent) 10%, var(--card, #ffffff)), color-mix(in srgb, var(--soft, #f8fafc) 38%, var(--card, #ffffff))) !important;
    color: var(--text, #111827) !important;
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--touch-payment-accent) 20%, transparent), 0 13px 24px color-mix(in srgb, var(--touch-payment-accent) 16%, transparent) !important;
    transform: translateY(-1px) !important;
}

body .pos-payment-touch-modal.pos-payment-confirmation-view:not(.sales-payment-touch-modal) #posPaymentMethodGrid.pos-touch-payment-method-grid .pos-payment-method-icon,
body .pos-payment-touch-modal.pos-payment-confirmation-view:not(.sales-payment-touch-modal) #posPaymentMethodGrid.pos-touch-payment-method-grid .pos-purpose-icon {
    width: 58px !important;
    height: 48px !important;
    min-width: 58px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 16px !important;
    padding: 7px !important;
    background: color-mix(in srgb, var(--touch-payment-accent) 10%, var(--card, #ffffff)) !important;
    color: var(--touch-payment-accent) !important;
    border: 1px solid color-mix(in srgb, var(--touch-payment-accent) 24%, transparent) !important;
    box-shadow: inset 0 1px 0 color-mix(in srgb, #ffffff 34%, transparent) !important;
}

body .pos-payment-touch-modal.pos-payment-confirmation-view:not(.sales-payment-touch-modal) #posPaymentMethodGrid.pos-touch-payment-method-grid .pos-payment-method-tile.active .pos-payment-method-icon,
body .pos-payment-touch-modal.pos-payment-confirmation-view:not(.sales-payment-touch-modal) #posPaymentMethodGrid.pos-touch-payment-method-grid .pos-payment-method-tile[aria-pressed="true"] .pos-payment-method-icon,
body .pos-payment-touch-modal.pos-payment-confirmation-view:not(.sales-payment-touch-modal) #posPaymentMethodGrid.pos-touch-payment-method-grid .pos-payment-method-tile.active .pos-purpose-icon,
body .pos-payment-touch-modal.pos-payment-confirmation-view:not(.sales-payment-touch-modal) #posPaymentMethodGrid.pos-touch-payment-method-grid .pos-payment-method-tile[aria-pressed="true"] .pos-purpose-icon {
    background: color-mix(in srgb, var(--touch-payment-accent) 14%, var(--card, #ffffff)) !important;
    color: var(--touch-payment-accent) !important;
    border-color: color-mix(in srgb, var(--touch-payment-accent) 34%, transparent) !important;
}

body .pos-payment-touch-modal.pos-payment-confirmation-view:not(.sales-payment-touch-modal) #posPaymentMethodGrid.pos-touch-payment-method-grid .pos-purpose-icon svg {
    width: 32px !important;
    height: 32px !important;
    stroke: currentColor !important;
    fill: none !important;
    stroke-width: 2.8 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
}

body .pos-payment-touch-modal.pos-payment-confirmation-view:not(.sales-payment-touch-modal) #posPaymentMethodGrid.pos-touch-payment-method-grid .pos-purpose-brand {
    min-width: 58px !important;
    height: 42px !important;
    padding: 0 8px !important;
    border-radius: 14px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 2px !important;
    background: var(--card, #ffffff) !important;
    color: var(--text, #111827) !important;
    border: 1px solid color-mix(in srgb, var(--touch-payment-accent) 25%, var(--border, #d8e3dc)) !important;
    box-shadow: 0 5px 12px color-mix(in srgb, var(--text, #111827) 6%, transparent) !important;
}

body .pos-payment-touch-modal.pos-payment-confirmation-view:not(.sales-payment-touch-modal) #posPaymentMethodGrid.pos-touch-payment-method-grid .pos-purpose-brand b {
    color: var(--touch-payment-accent) !important;
    font-size: 22px !important;
    line-height: 1 !important;
}

body .pos-payment-touch-modal.pos-payment-confirmation-view:not(.sales-payment-touch-modal) #posPaymentMethodGrid.pos-touch-payment-method-grid .pos-purpose-brand small {
    color: var(--text, #111827) !important;
    font-size: 14px !important;
    font-weight: 950 !important;
    line-height: 1 !important;
}

body .pos-payment-touch-modal.pos-payment-confirmation-view:not(.sales-payment-touch-modal) #posPaymentMethodGrid.pos-touch-payment-method-grid .pos-payment-method-caption {
    display: block !important;
    max-width: 100% !important;
    color: var(--text, #111827) !important;
    font-size: 16px !important;
    font-weight: 950 !important;
    line-height: 1.05 !important;
    text-align: center !important;
    white-space: normal !important;
}

body .pos-payment-touch-modal.pos-payment-confirmation-view:not(.sales-payment-touch-modal) #posPaymentMethodGrid.pos-touch-payment-method-grid .pos-payment-method-subcaption,
body .pos-payment-touch-modal.pos-payment-confirmation-view:not(.sales-payment-touch-modal) #posPaymentMethodGrid.pos-touch-payment-method-grid .pos-payment-method-tile.active .pos-payment-method-subcaption,
body .pos-payment-touch-modal.pos-payment-confirmation-view:not(.sales-payment-touch-modal) #posPaymentMethodGrid.pos-touch-payment-method-grid .pos-payment-method-tile[aria-pressed="true"] .pos-payment-method-subcaption {
    display: block !important;
    max-width: 100% !important;
    color: color-mix(in srgb, var(--muted, #64748b) 86%, var(--touch-payment-accent)) !important;
    font-size: 11px !important;
    font-weight: 900 !important;
    line-height: 1.05 !important;
    text-align: center !important;
}

body .pos-payment-touch-modal.pos-payment-confirmation-view:not(.sales-payment-touch-modal) #posPaymentMethodGrid.pos-touch-payment-method-grid .pos-payment-selected-mark {
    position: absolute !important;
    top: 8px !important;
    right: 8px !important;
    width: 21px !important;
    height: 21px !important;
    border-radius: 999px !important;
    display: none !important;
    align-items: center !important;
    justify-content: center !important;
    background: var(--touch-payment-accent) !important;
    color: #ffffff !important;
    font-size: 12px !important;
    font-weight: 950 !important;
    box-shadow: 0 5px 12px color-mix(in srgb, var(--touch-payment-accent) 26%, transparent) !important;
}
body .pos-payment-touch-modal.pos-payment-confirmation-view:not(.sales-payment-touch-modal) #posPaymentMethodGrid.pos-touch-payment-method-grid .pos-payment-method-tile.active .pos-payment-selected-mark,
body .pos-payment-touch-modal.pos-payment-confirmation-view:not(.sales-payment-touch-modal) #posPaymentMethodGrid.pos-touch-payment-method-grid .pos-payment-method-tile[aria-pressed="true"] .pos-payment-selected-mark {
    display: inline-flex !important;
}

body.theme-dark .pos-payment-touch-modal.pos-payment-confirmation-view:not(.sales-payment-touch-modal) #posPaymentMethodGrid.pos-touch-payment-method-grid .pos-payment-method-tile,
body.theme-midnight .pos-payment-touch-modal.pos-payment-confirmation-view:not(.sales-payment-touch-modal) #posPaymentMethodGrid.pos-touch-payment-method-grid .pos-payment-method-tile,
body.theme-carbon .pos-payment-touch-modal.pos-payment-confirmation-view:not(.sales-payment-touch-modal) #posPaymentMethodGrid.pos-touch-payment-method-grid .pos-payment-method-tile {
    background:
        radial-gradient(circle at 20% 0, color-mix(in srgb, var(--touch-payment-accent) 12%, transparent), transparent 36%),
        linear-gradient(180deg, color-mix(in srgb, var(--card, #0f172a) 94%, #ffffff 2%), color-mix(in srgb, var(--soft, #1e293b) 44%, var(--card, #0f172a))) !important;
    color: var(--text, #f8fafc) !important;
}
body.theme-dark .pos-payment-touch-modal.pos-payment-confirmation-view:not(.sales-payment-touch-modal) #posPaymentMethodGrid.pos-touch-payment-method-grid .pos-payment-method-caption,
body.theme-midnight .pos-payment-touch-modal.pos-payment-confirmation-view:not(.sales-payment-touch-modal) #posPaymentMethodGrid.pos-touch-payment-method-grid .pos-payment-method-caption,
body.theme-carbon .pos-payment-touch-modal.pos-payment-confirmation-view:not(.sales-payment-touch-modal) #posPaymentMethodGrid.pos-touch-payment-method-grid .pos-payment-method-caption,
body.theme-dark .pos-payment-touch-modal.pos-payment-confirmation-view:not(.sales-payment-touch-modal) #posPaymentMethodGrid.pos-touch-payment-method-grid .pos-purpose-brand small,
body.theme-midnight .pos-payment-touch-modal.pos-payment-confirmation-view:not(.sales-payment-touch-modal) #posPaymentMethodGrid.pos-touch-payment-method-grid .pos-purpose-brand small,
body.theme-carbon .pos-payment-touch-modal.pos-payment-confirmation-view:not(.sales-payment-touch-modal) #posPaymentMethodGrid.pos-touch-payment-method-grid .pos-purpose-brand small {
    color: var(--text, #f8fafc) !important;
}
body.theme-dark .pos-payment-touch-modal.pos-payment-confirmation-view:not(.sales-payment-touch-modal) #posPaymentMethodGrid.pos-touch-payment-method-grid .pos-purpose-brand,
body.theme-midnight .pos-payment-touch-modal.pos-payment-confirmation-view:not(.sales-payment-touch-modal) #posPaymentMethodGrid.pos-touch-payment-method-grid .pos-purpose-brand,
body.theme-carbon .pos-payment-touch-modal.pos-payment-confirmation-view:not(.sales-payment-touch-modal) #posPaymentMethodGrid.pos-touch-payment-method-grid .pos-purpose-brand {
    background: color-mix(in srgb, var(--card, #0f172a) 88%, #ffffff 4%) !important;
    color: var(--text, #f8fafc) !important;
}

@media (max-width: 620px) {
    body .pos-payment-touch-modal.pos-payment-confirmation-view:not(.sales-payment-touch-modal) #posPaymentMethodGrid.pos-touch-payment-method-grid,
    body .pos-payment-touch-modal.pos-payment-confirmation-view:not(.sales-payment-touch-modal) .pos-payment-method-grid.pos-touch-payment-method-grid.pos-payment-six-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

/* Update Opening Balances: frmUpdateLedgerPeningBalances.vb MVC conversion */
.opening-balances-page {
    padding-bottom: 28px;
}

.opening-balances-header-card {
    display: flex;
    justify-content: space-between;
    gap: 14px;
    align-items: flex-start;
    padding: 14px 16px;
    margin-bottom: 12px;
    border: 1px solid var(--border, #d9e2ef);
    border-radius: 14px;
    background: linear-gradient(135deg, color-mix(in srgb, var(--card, #fff) 96%, var(--brand, #714b67)), var(--card, #fff));
    box-shadow: 0 10px 24px rgba(15, 23, 42, .06);
}

.opening-balances-header-card h2 {
    margin: 0 0 4px;
    font-size: 18px;
    color: var(--text, #111827);
}

.opening-balances-status {
    min-height: 30px;
    max-width: 420px;
    padding: 7px 11px;
    border-radius: 999px;
    color: var(--muted, #64748b);
    font-weight: 800;
    text-align: right;
}

.opening-balances-status[data-type="success"] {
    color: #047857;
    background: rgba(16, 185, 129, .12);
    border: 1px solid rgba(16, 185, 129, .24);
}

.opening-balances-status[data-type="error"] {
    color: #b91c1c;
    background: rgba(239, 68, 68, .11);
    border: 1px solid rgba(239, 68, 68, .24);
}

.opening-balances-filter-form {
    display: grid;
    grid-template-columns: minmax(170px, .7fr) minmax(240px, 1.2fr) minmax(200px, .95fr) 78px auto;
    align-items: end;
    gap: 10px;
    padding: 12px;
    margin-bottom: 10px;
    border: 1px solid var(--border, #d9e2ef);
    border-radius: 14px;
    background: var(--card, #fff);
}

.opening-filter-field {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

.opening-filter-field span {
    font-size: 12px;
    color: var(--muted, #64748b);
    font-weight: 850;
}

.opening-balances-filter-form .odoo-input {
    min-height: 34px;
    font-size: 13px;
}

.opening-filter-rows .odoo-input {
    width: 68px;
    min-width: 68px;
}

.opening-filter-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    justify-content: flex-end;
}

.opening-balances-warning {
    margin: 0 0 10px;
    padding: 10px 12px;
    border-radius: 12px;
    background: color-mix(in srgb, #f59e0b 14%, var(--card, #fff));
    border: 1px solid color-mix(in srgb, #f59e0b 30%, var(--border, #d9e2ef));
    color: color-mix(in srgb, #92400e 84%, var(--text, #111827));
    font-weight: 800;
}

.opening-balances-results {
    position: relative;
}

.opening-balances-results.is-loading::before {
    content: "Loading opening balances...";
    position: absolute;
    right: 14px;
    top: 10px;
    z-index: 4;
    padding: 7px 12px;
    border-radius: 999px;
    color: var(--brand, #714b67);
    background: color-mix(in srgb, var(--brand, #714b67) 10%, var(--card, #fff));
    border: 1px solid color-mix(in srgb, var(--brand, #714b67) 24%, var(--border, #d9e2ef));
    box-shadow: 0 8px 22px rgba(15, 23, 42, .10);
    font-weight: 900;
}

.opening-balances-results.is-loading .opening-balance-table-wrap {
    opacity: .58;
    pointer-events: none;
}

.opening-balances-paging-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    padding: 8px 4px;
}

.opening-balance-table-wrap {
    width: 100%;
    overflow-x: auto;
    border: 1px solid var(--border, #d9e2ef);
    border-radius: 14px;
    background: var(--card, #fff);
    box-shadow: 0 12px 28px rgba(15, 23, 42, .06);
}

.opening-balance-grid {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    table-layout: fixed;
}

.opening-balance-grid thead th {
    height: 38px;
    padding: 8px 10px;
    color: #fff;
    background: var(--list-header, var(--brand, #714b67));
    border-right: 1px solid rgba(255,255,255,.14);
    font-size: 12px;
    text-align: left;
    white-space: nowrap;
}

.opening-balance-grid tbody td {
    height: 42px;
    padding: 7px 10px;
    border-bottom: 1px solid var(--border, #e5e7eb);
    color: var(--text, #111827);
    font-size: 13px;
    vertical-align: middle;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.opening-balance-grid tbody tr:hover {
    background: color-mix(in srgb, var(--brand, #714b67) 7%, transparent);
}

.opening-balance-grid tbody tr.is-saving {
    opacity: .68;
}

.opening-balance-grid tbody tr.just-saved {
    background: rgba(16, 185, 129, .14);
}

.opening-code-col { width: 110px; }
.opening-name-col { width: 310px; }
.opening-group-col { width: 250px; }
.opening-amount-col { width: 125px; text-align: right !important; }

.opening-balance-grid td:nth-child(2) strong,
.opening-balance-grid td:nth-child(2) span {
    display: block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.opening-balance-grid td:nth-child(2) span {
    margin-top: 2px;
    color: var(--muted, #64748b);
    font-size: 11px;
    font-weight: 700;
}

.opening-amount-cell {
    text-align: right;
}

.opening-balance-input {
    width: 100%;
    min-width: 94px;
    height: 31px;
    padding: 5px 8px !important;
    text-align: right;
    font-weight: 850;
    font-variant-numeric: tabular-nums;
}

.opening-balance-input:focus {
    border-color: var(--brand, #714b67) !important;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand, #714b67) 18%, transparent) !important;
}

.opening-balance-input:disabled {
    opacity: .72;
    cursor: not-allowed;
}

body.theme-dark .opening-balances-header-card,
body.theme-midnight .opening-balances-header-card,
body.theme-carbon .opening-balances-header-card,
body.theme-dark .opening-balances-filter-form,
body.theme-midnight .opening-balances-filter-form,
body.theme-carbon .opening-balances-filter-form,
body.theme-dark .opening-balance-table-wrap,
body.theme-midnight .opening-balance-table-wrap,
body.theme-carbon .opening-balance-table-wrap {
    background: var(--card, #0f172a);
    border-color: var(--border, #334155);
}

body.theme-dark .opening-balances-status[data-type="success"],
body.theme-midnight .opening-balances-status[data-type="success"],
body.theme-carbon .opening-balances-status[data-type="success"] {
    color: #86efac;
}

body.theme-dark .opening-balances-status[data-type="error"],
body.theme-midnight .opening-balances-status[data-type="error"],
body.theme-carbon .opening-balances-status[data-type="error"] {
    color: #fecaca;
}

@media (max-width: 1180px) {
    .opening-balances-filter-form {
        grid-template-columns: minmax(160px, .8fr) minmax(220px, 1.2fr) minmax(180px, 1fr) 78px;
    }
    .opening-filter-actions {
        grid-column: 1 / -1;
        justify-content: flex-start;
    }
}

@media (max-width: 760px) {
    .opening-balances-header-card {
        flex-direction: column;
    }
    .opening-balances-status {
        width: 100%;
        max-width: none;
        text-align: left;
    }
    .opening-balances-filter-form {
        grid-template-columns: 1fr;
    }
    .opening-filter-rows .odoo-input {
        width: 100%;
    }
}

/* Journal Voucher advanced entry form (frmJournalVoucher.vb MVC conversion). */
.journal-voucher-shell {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 14px;
}

.journal-command-bar,
.journal-main-card,
.journal-summary-card,
.journal-lines-card,
.journal-notes-card,
.journal-guidance-card,
.journal-open-panel-card {
    background: var(--card, #fff);
    border: 1px solid var(--border, #d8dee9);
    border-radius: 16px;
    box-shadow: 0 12px 28px rgba(15, 23, 42, .06);
}

.journal-command-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 12px;
    position: sticky;
    top: 0;
    z-index: 12;
}

.journal-command-left,
.journal-command-right,
.journal-line-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.journal-command-bar .odoo-save,
.journal-command-bar .odoo-discard,
.journal-line-actions .odoo-discard {
    min-height: 32px;
    padding: 6px 12px;
    border-radius: 10px;
    font-weight: 850;
}

.journal-status-pill {
    min-width: 150px;
    text-align: center;
    border: 1px solid var(--border, #d8dee9);
    border-radius: 999px;
    padding: 7px 12px;
    font-size: 12px;
    font-weight: 900;
    color: var(--text, #111827);
    background: var(--soft, #f8fafc);
}

.journal-status-pill[data-state="balanced"] {
    color: #057a55;
    border-color: rgba(16, 185, 129, .45);
    background: rgba(16, 185, 129, .12);
}

.journal-status-pill[data-state="warning"] {
    color: #b45309;
    border-color: rgba(245, 158, 11, .45);
    background: rgba(245, 158, 11, .12);
}

.journal-alert {
    min-height: 0;
    border-radius: 12px;
    font-weight: 800;
    font-size: 13px;
}

.journal-alert:not(:empty) {
    padding: 10px 12px;
    border: 1px solid var(--border, #d8dee9);
    background: var(--soft, #f8fafc);
}

.journal-alert[data-type="success"] { color: #047857; border-color: rgba(16,185,129,.35); background: rgba(16,185,129,.12); }
.journal-alert[data-type="error"] { color: #b91c1c; border-color: rgba(239,68,68,.35); background: rgba(239,68,68,.10); }
.journal-alert[data-type="info"] { color: var(--brand, #714b67); border-color: color-mix(in srgb, var(--brand, #714b67) 32%, transparent); background: color-mix(in srgb, var(--brand, #714b67) 10%, transparent); }

.journal-header-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 280px;
    gap: 14px;
    align-items: stretch;
}

.journal-main-card,
.journal-summary-card,
.journal-lines-card,
.journal-notes-card,
.journal-guidance-card {
    padding: 14px;
}

.journal-card-title-row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
}

.journal-card-title-row.compact {
    align-items: center;
    margin-bottom: 10px;
}

.journal-kicker {
    display: inline-block;
    margin-bottom: 2px;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--brand, #714b67);
}

.journal-card-title-row h2,
.journal-card-title-row h3 {
    margin: 0;
    color: var(--text, #111827);
    font-weight: 900;
}

.journal-document-chip {
    border-radius: 999px;
    padding: 7px 16px;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .04em;
    color: #fff;
    background: #64748b;
    box-shadow: 0 8px 18px rgba(15, 23, 42, .16);
}

.journal-document-chip.saved { background: var(--brand, #714b67); }
.journal-document-chip.draft { background: #64748b; }

.journal-form-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(150px, 1fr));
    gap: 10px;
}

.journal-field {
    display: flex;
    flex-direction: column;
    gap: 5px;
    min-width: 0;
    color: var(--text, #111827);
    font-weight: 800;
}

.journal-field > span {
    color: var(--muted, #64748b);
    font-size: 12px;
    font-weight: 900;
}

.journal-wide-field {
    margin-top: 10px;
}

.journal-summary-card {
    display: flex;
    flex-direction: column;
    gap: 9px;
}

.journal-summary-line {
    display: flex;
    justify-content: space-between;
    gap: 14px;
    padding-bottom: 8px;
    border-bottom: 1px dashed var(--border, #d8dee9);
    color: var(--muted, #64748b);
    font-size: 12px;
    font-weight: 800;
}

.journal-summary-line strong {
    color: var(--text, #111827);
    font-size: 14px;
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.journal-summary-line.balance strong {
    color: var(--brand, #714b67);
}

.journal-help-text {
    margin: 0;
    font-size: 12px;
    line-height: 1.35;
}

.journal-table-wrap {
    width: 100%;
    overflow-x: auto;
    border: 1px solid var(--border, #d8dee9);
    border-radius: 13px;
}

.journal-entry-table {
    width: 100%;
    min-width: 1280px;
    border-collapse: collapse;
    table-layout: fixed;
    background: var(--card, #fff);
}

.journal-entry-table th {
    height: 36px;
    padding: 7px 8px;
    background: color-mix(in srgb, var(--brand, #714b67) 12%, var(--soft, #f8fafc));
    color: var(--text, #111827);
    border-bottom: 1px solid var(--border, #d8dee9);
    font-size: 12px;
    font-weight: 900;
    white-space: nowrap;
}

.journal-entry-table td {
    height: 42px;
    padding: 5px 6px;
    border-bottom: 1px solid var(--border, #e5e7eb);
    vertical-align: middle;
    background: var(--card, #fff);
}

.journal-entry-table tbody tr:hover td {
    background: color-mix(in srgb, var(--brand, #714b67) 6%, var(--card, #fff));
}

.journal-entry-table tfoot td {
    height: 38px;
    font-weight: 900;
    text-align: right;
    color: var(--text, #111827);
    background: var(--soft, #f8fafc);
}

.journal-entry-table .odoo-input {
    width: 100%;
    min-height: 31px;
    height: 31px;
    padding: 5px 7px;
    font-size: 12px;
    font-weight: 750;
}

.journal-money-input,
.journal-rate-input {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.jv-sno { width: 44px; }
.jv-ledger { width: 250px; }
.jv-balance { width: 110px; }
.jv-narration { width: 260px; }
.jv-amount { width: 118px; }
.jv-cur { width: 92px; }
.jv-rate { width: 84px; }
.jv-store { width: 145px; }
.jv-config { width: 92px; }
.jv-actions { width: 46px; }

.jv-row-no,
.journal-balance-text {
    color: var(--muted, #64748b);
    font-size: 12px;
    font-weight: 900;
    text-align: center;
}

.journal-balance-text {
    display: block;
    text-align: right;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.journal-ledger-lookup {
    position: relative;
    display: grid;
    grid-template-columns: 1fr 30px;
    gap: 4px;
}

.journal-ledger-more {
    height: 31px;
    border-radius: 9px;
}

.journal-ledger-suggestions {
    display: none;
    position: absolute;
    left: 0;
    right: -160px;
    top: calc(100% + 4px);
    z-index: 30;
    max-height: 260px;
    overflow: auto;
    padding: 6px;
    border: 1px solid var(--border, #d8dee9);
    border-radius: 12px;
    background: var(--card, #fff);
    box-shadow: 0 16px 34px rgba(15, 23, 42, .16);
}

.journal-ledger-suggestions.open {
    display: block;
}

.journal-ledger-option {
    width: 100%;
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 3px 8px;
    border: 0;
    border-radius: 10px;
    padding: 8px 9px;
    background: transparent;
    color: var(--text, #111827);
    text-align: left;
    cursor: pointer;
}

.journal-ledger-option:hover,
.journal-ledger-option:focus {
    background: color-mix(in srgb, var(--brand, #714b67) 10%, transparent);
    outline: none;
}

.journal-ledger-option strong {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 13px;
}

.journal-ledger-option span,
.journal-ledger-option small {
    color: var(--muted, #64748b);
    font-size: 11px;
    font-weight: 800;
}

.journal-ledger-option small {
    grid-column: 2;
    grid-row: 1 / span 2;
    align-self: center;
    color: var(--brand, #714b67);
}

.journal-empty-option {
    padding: 14px;
    color: var(--muted, #64748b);
    font-weight: 800;
    text-align: center;
}

.journal-config-btn {
    width: 100%;
    min-height: 28px;
    border: 1px solid color-mix(in srgb, var(--brand, #714b67) 30%, var(--border, #d8dee9));
    border-radius: 999px;
    background: color-mix(in srgb, var(--brand, #714b67) 8%, transparent);
    color: var(--brand, #714b67);
    font-size: 11px;
    font-weight: 900;
    cursor: pointer;
}

.journal-bottom-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 320px;
    gap: 14px;
    margin-top: 14px;
}

.journal-notes-card textarea {
    min-height: 112px;
    resize: vertical;
}

.journal-guidance-card h3 {
    margin: 0 0 10px;
    color: var(--text, #111827);
    font-weight: 900;
}

.journal-check-row {
    position: relative;
    padding: 8px 10px 8px 28px;
    border-radius: 10px;
    color: var(--muted, #64748b);
    font-size: 12px;
    font-weight: 850;
    background: var(--soft, #f8fafc);
    margin-bottom: 8px;
}

.journal-check-row::before {
    content: "•";
    position: absolute;
    left: 11px;
    color: var(--muted, #64748b);
    font-weight: 900;
}

.journal-check-row[data-state="ok"] {
    color: #047857;
    background: rgba(16,185,129,.10);
}

.journal-check-row[data-state="ok"]::before {
    content: "✓";
    color: #059669;
}

.journal-check-row[data-state="warn"] {
    color: #b45309;
    background: rgba(245,158,11,.10);
}

.journal-check-row[data-state="warn"]::before {
    content: "!";
    color: #d97706;
}

.journal-open-panel {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 1000;
    background: rgba(15, 23, 42, .28);
    justify-content: flex-end;
    padding: 14px;
}

.journal-open-panel.open {
    display: flex;
}

.journal-open-panel-card {
    width: min(460px, 96vw);
    max-height: calc(100vh - 28px);
    overflow: auto;
    padding: 14px;
    animation: journalSlideIn .16s ease-out;
}

@keyframes journalSlideIn {
    from { transform: translateX(18px); opacity: .5; }
    to { transform: translateX(0); opacity: 1; }
}

.journal-voucher-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 10px;
}

.journal-voucher-item {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 2px 12px;
    padding: 10px 12px;
    border: 1px solid var(--border, #d8dee9);
    border-radius: 13px;
    background: var(--card, #fff);
    color: var(--text, #111827);
    text-align: left;
    cursor: pointer;
}

.journal-voucher-item:hover {
    border-color: var(--brand, #714b67);
    background: color-mix(in srgb, var(--brand, #714b67) 7%, var(--card, #fff));
}

.journal-voucher-item strong {
    font-size: 14px;
    font-weight: 900;
}

.journal-voucher-item span,
.journal-voucher-item small {
    color: var(--muted, #64748b);
    font-size: 11px;
    font-weight: 800;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.journal-voucher-item b {
    grid-column: 2;
    grid-row: 1 / span 3;
    align-self: center;
    color: var(--brand, #714b67);
    font-variant-numeric: tabular-nums;
}

body.theme-dark .journal-command-bar,
body.theme-midnight .journal-command-bar,
body.theme-carbon .journal-command-bar,
body.theme-dark .journal-main-card,
body.theme-midnight .journal-main-card,
body.theme-carbon .journal-main-card,
body.theme-dark .journal-summary-card,
body.theme-midnight .journal-summary-card,
body.theme-carbon .journal-summary-card,
body.theme-dark .journal-lines-card,
body.theme-midnight .journal-lines-card,
body.theme-carbon .journal-lines-card,
body.theme-dark .journal-notes-card,
body.theme-midnight .journal-notes-card,
body.theme-carbon .journal-notes-card,
body.theme-dark .journal-guidance-card,
body.theme-midnight .journal-guidance-card,
body.theme-carbon .journal-guidance-card,
body.theme-dark .journal-open-panel-card,
body.theme-midnight .journal-open-panel-card,
body.theme-carbon .journal-open-panel-card,
body.theme-dark .journal-entry-table,
body.theme-midnight .journal-entry-table,
body.theme-carbon .journal-entry-table,
body.theme-dark .journal-entry-table td,
body.theme-midnight .journal-entry-table td,
body.theme-carbon .journal-entry-table td,
body.theme-dark .journal-ledger-suggestions,
body.theme-midnight .journal-ledger-suggestions,
body.theme-carbon .journal-ledger-suggestions,
body.theme-dark .journal-voucher-item,
body.theme-midnight .journal-voucher-item,
body.theme-carbon .journal-voucher-item {
    background: var(--card, #0f172a);
    border-color: var(--border, #334155);
}

body.theme-dark .journal-entry-table tfoot td,
body.theme-midnight .journal-entry-table tfoot td,
body.theme-carbon .journal-entry-table tfoot td,
body.theme-dark .journal-check-row,
body.theme-midnight .journal-check-row,
body.theme-carbon .journal-check-row,
body.theme-dark .journal-status-pill,
body.theme-midnight .journal-status-pill,
body.theme-carbon .journal-status-pill {
    background: var(--soft, #111827);
}

@media (max-width: 1180px) {
    .journal-header-grid,
    .journal-bottom-grid {
        grid-template-columns: 1fr;
    }
    .journal-form-grid {
        grid-template-columns: repeat(2, minmax(160px, 1fr));
    }
}

@media (max-width: 760px) {
    .journal-command-bar,
    .journal-card-title-row,
    .journal-card-title-row.compact {
        flex-direction: column;
        align-items: stretch;
    }
    .journal-form-grid {
        grid-template-columns: 1fr;
    }
    .journal-line-actions,
    .journal-command-left,
    .journal-command-right {
        width: 100%;
    }
    .journal-command-bar .odoo-save,
    .journal-command-bar .odoo-discard,
    .journal-line-actions .odoo-discard {
        flex: 1 1 auto;
    }
}

/* Journal Voucher bill-wise configuration modal and theme-aware buttons. */
.journal-theme-btn,
.journal-command-bar .odoo-save,
.journal-command-bar .odoo-discard,
.journal-line-actions .odoo-discard,
.journal-config-btn {
    border: 1px solid color-mix(in srgb, var(--brand, #714b67) 45%, var(--border, #d8dee9));
    border-radius: 10px;
    background: color-mix(in srgb, var(--brand, #714b67) 13%, var(--card, #fff));
    color: var(--brand, #714b67);
    font-weight: 900;
    box-shadow: 0 8px 18px color-mix(in srgb, var(--brand, #714b67) 10%, transparent);
    transition: transform .12s ease, box-shadow .12s ease, background .12s ease, border-color .12s ease;
}

.journal-command-bar .odoo-save,
.journal-theme-btn:not(.secondary):not(.danger) {
    background: var(--brand, #714b67);
    border-color: var(--brand, #714b67);
    color: #fff;
}

.journal-theme-btn.secondary,
.journal-command-bar .odoo-discard,
.journal-line-actions .odoo-discard {
    background: color-mix(in srgb, var(--brand, #714b67) 8%, var(--card, #fff));
    color: var(--text, #111827);
}

.journal-theme-btn.danger {
    background: rgba(239, 68, 68, .10);
    border-color: rgba(239, 68, 68, .38);
    color: #b91c1c;
}

.journal-theme-btn:hover,
.journal-command-bar .odoo-save:hover,
.journal-command-bar .odoo-discard:hover,
.journal-line-actions .odoo-discard:hover,
.journal-config-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 24px color-mix(in srgb, var(--brand, #714b67) 16%, transparent);
}

.journal-theme-btn:disabled,
.journal-command-bar .odoo-save:disabled,
.journal-command-bar .odoo-discard:disabled,
.journal-line-actions .odoo-discard:disabled,
.journal-config-btn:disabled {
    opacity: .55;
    cursor: not-allowed;
    transform: none;
    box-shadow: none;
}

.journal-theme-btn.mini {
    min-height: 26px;
    padding: 4px 9px;
    border-radius: 999px;
    font-size: 11px;
}

.journal-config-btn[data-state="configured"] {
    background: color-mix(in srgb, var(--brand, #714b67) 18%, var(--card, #fff));
    border-color: var(--brand, #714b67);
    color: var(--brand, #714b67);
}

.journal-billwise-modal {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 1100;
    align-items: center;
    justify-content: center;
    padding: 18px;
    background: rgba(15, 23, 42, .34);
    backdrop-filter: blur(2px);
}

.journal-billwise-modal.open {
    display: flex;
}

.journal-billwise-card {
    width: min(1160px, 98vw);
    max-height: min(820px, calc(100vh - 32px));
    overflow: auto;
    background: var(--card, #fff);
    border: 1px solid var(--border, #d8dee9);
    border-radius: 18px;
    padding: 14px;
    box-shadow: 0 24px 60px rgba(15, 23, 42, .22);
}

.journal-billwise-subtitle {
    margin: 3px 0 0;
    font-size: 12px;
    font-weight: 800;
}

.journal-billwise-summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(120px, 1fr)) auto;
    gap: 10px;
    margin-bottom: 12px;
}

.journal-billwise-summary > div,
.journal-billwise-showall {
    display: flex;
    flex-direction: column;
    gap: 3px;
    padding: 9px 10px;
    border: 1px solid var(--border, #d8dee9);
    border-radius: 13px;
    background: color-mix(in srgb, var(--brand, #714b67) 5%, var(--soft, #f8fafc));
}

.journal-billwise-summary span,
.journal-billwise-entry span {
    color: var(--muted, #64748b);
    font-size: 11px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.journal-billwise-summary strong {
    color: var(--text, #111827);
    font-size: 15px;
    font-weight: 950;
    font-variant-numeric: tabular-nums;
}

.journal-billwise-showall {
    justify-content: center;
    color: var(--text, #111827);
    font-size: 12px;
    font-weight: 900;
}

.journal-billwise-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(320px, .9fr);
    gap: 12px;
}

.journal-billwise-panel {
    min-width: 0;
    border: 1px solid var(--border, #d8dee9);
    border-radius: 15px;
    padding: 11px;
    background: var(--card, #fff);
}

.journal-card-title-row.small {
    margin-bottom: 8px;
}

.journal-card-title-row.small h4 {
    margin: 0;
    color: var(--text, #111827);
    font-size: 14px;
    font-weight: 950;
}

.journal-billwise-table-wrap {
    max-height: 360px;
    overflow: auto;
    border: 1px solid var(--border, #d8dee9);
    border-radius: 12px;
}

.journal-billwise-table {
    width: 100%;
    border-collapse: collapse;
    background: var(--card, #fff);
}

.journal-billwise-table th,
.journal-billwise-table td {
    padding: 7px 8px;
    border-bottom: 1px solid var(--border, #e5e7eb);
    color: var(--text, #111827);
    font-size: 12px;
    white-space: nowrap;
}

.journal-billwise-table th {
    position: sticky;
    top: 0;
    z-index: 2;
    background: color-mix(in srgb, var(--brand, #714b67) 12%, var(--soft, #f8fafc));
    font-weight: 950;
}

.journal-billwise-table .num {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.journal-billwise-entry {
    display: grid;
    grid-template-columns: 110px 1fr 120px;
    gap: 9px;
    align-items: end;
}

.journal-billwise-entry label {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.journal-billwise-entry-actions {
    grid-column: 1 / -1;
    display: flex;
    gap: 8px;
    justify-content: flex-end;
}

.journal-billwise-selected-list {
    display: flex;
    flex-direction: column;
    gap: 7px;
    margin-top: 11px;
    max-height: 240px;
    overflow: auto;
}

.journal-billwise-selected-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto 32px;
    gap: 10px;
    align-items: center;
    padding: 8px 9px;
    border: 1px solid var(--border, #d8dee9);
    border-radius: 12px;
    background: color-mix(in srgb, var(--brand, #714b67) 5%, var(--card, #fff));
}

.journal-billwise-selected-row strong,
.journal-billwise-selected-row span {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.journal-billwise-selected-row strong {
    color: var(--text, #111827);
    font-size: 13px;
    font-weight: 950;
}

.journal-billwise-selected-row span {
    color: var(--muted, #64748b);
    font-size: 11px;
    font-weight: 800;
}

.journal-billwise-selected-row b {
    color: var(--brand, #714b67);
    font-variant-numeric: tabular-nums;
}

.journal-billwise-footer {
    display: flex;
    align-items: center;
    gap: 9px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--border, #d8dee9);
}

.journal-billwise-message {
    flex: 1 1 auto;
    font-size: 12px;
    font-weight: 850;
    color: var(--muted, #64748b);
}

.journal-billwise-message[data-type="success"] { color: #047857; }
.journal-billwise-message[data-type="error"] { color: #b91c1c; }

body.theme-dark .journal-billwise-card,
body.theme-midnight .journal-billwise-card,
body.theme-carbon .journal-billwise-card,
body.theme-dark .journal-billwise-panel,
body.theme-midnight .journal-billwise-panel,
body.theme-carbon .journal-billwise-panel,
body.theme-dark .journal-billwise-table,
body.theme-midnight .journal-billwise-table,
body.theme-carbon .journal-billwise-table,
body.theme-dark .journal-billwise-table td,
body.theme-midnight .journal-billwise-table td,
body.theme-carbon .journal-billwise-table td,
body.theme-dark .journal-billwise-selected-row,
body.theme-midnight .journal-billwise-selected-row,
body.theme-carbon .journal-billwise-selected-row {
    background: var(--card, #0f172a);
    border-color: var(--border, #334155);
}

body.theme-dark .journal-billwise-summary > div,
body.theme-midnight .journal-billwise-summary > div,
body.theme-carbon .journal-billwise-summary > div,
body.theme-dark .journal-billwise-showall,
body.theme-midnight .journal-billwise-showall,
body.theme-carbon .journal-billwise-showall,
body.theme-dark .journal-billwise-table th,
body.theme-midnight .journal-billwise-table th,
body.theme-carbon .journal-billwise-table th {
    background: var(--soft, #111827);
}

@media (max-width: 980px) {
    .journal-billwise-summary,
    .journal-billwise-grid {
        grid-template-columns: 1fr;
    }
    .journal-billwise-entry {
        grid-template-columns: 1fr;
    }
    .journal-billwise-footer {
        flex-wrap: wrap;
    }
}


/* Journal Voucher: voucher number is system generated/read-only. */
.journal-voucher-shell .journal-voucher-no-readonly,
.journal-voucher-shell .journal-voucher-no-readonly[readonly] {
    cursor: not-allowed;
    color: var(--muted, #64748b);
    background: color-mix(in srgb, var(--soft, #f8fafc) 86%, var(--card, #fff));
    border-style: dashed;
    font-weight: 900;
    letter-spacing: .02em;
}

.journal-voucher-shell .journal-voucher-no-readonly:focus {
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand, #714b67) 14%, transparent);
}

/* Journal Voucher UI final polish: no internal vertical scrollbars, ledger lookup above grid, themed buttons. */
.journal-voucher-shell .journal-lines-card,
.journal-voucher-shell .journal-table-wrap,
.journal-voucher-shell .journal-ledger-lookup {
    overflow: visible;
}

.journal-voucher-shell .journal-table-wrap {
    overflow-x: visible;
    overflow-y: visible;
}

.journal-voucher-shell .journal-entry-table {
    min-width: 1180px;
}

.journal-voucher-shell .journal-command-bar .odoo-save,
.journal-voucher-shell .journal-command-bar .odoo-discard,
.journal-voucher-shell .journal-line-actions .odoo-discard,
.journal-voucher-shell .journal-theme-btn,
.journal-voucher-shell .journal-config-btn {
    border-color: color-mix(in srgb, var(--brand, #714b67) 32%, var(--border, #d8dee9));
    color: var(--brand, #714b67);
    background: color-mix(in srgb, var(--brand, #714b67) 9%, var(--card, #fff));
    box-shadow: 0 8px 18px color-mix(in srgb, var(--brand, #714b67) 10%, transparent);
}

.journal-voucher-shell .journal-command-bar .odoo-save,
.journal-voucher-shell .journal-theme-btn:not(.secondary):not(.danger) {
    color: #fff;
    background: var(--brand, #714b67);
    border-color: var(--brand, #714b67);
}

.journal-voucher-shell .journal-config-btn {
    min-height: 30px;
    padding: 5px 10px;
    line-height: 1.1;
}

.journal-ledger-suggestions {
    position: fixed;
    right: auto;
    max-height: none;
    overflow: visible;
    z-index: 2147483000;
    padding: 7px;
}

.journal-ledger-show-more {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-top: 6px;
    padding: 9px 10px;
    border: 1px dashed color-mix(in srgb, var(--brand, #714b67) 40%, var(--border, #d8dee9));
    border-radius: 10px;
    color: var(--brand, #714b67);
    background: color-mix(in srgb, var(--brand, #714b67) 7%, var(--card, #fff));
    font-weight: 900;
    cursor: pointer;
}

.journal-ledger-show-more:hover,
.journal-ledger-modal-pick:hover {
    background: color-mix(in srgb, var(--brand, #714b67) 12%, var(--card, #fff));
}

.journal-ledger-modal {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 2147483001;
    align-items: center;
    justify-content: center;
    padding: 18px;
    background: rgba(15, 23, 42, .34);
    backdrop-filter: blur(2px);
}

.journal-ledger-modal.open {
    display: flex;
}

.journal-ledger-modal-card {
    width: min(920px, 96vw);
    max-height: min(760px, calc(100vh - 32px));
    overflow: auto;
    background: var(--card, #fff);
    color: var(--text, #111827);
    border: 1px solid var(--border, #d8dee9);
    border-radius: 18px;
    padding: 14px;
    box-shadow: 0 24px 60px rgba(15, 23, 42, .22);
}

.journal-ledger-modal-head,
.journal-ledger-modal-search {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
}

.journal-ledger-modal-head h3 {
    margin: 0;
    color: var(--text, #111827);
    font-weight: 950;
}

.journal-ledger-modal-head p {
    margin: 4px 0 0;
    font-size: 12px;
    font-weight: 800;
}

.journal-ledger-modal-search {
    align-items: center;
}

.journal-ledger-modal-search .odoo-input {
    flex: 1 1 auto;
    min-height: 38px;
}

.journal-ledger-modal-results {
    border: 1px solid var(--border, #d8dee9);
    border-radius: 14px;
    overflow: hidden;
}

.journal-ledger-modal-table {
    width: 100%;
    border-collapse: collapse;
    background: var(--card, #fff);
}

.journal-ledger-modal-table th,
.journal-ledger-modal-table td {
    padding: 9px 10px;
    border-bottom: 1px solid var(--border, #e5e7eb);
    color: var(--text, #111827);
    font-size: 12px;
    font-weight: 800;
}

.journal-ledger-modal-table th {
    background: color-mix(in srgb, var(--brand, #714b67) 12%, var(--soft, #f8fafc));
    font-weight: 950;
    text-align: left;
}

.journal-ledger-modal-table .num {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.journal-ledger-modal-pick {
    border: 0;
    background: transparent;
    color: var(--brand, #714b67);
    font-weight: 950;
    cursor: pointer;
    text-align: left;
    padding: 4px 0;
}

body.theme-dark .journal-ledger-modal-card,
body.theme-midnight .journal-ledger-modal-card,
body.theme-carbon .journal-ledger-modal-card,
body.theme-dark .journal-ledger-modal-table,
body.theme-midnight .journal-ledger-modal-table,
body.theme-carbon .journal-ledger-modal-table,
body.theme-dark .journal-ledger-suggestions,
body.theme-midnight .journal-ledger-suggestions,
body.theme-carbon .journal-ledger-suggestions {
    background: var(--card, #0f172a);
    border-color: var(--border, #334155);
}

/* POS Sales Source Customer Credit modal button sizing/readability fix. */
.sales-credit-source-actions {
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
}

.sales-credit-source-actions .pos-save-btn,
.sales-credit-source-actions .pos-payment-btn,
.sales-credit-source-actions .pos-orders-secondary {
    width: auto !important;
    min-width: 110px;
    min-height: 42px;
    height: 42px;
    padding: 0 18px !important;
    border-radius: 11px;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    line-height: 1.1;
    font-weight: 900;
    white-space: nowrap;
    flex: 0 0 auto;
}

.sales-credit-source-actions .pos-payment-btn {
    min-width: 160px;
}

.sales-credit-source-actions .pos-orders-secondary {
    min-width: 92px;
    color: var(--text, #111827) !important;
    background: var(--soft, #f8fafc) !important;
    border: 1px solid var(--border, #d8dee9) !important;
}

/* Payroll Employees advanced MVC conversion */
.employee-list-shell,
.employee-form-shell {
    --employee-border: color-mix(in srgb, var(--erp-primary, #008a5b) 22%, transparent);
    --employee-soft: color-mix(in srgb, var(--erp-primary, #008a5b) 10%, var(--erp-surface, #fff));
}
.employee-stat-strip {
    display: flex;
    flex-wrap: wrap;
    gap: .55rem;
    padding: .55rem .75rem;
    border: 1px solid var(--employee-border);
    border-radius: 12px;
    background: var(--employee-soft);
    color: var(--erp-text, #102a24);
    margin: .65rem 0;
}
.employee-stat-strip span {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    padding: .3rem .55rem;
    border: 1px solid var(--employee-border);
    border-radius: 999px;
    background: var(--erp-surface, #fff);
}
.employee-list-table th,
.employee-list-table td {
    white-space: nowrap;
    vertical-align: middle;
}
.employee-kanban-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: .85rem;
    margin-top: .7rem;
}
.employee-card {
    position: relative;
    display: grid;
    grid-template-columns: 74px minmax(0, 1fr);
    gap: .85rem;
    min-height: 150px;
    border: 1px solid var(--employee-border);
    border-radius: 18px;
    padding: .85rem;
    background: var(--erp-card-bg, var(--erp-surface, #fff));
    box-shadow: var(--erp-card-shadow, 0 8px 24px rgba(15, 23, 42, .08));
}
.employee-card.inactive { opacity: .72; }
.employee-card-photo,
.employee-photo-frame {
    width: 74px;
    height: 74px;
    border-radius: 18px;
    overflow: hidden;
    display: grid;
    place-items: center;
    border: 1px solid var(--employee-border);
    background: var(--employee-soft);
    color: var(--erp-primary, #008a5b);
    font-weight: 800;
}
.employee-card-photo img,
.employee-photo-frame img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.employee-avatar-fallback { display: none; place-items: center; width: 100%; height: 100%; }
.employee-card h3 { margin: 0; font-size: 1.02rem; color: var(--erp-text, #102a24); }
.employee-card p { margin: .16rem 0; color: var(--erp-muted, #64748b); }
.employee-card-meta { display: flex; gap: .55rem; flex-wrap: wrap; color: var(--erp-muted, #64748b); font-size: .83rem; }
.employee-card-actions { display: flex; gap: .35rem; flex-wrap: wrap; margin-top: .45rem; }
.employee-sticky-actions {
    position: sticky;
    top: 0;
    z-index: 20;
    background: var(--erp-surface, #fff);
    border-bottom: 1px solid var(--employee-border);
}
.employee-hero-card,
.employee-section-card {
    border: 1px solid var(--employee-border);
    border-radius: 20px;
    background: var(--erp-card-bg, var(--erp-surface, #fff));
    box-shadow: var(--erp-card-shadow, 0 10px 32px rgba(15, 23, 42, .08));
}
.employee-hero-card {
    display: grid;
    grid-template-columns: minmax(170px, 210px) minmax(0, 1fr) minmax(230px, 320px);
    gap: 1rem;
    padding: 1rem;
    margin-top: .85rem;
}
.employee-photo-panel {
    display: grid;
    gap: .55rem;
    align-content: start;
}
.employee-photo-frame {
    width: 142px;
    height: 142px;
    border-radius: 24px;
    font-size: 1.5rem;
    justify-self: center;
}
.employee-main-identity { min-width: 0; }
.employee-save-checklist {
    background: var(--employee-soft);
    border: 1px dashed var(--employee-border);
    border-radius: 16px;
    padding: .9rem;
    color: var(--erp-text, #102a24);
}
.employee-save-checklist h3 { margin: 0 0 .45rem; }
.employee-save-checklist p { margin: .35rem 0; color: var(--erp-muted, #64748b); }
.employee-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .8rem 1rem;
}
.employee-form-grid.four-cols { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.employee-form-grid.two-cols { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.employee-form-grid label,
.employee-checkline {
    display: grid;
    gap: .25rem;
    font-weight: 700;
    color: var(--erp-muted, #64748b);
}
.employee-form-grid label span,
.employee-checkline span,
.small-label { font-size: .76rem; text-transform: uppercase; letter-spacing: .04em; color: var(--erp-muted, #64748b); }
.employee-form-grid .span-2 { grid-column: span 2; }
.employee-checkline {
    align-content: center;
    grid-template-columns: auto 1fr;
    align-items: center;
    gap: .45rem;
    padding-top: 1.05rem;
}
.employee-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: .45rem;
    margin: 1rem 0 .7rem;
}
.employee-tabs button,
.employee-section-title-row .small-action,
.employee-status-toggle {
    border: 1px solid var(--employee-border);
    background: var(--erp-button-bg, var(--erp-surface, #fff));
    color: var(--erp-text, #102a24);
    border-radius: 12px;
    padding: .55rem .8rem;
    font-weight: 800;
    cursor: pointer;
    min-height: 38px;
}
.employee-tabs button.active {
    color: var(--erp-primary-contrast, #fff);
    background: var(--erp-primary, #008a5b);
    border-color: var(--erp-primary, #008a5b);
}
.employee-tab-panel { display: none; }
.employee-tab-panel.active { display: block; }
.employee-section-card { padding: 1rem; margin-bottom: .85rem; }
.employee-section-card h2 { margin: 0 0 .85rem; font-size: 1.05rem; color: var(--erp-text, #102a24); }
.two-column-card-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}
.employee-notes { min-height: 190px; }
.employee-section-title-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    margin-bottom: .6rem;
}
.employee-section-title-row h2 { margin: 0; }
.employee-sub-table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
}
.employee-sub-table th,
.employee-sub-table td {
    border-bottom: 1px solid var(--employee-border);
    padding: .35rem;
    vertical-align: middle;
}
.employee-sub-table th {
    text-align: left;
    color: var(--erp-muted, #64748b);
    background: var(--employee-soft);
}
.employee-attachment-list {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
}
.employee-attachment-list span {
    border: 1px solid var(--employee-border);
    border-radius: 999px;
    padding: .35rem .65rem;
    background: var(--employee-soft);
}
.no-inner-scroll,
.employee-list-shell .table-card,
.employee-form-shell .responsive-grid-card {
    overflow-y: visible !important;
    max-height: none !important;
}
.employee-form-shell textarea.odoo-input { min-height: 86px; resize: vertical; }
.employee-form-shell .odoo-input,
.employee-list-shell .odoo-input {
    background: var(--erp-input-bg, var(--erp-surface, #fff));
    color: var(--erp-input-text, var(--erp-text, #102a24));
    border-color: var(--employee-border);
}

/* Payroll Employees action-column readability fix */
.employee-list-table .employee-actions-col,
.employee-list-table .employee-actions-cell {
    width: 292px !important;
    min-width: 292px !important;
    max-width: 292px !important;
}
.employee-list-table .employee-actions-cell {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
}
.employee-row-actions {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: .5rem;
    flex-wrap: nowrap;
    min-width: 260px;
}
.employee-action-form {
    flex: 0 0 auto;
}
.employee-list-table .employee-action-btn,
.employee-card-actions .employee-action-btn {
    width: auto !important;
    min-width: 78px !important;
    height: 34px !important;
    min-height: 34px !important;
    padding: 0 .8rem !important;
    border-radius: 11px !important;
    font-size: .86rem !important;
    font-weight: 850 !important;
    letter-spacing: 0 !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    text-align: center !important;
    gap: .25rem;
}
.employee-list-table .employee-edit-btn,
.employee-card-actions .employee-edit-btn {
    color: var(--erp-primary, #008a5b) !important;
    background: color-mix(in srgb, var(--erp-primary, #008a5b) 10%, var(--erp-surface, #fff)) !important;
    border-color: color-mix(in srgb, var(--erp-primary, #008a5b) 25%, transparent) !important;
}
.employee-list-table .employee-status-toggle,
.employee-card-actions .employee-status-toggle {
    min-width: 96px !important;
    color: var(--erp-text, #102a24) !important;
    background: var(--erp-surface, #fff) !important;
    border-color: var(--employee-border) !important;
}
.employee-list-table .employee-delete-btn,
.employee-card-actions .employee-delete-btn {
    min-width: 82px !important;
    color: #b91c1c !important;
    background: rgba(254, 226, 226, .82) !important;
    border-color: rgba(220, 38, 38, .26) !important;
}
.employee-list-table .employee-action-btn:hover,
.employee-card-actions .employee-action-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 8px 18px rgba(15, 23, 42, .12);
}
@media (max-width: 900px) {
    .employee-row-actions {
        flex-wrap: wrap;
        min-width: 220px;
    }
    .employee-list-table .employee-actions-col,
    .employee-list-table .employee-actions-cell {
        width: 245px !important;
        min-width: 245px !important;
        max-width: 245px !important;
    }
}
@media (max-width: 1100px) {
    .employee-hero-card { grid-template-columns: 1fr; }
    .employee-form-grid.four-cols { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .two-column-card-grid { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
    .employee-form-grid,
    .employee-form-grid.four-cols,
    .employee-form-grid.two-cols { grid-template-columns: 1fr; }
    .employee-form-grid .span-2 { grid-column: auto; }
    .employee-card { grid-template-columns: 1fr; }
}

/* Payroll Employees Phase 2 child tabs */
.employee-tabs-wrap {
    flex-wrap: wrap;
    row-gap: .45rem;
}
.employee-inline-actions {
    display: flex;
    gap: .45rem;
    flex-wrap: wrap;
    align-items: center;
}
.employee-sub-table.employee-wide-table {
    min-width: 980px;
}
.employee-sub-table .center-cell {
    text-align: center;
    vertical-align: middle;
}
.employee-row-deleted {
    opacity: .35;
}
.employee-upload-label {
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.employee-form-shell .responsive-grid-card.no-inner-scroll {
    overflow-y: visible !important;
    max-height: none !important;
}
.employee-form-shell .responsive-grid-card.no-inner-scroll .employee-sub-table {
    width: 100%;
}
.employee-form-shell .employee-tab-panel .muted {
    color: var(--erp-muted, #64748b);
}

/* Payroll Accounts / Payroll Ledger master converted from PayrollLedgers.vb */
.payroll-ledger-list-shell,
.payroll-ledger-form-shell {
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: 18px;
    box-shadow: 0 18px 46px rgba(15, 23, 42, 0.08);
    overflow: visible;
}

.payroll-ledger-toolbar,
.payroll-ledger-sticky-actions {
    position: sticky;
    top: 0;
    z-index: 25;
    background: color-mix(in srgb, var(--card) 94%, var(--brand) 6%);
    border-bottom: 1px solid var(--border);
}

.payroll-ledger-filter {
    grid-template-columns: minmax(240px, 1.3fr) minmax(180px, 0.9fr) minmax(180px, 0.9fr) minmax(160px, 0.7fr);
}

.payroll-ledger-stat-strip {
    border: 1px solid color-mix(in srgb, var(--brand) 24%, var(--border) 76%);
    border-radius: 14px;
    margin: 12px 0;
    padding: 10px 12px;
    background: color-mix(in srgb, var(--brand) 9%, var(--card) 91%);
}

.payroll-ledger-list-table th,
.payroll-ledger-list-table td {
    white-space: nowrap;
    vertical-align: middle;
}

.payroll-ledger-list-table td:nth-child(2),
.payroll-ledger-list-table td:nth-child(3) {
    white-space: normal;
}

.payroll-ledger-actions-col,
.payroll-ledger-actions-cell {
    width: 300px;
    min-width: 300px;
}

.payroll-ledger-row-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: nowrap;
}

.payroll-ledger-action-form {
    display: inline-flex;
    margin: 0;
}

.payroll-ledger-action-btn {
    min-width: 76px;
    min-height: 34px;
    border: 1px solid color-mix(in srgb, var(--brand) 35%, var(--border) 65%);
    border-radius: 11px;
    padding: 7px 12px;
    font-weight: 800;
    font-size: 13px;
    line-height: 1;
    cursor: pointer;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--text);
    background: color-mix(in srgb, var(--brand) 9%, var(--card) 91%);
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.07);
}

.payroll-ledger-action-btn:hover,
.payroll-ledger-action-btn:focus {
    transform: translateY(-1px);
    color: var(--brand-dark);
    background: color-mix(in srgb, var(--brand) 16%, var(--card) 84%);
}

.payroll-ledger-edit-btn,
.payroll-ledger-add-btn {
    color: #fff;
    background: linear-gradient(135deg, var(--brand), var(--brand-dark));
    border-color: var(--brand-dark);
}

.payroll-ledger-edit-btn:hover,
.payroll-ledger-add-btn:hover,
.payroll-ledger-edit-btn:focus,
.payroll-ledger-add-btn:focus {
    color: #fff;
    filter: brightness(1.04);
}

.payroll-ledger-status-btn {
    background: color-mix(in srgb, var(--brand) 12%, var(--card) 88%);
}

.payroll-ledger-delete-btn {
    border-color: color-mix(in srgb, #ef4444 35%, var(--border) 65%);
    color: #991b1b;
    background: color-mix(in srgb, #ef4444 9%, var(--card) 91%);
}

.payroll-cr-row {
    background: color-mix(in srgb, #f59e0b 9%, var(--card) 91%);
}

.payroll-ledger-kanban-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 14px;
    padding: 12px 0;
}

.payroll-ledger-card {
    border: 1px solid var(--border);
    border-radius: 18px;
    padding: 14px;
    background: var(--card);
    display: grid;
    grid-template-columns: 58px 1fr auto;
    gap: 12px;
    box-shadow: 0 12px 30px rgba(15, 23, 42, 0.08);
}

.payroll-ledger-avatar,
.payroll-ledger-photo-frame {
    display: grid;
    place-items: center;
    border-radius: 18px;
    background: linear-gradient(135deg, color-mix(in srgb, var(--brand) 18%, var(--card) 82%), color-mix(in srgb, var(--brand) 8%, var(--card) 92%));
    color: var(--brand-dark);
    font-weight: 900;
}

.payroll-ledger-avatar { width: 58px; height: 58px; }
.payroll-ledger-card-body h3 { margin: 0 0 4px; font-size: 16px; }
.payroll-ledger-card-body p { margin: 0 0 4px; color: var(--muted); }
.payroll-ledger-card-meta { display: flex; gap: 10px; flex-wrap: wrap; font-weight: 800; }

.payroll-ledger-hero-card {
    display: grid;
    grid-template-columns: 210px minmax(0, 1fr) 280px;
    gap: 16px;
    padding: 18px;
    border: 1px solid var(--border);
    border-radius: 20px;
    background: color-mix(in srgb, var(--brand) 5%, var(--card) 95%);
}

.payroll-ledger-photo-panel,
.payroll-ledger-save-checklist,
.payroll-ledger-section-card {
    border: 1px solid var(--border);
    border-radius: 18px;
    padding: 14px;
    background: var(--card);
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.06);
}

.payroll-ledger-photo-frame {
    width: 140px;
    height: 140px;
    overflow: hidden;
    margin: 0 auto 12px;
    font-size: 34px;
}

.payroll-ledger-photo-frame img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.payroll-ledger-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(180px, 1fr));
    gap: 12px;
}

.payroll-ledger-form-grid.four-cols {
    grid-template-columns: repeat(4, minmax(150px, 1fr));
}

.payroll-ledger-form-grid label,
.payroll-ledger-checkline {
    display: flex;
    flex-direction: column;
    gap: 6px;
    font-weight: 800;
    color: var(--text);
}

.payroll-ledger-form-grid label span,
.payroll-ledger-checkline span {
    color: var(--muted);
    font-size: 12px;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.payroll-ledger-form-grid .span-2 { grid-column: span 2; }
.payroll-ledger-checkline { flex-direction: row; align-items: center; }
.payroll-ledger-checkline input { width: 18px; height: 18px; }

.payroll-ledger-tabs {
    margin: 16px 0 0;
    position: sticky;
    top: 68px;
    z-index: 20;
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: 16px;
    padding: 6px;
}

.payroll-ledger-section-card {
    margin-top: 14px;
}

.payroll-ledger-section-card h2,
.payroll-ledger-save-checklist h3 {
    margin-top: 0;
}

.payroll-ledger-section-title-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}

.payroll-ledger-bill-table-wrap {
    margin-top: 12px;
    overflow-x: auto;
    overflow-y: visible;
}

.payroll-ledger-bill-table th,
.payroll-ledger-bill-table td {
    vertical-align: middle;
}

.payroll-ledger-bill-table .odoo-input {
    min-width: 110px;
}

.payroll-ledger-option-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 12px;
}

.payroll-ledger-option-card {
    border: 1px solid var(--border);
    border-radius: 16px;
    padding: 14px;
    display: flex;
    gap: 12px;
    align-items: flex-start;
    background: color-mix(in srgb, var(--brand) 5%, var(--card) 95%);
}

.payroll-ledger-option-card input { width: 20px; height: 20px; }
.payroll-ledger-option-card small { display: block; color: var(--muted); margin-top: 3px; }
.payroll-ledger-row-actions.align-end { align-self: end; }

.payroll-ledger-form-shell .odoo-input[readonly] {
    background: color-mix(in srgb, var(--muted) 10%, var(--card) 90%);
    color: var(--muted);
    cursor: not-allowed;
}

body.theme-dark .payroll-ledger-list-shell,
body.theme-midnight .payroll-ledger-list-shell,
body.theme-carbon .payroll-ledger-list-shell,
body.theme-dark .payroll-ledger-form-shell,
body.theme-midnight .payroll-ledger-form-shell,
body.theme-carbon .payroll-ledger-form-shell,
body.theme-dark .payroll-ledger-section-card,
body.theme-midnight .payroll-ledger-section-card,
body.theme-carbon .payroll-ledger-section-card,
body.theme-dark .payroll-ledger-photo-panel,
body.theme-midnight .payroll-ledger-photo-panel,
body.theme-carbon .payroll-ledger-photo-panel,
body.theme-dark .payroll-ledger-save-checklist,
body.theme-midnight .payroll-ledger-save-checklist,
body.theme-carbon .payroll-ledger-save-checklist {
    background: var(--card);
    color: var(--text);
}

@media (max-width: 1100px) {
    .payroll-ledger-hero-card { grid-template-columns: 1fr; }
    .payroll-ledger-form-grid.four-cols { grid-template-columns: repeat(2, minmax(150px, 1fr)); }
    .payroll-ledger-actions-col,
    .payroll-ledger-actions-cell { width: 260px; min-width: 260px; }
    .payroll-ledger-row-actions { flex-wrap: wrap; }
}

@media (max-width: 720px) {
    .payroll-ledger-filter,
    .payroll-ledger-form-grid,
    .payroll-ledger-form-grid.four-cols { grid-template-columns: 1fr; }
    .payroll-ledger-form-grid .span-2 { grid-column: span 1; }
    .payroll-ledger-tabs { position: static; }
    .payroll-ledger-section-title-row { align-items: flex-start; flex-direction: column; }
}

/* Payroll Dashboard Phase 1 */
.payroll-dashboard-topbar {
    align-items: flex-start;
    gap: 16px;
}

.erp-breadcrumb {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    color: var(--muted);
    font-size: .88rem;
    margin-bottom: 8px;
}

.erp-breadcrumb a {
    color: var(--brand);
    font-weight: 700;
    text-decoration: none;
}

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

.payroll-dashboard-title h1 {
    margin: 0;
    color: var(--text);
}

.payroll-dashboard-actions-top {
    display: flex;
    align-items: center;
    gap: 12px;
}

.payroll-hero-panel,
.payroll-dashboard-panel,
.payroll-kpi-card {
    background: var(--card);
    border: 1px solid var(--border);
    box-shadow: var(--shadow);
}

.payroll-hero-panel {
    border-radius: 22px;
    padding: 24px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 22px;
    margin-bottom: 18px;
    background: linear-gradient(135deg, color-mix(in srgb, var(--brand) 10%, var(--card)), var(--card));
}

.payroll-hero-kicker {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--brand);
    font-weight: 800;
    letter-spacing: .04em;
    text-transform: uppercase;
    font-size: .78rem;
}

.payroll-hero-left h2 {
    margin: 6px 0 6px;
    font-size: clamp(1.45rem, 2.5vw, 2.35rem);
    color: var(--text);
}

.payroll-hero-left p {
    margin: 0;
    color: var(--muted);
    max-width: 850px;
}

.payroll-hero-buttons {
    margin-top: 18px;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
}

.payroll-primary-action,
.payroll-secondary-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 10px 16px;
    border-radius: 12px;
    font-weight: 800;
    text-decoration: none;
    border: 1px solid var(--border);
}

.payroll-primary-action {
    background: var(--brand);
    color: #fff;
    border-color: var(--brand);
}

.payroll-secondary-action {
    color: var(--brand);
    background: color-mix(in srgb, var(--brand) 8%, var(--card));
}

.payroll-secondary-action.is-muted {
    color: var(--text);
}

.payroll-hero-right {
    display: grid;
    grid-template-columns: auto;
    gap: 10px;
    align-content: center;
    min-width: 220px;
}

.payroll-date-card,
.payroll-mini-status {
    border-radius: 18px;
    border: 1px solid var(--border);
    background: var(--card);
    padding: 14px 16px;
}

.payroll-date-card span,
.payroll-date-card small,
.payroll-mini-status span {
    display: block;
    color: var(--muted);
    font-weight: 700;
}

.payroll-date-card strong {
    display: block;
    color: var(--brand);
    font-size: 2.35rem;
    line-height: 1;
    margin: 4px 0;
}

.payroll-mini-status strong {
    display: block;
    color: var(--text);
    margin-top: 2px;
}

.payroll-mini-status.is-warning {
    border-color: rgba(245, 158, 11, .4);
    background: rgba(245, 158, 11, .09);
}

.payroll-mini-status.is-ok {
    border-color: rgba(16, 185, 129, .35);
    background: rgba(16, 185, 129, .08);
}

.payroll-kpi-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(150px, 1fr));
    gap: 12px;
    margin-bottom: 18px;
}

.payroll-kpi-card {
    border-radius: 18px;
    padding: 16px;
    min-height: 118px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 6px;
}

.payroll-kpi-card span {
    color: var(--muted);
    font-weight: 800;
    font-size: .82rem;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.payroll-kpi-card strong {
    color: var(--text);
    font-size: 1.85rem;
    line-height: 1;
}

.payroll-kpi-card small {
    color: var(--muted);
    font-weight: 650;
}

.payroll-kpi-card.success { border-color: rgba(16, 185, 129, .28); }
.payroll-kpi-card.danger { border-color: rgba(239, 68, 68, .28); }
.payroll-kpi-card.info { border-color: rgba(59, 130, 246, .28); }
.payroll-kpi-card.warning { border-color: rgba(245, 158, 11, .35); }

.payroll-dashboard-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    align-items: start;
}

.payroll-dashboard-panel {
    border-radius: 22px;
    padding: 18px;
    min-width: 0;
}

.payroll-panel-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 14px;
}

.payroll-panel-heading h2 {
    margin: 0;
    color: var(--text);
    font-size: 1.1rem;
}

.payroll-panel-heading p {
    margin: 4px 0 0;
    color: var(--muted);
    font-size: .92rem;
}

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

.payroll-action-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
    min-height: 82px;
    padding: 14px;
    border-radius: 16px;
    border: 1px solid var(--border);
    text-decoration: none;
    color: var(--text);
    background: color-mix(in srgb, var(--card) 92%, var(--brand));
    transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}

.payroll-action-card:hover,
.payroll-action-card:focus-visible {
    transform: translateY(-1px);
    border-color: var(--brand);
    box-shadow: 0 12px 26px rgba(15, 23, 42, .12);
    outline: none;
}

.payroll-action-card.is-planned {
    background: color-mix(in srgb, var(--soft) 74%, var(--card));
}

.payroll-action-card.was-touched {
    border-color: var(--brand);
}

.payroll-action-icon {
    width: 44px;
    height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 14px;
    background: color-mix(in srgb, var(--brand) 12%, var(--card));
    font-size: 1.35rem;
}

.payroll-action-content {
    min-width: 0;
}

.payroll-action-content strong,
.payroll-action-content small {
    display: block;
}

.payroll-action-content strong {
    color: var(--text);
    font-size: 1rem;
}

.payroll-action-content small {
    color: var(--muted);
    margin-top: 3px;
    line-height: 1.35;
}

.payroll-action-card em {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    padding: 6px 10px;
    font-style: normal;
    font-size: .78rem;
    font-weight: 800;
    color: var(--brand);
    background: color-mix(in srgb, var(--brand) 10%, var(--card));
    white-space: nowrap;
}

.payroll-work-list {
    display: grid;
    gap: 10px;
}

.payroll-work-item {
    display: flex;
    justify-content: space-between;
    gap: 14px;
    align-items: center;
    padding: 13px 14px;
    border-radius: 15px;
    border: 1px solid var(--border);
    background: var(--card);
}

.payroll-work-item strong,
.payroll-work-item span {
    display: block;
}

.payroll-work-item strong {
    color: var(--text);
}

.payroll-work-item span {
    color: var(--muted);
    margin-top: 2px;
    line-height: 1.35;
}

.payroll-work-item em {
    font-style: normal;
    font-weight: 850;
    white-space: nowrap;
    border-radius: 999px;
    padding: 6px 10px;
    color: var(--text);
    background: var(--soft);
}

.payroll-work-item.success em { color: #047857; background: rgba(16, 185, 129, .12); }
.payroll-work-item.warning em { color: #92400e; background: rgba(245, 158, 11, .14); }

.payroll-dashboard-footnote {
    display: flex;
    justify-content: space-between;
    gap: 14px;
    align-items: center;
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px solid var(--border);
    color: var(--muted);
}

.payroll-dashboard-footnote strong {
    color: var(--text);
}

@media (max-width: 1280px) {
    .payroll-kpi-grid {
        grid-template-columns: repeat(3, minmax(160px, 1fr));
    }
}

@media (max-width: 980px) {
    .payroll-hero-panel,
    .payroll-dashboard-grid {
        grid-template-columns: 1fr;
    }
    .payroll-hero-right {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 720px) {
    .payroll-dashboard-topbar,
    .payroll-dashboard-actions-top,
    .payroll-panel-heading,
    .payroll-dashboard-footnote {
        align-items: stretch;
        flex-direction: column;
    }
    .payroll-kpi-grid {
        grid-template-columns: 1fr;
    }
    .payroll-hero-right {
        grid-template-columns: 1fr;
    }
    .payroll-action-card {
        grid-template-columns: auto minmax(0, 1fr);
    }
    .payroll-action-card em {
        grid-column: 1 / -1;
        justify-self: start;
    }
}

/* Payroll Attendance Entry - EmpAttendenceEntry.vb conversion */
.attendance-topbar,
.attendance-card-heading,
.attendance-holiday-banner,
.attendance-filter-card,
.attendance-bulk-actions,
.attendance-top-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}

.attendance-filter-card,
.attendance-card,
.attendance-holiday-banner {
    border: 1px solid var(--border);
    background: var(--card);
    border-radius: 20px;
    box-shadow: 0 16px 42px rgba(15, 23, 42, .08);
}

.attendance-filter-card {
    padding: 16px;
    margin: 16px 0;
    flex-wrap: wrap;
}

.attendance-filter-grid {
    display: grid;
    grid-template-columns: minmax(170px, 220px) minmax(220px, 320px) auto;
    gap: 12px;
    align-items: end;
}

.attendance-filter-grid label,
.attendance-time-input-label {
    display: grid;
    gap: 6px;
    color: var(--muted);
    font-weight: 750;
}

.attendance-filter-grid input,
.attendance-filter-grid select,
.attendance-time-input-label input,
.attendance-mini-input {
    border: 1px solid var(--border);
    background: var(--card);
    color: var(--text);
    border-radius: 12px;
    padding: 9px 10px;
    min-height: 40px;
    outline: none;
}

.attendance-filter-grid input:focus,
.attendance-filter-grid select:focus,
.attendance-time-input-label input:focus,
.attendance-mini-input:focus {
    border-color: var(--brand);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand) 16%, transparent);
}

.attendance-filter-actions,
.attendance-bulk-actions,
.attendance-row-actions,
.attendance-time-actions {
    display: flex;
    gap: 8px;
    align-items: center;
    flex-wrap: wrap;
}

.attendance-inline-form {
    display: inline-flex;
    margin: 0;
}

.attendance-btn,
.attendance-row-btn,
.attendance-modal-close {
    border: 1px solid var(--border);
    border-radius: 999px;
    background: var(--soft);
    color: var(--text);
    font-weight: 850;
    text-decoration: none;
    cursor: pointer;
    transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease, background .15s ease;
}

.attendance-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 9px 15px;
}

.attendance-row-btn {
    min-height: 32px;
    padding: 6px 10px;
    font-size: .78rem;
    white-space: nowrap;
}

.attendance-btn:hover,
.attendance-row-btn:hover,
.attendance-modal-close:hover {
    transform: translateY(-1px);
    border-color: var(--brand);
    box-shadow: 0 8px 18px rgba(15, 23, 42, .12);
}

.attendance-btn.primary,
.attendance-row-btn.save {
    background: var(--brand);
    color: var(--on-brand, #fff);
    border-color: var(--brand);
}

.attendance-btn.success,
.attendance-row-btn.success {
    background: rgba(16, 185, 129, .14);
    color: #047857;
    border-color: rgba(16, 185, 129, .32);
}

.attendance-btn.warning {
    background: rgba(245, 158, 11, .15);
    color: #92400e;
    border-color: rgba(245, 158, 11, .34);
}

.attendance-btn.danger,
.attendance-row-btn.danger {
    background: rgba(239, 68, 68, .12);
    color: #b91c1c;
    border-color: rgba(239, 68, 68, .28);
}

.attendance-btn.ghost {
    background: var(--card);
}

.attendance-holiday-banner {
    padding: 14px 16px;
    margin: 16px 0;
    border-color: rgba(245, 158, 11, .34);
    background: color-mix(in srgb, var(--card) 86%, #f59e0b 14%);
}

.attendance-holiday-banner strong,
.attendance-holiday-banner span {
    display: block;
}

.attendance-holiday-banner span {
    color: var(--muted);
    margin-top: 2px;
}

.attendance-kpi-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(130px, 1fr));
    gap: 12px;
    margin: 16px 0;
}

.attendance-kpi-card {
    border: 1px solid var(--border);
    background: var(--card);
    border-radius: 18px;
    padding: 14px;
    min-height: 104px;
    display: grid;
    align-content: center;
    gap: 4px;
    box-shadow: 0 12px 30px rgba(15, 23, 42, .07);
}

.attendance-kpi-card span {
    color: var(--muted);
    font-weight: 750;
}

.attendance-kpi-card strong {
    color: var(--text);
    font-size: 1.8rem;
    line-height: 1;
}

.attendance-kpi-card small {
    color: var(--muted);
}

.attendance-kpi-card.present { border-color: rgba(16, 185, 129, .30); }
.attendance-kpi-card.absent { border-color: rgba(239, 68, 68, .28); }
.attendance-kpi-card.leave { border-color: rgba(99, 102, 241, .28); }
.attendance-kpi-card.warning { border-color: rgba(245, 158, 11, .34); }
.attendance-kpi-card.info { border-color: color-mix(in srgb, var(--brand) 28%, var(--border)); }

.attendance-card {
    padding: 16px;
    margin: 16px 0 28px;
}

.attendance-card-heading {
    margin-bottom: 14px;
}

.attendance-card-heading h2 {
    margin: 0;
    color: var(--text);
}

.attendance-card-heading p {
    margin: 4px 0 0;
    color: var(--muted);
}

.attendance-mode-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    padding: 7px 11px;
    background: color-mix(in srgb, var(--brand) 12%, var(--card));
    color: var(--brand);
    font-weight: 850;
    white-space: nowrap;
}

.attendance-table-shell {
    width: 100%;
    overflow-x: auto;
    overflow-y: visible;
}

.attendance-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0 8px;
    table-layout: auto;
    min-width: 1180px;
}

.attendance-table th {
    color: var(--muted);
    font-size: .78rem;
    text-align: left;
    padding: 4px 8px;
    white-space: nowrap;
}

.attendance-table td {
    background: var(--card);
    border-top: 1px solid var(--border);
    border-bottom: 1px solid var(--border);
    padding: 9px 8px;
    color: var(--text);
    vertical-align: middle;
}

.attendance-table td:first-child {
    border-left: 1px solid var(--border);
    border-radius: 14px 0 0 14px;
    color: var(--muted);
    font-weight: 800;
}

.attendance-table td:last-child {
    border-right: 1px solid var(--border);
    border-radius: 0 14px 14px 0;
}

.attendance-row.present td { border-color: rgba(16, 185, 129, .22); }
.attendance-row.absent td { border-color: rgba(239, 68, 68, .18); }
.attendance-row.leave td { border-color: rgba(99, 102, 241, .22); }

.attendance-table strong,
.attendance-table small {
    display: block;
}

.attendance-table small {
    color: var(--muted);
    margin-top: 2px;
}

.attendance-time-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    padding: 5px 8px;
    background: var(--soft);
    color: var(--text);
    font-weight: 800;
    white-space: nowrap;
}

.attendance-time-chip.actual {
    background: color-mix(in srgb, var(--brand) 10%, var(--card));
    color: var(--brand);
}

.attendance-mini-input {
    width: 74px;
    min-height: 34px;
    padding: 5px 7px;
    text-align: right;
    border-radius: 10px;
}

.attendance-status {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    border: 1px solid var(--border);
    padding: 6px 10px;
    font-weight: 900;
    font-size: .8rem;
    white-space: nowrap;
}

.attendance-status.present { color: #047857; background: rgba(16, 185, 129, .12); border-color: rgba(16, 185, 129, .28); }
.attendance-status.absent { color: #b91c1c; background: rgba(239, 68, 68, .11); border-color: rgba(239, 68, 68, .24); }
.attendance-status.leave { color: #4338ca; background: rgba(99, 102, 241, .12); border-color: rgba(99, 102, 241, .28); }
.attendance-leave-name,
.attendance-locked-note {
    display: block;
    color: var(--muted);
    margin-top: 4px;
    font-size: .78rem;
}

.attendance-row-actions {
    min-width: 210px;
}

.attendance-empty {
    display: grid;
    gap: 4px;
    padding: 24px;
    border: 1px dashed var(--border);
    border-radius: 16px;
    background: var(--soft);
    color: var(--muted);
}

.attendance-empty strong {
    color: var(--text);
}


/* Attendance Entry modal must stay hidden on initial page load.
   The browser hidden attribute can be overridden by module display rules,
   so keep this high-specificity guard. */
.attendance-modal-backdrop[hidden],
.attendance-modal-backdrop.is-hidden {
    display: none !important;
}

.attendance-modal-backdrop {
    position: fixed;
    inset: 0;
    z-index: 9990;
    background: rgba(15, 23, 42, .42);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 18px;
}

.attendance-time-modal {
    width: min(440px, 100%);
    border: 1px solid var(--border);
    border-radius: 22px;
    background: var(--card);
    box-shadow: 0 24px 70px rgba(15, 23, 42, .28);
    padding: 18px;
}

.attendance-time-head {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: flex-start;
    margin-bottom: 16px;
}

.attendance-time-head span,
.attendance-time-head p {
    color: var(--muted);
    margin: 0;
}

.attendance-time-head h3 {
    margin: 2px 0;
    color: var(--text);
}

.attendance-modal-close {
    width: 36px;
    height: 36px;
    font-size: 1.25rem;
}

.attendance-time-actions {
    justify-content: flex-end;
    margin-top: 16px;
}

@media (max-width: 1180px) {
    .attendance-kpi-grid { grid-template-columns: repeat(3, minmax(140px, 1fr)); }
    .attendance-filter-card { align-items: stretch; flex-direction: column; }
}

@media (max-width: 760px) {
    .attendance-topbar,
    .attendance-top-actions,
    .attendance-card-heading,
    .attendance-holiday-banner {
        align-items: stretch;
        flex-direction: column;
    }
    .attendance-filter-grid { grid-template-columns: 1fr; }
    .attendance-kpi-grid { grid-template-columns: 1fr 1fr; }
}

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

/* Payroll Attendance Sheet report */
.attendance-sheet-topbar,
.attendance-sheet-actions-top {
    gap: 0.75rem;
}
.attendance-sheet-title h1 {
    margin: 0.2rem 0 0.15rem;
    color: var(--text);
}
.attendance-sheet-filter-panel,
.attendance-sheet-card,
.attendance-sheet-hero,
.attendance-sheet-kpi-card {
    background: var(--card);
    color: var(--text);
    border: 1px solid var(--border);
    box-shadow: 0 16px 38px rgba(15, 23, 42, 0.06);
}
.attendance-sheet-filter-panel {
    border-radius: 18px;
    padding: 1rem;
    margin: 1rem 0;
}
.attendance-sheet-filter-form {
    display: flex;
    flex-wrap: wrap;
    align-items: end;
    gap: 0.9rem;
}
.attendance-sheet-filter-form label {
    display: grid;
    gap: 0.35rem;
    min-width: 210px;
    font-weight: 800;
    color: var(--muted);
}
.attendance-sheet-filter-form input[type="month"],
.attendance-sheet-filter-form select {
    min-height: 44px;
    border-radius: 12px;
    border: 1px solid var(--border);
    background: var(--card);
    color: var(--text);
    padding: 0.55rem 0.75rem;
    font: inherit;
}
.attendance-sheet-check {
    display: flex !important;
    grid-template-columns: auto 1fr;
    align-items: center;
    min-width: 230px !important;
    min-height: 44px;
    border: 1px dashed var(--border);
    border-radius: 14px;
    padding: 0.55rem 0.75rem;
    background: var(--soft);
}
.attendance-sheet-check input {
    width: 18px;
    height: 18px;
    accent-color: var(--brand);
}
.attendance-sheet-filter-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
    margin-left: auto;
}
.attendance-sheet-primary-btn,
.attendance-sheet-soft-btn {
    border-radius: 13px;
    border: 1px solid var(--border);
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    padding: 0.6rem 1rem;
    font-weight: 900;
    text-decoration: none;
    cursor: pointer;
    transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.attendance-sheet-primary-btn {
    background: var(--brand);
    color: var(--brand-contrast);
    border-color: var(--brand);
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.12);
}
.attendance-sheet-soft-btn {
    background: var(--soft);
    color: var(--text);
}
.attendance-sheet-primary-btn:hover,
.attendance-sheet-soft-btn:hover {
    transform: translateY(-1px);
    border-color: var(--brand);
}
.attendance-sheet-hero {
    border-radius: 20px;
    padding: 1.2rem;
    margin: 1rem 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    overflow: hidden;
    position: relative;
}
.attendance-sheet-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(120deg, color-mix(in srgb, var(--brand) 12%, transparent), transparent 65%);
    pointer-events: none;
}
.attendance-sheet-hero-main,
.attendance-sheet-hero-stat {
    position: relative;
    z-index: 1;
}
.attendance-sheet-hero-main span {
    color: var(--brand);
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
    font-size: .78rem;
}
.attendance-sheet-hero-main h2 {
    margin: 0.25rem 0;
    font-size: clamp(1.8rem, 3vw, 3rem);
    color: var(--text);
}
.attendance-sheet-hero-main p {
    margin: 0;
    color: var(--muted);
    font-weight: 700;
}
.attendance-sheet-hero-stat {
    min-width: 210px;
    border-radius: 18px;
    background: var(--soft);
    border: 1px solid var(--border);
    padding: 1rem;
    text-align: right;
}
.attendance-sheet-hero-stat span,
.attendance-sheet-hero-stat small {
    display: block;
    color: var(--muted);
    font-weight: 800;
}
.attendance-sheet-hero-stat strong {
    display: block;
    color: var(--brand);
    font-size: 2.1rem;
    line-height: 1.1;
}
.attendance-sheet-kpi-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(180px, 1fr));
    gap: 0.9rem;
    margin: 1rem 0;
}
.attendance-sheet-kpi-card {
    border-radius: 18px;
    padding: 1rem;
}
.attendance-sheet-kpi-card span,
.attendance-sheet-kpi-card small {
    display: block;
    color: var(--muted);
    font-weight: 800;
}
.attendance-sheet-kpi-card strong {
    display: block;
    color: var(--text);
    font-size: 2rem;
    line-height: 1.05;
    margin: 0.2rem 0;
}
.attendance-sheet-kpi-card.success strong,
.attendance-total-cell.present,
.attendance-status-badge.present {
    color: var(--success-text, #064e3b);
}
.attendance-sheet-kpi-card.danger strong,
.attendance-total-cell.absent,
.attendance-status-badge.absent {
    color: var(--danger-text, #7f1d1d);
}
.attendance-sheet-kpi-card.warning strong,
.attendance-total-cell.leave,
.attendance-status-badge.leave,
.attendance-status-badge.holiday {
    color: var(--warning-text, #713f12);
}
.attendance-sheet-message {
    border-radius: 14px;
    border: 1px solid var(--border);
    background: var(--soft);
    color: var(--muted);
    padding: 0.85rem 1rem;
    margin: 1rem 0;
    font-weight: 800;
}
.attendance-sheet-card {
    border-radius: 20px;
    padding: 1rem;
    margin: 1rem 0 2rem;
}
.attendance-sheet-card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 0.75rem;
}
.attendance-sheet-card-head h2 {
    margin: 0;
    color: var(--text);
}
.attendance-sheet-card-head p {
    margin: 0.2rem 0 0;
    color: var(--muted);
    font-weight: 700;
}
.attendance-sheet-mode-pill {
    border-radius: 999px;
    background: color-mix(in srgb, var(--brand) 12%, var(--soft));
    color: var(--brand);
    border: 1px solid color-mix(in srgb, var(--brand) 28%, var(--border));
    padding: 0.45rem 0.8rem;
    font-weight: 900;
    white-space: nowrap;
}
.attendance-sheet-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
    margin: 0.75rem 0 1rem;
}
.attendance-legend-item {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    border-radius: 999px;
    border: 1px solid var(--border);
    background: var(--soft);
    color: var(--text);
    padding: 0.35rem 0.65rem;
    font-weight: 800;
    font-size: 0.9rem;
}
.attendance-legend-item em {
    font-style: normal;
    min-width: 28px;
    text-align: center;
    border-radius: 999px;
    padding: 0.15rem 0.35rem;
    background: var(--card);
    border: 1px solid var(--border);
}
.attendance-sheet-scroll {
    width: 100%;
    overflow-x: auto;
    overflow-y: visible;
    border: 1px solid var(--border);
    border-radius: 18px;
}
.attendance-sheet-table {
    width: max-content;
    min-width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    background: var(--card);
    color: var(--text);
}
.attendance-sheet-table th,
.attendance-sheet-table td {
    border-bottom: 1px solid var(--border);
    border-right: 1px solid var(--border);
    padding: 0.55rem;
    white-space: nowrap;
    vertical-align: middle;
}
.attendance-sheet-table thead th {
    position: sticky;
    top: 0;
    z-index: 3;
    background: var(--soft);
    color: var(--muted);
    text-transform: uppercase;
    letter-spacing: .04em;
    font-size: 0.78rem;
}
.attendance-sheet-table .sticky-number {
    position: sticky;
    left: 0;
    z-index: 4;
    background: var(--card);
    min-width: 56px;
    text-align: center;
    font-weight: 900;
}
.attendance-sheet-table thead .sticky-number {
    background: var(--soft);
    z-index: 6;
}
.attendance-sheet-table .sticky-employee {
    position: sticky;
    left: 56px;
    z-index: 4;
    background: var(--card);
    min-width: 220px;
    max-width: 260px;
    white-space: normal;
    box-shadow: 8px 0 14px rgba(15, 23, 42, 0.04);
}
.attendance-sheet-table thead .sticky-employee {
    background: var(--soft);
    z-index: 6;
}
.attendance-sheet-table .sticky-employee strong,
.attendance-sheet-table .sticky-employee small {
    display: block;
}
.attendance-sheet-table .sticky-employee small {
    color: var(--muted);
    margin-top: 0.15rem;
}
.attendance-day-head {
    text-align: center;
    min-width: 54px;
}
.attendance-day-head span,
.attendance-day-head small {
    display: block;
}
.attendance-day-head.today {
    color: var(--brand) !important;
    background: color-mix(in srgb, var(--brand) 10%, var(--soft)) !important;
}
.attendance-day-head.weekend {
    background: color-mix(in srgb, var(--muted) 8%, var(--soft));
}
.attendance-status-cell {
    text-align: center;
    min-width: 54px;
}
.attendance-status-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 34px;
    min-height: 28px;
    border-radius: 10px;
    border: 1px solid var(--border);
    font-weight: 900;
    background: var(--soft);
}
.attendance-status-badge.present,
.attendance-legend-item.present em {
    background: color-mix(in srgb, var(--success, #16a34a) 16%, var(--card));
    border-color: color-mix(in srgb, var(--success, #16a34a) 34%, var(--border));
}
.attendance-status-badge.absent,
.attendance-legend-item.absent em {
    background: color-mix(in srgb, var(--danger, #dc2626) 13%, var(--card));
    border-color: color-mix(in srgb, var(--danger, #dc2626) 34%, var(--border));
}
.attendance-status-badge.leave,
.attendance-legend-item.leave em {
    background: color-mix(in srgb, var(--brand) 13%, var(--card));
    border-color: color-mix(in srgb, var(--brand) 32%, var(--border));
    color: var(--brand);
}
.attendance-status-badge.holiday,
.attendance-legend-item.holiday em {
    background: color-mix(in srgb, var(--warning, #f59e0b) 17%, var(--card));
    border-color: color-mix(in srgb, var(--warning, #f59e0b) 34%, var(--border));
}
.attendance-total-head,
.attendance-total-cell {
    text-align: center;
    min-width: 82px;
    font-weight: 900;
}
.attendance-total-cell.percent {
    color: var(--brand);
}
.attendance-empty-cell {
    text-align: center;
    color: var(--muted);
    font-weight: 800;
    padding: 1.5rem !important;
}
@media (max-width: 1100px) {
    .attendance-sheet-kpi-grid {
        grid-template-columns: repeat(2, minmax(180px, 1fr));
    }
    .attendance-sheet-filter-actions {
        margin-left: 0;
    }
}
@media (max-width: 760px) {
    .attendance-sheet-hero,
    .attendance-sheet-card-head {
        align-items: stretch;
        flex-direction: column;
    }
    .attendance-sheet-hero-stat {
        text-align: left;
        min-width: auto;
    }
    .attendance-sheet-kpi-grid {
        grid-template-columns: 1fr;
    }
    .attendance-sheet-filter-form label,
    .attendance-sheet-filter-actions,
    .attendance-sheet-primary-btn,
    .attendance-sheet-soft-btn {
        width: 100%;
    }
}
@media print {
    .sidebar,
    .topbar .user-panel,
    .attendance-sheet-filter-panel,
    .attendance-sheet-actions-top,
    .erp-notification-slot,
    .app-header,
    .navbar {
        display: none !important;
    }
    .content,
    .main-content,
    body {
        background: #fff !important;
    }
    .attendance-sheet-card,
    .attendance-sheet-hero,
    .attendance-sheet-kpi-card {
        box-shadow: none !important;
        break-inside: avoid;
    }
    .attendance-sheet-scroll {
        overflow: visible !important;
    }
    .attendance-sheet-table {
        width: 100% !important;
        font-size: 10px;
    }
}

/* Attendance Sheet modern monthly matrix refresh */
.attendance-sheet-modern-topbar {
    align-items: flex-start;
}
.attendance-sheet-modern-shell {
    display: block;
    margin: 1rem 0 2rem;
}
.attendance-sheet-modern-toolbar,
.attendance-sheet-filter-drawer,
.attendance-sheet-report-summary,
.attendance-sheet-modern-card {
    background: var(--card);
    border: 1px solid var(--border);
    box-shadow: var(--shadow);
}
.attendance-sheet-modern-toolbar {
    border-radius: 18px;
    padding: 0.85rem;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.65rem;
}
.attendance-sheet-month-nav {
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.45rem;
    margin-right: auto;
}
.attendance-sheet-icon-btn {
    width: 42px;
    min-height: 42px;
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    border: 1px solid var(--border);
    background: var(--soft);
    color: var(--text);
    font-size: 1.35rem;
    font-weight: 1000;
    transition: transform .15s ease, border-color .15s ease, box-shadow .15s ease;
}
.attendance-sheet-icon-btn:hover,
.attendance-filter-toggle:hover,
.attendance-sheet-print-btn:hover,
.attendance-sheet-export-btn:hover {
    transform: translateY(-1px);
    border-color: var(--brand);
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.09);
}
.attendance-sheet-month-picker-wrap {
    margin: 0;
    min-width: 170px;
}
.attendance-sheet-month-picker-wrap input[type="month"] {
    min-height: 42px;
    border-radius: 12px;
    border: 1px solid var(--border);
    background: var(--card);
    color: var(--text);
    font-weight: 900;
    padding: 0.45rem 0.75rem;
}
.attendance-sheet-export-btn,
.attendance-sheet-print-btn {
    border-radius: 13px;
    border: 1px solid var(--border);
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    padding: 0.6rem 1rem;
    font-weight: 1000;
    text-decoration: none;
    cursor: pointer;
    transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.attendance-sheet-export-btn {
    background: var(--brand);
    color: var(--brand-contrast);
    border-color: var(--brand);
}
.attendance-sheet-print-btn {
    background: color-mix(in srgb, var(--brand) 12%, var(--soft));
    color: var(--brand);
}
.attendance-sheet-filter-drawer {
    border-radius: 16px;
    padding: 0.8rem;
    margin-top: 0.75rem;
}
.attendance-sheet-filter-drawer[hidden] {
    display: none !important;
}
.attendance-sheet-filter-form-modern {
    display: flex;
    flex-wrap: wrap;
    align-items: end;
    gap: 0.75rem;
}
.attendance-sheet-report-summary {
    border-radius: 18px;
    padding: 0.75rem;
    display: grid;
    grid-template-columns: repeat(5, minmax(160px, 1fr));
    gap: 0.75rem;
    margin: 0.9rem 0;
}
.attendance-sheet-report-card {
    border-radius: 16px;
    padding: 0.95rem 1rem;
    border: 1px solid var(--border);
    background: var(--soft);
    min-height: 92px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 0.1rem;
}
.attendance-sheet-report-card span,
.attendance-sheet-report-card small {
    color: var(--muted);
    font-weight: 850;
}
.attendance-sheet-report-card strong {
    color: var(--text);
    font-size: 1.7rem;
    line-height: 1.1;
}
.attendance-sheet-report-card.present strong { color: var(--success-text, #047857); }
.attendance-sheet-report-card.absent strong { color: var(--danger-text, #b91c1c); }
.attendance-sheet-report-card.leave strong { color: var(--warning-text, #92400e); }
.attendance-sheet-report-card.range strong { color: var(--brand); }
.attendance-sheet-modern-card {
    border-radius: 20px;
    padding: 1rem;
    margin-top: 1rem;
}
.attendance-sheet-modern-head {
    padding: 0 0.25rem 0.75rem;
}
.attendance-sheet-modern-scroll {
    border-radius: 16px;
    max-width: 100%;
    overflow-x: auto;
    overflow-y: visible;
    scrollbar-width: thin;
}
.attendance-sheet-modern-table {
    font-size: 0.88rem;
}
.attendance-sheet-modern-table th,
.attendance-sheet-modern-table td {
    padding: 0.48rem 0.5rem;
}
.attendance-sheet-modern-table thead th {
    text-align: center;
    vertical-align: middle;
}
.attendance-sheet-week-row th {
    background: color-mix(in srgb, var(--brand) 7%, var(--soft)) !important;
}
.attendance-week-head {
    color: var(--brand) !important;
    font-size: 0.76rem !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    font-weight: 1000;
    border-bottom: 1px solid color-mix(in srgb, var(--brand) 25%, var(--border)) !important;
}
.attendance-sheet-table .attendance-department-col {
    min-width: 150px;
}
.attendance-employee-cell {
    display: flex;
    align-items: center;
    gap: 0.65rem;
}
.attendance-avatar {
    width: 30px;
    height: 30px;
    border-radius: 9px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 30px;
    background: var(--brand);
    color: var(--brand-contrast);
    font-size: 0.8rem;
    font-weight: 1000;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.25);
}
.attendance-employee-text {
    min-width: 0;
}
.attendance-status-badge.present,
.attendance-legend-item.present em {
    color: var(--success-text, #047857);
}
.attendance-status-badge.absent,
.attendance-legend-item.absent em {
    color: var(--danger-text, #b91c1c);
}
.attendance-status-badge.holiday,
.attendance-legend-item.holiday em {
    color: var(--warning-text, #92400e);
}
.attendance-status-badge.leave,
.attendance-legend-item.leave em {
    color: var(--brand);
}
.attendance-total-cell.holiday {
    color: var(--warning-text, #92400e);
}
.attendance-sheet-modern-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    padding-top: 0.9rem;
}
.attendance-sheet-modern-footer .attendance-sheet-legend {
    margin: 0;
}
.attendance-sheet-total-present {
    margin-left: auto;
    display: inline-flex;
    align-items: baseline;
    gap: 0.5rem;
    font-weight: 900;
    color: var(--text);
}
.attendance-sheet-total-present span {
    color: var(--muted);
}
.attendance-sheet-total-present strong {
    font-size: 1.05rem;
}
.attendance-sheet-total-present em {
    color: var(--brand);
    font-style: normal;
}
@media (max-width: 1200px) {
    .attendance-sheet-report-summary {
        grid-template-columns: repeat(3, minmax(160px, 1fr));
    }
}
@media (max-width: 760px) {
    .attendance-sheet-report-summary {
        grid-template-columns: 1fr;
    }
    .attendance-sheet-modern-toolbar,
    .attendance-sheet-month-nav,
    .attendance-sheet-month-picker-wrap,
    .attendance-sheet-month-picker-wrap input[type="month"],
    .attendance-sheet-modern-toolbar .attendance-sheet-soft-btn,
    .attendance-sheet-modern-toolbar .attendance-sheet-primary-btn,
    .attendance-sheet-export-btn,
    .attendance-sheet-print-btn {
        width: 100%;
    }
    .attendance-sheet-icon-btn {
        flex: 1 1 42px;
    }
    .attendance-sheet-total-present {
        width: 100%;
        justify-content: flex-start;
    }
}
@media print {
    .attendance-sheet-modern-toolbar,
    .attendance-sheet-filter-drawer,
    .attendance-sheet-report-summary,
    .attendance-sheet-actions-top,
    .erp-breadcrumb {
        display: none !important;
    }
    .attendance-sheet-modern-card {
        border: none !important;
        padding: 0 !important;
        box-shadow: none !important;
    }
    .attendance-sheet-modern-scroll {
        overflow: visible !important;
        border-radius: 0 !important;
        border: none !important;
    }
    .attendance-sheet-modern-table {
        width: 100% !important;
        font-size: 8px !important;
    }
    .attendance-status-badge {
        min-width: 20px !important;
        min-height: 18px !important;
        border-radius: 4px !important;
    }
}

/* Attendance Sheet exact monthly matrix UI fix - matches approved reference layout */
.attendance-sheet-exact-toolbar {
    position: relative;
    align-items: end;
    gap: 0.75rem;
    padding: 0.9rem 1rem;
}
.attendance-sheet-exact-toolbar .attendance-sheet-month-nav {
    margin-right: 0;
}
.attendance-sheet-toolbar-field {
    display: grid;
    gap: 0.25rem;
    margin: 0;
    color: var(--muted);
    font-weight: 900;
    font-size: 0.82rem;
}
.attendance-sheet-toolbar-field span {
    color: var(--muted);
    font-size: 0.78rem;
    letter-spacing: .02em;
}
.attendance-sheet-toolbar-field select,
.attendance-sheet-toolbar-field input[type="month"] {
    min-height: 42px;
    border-radius: 12px;
    border: 1px solid var(--border);
    background: var(--card);
    color: var(--text);
    padding: 0.45rem 0.75rem;
    font: inherit;
    font-weight: 900;
}
.attendance-sheet-department-filter {
    min-width: 210px;
}
.attendance-sheet-showall-check {
    min-width: 190px !important;
    min-height: 42px;
    margin: 0;
    padding: 0.55rem 0.75rem;
}
.attendance-sheet-modern-card {
    overflow: hidden;
}
.attendance-sheet-modern-head {
    align-items: center;
}
.attendance-sheet-modern-head h2 {
    font-size: clamp(1.35rem, 2vw, 1.8rem);
}
.attendance-sheet-modern-head p {
    font-size: 0.95rem;
}
.attendance-sheet-modern-scroll {
    max-width: 100%;
    overflow-x: auto !important;
    overflow-y: visible !important;
    border: 1px solid color-mix(in srgb, var(--brand) 18%, var(--border));
    border-radius: 16px;
    background: var(--card);
}
.attendance-sheet-exact-table {
    table-layout: fixed;
    width: max-content;
    min-width: max-content;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 0.82rem;
}
.attendance-sheet-exact-table col.attendance-col-number { width: 52px; }
.attendance-sheet-exact-table col.attendance-col-employee { width: 230px; }
.attendance-sheet-exact-table col.attendance-col-department { width: 145px; }
.attendance-sheet-exact-table col.attendance-col-day { width: 48px; }
.attendance-sheet-exact-table col.attendance-col-total { width: 70px; }
.attendance-sheet-exact-table th,
.attendance-sheet-exact-table td {
    padding: 0.48rem 0.42rem;
    height: 46px;
    white-space: nowrap !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
    writing-mode: horizontal-tb !important;
    vertical-align: middle;
}
.attendance-sheet-exact-table thead th {
    height: 50px;
    background: color-mix(in srgb, var(--brand) 8%, var(--card)) !important;
    color: var(--text) !important;
    line-height: 1.15;
    letter-spacing: 0 !important;
    text-transform: none !important;
    font-weight: 1000;
}
.attendance-sheet-exact-table .attendance-week-head {
    height: 40px;
    color: var(--brand) !important;
    background: color-mix(in srgb, var(--brand) 14%, var(--card)) !important;
    border-right: 1px solid color-mix(in srgb, var(--brand) 18%, var(--border)) !important;
}
.attendance-sheet-exact-table .sticky-number {
    position: sticky !important;
    left: 0 !important;
    z-index: 12 !important;
    width: 52px !important;
    min-width: 52px !important;
    max-width: 52px !important;
    text-align: center;
    background: var(--card) !important;
    box-shadow: none;
}
.attendance-sheet-exact-table thead .sticky-number {
    z-index: 18 !important;
    background: color-mix(in srgb, var(--brand) 15%, var(--card)) !important;
}
.attendance-sheet-exact-table .sticky-employee {
    position: sticky !important;
    left: 52px !important;
    z-index: 11 !important;
    width: 230px !important;
    min-width: 230px !important;
    max-width: 230px !important;
    white-space: nowrap !important;
    background: var(--card) !important;
    box-shadow: 8px 0 16px rgba(15, 23, 42, 0.06);
}
.attendance-sheet-exact-table thead .sticky-employee {
    z-index: 17 !important;
    text-align: center;
    background: color-mix(in srgb, var(--brand) 15%, var(--card)) !important;
}
.attendance-sheet-exact-table .attendance-department-col {
    position: sticky !important;
    left: 282px !important;
    z-index: 10 !important;
    width: 145px !important;
    min-width: 145px !important;
    max-width: 145px !important;
    background: var(--card) !important;
    white-space: nowrap !important;
    overflow: hidden;
    text-overflow: ellipsis;
    box-shadow: 8px 0 16px rgba(15, 23, 42, 0.045);
}
.attendance-sheet-exact-table thead .attendance-department-col {
    z-index: 16 !important;
    text-align: center;
    background: color-mix(in srgb, var(--brand) 15%, var(--card)) !important;
}
.attendance-sheet-exact-table .attendance-employee-cell {
    display: flex !important;
    align-items: center;
    gap: 0.55rem;
    white-space: nowrap !important;
}
.attendance-sheet-exact-table .attendance-employee-text {
    display: grid;
    min-width: 0;
    max-width: 165px;
    overflow: hidden;
}
.attendance-sheet-exact-table .attendance-employee-text strong,
.attendance-sheet-exact-table .attendance-employee-text small {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap !important;
    writing-mode: horizontal-tb !important;
}
.attendance-sheet-exact-table .attendance-avatar {
    width: 30px;
    height: 30px;
    flex: 0 0 30px;
    border-radius: 9px;
}
.attendance-sheet-exact-table .attendance-day-head {
    min-width: 48px !important;
    width: 48px !important;
    max-width: 48px !important;
    text-align: center;
    padding: 0.35rem 0.2rem;
}
.attendance-sheet-exact-table .attendance-day-head span,
.attendance-sheet-exact-table .attendance-day-head small {
    display: block;
    line-height: 1.1;
    white-space: nowrap !important;
}
.attendance-sheet-exact-table .attendance-day-head small {
    font-size: 0.66rem;
    color: var(--muted);
    font-weight: 1000;
}
.attendance-sheet-exact-table .attendance-status-cell {
    min-width: 48px !important;
    width: 48px !important;
    text-align: center;
    padding: 0.35rem 0.2rem;
}
.attendance-sheet-exact-table .attendance-status-badge {
    min-width: 28px;
    min-height: 26px;
    height: 26px;
    padding: 0 0.35rem;
    border-radius: 9px;
    font-size: 0.78rem;
    line-height: 1;
}
.attendance-sheet-exact-table .attendance-total-head,
.attendance-sheet-exact-table .attendance-total-cell {
    min-width: 70px !important;
    width: 70px !important;
    max-width: 70px !important;
    text-align: center;
    padding-left: 0.2rem;
    padding-right: 0.2rem;
}
.attendance-sheet-modern-footer {
    border-top: 1px solid var(--border);
    margin-top: 0.85rem;
    padding: 0.85rem 0.15rem 0.05rem;
}
.attendance-sheet-modern-footer .attendance-sheet-legend {
    gap: 0.55rem;
}
.attendance-sheet-modern-footer .attendance-legend-item {
    min-height: 38px;
    padding: 0.4rem 0.7rem;
    border-radius: 999px;
}
.attendance-sheet-total-present {
    font-size: 1rem;
}
@media (max-width: 920px) {
    .attendance-sheet-exact-toolbar,
    .attendance-sheet-exact-toolbar .attendance-sheet-month-nav {
        align-items: stretch;
    }
    .attendance-sheet-department-filter,
    .attendance-sheet-showall-check {
        width: 100%;
    }
}
@media print {
    .attendance-sheet-exact-table {
        table-layout: fixed !important;
        min-width: 100% !important;
        width: 100% !important;
        font-size: 7px !important;
    }
    .attendance-sheet-exact-table th,
    .attendance-sheet-exact-table td {
        height: auto !important;
        padding: 0.12rem !important;
        position: static !important;
        box-shadow: none !important;
    }
    .attendance-sheet-exact-table col.attendance-col-day { width: 2.2%; }
}


/* Attendance Sheet sticky employee/department columns final fix */
.attendance-sheet-modern-scroll {
    position: relative;
    overflow-x: auto !important;
    overflow-y: visible !important;
}
.attendance-sheet-exact-table .sticky-number,
.attendance-sheet-exact-table .sticky-employee,
.attendance-sheet-exact-table .attendance-department-col {
    position: sticky !important;
    background-clip: padding-box !important;
}
.attendance-sheet-exact-table .sticky-number {
    left: 0 !important;
    z-index: 41 !important;
}
.attendance-sheet-exact-table .sticky-employee {
    left: 52px !important;
    z-index: 40 !important;
    width: 230px !important;
    min-width: 230px !important;
    max-width: 230px !important;
    display: table-cell !important;
    overflow: hidden !important;
    text-align: left !important;
    background: var(--card) !important;
    box-shadow: 10px 0 16px rgba(15, 23, 42, 0.08) !important;
}
.attendance-sheet-exact-table thead .sticky-number {
    z-index: 61 !important;
}
.attendance-sheet-exact-table thead .sticky-employee {
    z-index: 60 !important;
    text-align: center !important;
}
.attendance-sheet-exact-table .attendance-department-col {
    left: 282px !important;
    z-index: 39 !important;
    width: 145px !important;
    min-width: 145px !important;
    max-width: 145px !important;
    background: var(--card) !important;
    box-shadow: 10px 0 16px rgba(15, 23, 42, 0.06) !important;
}
.attendance-sheet-exact-table thead .attendance-department-col {
    z-index: 59 !important;
    text-align: center !important;
}
.attendance-sheet-exact-table .attendance-employee-cell {
    display: table-cell !important;
    vertical-align: middle !important;
}
.attendance-sheet-exact-table .attendance-employee-wrap {
    display: flex !important;
    align-items: center !important;
    gap: 0.55rem !important;
    width: 100%;
    min-width: 0;
    white-space: nowrap !important;
    overflow: hidden !important;
}
.attendance-sheet-exact-table .attendance-employee-text {
    min-width: 0 !important;
    max-width: 168px !important;
    overflow: hidden !important;
}
.attendance-sheet-exact-table .attendance-employee-text strong,
.attendance-sheet-exact-table .attendance-employee-text small {
    display: block !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    writing-mode: horizontal-tb !important;
}
.attendance-sheet-exact-table tbody tr:hover .sticky-number,
.attendance-sheet-exact-table tbody tr:hover .sticky-employee,
.attendance-sheet-exact-table tbody tr:hover .attendance-department-col {
    background: color-mix(in srgb, var(--brand) 5%, var(--card)) !important;
}

/* Attendance Entry themed confirmation/leave quick action fixes */
.attendance-time-input-label select,
.attendance-time-input-label textarea {
    border: 1px solid var(--border);
    background: var(--card);
    color: var(--text);
    border-radius: 12px;
    padding: 9px 10px;
    min-height: 40px;
    outline: none;
}

.attendance-time-input-label select:focus,
.attendance-time-input-label textarea:focus {
    border-color: var(--brand);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand) 16%, transparent);
}

.attendance-row-btn.leave-action {
    background: color-mix(in srgb, var(--brand) 12%, var(--card));
    color: var(--brand);
    border-color: color-mix(in srgb, var(--brand) 32%, var(--border));
}

.attendance-leave-modal {
    width: min(520px, 100%);
}

.attendance-leave-help {
    margin: 10px 0 0;
    padding: 10px 12px;
    border: 1px dashed color-mix(in srgb, var(--brand) 30%, var(--border));
    border-radius: 14px;
    background: color-mix(in srgb, var(--brand) 7%, var(--card));
    color: var(--muted);
    font-size: .86rem;
    line-height: 1.45;
}

/* Keep the shared ERP confirmation dialog above Attendance Entry popups. */
.erp-action-modal-backdrop.open {
    z-index: 10080;
}


/* Attendance Sheet: use Leaves.ColorCode for employee leave badges and legend items */
.attendance-status-badge.leave[style],
.attendance-legend-item.leave[style] em {
    color: var(--attendance-leave-text, var(--brand)) !important;
    background: var(--attendance-leave-bg, color-mix(in srgb, var(--brand) 13%, var(--card))) !important;
    border-color: var(--attendance-leave-border, color-mix(in srgb, var(--brand) 32%, var(--border))) !important;
}
.attendance-legend-item.leave[style] {
    border-color: var(--attendance-leave-border, color-mix(in srgb, var(--brand) 26%, var(--border))) !important;
    background: color-mix(in srgb, var(--attendance-leave-color, var(--brand)) 8%, var(--soft)) !important;
}
.attendance-status-badge.leave.leave-al,
.attendance-legend-item.leave.leave-al em {
    /* Annual Leave from Leaves.ColorCode (example: YellowGreen) */
}
.attendance-status-badge.leave.leave-sl,
.attendance-legend-item.leave.leave-sl em {
    /* Sick Leave from Leaves.ColorCode (example: SkyBlue) */
}
.attendance-status-badge.leave.leave-ul,
.attendance-legend-item.leave.leave-ul em {
    /* Undefined/Unpaid Leave from Leaves.ColorCode (example: SandyBrown) */
}

/* Cost Centers Master - advanced MVC conversion */
.cost-center-topbar .breadcrumb-line{font-weight:700;color:var(--erp-muted,#5d6b82);margin-bottom:6px}.cost-center-topbar .breadcrumb-line a{color:var(--erp-primary,#009879);text-decoration:none}.cost-center-topbar .breadcrumb-line span{margin:0 6px;color:var(--erp-muted,#6b7280)}.cost-center-shell{border:1px solid color-mix(in srgb,var(--erp-primary,#009879) 24%,transparent);box-shadow:0 18px 40px rgba(0,0,0,.05)}.cost-center-toolbar{gap:16px;align-items:center}.cost-center-search-form{min-width:min(420px,100%);flex:1}.cost-center-primary-btn{border-radius:10px!important;font-weight:800!important}.cost-center-stat-strip{display:flex;gap:10px;flex-wrap:wrap;margin:12px 0 16px}.cost-center-stat-strip span{background:color-mix(in srgb,var(--erp-primary,#009879) 10%,#fff);border:1px solid color-mix(in srgb,var(--erp-primary,#009879) 28%,transparent);border-radius:999px;padding:8px 14px;color:var(--erp-text,#073b2a)}.cost-center-pager{justify-content:flex-end}.cost-center-table-card,.cost-center-tree-card{overflow:visible;border-radius:16px;border:1px solid color-mix(in srgb,var(--erp-primary,#009879) 18%,transparent);background:var(--erp-card,#fff)}.cost-center-list-table{width:100%;border-collapse:separate;border-spacing:0}.cost-center-list-table th{background:color-mix(in srgb,var(--erp-primary,#009879) 12%,#fff);color:var(--erp-text,#073b2a);font-weight:900;text-transform:uppercase;letter-spacing:.035em;border-bottom:1px solid color-mix(in srgb,var(--erp-primary,#009879) 24%,transparent);white-space:nowrap}.cost-center-list-table td{vertical-align:middle;border-bottom:1px solid rgba(0,0,0,.07)}.cost-center-list-table tr:hover td{background:color-mix(in srgb,var(--erp-primary,#009879) 5%,transparent)}.cost-center-actions-cell{min-width:210px}.cost-center-row-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.cost-center-action-form{display:inline-flex;margin:0}.cost-center-action-btn{border:1px solid color-mix(in srgb,var(--erp-primary,#009879) 30%,transparent);background:color-mix(in srgb,var(--erp-primary,#009879) 9%,#fff);color:var(--erp-primary-dark,#006b54);border-radius:999px;padding:8px 14px;min-width:72px;text-align:center;font-weight:800;text-decoration:none;line-height:1.1;cursor:pointer}.cost-center-action-btn:hover{background:var(--erp-primary,#009879);color:#fff}.cost-center-delete-btn,.cost-center-delete-toolbar-btn{border-color:rgba(220,38,38,.28)!important;background:rgba(254,226,226,.85)!important;color:#991b1b!important}.cost-center-delete-btn:hover,.cost-center-delete-toolbar-btn:hover{background:#dc2626!important;color:#fff!important}.cost-center-usage,.cost-center-child-pill{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:5px 10px;font-weight:800;font-size:.88rem}.cost-center-usage.used{background:rgba(251,191,36,.18);border:1px solid rgba(217,119,6,.28);color:#92400e}.cost-center-usage.free{background:color-mix(in srgb,var(--erp-primary,#009879) 12%,#fff);border:1px solid color-mix(in srgb,var(--erp-primary,#009879) 28%,transparent);color:var(--erp-primary-dark,#006b54)}.cost-center-child-pill{background:rgba(148,163,184,.14);border:1px solid rgba(148,163,184,.28);color:var(--erp-muted,#475569)}.cost-center-tree-title{display:flex;justify-content:space-between;gap:10px;align-items:center;padding:16px 18px;border-bottom:1px solid color-mix(in srgb,var(--erp-primary,#009879) 18%,transparent);font-weight:900;color:var(--erp-text,#073b2a)}.cost-center-tree-title small{font-weight:700;color:var(--erp-muted,#64748b)}.cost-center-tree-name{display:flex;align-items:center;gap:8px;padding-left:calc(var(--level,0) * 24px);white-space:nowrap}.cost-center-tree-icon{display:inline-flex;width:28px;height:28px;align-items:center;justify-content:center;border-radius:10px;background:color-mix(in srgb,var(--erp-primary,#009879) 12%,#fff);color:var(--erp-primary-dark,#006b54);font-weight:900}.cost-center-edit-shell{max-width:1120px;margin:auto}.cost-center-editor-header{border-bottom:1px solid color-mix(in srgb,var(--erp-primary,#009879) 16%,transparent)}.cost-center-large-icon{width:72px;height:72px;border-radius:22px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,color-mix(in srgb,var(--erp-primary,#009879) 22%,#fff),color-mix(in srgb,var(--erp-primary,#009879) 8%,#fff));border:1px solid color-mix(in srgb,var(--erp-primary,#009879) 32%,transparent);font-size:42px;font-weight:900;color:var(--erp-primary-dark,#006b54)}.cost-center-editor-grid{align-items:stretch}.cost-center-editor-grid .odoo-field-group{border:1px solid color-mix(in srgb,var(--erp-primary,#009879) 18%,transparent);border-radius:16px;background:color-mix(in srgb,var(--erp-primary,#009879) 4%,var(--erp-card,#fff));padding:18px}.cost-center-help-card,.cost-center-vb-rules-card ul{margin-top:14px;color:var(--erp-muted,#5b677a)}.cost-center-help-card{border-radius:14px;padding:14px;background:color-mix(in srgb,var(--erp-primary,#009879) 8%,#fff);border:1px dashed color-mix(in srgb,var(--erp-primary,#009879) 28%,transparent)}.cost-center-vb-rules-card ul{padding-left:20px;line-height:1.8}.theme-dark .cost-center-list-table th,.theme-midnight .cost-center-list-table th,.theme-carbon .cost-center-list-table th{background:color-mix(in srgb,var(--erp-primary,#009879) 24%,#111827);color:var(--erp-text,#f8fafc)}.theme-dark .cost-center-table-card,.theme-midnight .cost-center-table-card,.theme-carbon .cost-center-table-card,.theme-dark .cost-center-tree-card,.theme-midnight .cost-center-tree-card,.theme-carbon .cost-center-tree-card{background:var(--erp-card,#111827)}.theme-dark .cost-center-action-btn,.theme-midnight .cost-center-action-btn,.theme-carbon .cost-center-action-btn{background:color-mix(in srgb,var(--erp-primary,#009879) 18%,#111827);color:var(--erp-text,#f8fafc)}@media(max-width:820px){.cost-center-toolbar{align-items:stretch}.cost-center-actions-cell{min-width:180px}.cost-center-list-table{font-size:.92rem}.cost-center-row-actions{gap:6px}.cost-center-action-btn{min-width:64px;padding:7px 10px}.cost-center-tree-title{align-items:flex-start;flex-direction:column}}
@media print{.cost-center-toolbar,.cost-center-pager,.user-panel,.cost-center-row-actions{display:none!important}.cost-center-shell{box-shadow:none!important}.cost-center-table-card,.cost-center-tree-card{border:1px solid #999!important}}

/* Cost Center Categories - Phase 1 */
.cost-category-topbar .breadcrumb-line a{color:var(--erp-primary,#009879)}
.cost-category-shell .cost-center-stat-strip span{background:color-mix(in srgb,var(--erp-primary,#009879) 10%,var(--erp-card,#fff))}
.cost-category-toolbar .odoo-actions{gap:8px;flex-wrap:wrap}
.cost-category-edit-form .cost-center-large-icon{background:linear-gradient(135deg,color-mix(in srgb,var(--erp-primary,#009879) 24%,#fff),color-mix(in srgb,var(--erp-primary,#009879) 7%,#fff))}
.theme-dark .cost-category-edit-form .cost-center-large-icon,.theme-midnight .cost-category-edit-form .cost-center-large-icon,.theme-carbon .cost-category-edit-form .cost-center-large-icon{background:color-mix(in srgb,var(--erp-primary,#009879) 25%,#111827);color:var(--erp-text,#f8fafc)}
@media print{.cost-category-toolbar,.cost-category-shell .country-paging-bar,.cost-category-topbar .user-panel{display:none!important}}


/* Cost Center Categories: active theme buttons + safe view switch tooltips */
.cost-category-toolbar,
.cost-category-shell,
.cost-category-topbar {
    overflow: visible !important;
}
.cost-category-toolbar .odoo-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}
.cost-category-new-btn,
.cost-category-print-btn,
.cost-category-reload-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 40px !important;
    padding: 0 18px !important;
    border-radius: 12px !important;
    border: 1px solid color-mix(in srgb, var(--erp-primary, #009879) 34%, transparent) !important;
    box-shadow: 0 8px 18px rgba(0, 0, 0, .08) !important;
    font-weight: 900 !important;
    letter-spacing: .01em !important;
    text-decoration: none !important;
}
.cost-category-new-btn,
.cost-category-print-btn {
    background: linear-gradient(135deg, var(--erp-primary, #009879), color-mix(in srgb, var(--erp-primary, #009879) 72%, #064e3b)) !important;
    color: #fff !important;
}
.cost-category-reload-btn {
    background: color-mix(in srgb, var(--erp-primary, #009879) 9%, var(--erp-card, #fff)) !important;
    color: var(--erp-primary-dark, #006b54) !important;
}
.cost-category-new-btn:hover,
.cost-category-print-btn:hover,
.cost-category-reload-btn:hover,
.cost-category-new-btn:focus-visible,
.cost-category-print-btn:focus-visible,
.cost-category-reload-btn:focus-visible {
    transform: translateY(-1px);
    box-shadow: 0 12px 24px color-mix(in srgb, var(--erp-primary, #009879) 20%, transparent) !important;
}
.cost-category-view-switch,
.cost-center-view-switch {
    position: relative;
    overflow: visible !important;
    z-index: 20;
}
.cost-category-view-tip {
    position: relative;
    overflow: visible !important;
}
.cost-category-view-tip::after {
    content: attr(data-tooltip);
    position: absolute;
    right: 0;
    top: calc(100% + 8px);
    min-width: max-content;
    max-width: 220px;
    padding: 7px 10px;
    border-radius: 9px;
    background: var(--erp-text, #0f172a);
    color: var(--erp-card, #ffffff);
    border: 1px solid color-mix(in srgb, var(--erp-primary, #009879) 28%, transparent);
    box-shadow: 0 14px 28px rgba(15, 23, 42, .18);
    font-size: .78rem;
    font-weight: 800;
    line-height: 1;
    white-space: nowrap;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(-3px);
    transition: opacity .14s ease, transform .14s ease, visibility .14s ease;
    z-index: 9999;
}
.cost-category-view-tip:hover::after,
.cost-category-view-tip:focus-visible::after {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}
.theme-dark .cost-category-reload-btn,
.theme-midnight .cost-category-reload-btn,
.theme-carbon .cost-category-reload-btn {
    background: color-mix(in srgb, var(--erp-primary, #009879) 18%, #111827) !important;
    color: var(--erp-text, #f8fafc) !important;
}
.theme-dark .cost-category-view-tip::after,
.theme-midnight .cost-category-view-tip::after,
.theme-carbon .cost-category-view-tip::after {
    background: var(--erp-card, #111827);
    color: var(--erp-text, #f8fafc);
}

/* Payroll Employees grid single-row column width/readability fix */
.employee-list-shell .country-table-card,
.employee-list-shell .table-card {
    overflow-x: auto !important;
    overflow-y: visible !important;
    max-height: none !important;
}

.main-area .employee-list-shell .employee-list-table,
.employee-list-shell .employee-list-table {
    table-layout: fixed !important;
    width: 100% !important;
    min-width: 1680px !important;
    max-width: none !important;
    border-collapse: collapse !important;
}

.employee-list-table col.employee-col-id { width: 76px; }
.employee-list-table col.employee-col-name { width: 230px; }
.employee-list-table col.employee-col-gender { width: 88px; }
.employee-list-table col.employee-col-dob { width: 112px; }
.employee-list-table col.employee-col-designation { width: 140px; }
.employee-list-table col.employee-col-department { width: 140px; }
.employee-list-table col.employee-col-address { width: 190px; }
.employee-list-table col.employee-col-contact { width: 130px; }
.employee-list-table col.employee-col-email { width: 190px; }
.employee-list-table col.employee-col-status { width: 110px; }
.employee-list-table col.employee-col-actions { width: 274px; }

.main-area .employee-list-shell .employee-list-table th,
.main-area .employee-list-shell .employee-list-table td,
.employee-list-shell .employee-list-table th,
.employee-list-shell .employee-list-table td {
    display: table-cell !important;
    height: 56px !important;
    min-height: 56px !important;
    max-height: 56px !important;
    padding: .62rem .8rem !important;
    vertical-align: middle !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
    line-height: 1.25 !important;
}

.main-area .employee-list-shell .employee-list-table th,
.employee-list-shell .employee-list-table th {
    height: 48px !important;
    min-height: 48px !important;
    max-height: 48px !important;
    letter-spacing: .045em !important;
    text-align: left !important;
}

.employee-list-shell .employee-list-table tr,
.employee-list-shell .employee-list-table tbody tr,
.employee-list-shell .employee-list-table thead tr {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
}

.employee-list-shell .employee-name-cell strong,
.employee-list-shell .employee-code-text {
    display: inline !important;
    white-space: nowrap !important;
    vertical-align: baseline !important;
}

.employee-list-shell .employee-code-text::before {
    content: " · ";
    color: var(--erp-muted, #64748b);
}

.employee-list-shell .employee-name-cell,
.employee-list-shell .employee-address-cell,
.employee-list-shell .employee-email-cell,
.employee-list-shell .employee-designation-cell,
.employee-list-shell .employee-department-cell {
    min-width: 0 !important;
}

.employee-list-shell .employee-id-cell,
.employee-list-shell .employee-gender-cell,
.employee-list-shell .employee-date-cell,
.employee-list-shell .employee-status-cell,
.employee-list-shell .employee-actions-cell {
    text-align: left !important;
}

.employee-list-shell .employee-status-cell,
.employee-list-shell .employee-actions-cell {
    overflow: visible !important;
    text-overflow: clip !important;
}

.employee-list-table .employee-actions-col,
.employee-list-table .employee-actions-cell {
    width: 274px !important;
    min-width: 274px !important;
    max-width: 274px !important;
}

.employee-list-shell .employee-row-actions {
    min-width: 250px !important;
    max-width: 250px !important;
    gap: .42rem !important;
    flex-wrap: nowrap !important;
    overflow: visible !important;
}

.employee-list-shell .employee-list-table .employee-action-btn {
    min-width: 72px !important;
    height: 32px !important;
    min-height: 32px !important;
    padding: 0 .7rem !important;
}

.employee-list-shell .employee-list-table .employee-status-toggle {
    min-width: 92px !important;
}

.employee-list-shell .employee-list-table .employee-delete-btn {
    min-width: 74px !important;
}

body.theme-dark .employee-list-shell .employee-list-table th,
body.theme-midnight .employee-list-shell .employee-list-table th,
body.theme-carbon .employee-list-shell .employee-list-table th {
    color: var(--erp-text, #e5e7eb) !important;
}

/* Payroll Employees grid final image-aligned layout fix */
.employee-list-shell .table-card.country-table-card {
    overflow-x: auto !important;
    overflow-y: visible !important;
    max-height: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}
.main-area .employee-list-shell .employee-list-table,
.employee-list-shell table.employee-list-table {
    table-layout: fixed !important;
    width: 100% !important;
    min-width: 1420px !important;
    border-collapse: collapse !important;
}
.employee-list-shell .employee-list-table col.employee-col-id { width: 72px !important; }
.employee-list-shell .employee-list-table col.employee-col-name { width: 150px !important; }
.employee-list-shell .employee-list-table col.employee-col-gender { width: 88px !important; }
.employee-list-shell .employee-list-table col.employee-col-dob { width: 110px !important; }
.employee-list-shell .employee-list-table col.employee-col-designation { width: 140px !important; }
.employee-list-shell .employee-list-table col.employee-col-department { width: 135px !important; }
.employee-list-shell .employee-list-table col.employee-col-address { width: 150px !important; }
.employee-list-shell .employee-list-table col.employee-col-contact { width: 130px !important; }
.employee-list-shell .employee-list-table col.employee-col-email { width: 170px !important; }
.employee-list-shell .employee-list-table col.employee-col-status { width: 100px !important; }
.employee-list-shell .employee-list-table col.employee-col-actions { width: 275px !important; }
.main-area .employee-list-shell .employee-list-table thead th,
.employee-list-shell .employee-list-table thead th {
    height: 54px !important;
    min-height: 54px !important;
    max-height: 54px !important;
    padding: .7rem .78rem !important;
    white-space: normal !important;
    word-break: keep-all !important;
    overflow-wrap: normal !important;
    overflow: hidden !important;
    text-overflow: clip !important;
    line-height: 1.15 !important;
    vertical-align: middle !important;
    letter-spacing: .045em !important;
}
.main-area .employee-list-shell .employee-list-table tbody td,
.employee-list-shell .employee-list-table tbody td {
    height: 64px !important;
    min-height: 64px !important;
    max-height: 64px !important;
    padding: .58rem .78rem !important;
    vertical-align: middle !important;
    white-space: nowrap !important;
    word-break: keep-all !important;
    overflow-wrap: normal !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    line-height: 1.18 !important;
}
.employee-list-shell .employee-name-cell {
    white-space: normal !important;
    overflow: hidden !important;
    text-overflow: clip !important;
}
.employee-list-shell .employee-name-cell strong {
    display: block !important;
    max-width: 100% !important;
    font-weight: 900 !important;
    line-height: 1.12 !important;
    white-space: normal !important;
    word-break: keep-all !important;
    overflow-wrap: normal !important;
    overflow: hidden !important;
}
.employee-list-shell .employee-code-text {
    display: block !important;
    margin-top: .08rem !important;
    color: var(--erp-text, #0f172a) !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}
.employee-list-shell .employee-code-text::before { content: "" !important; }
.employee-list-shell .employee-status-cell,
.employee-list-shell .employee-actions-cell {
    overflow: visible !important;
    text-overflow: clip !important;
}
.employee-list-shell .employee-actions-col,
.employee-list-shell .employee-actions-cell {
    width: 275px !important;
    min-width: 275px !important;
    max-width: 275px !important;
}
.employee-list-shell .employee-row-actions,
.employee-list-shell .table-action-group.employee-row-actions {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: .5rem !important;
    flex-wrap: nowrap !important;
    min-width: 255px !important;
    max-width: 255px !important;
    overflow: visible !important;
}
.employee-list-shell .employee-list-table .employee-action-btn,
.employee-list-shell .employee-list-table .employee-edit-btn,
.employee-list-shell .employee-list-table .employee-status-toggle,
.employee-list-shell .employee-list-table .employee-delete-btn {
    height: 32px !important;
    min-height: 32px !important;
    line-height: 30px !important;
    padding: 0 .78rem !important;
    white-space: nowrap !important;
    font-size: .86rem !important;
    font-weight: 850 !important;
}
.employee-list-shell .employee-list-table .employee-edit-btn { min-width: 70px !important; }
.employee-list-shell .employee-list-table .employee-status-toggle { min-width: 96px !important; }
.employee-list-shell .employee-list-table .employee-delete-btn { min-width: 76px !important; }
.employee-list-shell .employee-list-table .status-badge {
    min-width: 62px !important;
    justify-content: center !important;
    white-space: nowrap !important;
}
@media (max-width: 1200px) {
    .main-area .employee-list-shell .employee-list-table,
    .employee-list-shell table.employee-list-table { min-width: 1420px !important; }
}

/* Attendance Sheet salary-by-attendance preview cards */
.attendance-salary-preview-card {
    margin-top: 1rem;
    border: 1px solid color-mix(in srgb, var(--brand) 18%, var(--border));
    background: color-mix(in srgb, var(--card) 92%, var(--brand) 3%);
    border-radius: 20px;
    padding: 1rem;
    box-shadow: 0 18px 40px rgba(15, 23, 42, 0.06);
}
.attendance-salary-preview-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
    flex-wrap: wrap;
    padding: 0.1rem 0.15rem 0.9rem;
    border-bottom: 1px solid var(--border);
    margin-bottom: 1rem;
}
.attendance-salary-preview-head h2 {
    margin: 0;
    color: var(--text);
    font-size: clamp(1.15rem, 1.9vw, 1.55rem);
    font-weight: 1000;
}
.attendance-salary-preview-head p {
    margin: 0.2rem 0 0;
    color: var(--muted);
    font-weight: 750;
}
.attendance-salary-preview-total {
    min-width: 230px;
    border-radius: 16px;
    border: 1px solid color-mix(in srgb, var(--brand) 20%, var(--border));
    background: color-mix(in srgb, var(--brand) 8%, var(--card));
    padding: 0.8rem 1rem;
    display: grid;
    gap: 0.15rem;
    text-align: right;
}
.attendance-salary-preview-total span,
.attendance-salary-preview-total small {
    color: var(--muted);
    font-weight: 850;
}
.attendance-salary-preview-total strong {
    color: var(--brand);
    font-size: 1.6rem;
    line-height: 1;
    font-weight: 1000;
}
.attendance-salary-card-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(230px, 1fr));
    gap: 0.8rem;
}
.attendance-salary-card {
    border: 1px solid var(--border);
    background: var(--card);
    border-radius: 16px;
    padding: 0.95rem 1rem;
    min-height: 158px;
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.045);
    display: grid;
    grid-template-rows: auto auto 1fr;
    gap: 0.7rem;
}
.attendance-salary-card-title {
    display: flex;
    align-items: center;
    gap: 0.7rem;
    min-width: 0;
}
.attendance-salary-avatar {
    width: 34px;
    height: 34px;
    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 34px;
    background: var(--brand);
    color: var(--brand-contrast);
    font-weight: 1000;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.25);
}
.attendance-salary-card-title strong,
.attendance-salary-card-title small {
    display: block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.attendance-salary-card-title strong {
    color: var(--text);
    font-weight: 1000;
}
.attendance-salary-card-title small {
    color: var(--muted);
    font-weight: 750;
    font-size: 0.78rem;
}
.attendance-salary-days {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
}
.attendance-salary-days span {
    border-radius: 999px;
    padding: 0.25rem 0.55rem;
    background: color-mix(in srgb, var(--brand) 8%, var(--soft));
    border: 1px solid color-mix(in srgb, var(--brand) 18%, var(--border));
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 850;
}
.attendance-salary-days b {
    color: var(--text);
    font-weight: 1000;
}
.attendance-salary-amounts {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.45rem;
    align-self: end;
}
.attendance-salary-amounts span {
    border-radius: 12px;
    border: 1px solid var(--border);
    background: color-mix(in srgb, var(--soft) 88%, var(--card));
    padding: 0.45rem 0.55rem;
    min-width: 0;
}
.attendance-salary-amounts em,
.attendance-salary-amounts strong {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.attendance-salary-amounts em {
    color: var(--muted);
    font-style: normal;
    font-size: 0.72rem;
    font-weight: 850;
}
.attendance-salary-amounts strong {
    color: var(--text);
    font-size: 0.92rem;
    font-weight: 1000;
}
.attendance-salary-amounts .payable {
    background: color-mix(in srgb, var(--brand) 10%, var(--card));
    border-color: color-mix(in srgb, var(--brand) 26%, var(--border));
}
.attendance-salary-amounts .payable strong {
    color: var(--brand);
}
@media (max-width: 1320px) {
    .attendance-salary-card-grid { grid-template-columns: repeat(3, minmax(230px, 1fr)); }
}
@media (max-width: 980px) {
    .attendance-salary-card-grid { grid-template-columns: repeat(2, minmax(220px, 1fr)); }
}
@media (max-width: 640px) {
    .attendance-salary-card-grid { grid-template-columns: 1fr; }
    .attendance-salary-preview-total { width: 100%; text-align: left; }
}
@media print {
    .attendance-salary-preview-card {
        break-inside: avoid;
        page-break-inside: avoid;
        box-shadow: none !important;
    }
    .attendance-salary-card-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 0.35rem !important;
    }
    .attendance-salary-card {
        min-height: 0 !important;
        padding: 0.35rem !important;
    }
}

/* Invoice Number Settings advanced UI */
.invoice-settings-shell {
    margin: 14px;
    border: 1px solid var(--erp-border, #c9d8f3);
    background: var(--erp-surface, #fff);
    border-radius: 10px;
    overflow: hidden;
}
.invoice-settings-toolbar {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 14px;
    border-bottom: 1px solid var(--erp-border, #c9d8f3);
    background: var(--erp-panel-bg, #f5f8ff);
}
.invoice-settings-filters {
    display: flex;
    align-items: flex-end;
    gap: 10px;
    flex-wrap: wrap;
}
.invoice-settings-filters label,
.invoice-settings-grid label {
    display: flex;
    flex-direction: column;
    gap: 4px;
    font-size: 12px;
    font-weight: 700;
    color: var(--erp-text, #172b4d);
}
.invoice-settings-filters .invoice-search-label input { min-width: 260px; }
.invoice-settings-status-pill {
    padding: 7px 12px;
    border-radius: 999px;
    background: var(--erp-accent-soft, #e7f0ff);
    color: var(--erp-accent, #0b5ed7);
    font-weight: 800;
    white-space: nowrap;
}
.invoice-settings-layout {
    display: grid;
    grid-template-columns: minmax(260px, 360px) 1fr;
    min-height: 620px;
}
.invoice-settings-list {
    border-right: 1px solid var(--erp-border, #c9d8f3);
    background: var(--erp-bg, #f8fbff);
    padding: 12px;
    overflow: auto;
    max-height: calc(100vh - 220px);
}
.invoice-settings-card {
    display: block;
    color: inherit;
    text-decoration: none;
    padding: 10px;
    margin-bottom: 8px;
    border: 1px solid var(--erp-border, #d5e3fb);
    border-radius: 10px;
    background: var(--erp-surface, #fff);
    box-shadow: 0 2px 6px rgba(14, 49, 93, .05);
}
.invoice-settings-card:hover,
.invoice-settings-card.active {
    border-color: var(--erp-primary, #2f6fed);
    box-shadow: 0 8px 18px rgba(47,111,237,.14);
}
.invoice-card-main {
    display: flex;
    gap: 10px;
    align-items: center;
}
.invoice-card-icon {
    width: 32px;
    height: 32px;
    border-radius: 9px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--erp-primary, #2f6fed);
    color: white;
    font-weight: 900;
}
.invoice-card-main small {
    display: block;
    margin-top: 2px;
    color: var(--erp-muted, #60708c);
}
.invoice-card-preview {
    margin-top: 8px;
    padding: 8px;
    border-radius: 8px;
    background: var(--erp-panel-bg, #f1f6ff);
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-weight: 800;
    word-break: break-word;
}
.invoice-card-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 8px;
}
.invoice-card-meta span {
    font-size: 11px;
    padding: 3px 7px;
    border-radius: 999px;
    background: var(--erp-chip-bg, #eef4ff);
    color: var(--erp-muted, #50617a);
}
.invoice-settings-editor { padding: 18px; }
.invoice-settings-editor-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 16px;
}
.invoice-settings-editor-head h2 { margin: 4px 0; }
.invoice-preview-box {
    min-width: 260px;
    padding: 14px;
    border: 1px solid var(--erp-border, #c9d8f3);
    border-radius: 12px;
    background: linear-gradient(135deg, var(--erp-panel-bg, #eef5ff), var(--erp-surface, #fff));
    box-shadow: 0 8px 20px rgba(14, 49, 93, .08);
}
.invoice-preview-box span {
    display: block;
    font-size: 12px;
    color: var(--erp-muted, #60708c);
    font-weight: 700;
}
.invoice-preview-box strong {
    display: block;
    margin-top: 7px;
    color: var(--erp-primary, #0b5ed7);
    font-size: 24px;
    word-break: break-all;
}
.invoice-settings-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(150px, 1fr));
    gap: 12px;
}
.invoice-settings-grid label:nth-child(5),
.invoice-settings-grid label:nth-child(6) {
    grid-column: span 2;
}
.invoice-token-panel {
    margin-top: 16px;
    padding: 14px;
    border: 1px dashed var(--erp-border, #b8ccec);
    border-radius: 12px;
    background: var(--erp-panel-bg, #f7faff);
}
.invoice-token-panel h3 { margin: 0 0 5px; }
.invoice-token-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 10px;
}
.invoice-token-grid button {
    border: 1px solid var(--erp-border, #b8ccec);
    background: var(--erp-surface, #fff);
    color: var(--erp-primary, #0b5ed7);
    padding: 6px 10px;
    border-radius: 8px;
    font-weight: 800;
    cursor: pointer;
}
.invoice-settings-actions {
    margin-top: 18px;
    display: flex;
    gap: 10px;
}
@media (max-width: 980px) {
    .invoice-settings-layout { grid-template-columns: 1fr; }
    .invoice-settings-list { max-height: none; border-right: 0; border-bottom: 1px solid var(--erp-border, #c9d8f3); }
    .invoice-settings-grid { grid-template-columns: repeat(2, minmax(140px, 1fr)); }
    .invoice-settings-editor-head { flex-direction: column; }
    .invoice-preview-box { width: 100%; }
}
@media (max-width: 640px) {
    .invoice-settings-grid { grid-template-columns: 1fr; }
    .invoice-settings-grid label:nth-child(5),
    .invoice-settings-grid label:nth-child(6) { grid-column: auto; }
    .invoice-settings-toolbar { align-items: stretch; flex-direction: column; }
    .invoice-settings-filters { align-items: stretch; }
}

/* ERP database connectivity guard */
.erp-offline-page {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 32px;
    background: var(--bg, #fff);
    color: var(--text, #0f172a);
    text-align: center;
}

.erp-offline-card {
    max-width: 760px;
    width: 100%;
    padding: 24px;
}

.erp-offline-spinner,
.erp-db-connection-spinner {
    width: 76px;
    height: 76px;
    border-radius: 50%;
    border: 16px solid rgba(15, 23, 42, 0.12);
    border-top-color: var(--brand, #7c4d70);
    margin: 0 auto 24px;
    animation: erp-spin 1.15s linear infinite;
}

.erp-offline-card h1 {
    margin: 0 0 16px;
    font-size: clamp(28px, 4vw, 44px);
    font-weight: 800;
}

.erp-offline-card p {
    margin: 0 auto 16px;
    color: var(--muted, #475569);
    font-size: 16px;
}

.erp-offline-check,
.erp-db-reconnect-button {
    border: 0;
    border-radius: 4px;
    padding: 10px 18px;
    background: var(--brand, #7c4d70);
    color: #fff;
    font-weight: 700;
    cursor: pointer;
    box-shadow: 0 6px 16px rgba(15, 23, 42, 0.15);
}

.erp-offline-check:disabled,
.erp-db-reconnect-button:disabled {
    opacity: 0.65;
    cursor: wait;
}

.erp-offline-small {
    font-size: 13px !important;
    opacity: 0.8;
    margin-top: 12px !important;
}

.erp-db-connection-overlay {
    position: fixed;
    inset: 0;
    z-index: 2147483000;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.88);
    backdrop-filter: blur(3px);
    pointer-events: auto;
}

.erp-db-connection-overlay[hidden] {
    display: none !important;
}

.erp-db-connection-card {
    width: min(520px, calc(100vw - 40px));
    background: var(--card, #fff);
    color: var(--text, #0f172a);
    border: 1px solid var(--border, #dbeafe);
    border-radius: 18px;
    padding: 28px;
    text-align: center;
    box-shadow: 0 26px 70px rgba(15, 23, 42, 0.22);
}

.erp-db-connection-card h2 {
    margin: 0 0 8px;
    font-size: 28px;
    font-weight: 800;
}

.erp-db-connection-card p {
    margin: 0 0 18px;
    color: var(--muted, #475569);
    font-size: 15px;
}

body.erp-db-offline-lock .app-shell,
body.erp-db-offline-lock main {
    filter: grayscale(0.15);
    user-select: none;
}

@keyframes erp-spin {
    to { transform: rotate(360deg); }
}

.theme-dark .erp-db-connection-overlay,
.theme-midnight .erp-db-connection-overlay,
.theme-carbon .erp-db-connection-overlay {
    background: rgba(2, 6, 23, 0.78);
}

/* Touch POS 2 product paging + touch-friendly product scrollbar */
.pos-product-grid {
    scrollbar-gutter: stable;
    scrollbar-width: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
}

.pos-product-grid::-webkit-scrollbar {
    width: 30px;
    height: 30px;
}

.pos-product-grid::-webkit-scrollbar-track {
    background: color-mix(in srgb, var(--soft) 72%, var(--card));
    border-radius: 18px;
    border: 1px solid var(--border);
}

.pos-product-grid::-webkit-scrollbar-thumb {
    background: color-mix(in srgb, var(--brand) 58%, #9ca3af);
    border-radius: 18px;
    border: 6px solid color-mix(in srgb, var(--soft) 72%, var(--card));
    min-height: 72px;
}

.pos-product-grid::-webkit-scrollbar-thumb:hover {
    background: var(--brand-dark);
}

.pos-product-pager {
    flex: 0 0 auto;
    min-height: 54px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 8px 14px;
    border-top: 1px solid var(--border);
    background: color-mix(in srgb, var(--soft) 72%, var(--card));
    color: var(--text);
    font-weight: 800;
}

.pos-product-pager-actions {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.pos-product-pager-actions button {
    min-width: 54px;
    min-height: 46px;
    border-radius: 10px;
    border: 1px solid var(--border);
    background: var(--card);
    color: var(--brand-dark);
    font-size: 30px;
    line-height: 1;
    font-weight: 900;
    cursor: pointer;
    box-shadow: 0 6px 14px rgba(31,41,55,.08);
}

.pos-product-pager-actions button:not(:disabled):hover,
.pos-product-pager-actions button:not(:disabled):focus-visible {
    background: var(--brand);
    color: #fff;
}

.pos-product-pager-actions button:disabled {
    opacity: .45;
    cursor: not-allowed;
    box-shadow: none;
}

#posProductPagerInfo {
    min-width: 132px;
    white-space: nowrap;
}

/* Global main content top spacing fix
   Keep finalized page logic untouched; keep a compact 10px top spacing on all pages/dashboards. */
.main-area {
    padding-top: 10px !important;
}

.pos-sidebar-hidden .main-area {
    padding-top: 10px !important;
}

.main-area > .erp-notification-slot + * {
    margin-top: 0 !important;
}

.dashboard-header,
.payroll-dashboard-topbar,
.multi-level-dashboard,
.one-level-dashboard {
    margin-top: 0 !important;
}

/* The notification bell should float instead of reserving a blank row at the top of every page. */
.main-area > .erp-notification-slot {
    position: fixed;
    top: 12px;
    right: 18px;
    width: auto;
    height: auto;
    min-height: 0;
    margin: 0 !important;
    padding: 0;
    z-index: 900;
}

@media (max-width: 720px) {
    .main-area {
        padding-top: 10px !important;
    }

    .main-area > .erp-notification-slot {
        top: 10px;
        right: 10px;
    }
}

/* Counters master - advanced responsive UI */
.counters-topbar .breadcrumb-line,
.counters-topbar .muted {
    color: var(--muted-text, #6b7280);
}

.counters-shell,
.counters-edit-shell {
    width: 100%;
}

.counters-toolbar,
.counters-form-statusbar {
    gap: 14px;
    flex-wrap: wrap;
}

.counters-actions,
.counters-search-form {
    min-width: 260px;
}

.counters-search-form {
    flex: 1 1 360px;
}

.counters-search-form .odoo-input {
    width: 100%;
    min-height: 42px;
}

.counters-primary-btn,
.counters-secondary-btn,
.counter-action-btn {
    min-height: 38px;
    border-radius: 12px;
}

.counters-stat-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(130px, 1fr));
    gap: 10px;
    margin: 12px 0;
}

.counters-stat-strip span {
    border: 1px solid var(--border-color, #e5e7eb);
    border-radius: 14px;
    padding: 12px 14px;
    background: var(--card-bg, #fff);
    color: var(--text-color, #111827);
}

.counters-card-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 14px;
    margin: 14px 0;
}

.counter-card,
.counter-edit-card {
    border: 1px solid var(--border-color, #e5e7eb);
    border-radius: 18px;
    background: var(--card-bg, #fff);
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.06);
}

.counter-card {
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.counter-card-header {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: flex-start;
}

.counter-card-header h3 {
    margin: 4px 0 0;
    color: var(--text-color, #111827);
    font-size: 1.05rem;
}

.counter-id,
.counter-table-id {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    padding: 4px 9px;
    background: color-mix(in srgb, var(--theme-primary, #2563eb) 12%, transparent);
    color: var(--theme-primary, #2563eb);
    font-weight: 700;
    font-size: 0.82rem;
}

.counter-status-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    padding: 6px 10px;
    font-size: 0.78rem;
    font-weight: 700;
    white-space: nowrap;
}

.counter-status-pill.small {
    padding: 4px 8px;
}

.counter-status-pill.is-free {
    background: rgba(16, 185, 129, 0.12);
    color: #047857;
}

.counter-status-pill.is-used {
    background: rgba(245, 158, 11, 0.15);
    color: #92400e;
}

.counter-card-body {
    display: grid;
    gap: 8px;
}

.counter-info-line {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    border-bottom: 1px dashed var(--border-color, #e5e7eb);
    padding-bottom: 8px;
}

.counter-info-line:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.counter-info-line span {
    color: var(--muted-text, #6b7280);
}

.counter-info-line strong {
    color: var(--text-color, #111827);
    text-align: right;
}

.counter-card-actions,
.counter-row-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}

.counter-action-btn {
    border: 1px solid var(--border-color, #d1d5db);
    background: var(--button-bg, #fff);
    color: var(--text-color, #111827);
    padding: 8px 14px;
    text-decoration: none;
    font-weight: 700;
    cursor: pointer;
}

.counter-action-btn:hover,
.counter-action-btn:focus {
    border-color: var(--theme-primary, #2563eb);
    color: var(--theme-primary, #2563eb);
}

.counter-action-btn.compact {
    min-height: 32px;
    padding: 6px 10px;
}

.counter-action-btn.danger,
.odoo-save.danger {
    border-color: rgba(220, 38, 38, 0.35);
    color: #b91c1c;
    background: rgba(220, 38, 38, 0.08);
}

.counter-action-btn.disabled,
.counter-action-btn:disabled {
    opacity: 0.45;
    cursor: not-allowed;
    pointer-events: none;
}

.counters-table-wrap {
    overflow-x: auto;
    margin-top: 16px;
    border-radius: 16px;
}

.counters-table {
    min-width: 860px;
}

.counters-table .actions-col {
    width: 170px;
    text-align: right;
}

.counter-edit-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(260px, 360px);
    gap: 16px;
    padding: 16px;
}

.counter-edit-card {
    padding: 18px;
}

.counter-edit-card-title {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: baseline;
    margin-bottom: 16px;
    color: var(--text-color, #111827);
}

.counter-edit-card-title span {
    font-size: 1.05rem;
    font-weight: 800;
}

.counter-edit-card-title small,
.counter-edit-summary,
.counter-system-list span {
    color: var(--muted-text, #6b7280);
}

.counter-edit-summary {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    font-size: 0.9rem;
}

.counter-edit-summary span {
    border-radius: 999px;
    border: 1px solid var(--border-color, #e5e7eb);
    padding: 6px 10px;
    background: var(--card-bg, #fff);
}

.counter-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(220px, 1fr));
    gap: 14px;
}

.counter-field {
    display: grid;
    gap: 7px;
}

.counter-field > span:first-child {
    font-weight: 700;
    color: var(--text-color, #111827);
}

.counter-field-wide {
    grid-column: 1 / -1;
}

.counter-system-list {
    display: grid;
    gap: 12px;
    padding: 0;
    margin: 0;
    list-style: none;
}

.counter-system-list li {
    display: grid;
    gap: 4px;
    border-left: 3px solid var(--theme-primary, #2563eb);
    padding-left: 12px;
}

.counters-delete-modal.is-hidden {
    display: none !important;
}

.counters-delete-modal {
    display: flex;
    align-items: center;
    justify-content: center;
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.45);
    z-index: 1200;
    padding: 16px;
}

.counters-delete-card {
    width: min(520px, 100%);
    background: var(--card-bg, #fff);
    border-radius: 18px;
    border: 1px solid var(--border-color, #e5e7eb);
    overflow: hidden;
}

.counters-delete-card .erp-modal-header,
.counters-delete-card .erp-modal-body,
.counters-delete-card .erp-modal-actions {
    padding: 16px 18px;
}

.counters-delete-card .erp-modal-header,
.counters-delete-card .erp-modal-actions {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    align-items: center;
}

.counters-empty-state {
    grid-column: 1 / -1;
}

@media (max-width: 980px) {
    .counters-stat-strip {
        grid-template-columns: repeat(2, minmax(130px, 1fr));
    }
    .counter-edit-layout {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    .counters-stat-strip,
    .counter-form-grid {
        grid-template-columns: 1fr;
    }
    .counter-card-header,
    .counter-info-line,
    .counter-edit-card-title {
        flex-direction: column;
        align-items: flex-start;
    }
    .counter-info-line strong {
        text-align: left;
    }
}

/* User Management - advanced responsive UI */
.usermgmt-topbar .breadcrumb-line,
.usermgmt-topbar .muted {
    color: var(--muted-text, #6b7280);
}

.usermgmt-shell,
.usermgmt-edit-shell {
    width: 100%;
}

.usermgmt-toolbar,
.usermgmt-form-statusbar {
    gap: 14px;
    flex-wrap: wrap;
}

.usermgmt-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.usermgmt-primary-btn,
.usermgmt-secondary-btn,
.usermgmt-action-btn {
    min-height: 38px;
    border-radius: 12px;
}

.usermgmt-filter-form {
    flex: 1 1 680px;
    display: grid;
    grid-template-columns: minmax(240px, 1.6fr) minmax(150px, .8fr) minmax(150px, .8fr) minmax(115px, .55fr) minmax(115px, .55fr);
    gap: 8px;
    align-items: center;
}

.usermgmt-search,
.usermgmt-select {
    width: 100%;
    min-height: 42px;
}

.usermgmt-stat-strip {
    display: grid;
    grid-template-columns: repeat(6, minmax(120px, 1fr));
    gap: 10px;
    margin: 12px 0;
}

.usermgmt-stat-strip span {
    border: 1px solid var(--border-color, #e5e7eb);
    border-radius: 14px;
    padding: 12px 14px;
    background: var(--card-bg, #fff);
    color: var(--text-color, #111827);
}

.usermgmt-stat-strip strong {
    display: block;
    font-size: 1.2rem;
    color: var(--theme-primary, #2563eb);
}

.usermgmt-card-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 14px;
    margin: 14px 0;
}

.usermgmt-card,
.usermgmt-edit-card,
.usermgmt-profile-card,
.usermgmt-system-card {
    border: 1px solid var(--border-color, #e5e7eb);
    border-radius: 18px;
    background: var(--card-bg, #fff);
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.06);
}

.usermgmt-card {
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.usermgmt-card-head {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 12px;
}

.usermgmt-avatar,
.usermgmt-profile-avatar {
    display: grid;
    place-items: center;
    border-radius: 16px;
    background: color-mix(in srgb, var(--theme-primary, #2563eb) 14%, transparent);
    color: var(--theme-primary, #2563eb);
    font-weight: 900;
    letter-spacing: .04em;
}

.usermgmt-avatar {
    width: 46px;
    height: 46px;
}

.usermgmt-card-head h3 {
    margin: 0;
    color: var(--text-color, #111827);
    font-size: 1.05rem;
}

.usermgmt-card-head span:not(.usermgmt-pill) {
    color: var(--muted-text, #6b7280);
    font-size: .85rem;
}

.usermgmt-card-body {
    display: grid;
    gap: 8px;
}

.usermgmt-card-body div {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding-bottom: 8px;
    border-bottom: 1px dashed var(--border-color, #e5e7eb);
}

.usermgmt-card-body div:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.usermgmt-card-body span {
    color: var(--muted-text, #6b7280);
}

.usermgmt-card-body strong {
    color: var(--text-color, #111827);
    text-align: right;
    word-break: break-word;
}

.usermgmt-pill,
.usermgmt-code-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    padding: 6px 10px;
    font-size: .78rem;
    font-weight: 800;
    white-space: nowrap;
}

.usermgmt-pill.small {
    padding: 4px 8px;
}

.usermgmt-pill.active {
    background: rgba(16, 185, 129, 0.12);
    color: #047857;
}

.usermgmt-pill.inactive {
    background: rgba(239, 68, 68, 0.12);
    color: #b91c1c;
}

.usermgmt-code-pill {
    background: color-mix(in srgb, var(--theme-primary, #2563eb) 12%, transparent);
    color: var(--theme-primary, #2563eb);
}

.usermgmt-card-actions,
.usermgmt-row-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}

.usermgmt-card-actions form,
.usermgmt-row-actions form {
    margin: 0;
}

.usermgmt-action-btn {
    border: 1px solid var(--border-color, #e5e7eb);
    background: var(--card-bg, #fff);
    color: var(--text-color, #111827);
    padding: 8px 12px;
    font-weight: 800;
    text-decoration: none;
    cursor: pointer;
}

.usermgmt-action-btn:hover,
.usermgmt-action-btn:focus-visible {
    background: color-mix(in srgb, var(--theme-primary, #2563eb) 10%, var(--card-bg, #fff));
    color: var(--theme-primary, #2563eb);
}

.usermgmt-action-btn.compact {
    padding: 6px 10px;
    font-size: .82rem;
    min-height: 32px;
}

.usermgmt-action-btn.warning {
    background: rgba(245, 158, 11, .12);
    color: #92400e;
}

.usermgmt-action-btn.success {
    background: rgba(16, 185, 129, .12);
    color: #047857;
}

.usermgmt-action-btn.danger,
.usermgmt-delete-card .odoo-save.danger {
    background: rgba(239, 68, 68, .12);
    color: #b91c1c;
}

.usermgmt-table-wrap {
    overflow-x: auto;
    border: 1px solid var(--border-color, #e5e7eb);
    border-radius: 16px;
    background: var(--card-bg, #fff);
}

.usermgmt-table {
    min-width: 1080px;
}

.usermgmt-table .actions-col {
    min-width: 240px;
}

.usermgmt-edit-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 340px);
    gap: 16px;
    align-items: start;
}

.usermgmt-edit-main {
    display: grid;
    gap: 16px;
}

.usermgmt-edit-card {
    padding: 18px;
}

.usermgmt-edit-card-title {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: flex-start;
    margin-bottom: 14px;
    border-bottom: 1px solid var(--border-color, #e5e7eb);
    padding-bottom: 10px;
}

.usermgmt-edit-card-title span {
    font-weight: 900;
    color: var(--text-color, #111827);
}

.usermgmt-edit-card-title small,
.usermgmt-edit-summary,
.usermgmt-system-card span,
.field-hint {
    color: var(--muted-text, #6b7280);
}

.usermgmt-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(220px, 1fr));
    gap: 14px;
}

.usermgmt-field-wide {
    grid-column: 1 / -1;
}

.usermgmt-field .odoo-input,
.usermgmt-form-grid .odoo-input {
    width: 100%;
    min-height: 42px;
}

.readonly-input {
    background: color-mix(in srgb, var(--soft, #f8fafc) 85%, var(--card-bg, #fff));
    cursor: not-allowed;
}

.field-hint {
    display: block;
    margin-top: 4px;
    font-size: .8rem;
}

.field-hint.ok,
#passwordMatchText.ok {
    color: #047857;
}

.field-hint.bad,
#passwordMatchText.bad {
    color: #b91c1c;
}

.usermgmt-password-panel {
    border: 1px dashed var(--border-color, #e5e7eb);
    border-radius: 14px;
    padding: 12px;
    display: grid;
    gap: 8px;
    align-content: center;
}

.usermgmt-password-meter {
    height: 8px;
    border-radius: 999px;
    background: var(--soft, #f1f5f9);
    overflow: hidden;
}

.usermgmt-password-meter span {
    display: block;
    height: 100%;
    width: 0;
    border-radius: inherit;
    background: var(--theme-primary, #2563eb);
    transition: width .18s ease;
}

.usermgmt-edit-side {
    display: grid;
    gap: 16px;
    position: sticky;
    top: 72px;
}

.usermgmt-profile-card,
.usermgmt-system-card {
    padding: 18px;
}

.usermgmt-profile-card {
    text-align: center;
}

.usermgmt-profile-avatar {
    width: 72px;
    height: 72px;
    margin: 0 auto 12px;
    font-size: 1.3rem;
}

.usermgmt-profile-card h3 {
    margin: 0;
    color: var(--text-color, #111827);
}

.usermgmt-profile-card p {
    margin: 4px 0 12px;
    color: var(--muted-text, #6b7280);
}

.usermgmt-toggle-line {
    display: inline-flex;
    gap: 8px;
    align-items: center;
    font-weight: 800;
}

.usermgmt-system-card h4 {
    margin: 0 0 10px;
}

.usermgmt-system-card ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    gap: 10px;
}

.usermgmt-system-card li {
    display: grid;
    gap: 3px;
    border-bottom: 1px dashed var(--border-color, #e5e7eb);
    padding-bottom: 10px;
}

.usermgmt-system-card li:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.usermgmt-delete-modal.is-hidden {
    display: none;
}

@media (max-width: 1180px) {
    .usermgmt-filter-form {
        grid-template-columns: repeat(2, minmax(180px, 1fr));
    }

    .usermgmt-search {
        grid-column: 1 / -1;
    }

    .usermgmt-stat-strip {
        grid-template-columns: repeat(3, minmax(120px, 1fr));
    }
}

@media (max-width: 920px) {
    .usermgmt-edit-layout {
        grid-template-columns: 1fr;
    }

    .usermgmt-edit-side {
        position: static;
    }
}

@media (max-width: 680px) {
    .usermgmt-filter-form,
    .usermgmt-form-grid,
    .usermgmt-stat-strip {
        grid-template-columns: 1fr;
    }

    .usermgmt-card-head {
        grid-template-columns: auto 1fr;
    }

    .usermgmt-card-head .usermgmt-pill {
        grid-column: 1 / -1;
        justify-self: start;
    }

    .usermgmt-edit-card-title {
        display: grid;
    }
}

/* Direct Purchase Invoice latest POS/Odoo-style layout */
.purchase-page-shell{padding:10px 14px 22px;background:linear-gradient(180deg,rgba(7,147,100,.08),rgba(255,255,255,.92) 120px);min-height:100vh;color:var(--erp-text,#102033)}
.purchase-topline,.purchase-action-header,.purchase-toolbar{display:flex;align-items:center;justify-content:space-between;gap:14px}.purchase-breadcrumb{display:flex;gap:8px;align-items:center;color:var(--erp-muted,#64748b);font-size:13px}.purchase-breadcrumb strong{color:var(--erp-primary,#008c6a)}.purchase-company{text-align:right;font-size:12px;color:var(--erp-muted,#64748b)}.purchase-company strong{font-size:17px;color:var(--erp-text,#102033)}
.purchase-action-header{padding:10px 0}.purchase-title-block{display:flex;align-items:center;gap:14px}.purchase-mini-actions{display:flex;gap:8px}.purchase-form-title{font-weight:700;color:var(--erp-text,#102033)}.purchase-title-block h1{font-size:27px;line-height:1;margin:3px 0;color:#062f1d;display:inline-block}.purchase-state-pill{display:inline-flex;align-items:center;padding:3px 14px;border-radius:999px;background:#eef2f7;color:#475569;font-weight:700;font-size:12px;margin-left:8px}.purchase-record-nav{display:flex;gap:8px;align-items:center}.purchase-record-nav button{border:1px solid #dbe3ea;background:#f8fafc;border-radius:10px;font-size:24px;min-width:38px;height:38px;color:#0f172a}.purchase-toolbar{border-top:1px solid rgba(0,140,106,.22);border-bottom:1px solid rgba(0,140,106,.22);padding:8px 0;margin-bottom:10px}.purchase-toolbar-left{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.purchase-primary{background:var(--erp-primary,#008c6a)!important;color:#fff!important;border:1px solid var(--erp-primary,#008c6a)!important}.purchase-outline{background:#fff!important;color:var(--erp-primary,#008c6a)!important;border:1px solid rgba(0,140,106,.32)!important}.purchase-danger{background:#fff6f6!important;color:#b91c1c!important;border:1px solid #fecaca!important}.purchase-statusbar{display:grid;grid-template-columns:repeat(4,120px);border:1px solid rgba(0,140,106,.22);background:#f3f6f8}.purchase-statusbar span{text-align:center;padding:8px 12px;font-weight:700;color:#64748b;border-left:1px solid #dce5eb}.purchase-statusbar span:first-child{border-left:0}.purchase-statusbar .active{background:#fff;color:var(--erp-primary,#008c6a);box-shadow:inset 0 0 0 1px var(--erp-primary,#008c6a)}
.purchase-card{background:rgba(255,255,255,.96);border:1px solid rgba(0,140,106,.20);box-shadow:0 12px 28px rgba(15,23,42,.04);border-radius:3px}.purchase-form-card{padding:14px 18px}.purchase-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:64px}.purchase-form-column{display:grid;grid-template-columns:155px minmax(0,1fr);gap:8px 14px;align-items:center}.purchase-form-column label{font-weight:700;font-size:13px;color:#111827}.purchase-field{width:100%;border:0;border-bottom:1px solid rgba(0,140,106,.25);background:transparent;min-height:32px;padding:5px 8px;color:#102033;font-weight:600;outline:none}.purchase-field:focus{border-bottom-color:var(--erp-primary,#008c6a);background:rgba(0,140,106,.04)}.purchase-field.compact{min-height:28px;font-size:12px}.purchase-inline-fields{display:grid;grid-template-columns:90px 1fr;gap:8px}.purchase-lookup-row{display:grid;grid-template-columns:1fr 38px;gap:8px}.purchase-icon-btn{border:1px solid rgba(0,140,106,.25);background:#fff;color:var(--erp-primary,#008c6a);border-radius:8px;font-weight:800}.purchase-supplier-panel{grid-column:2/3;border-left:3px solid var(--erp-primary,#008c6a);background:linear-gradient(90deg,rgba(0,140,106,.08),rgba(0,140,106,.02));min-height:78px;padding:10px 12px;display:flex;flex-direction:column;gap:4px;border-radius:0 8px 8px 0}.purchase-supplier-panel span{font-size:12px;color:#475569}.purchase-checkbox{font-weight:600!important;display:flex!important;align-items:center;gap:8px}.purchase-checkbox input{accent-color:var(--erp-primary,#008c6a)}.purchase-alert{padding:10px 14px;border-radius:7px;margin:8px 0;font-weight:800;border:1px solid #bbf7d0;background:#f0fdf4;color:#166534}.purchase-alert.danger{background:#fff1f2;color:#9f1239;border-color:#fecdd3}.purchase-alert.success{background:#ecfdf5;color:#047857;border-color:#a7f3d0}
.purchase-suggestion-list{position:absolute;z-index:50;margin-top:4px;background:#fff;border:1px solid rgba(0,140,106,.24);box-shadow:0 16px 40px rgba(15,23,42,.14);border-radius:10px;min-width:420px;max-height:280px;overflow:auto}.purchase-product-search{position:relative}.purchase-suggestion-list button{display:flex;flex-direction:column;width:100%;text-align:left;border:0;background:#fff;padding:9px 12px;border-bottom:1px solid #edf2f7;color:#0f172a}.purchase-suggestion-list button:hover{background:rgba(0,140,106,.06)}.purchase-suggestion-list strong{font-size:13px}.purchase-suggestion-list span{font-size:12px;color:#64748b}
.purchase-tabs{display:flex;overflow-x:auto;margin-top:10px;border:1px solid rgba(0,140,106,.20);border-bottom:0;background:rgba(0,140,106,.05)}.purchase-tabs button{border:0;border-right:1px solid #dbe5e0;background:#f8fafc;color:#0f172a;padding:11px 18px;white-space:nowrap}.purchase-tabs button.active{background:#fff;color:var(--erp-primary,#008c6a);border-top:3px solid var(--erp-primary,#008c6a);font-weight:800}.purchase-lines-card{border-top-left-radius:0;border-top-right-radius:0;padding:12px}.purchase-entry-strip{display:grid;grid-template-columns:minmax(260px,1.6fr) repeat(7,minmax(90px,.55fr)) auto;gap:10px;align-items:end}.purchase-entry-strip label{display:block;color:var(--erp-primary,#008c6a);font-size:12px;font-weight:800;margin-bottom:3px}.purchase-grid-toolbar{display:grid;grid-template-columns:auto 1fr auto 160px auto;gap:8px;align-items:center;margin:14px 0 8px;color:var(--erp-primary,#008c6a)}.purchase-table-wrap{overflow:auto;border:1px solid rgba(0,140,106,.15);border-radius:2px}.purchase-lines-table{width:100%;border-collapse:collapse;font-size:12px}.purchase-lines-table th{background:rgba(0,140,106,.09);color:#0f422e;padding:8px;border-bottom:1px solid rgba(0,140,106,.20);border-right:1px solid rgba(0,140,106,.12);white-space:nowrap}.purchase-lines-table td{padding:7px 8px;border-bottom:1px solid #e5edf0;border-right:1px solid #edf2f7;white-space:nowrap}.purchase-lines-table tbody tr:hover{background:rgba(0,140,106,.04)}.purchase-lines-table .row-handle{width:26px;text-align:center;color:#94a3b8}.hidden-col{display:none!important}.purchase-empty-line td{text-align:center;color:#94a3b8;padding:24px!important}.ok-pill{display:inline-flex;padding:3px 12px;border-radius:999px;background:#dcfce7;color:#15803d;font-weight:800}.purchase-row-actions{display:flex;gap:8px;align-items:center;padding:10px 0 2px}.purchase-row-actions button{border:1px solid #d7e5df;background:#fff;border-radius:5px;color:var(--erp-primary,#008c6a);padding:7px 10px}.purchase-row-actions span{margin-left:auto;color:var(--erp-primary,#008c6a);font-weight:700}
.purchase-bottom-grid{display:grid;grid-template-columns:minmax(0,1fr) 440px;gap:18px;margin-top:12px}.purchase-notes{padding:14px}.purchase-notes textarea{min-height:110px;border:1px solid #dbe5e0;border-radius:7px;margin-top:10px;resize:vertical}.purchase-totals{padding:14px 20px}.purchase-totals div{display:grid;grid-template-columns:1fr 150px;gap:14px;align-items:center;margin:7px 0}.purchase-totals input{border:0;border-bottom:1px solid rgba(0,140,106,.18);text-align:right;background:transparent;padding:4px;font-weight:700}.purchase-totals span{text-align:right;color:#334155}.purchase-totals strong{text-align:right}.purchase-totals .grand{border-top:1px solid #e2e8f0;padding-top:10px;margin-top:12px}.purchase-totals .grand strong{font-size:25px;color:#0f766e}.purchase-column-modal{position:fixed;inset:0;background:rgba(15,23,42,.32);display:grid;place-items:center;z-index:2000}.purchase-column-card{width:min(460px,94vw);max-height:80vh;overflow:auto;background:#fff;border-radius:14px;box-shadow:0 25px 70px rgba(15,23,42,.25);padding:18px}.column-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.column-title button{border:0;background:#f1f5f9;border-radius:999px;width:32px;height:32px}.purchase-column-card label{display:flex;align-items:center;gap:9px;padding:8px 4px;border-bottom:1px solid #edf2f7}.purchase-column-card input{accent-color:var(--erp-primary,#008c6a)}
@media (max-width:1200px){.purchase-form-grid{grid-template-columns:1fr;gap:20px}.purchase-entry-strip{grid-template-columns:repeat(4,1fr)}.purchase-bottom-grid{grid-template-columns:1fr}.purchase-statusbar{grid-template-columns:repeat(4,1fr)}}
@media (max-width:760px){.purchase-toolbar,.purchase-topline,.purchase-action-header{align-items:flex-start;flex-direction:column}.purchase-form-column{grid-template-columns:1fr}.purchase-supplier-panel{grid-column:auto}.purchase-entry-strip{grid-template-columns:1fr 1fr}.purchase-grid-toolbar{grid-template-columns:1fr}.purchase-record-nav{align-self:flex-end}}

/* Employee Face Registration / Self Attendance kiosk */
.efr-page{padding:18px 22px 34px}.efr-head{display:flex;justify-content:space-between;gap:18px;align-items:flex-start;margin-bottom:18px}.efr-head h1{margin:0 0 6px;font-size:28px}.efr-head p,.efr-list-head p{margin:0;color:var(--muted-color,#64748b)}.efr-kiosk-link,.efr-actions button{border:0;border-radius:10px;padding:11px 16px;background:var(--primary,#2563eb);color:#fff;text-decoration:none;font-weight:700;cursor:pointer}.efr-grid{display:grid;grid-template-columns:minmax(360px,1fr) minmax(420px,1.2fr);gap:18px}.efr-card{background:var(--card-bg,#fff);border:1px solid var(--border-color,#dbe3ef);border-radius:16px;padding:20px;box-shadow:0 10px 28px rgba(15,23,42,.06)}.efr-card h2{font-size:18px;margin:0 0 14px}.efr-label{display:block;font-weight:700;margin:0 0 7px}.efr-select{width:100%;min-height:44px;border:1px solid var(--border-color,#cbd5e1);border-radius:10px;padding:0 12px;background:var(--input-bg,#fff);color:inherit}.efr-status{margin:10px 0 22px;padding:10px 12px;border-radius:9px;background:rgba(37,99,235,.08);color:#1d4ed8}.efr-camera-wrap{position:relative;aspect-ratio:4/3;overflow:hidden;border-radius:14px;background:#0f172a}.efr-camera-wrap video,.efr-camera-wrap canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.efr-camera-wrap canvas{pointer-events:none}.efr-camera-wrap #cameraPlaceholder{position:absolute;inset:0;display:grid;place-items:center;color:#cbd5e1}.efr-samples{display:flex;justify-content:center;gap:12px;margin:14px 0}.efr-samples span{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;border:2px solid #cbd5e1;color:#64748b;font-weight:800}.efr-samples span.done{background:#22c55e;border-color:#22c55e;color:#fff}.efr-prompt{text-align:center;color:#475569;margin-bottom:14px}.efr-actions{display:flex;gap:10px;flex-wrap:wrap}.efr-actions button:disabled{opacity:.45;cursor:not-allowed}.efr-message{min-height:24px;margin-top:12px}.efr-message.ok{color:#15803d}.efr-message.error{color:#b91c1c}.efr-table-wrap{overflow:auto}.efr-table-wrap table{width:100%;border-collapse:collapse}.efr-table-wrap th,.efr-table-wrap td{padding:11px;border-bottom:1px solid var(--border-color,#e2e8f0);text-align:left}.efr-badge{display:inline-flex;border-radius:999px;padding:5px 9px;font-size:12px;font-weight:800}.efr-badge.yes{background:#dcfce7;color:#166534}.efr-badge.no{background:#f1f5f9;color:#475569}.efr-remove{border:1px solid #fecaca;background:#fff1f2;color:#b91c1c;border-radius:8px;padding:7px 10px;cursor:pointer}.efr-note{margin-top:18px;padding:13px;border-radius:10px;background:#fff7ed;color:#9a3412;font-size:13px}
.efa-kiosk-body{margin:0;background:linear-gradient(135deg,#f8fbff,#eef4fb);color:#10213f;font-family:Inter,Segoe UI,Arial,sans-serif}.efa-kiosk{min-height:100vh;padding:34px 38px;box-sizing:border-box}.efa-header{display:flex;align-items:center;gap:20px;max-width:1400px;margin:0 auto 32px}.efa-title-icon{width:58px;height:58px;border:3px solid #2563eb;border-radius:16px;display:grid;place-items:center;font-size:34px;color:#2563eb}.efa-header h1{font-size:34px;margin:0 0 5px}.efa-header p{margin:0;color:#586985;font-size:18px}.efa-clock{margin-left:auto;display:flex;gap:24px;align-items:center;background:#fff;border:1px solid #d9e2ef;border-radius:14px;padding:20px 25px;box-shadow:0 8px 26px rgba(15,23,42,.05)}.efa-main{max-width:1400px;margin:auto;display:grid;grid-template-columns:1fr 1fr;gap:22px}.efa-panel{background:#fff;border:1px solid #d9e2ef;border-radius:16px;padding:28px;box-shadow:0 12px 34px rgba(15,23,42,.05)}.efa-panel h2{margin:0 0 22px;font-size:24px}.efa-video-box{position:relative;aspect-ratio:4/3;background:#d5dde6;border-radius:14px;overflow:hidden}.efa-video-box video{width:100%;height:100%;object-fit:cover;transform:scaleX(-1)}.efa-corners{position:absolute;inset:15%;border:4px solid transparent;border-top-color:#22c55e;border-bottom-color:#22c55e;opacity:.85}.efa-scan-state{position:absolute;left:0;right:0;bottom:0;padding:18px;text-align:center;background:rgba(6,30,58,.85);color:#fff;font-size:20px}.efa-help,.efa-result{margin-top:20px;border:1px solid #bfdbfe;background:#eff6ff;color:#1d4ed8;border-radius:12px;padding:18px;line-height:1.5}.efa-buttons{display:grid;grid-template-columns:1fr 1fr;gap:24px}.efa-action{min-height:430px;border-radius:16px;background:#fff;border:1px solid;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:15px;cursor:pointer}.efa-action.in{border-color:#bbf7d0;background:linear-gradient(#f0fdf4,#effcf5);color:#078829}.efa-action.out{border-color:#fecaca;background:linear-gradient(#fff1f2,#fff5f5);color:#b91c1c}.efa-action span{width:106px;height:106px;border-radius:50%;display:grid;place-items:center;color:#fff;font-size:56px}.efa-action.in span{background:#22c55e}.efa-action.out span{background:#ef4444}.efa-action strong{font-size:35px}.efa-action small{font-size:18px;color:#334155}.efa-action:disabled{opacity:.55;cursor:wait}.efa-result{color:#334155;background:#f8fafc;border-color:#dbe4ef;text-align:center;font-size:18px}.efa-result.success{background:#ecfdf5;border-color:#86efac;color:#166534}.efa-result.error{background:#fff1f2;border-color:#fda4af;color:#9f1239}.efa-kiosk footer{text-align:center;color:#64748b;margin:28px auto 0;font-size:16px}
@media(max-width:900px){.efr-grid,.efa-main{grid-template-columns:1fr}.efa-header{flex-wrap:wrap}.efa-clock{margin-left:0;width:100%;justify-content:space-between}.efa-buttons{grid-template-columns:1fr 1fr}.efa-action{min-height:260px}.efa-kiosk{padding:18px}.efr-page{padding:12px}.efr-head{flex-direction:column}}

/* Direct Purchase latest purchase/order layout and POS-style product grid lookup */
.purchase-latest-shell {
    background: #fafafa !important;
    padding: 10px 14px 22px !important;
}
.purchase-order-style-header,
.purchase-latest-toolbar {
    background: #fff !important;
}
.purchase-latest-toolbar {
    border-top: 0 !important;
    border-bottom: 1px solid #e5e7eb !important;
    padding: 10px 0 !important;
}
.purchase-stagebar {
    display: flex;
    align-items: center;
    gap: 0;
    min-width: 320px;
    justify-content: flex-end;
}
.purchase-stagebar span {
    min-width: 108px;
    padding: 9px 18px;
    background: #f1f5f9;
    color: #64748b;
    border: 1px solid #e2e8f0;
    font-weight: 800;
    text-align: center;
    clip-path: polygon(0 0, calc(100% - 16px) 0, 100% 50%, calc(100% - 16px) 100%, 0 100%, 16px 50%);
    margin-left: -10px;
}
.purchase-stagebar span:first-child { margin-left: 0; clip-path: polygon(0 0, calc(100% - 16px) 0, 100% 50%, calc(100% - 16px) 100%, 0 100%); }
.purchase-stagebar .active { background: var(--erp-primary,#008c6a); color: #fff; border-color: var(--erp-primary,#008c6a); }
.purchase-order-info-card {
    border-color: #e5e7eb !important;
    border-radius: 10px !important;
    box-shadow: none !important;
    margin-top: 10px;
}
.purchase-order-info-grid { gap: 72px !important; }
.purchase-tabs { border-color: #e5e7eb !important; background: transparent !important; margin-top: 14px !important; }
.purchase-tabs button { background: #f8fafc !important; }
.purchase-tabs button.active { background: #fff !important; color: var(--erp-primary,#008c6a) !important; border-top-color: var(--erp-primary,#008c6a) !important; }
.purchase-order-lines-card { border-color: #e5e7eb !important; border-radius: 0 0 10px 10px !important; box-shadow: none !important; }
.purchase-order-grid-toolbar {
    grid-template-columns: auto 1fr auto 180px auto !important;
    color: #0f172a !important;
    margin-top: 0 !important;
}
.purchase-grid-help { color: #64748b; font-size: 12px; font-weight: 600; }
.purchase-order-lines-table th {
    background: #fff !important;
    color: #111827 !important;
    border-bottom: 1px solid #e5e7eb !important;
    font-size: 13px;
}
.purchase-order-lines-table td { font-size: 13px; vertical-align: middle; }
.purchase-grid-input {
    width: 100%;
    min-width: 80px;
    border: 0;
    border-bottom: 1px solid transparent;
    background: transparent;
    padding: 6px 7px;
    font: inherit;
    color: #0f172a;
    outline: none;
}
.purchase-grid-input:focus { border-bottom-color: var(--erp-primary,#008c6a); background: rgba(0,140,106,.05); }
.purchase-grid-input.product { color: var(--erp-primary,#008c6a); font-weight: 800; min-width: 220px; }
.purchase-product-cell { display: grid; grid-template-columns: minmax(210px,1fr) 30px; align-items: center; gap: 4px; }
.purchase-product-cell button {
    border: 0;
    background: rgba(0,140,106,.08);
    color: var(--erp-primary,#008c6a);
    width: 28px;
    height: 28px;
    border-radius: 999px;
    font-weight: 900;
}
.purchase-cell-suggestions {
    position: absolute;
    z-index: 2500;
    background: #fff;
    border: 1px solid rgba(0,140,106,.24);
    box-shadow: 0 18px 48px rgba(15,23,42,.16);
    border-radius: 10px;
    overflow: hidden;
    max-height: 310px;
}
.purchase-cell-suggestions[hidden] { display: none !important; }
.purchase-cell-suggestions button,
.purchase-product-modal-results button {
    display: flex;
    flex-direction: column;
    gap: 2px;
    width: 100%;
    text-align: left;
    border: 0;
    background: #fff;
    padding: 10px 13px;
    border-bottom: 1px solid #edf2f7;
    color: #0f172a;
}
.purchase-cell-suggestions button:hover,
.purchase-product-modal-results button:hover { background: rgba(0,140,106,.06); }
.purchase-cell-suggestions button.more { color: var(--erp-primary,#008c6a); font-weight: 900; background: #f8fafc; }
.purchase-product-modal-results { margin-top: 10px; max-height: 58vh; overflow: auto; border: 1px solid #edf2f7; border-radius: 10px; }
.purchase-product-modal-results .empty { padding: 18px; color: #64748b; }
.ok-pill.draft { background: #eef2f7; color: #64748b; }
.purchase-page-shell .btn,
.purchase-page-shell button.btn,
.purchase-toolbar .btn,
.purchase-mini-actions .btn,
.purchase-grid-toolbar .btn,
.purchase-entry-strip .btn,
.purchase-column-card .btn {
    width: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    min-height: 34px !important;
    padding: 8px 14px !important;
    border-radius: 7px !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    line-height: 1.1 !important;
    box-shadow: none !important;
}
.purchase-toolbar-left .btn,
.purchase-mini-actions .btn { flex: 0 0 auto !important; }
.purchase-toolbar { align-items: center !important; }
.purchase-toolbar-left { width: auto !important; min-width: 0 !important; display: flex !important; flex-direction: row !important; flex-wrap: wrap !important; align-items: center !important; gap: 8px !important; }
.purchase-primary { min-width: 82px !important; }
.purchase-toolbar .purchase-danger { min-width: 88px !important; }
.purchase-column-modal[hidden] { display: none !important; }
.purchase-column-modal:not([hidden]) { display: grid !important; }
.purchase-column-card .purchase-primary { width: 100% !important; min-height: 38px !important; }
@media (max-width:1200px){ .purchase-stagebar{justify-content:flex-start}.purchase-order-grid-toolbar{grid-template-columns:1fr!important}.purchase-order-info-grid{gap:20px!important}.purchase-stagebar span{min-width:90px;padding:8px 12px} }

/* Employee Face Attendance Kiosk - responsive standalone terminal update */
.efa-standalone-kiosk,
.efa-standalone-kiosk *{box-sizing:border-box}
.efa-standalone-kiosk{margin:0;min-width:320px;min-height:100dvh;background:radial-gradient(circle at top left,rgba(14,165,164,.12),transparent 32rem),linear-gradient(135deg,#f8fbff,#eef6f3);color:#10213f;font-family:Inter,Segoe UI,Arial,sans-serif;overflow-x:hidden}
.efa-standalone-kiosk .efa-kiosk-shell{min-height:100dvh;width:min(100%,1920px);margin:0 auto;padding:clamp(10px,1.8vw,34px);display:flex;flex-direction:column;gap:clamp(10px,1.6vw,26px)}
.efa-standalone-kiosk .efa-kiosk-topbar{display:grid;grid-template-columns:minmax(260px,1fr) auto auto;align-items:center;gap:clamp(10px,1.4vw,22px);background:rgba(255,255,255,.74);border:1px solid rgba(148,163,184,.28);border-radius:clamp(14px,1.4vw,24px);padding:clamp(12px,1.4vw,22px);box-shadow:0 16px 40px rgba(15,23,42,.06);backdrop-filter:blur(12px)}
.efa-standalone-kiosk .efa-brand-block{display:flex;align-items:center;gap:clamp(10px,1.2vw,18px);min-width:0}
.efa-standalone-kiosk .efa-title-icon{flex:0 0 auto;width:clamp(44px,4.8vw,76px);height:clamp(44px,4.8vw,76px);border:3px solid var(--accent,#009879);border-radius:clamp(12px,1.2vw,20px);display:grid;place-items:center;font-size:clamp(26px,3vw,44px);color:var(--accent,#009879);background:#fff;box-shadow:0 10px 28px rgba(0,0,0,.06)}
.efa-standalone-kiosk .efa-kiosk-topbar h1{font-size:clamp(24px,3.3vw,52px);line-height:1.05;margin:0;color:#071b33;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.efa-standalone-kiosk .efa-kiosk-topbar p{font-size:clamp(13px,1.25vw,21px);margin:clamp(2px,.3vw,6px) 0 0;color:#667085;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.efa-standalone-kiosk .efa-kiosk-status-strip{display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap}
.efa-standalone-kiosk .efa-connection-pill{display:inline-flex;align-items:center;justify-content:center;min-height:clamp(30px,2.6vw,42px);border-radius:999px;padding:0 clamp(12px,1.2vw,18px);font-weight:800;font-size:clamp(12px,.95vw,16px);border:1px solid transparent;white-space:nowrap}
.efa-standalone-kiosk .efa-connection-pill.online{background:#ecfdf5;border-color:#86efac;color:#166534}
.efa-standalone-kiosk .efa-connection-pill.offline{background:#fff1f2;border-color:#fda4af;color:#9f1239}
.efa-standalone-kiosk .efa-connection-pill.waiting{background:#eff6ff;border-color:#bfdbfe;color:#1d4ed8}
.efa-standalone-kiosk .efa-connection-pill.muted{background:#f8fafc;border-color:#dbe4ef;color:#475569;max-width:180px;overflow:hidden;text-overflow:ellipsis}
.efa-standalone-kiosk .efa-clock{margin-left:0;display:flex;flex-direction:column;align-items:flex-end;gap:4px;background:#fff;border:1px solid #d9e2ef;border-radius:clamp(12px,1vw,18px);padding:clamp(10px,1.2vw,18px) clamp(12px,1.5vw,24px);box-shadow:0 8px 26px rgba(15,23,42,.05);min-width:clamp(190px,18vw,330px)}
.efa-standalone-kiosk .efa-clock span{font-size:clamp(12px,1vw,16px);color:#64748b;text-align:right}.efa-standalone-kiosk .efa-clock b{font-size:clamp(22px,2.6vw,44px);letter-spacing:.02em;color:#071b33}
.efa-standalone-kiosk .efa-kiosk-grid{flex:1;min-height:0;display:grid;grid-template-columns:minmax(340px,1.05fr) minmax(340px,.95fr);gap:clamp(12px,1.6vw,26px)}
.efa-standalone-kiosk .efa-kiosk-card{background:#fff;border:1px solid #d9e2ef;border-radius:clamp(14px,1.2vw,24px);padding:clamp(14px,1.6vw,28px);box-shadow:0 16px 42px rgba(15,23,42,.06);min-height:0;display:flex;flex-direction:column;gap:clamp(12px,1.2vw,20px)}
.efa-standalone-kiosk .efa-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.efa-standalone-kiosk .efa-card-head h2{font-size:clamp(20px,2vw,34px);line-height:1.15;margin:0;color:#071b33}.efa-standalone-kiosk .efa-card-head p{margin:clamp(3px,.35vw,7px) 0 0;color:#667085;font-size:clamp(12px,1vw,17px)}
.efa-standalone-kiosk .efa-small-button{border:1px solid #bfd4e8;border-radius:10px;background:#fff;color:#0f766e;padding:10px 14px;font-weight:800;white-space:nowrap;cursor:pointer}.efa-standalone-kiosk .efa-small-button:hover{background:#f0fdfa}
.efa-standalone-kiosk .efa-video-box{position:relative;flex:1;min-height:clamp(260px,44dvh,760px);aspect-ratio:16/10;background:linear-gradient(145deg,#dbeafe,#e2e8f0);border-radius:clamp(14px,1vw,22px);overflow:hidden;border:1px solid #cbd5e1}.efa-standalone-kiosk .efa-video-box video{width:100%;height:100%;object-fit:cover;transform:scaleX(-1);display:block}
.efa-standalone-kiosk .efa-face-guide{position:absolute;inset:14% 24%;border:clamp(3px,.35vw,6px) solid rgba(34,197,94,.9);border-left-color:transparent;border-right-color:transparent;border-radius:48%;filter:drop-shadow(0 0 12px rgba(34,197,94,.28));pointer-events:none}.efa-standalone-kiosk .efa-scan-line{position:absolute;left:18%;right:18%;height:3px;top:28%;background:linear-gradient(90deg,transparent,#22c55e,transparent);box-shadow:0 0 18px rgba(34,197,94,.8);animation:efaScan 2.4s linear infinite;pointer-events:none}.efa-standalone-kiosk .efa-scan-state{position:absolute;left:0;right:0;bottom:0;padding:clamp(12px,1.4vw,22px);text-align:center;background:rgba(6,30,58,.86);color:#fff;font-size:clamp(15px,1.35vw,24px);font-weight:800;letter-spacing:.01em}.efa-standalone-kiosk .efa-help{margin-top:0;border:1px solid #bfdbfe;background:#eff6ff;color:#1d4ed8;border-radius:clamp(11px,1vw,16px);padding:clamp(12px,1.1vw,18px);line-height:1.45;font-size:clamp(13px,1.05vw,18px)}
.efa-standalone-kiosk .efa-kiosk-actions{display:grid;grid-template-columns:1fr 1fr;gap:clamp(12px,1.6vw,24px);flex:1}.efa-standalone-kiosk .efa-action{min-height:clamp(210px,38dvh,610px);border-radius:clamp(14px,1.2vw,24px);background:#fff;border:1px solid;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(10px,1.2vw,18px);cursor:pointer;transition:transform .14s ease,box-shadow .14s ease,opacity .14s ease;padding:clamp(12px,1.4vw,24px);touch-action:manipulation}.efa-standalone-kiosk .efa-action:active{transform:scale(.985)}.efa-standalone-kiosk .efa-action.in{border-color:#86efac;background:linear-gradient(#f0fdf4,#effcf5);color:#078829}.efa-standalone-kiosk .efa-action.out{border-color:#fecaca;background:linear-gradient(#fff1f2,#fff5f5);color:#b91c1c}.efa-standalone-kiosk .efa-action span{width:clamp(70px,8vw,138px);height:clamp(70px,8vw,138px);border-radius:50%;display:grid;place-items:center;color:#fff;font-size:clamp(38px,5vw,74px);box-shadow:0 18px 38px rgba(15,23,42,.14)}.efa-standalone-kiosk .efa-action.in span{background:#22c55e}.efa-standalone-kiosk .efa-action.out span{background:#ef4444}.efa-standalone-kiosk .efa-action strong{font-size:clamp(25px,3.1vw,58px);line-height:1.05}.efa-standalone-kiosk .efa-action small{font-size:clamp(13px,1.2vw,20px);color:#334155}.efa-standalone-kiosk .efa-action:disabled{opacity:.45;cursor:wait;filter:grayscale(.15)}
.efa-standalone-kiosk .efa-result{margin-top:0;color:#334155;background:#f8fafc;border:1px solid #dbe4ef;text-align:center;font-size:clamp(14px,1.2vw,20px);border-radius:clamp(11px,1vw,16px);padding:clamp(13px,1.2vw,20px);line-height:1.45;min-height:clamp(56px,6dvh,100px);display:grid;place-items:center}.efa-standalone-kiosk .efa-result.success{background:#ecfdf5;border-color:#86efac;color:#166534}.efa-standalone-kiosk .efa-result.error{background:#fff1f2;border-color:#fda4af;color:#9f1239}.efa-standalone-kiosk .efa-kiosk-footer-note{text-align:center;color:#64748b;font-size:clamp(12px,.95vw,16px);padding-top:2px}
.efa-standalone-kiosk .efa-offline-overlay{position:fixed;inset:0;z-index:99999;background:rgba(15,23,42,.72);display:grid;place-items:center;padding:24px;backdrop-filter:blur(6px)}.efa-standalone-kiosk .efa-offline-overlay[hidden]{display:none!important}.efa-standalone-kiosk .efa-offline-card{width:min(620px,94vw);background:#fff;border-radius:24px;padding:clamp(24px,4vw,48px);text-align:center;box-shadow:0 28px 80px rgba(0,0,0,.35);border:1px solid #e2e8f0}.efa-standalone-kiosk .efa-offline-icon{width:86px;height:86px;border-radius:50%;display:grid;place-items:center;margin:0 auto 18px;background:#fff7ed;color:#ea580c;font-size:48px}.efa-standalone-kiosk .efa-offline-card h2{margin:0 0 12px;font-size:clamp(24px,3vw,38px);color:#9a3412}.efa-standalone-kiosk .efa-offline-card p{margin:0 0 16px;font-size:clamp(15px,1.3vw,20px);color:#334155}.efa-standalone-kiosk .efa-offline-card small{color:#64748b;font-weight:700}
@keyframes efaScan{0%{top:22%;opacity:.2}20%{opacity:1}80%{opacity:1}100%{top:74%;opacity:.2}}
@media (min-width:1800px){.efa-standalone-kiosk .efa-kiosk-shell{padding:34px}.efa-standalone-kiosk .efa-video-box{min-height:720px}.efa-standalone-kiosk .efa-action{min-height:610px}}
@media (max-width:1180px){.efa-standalone-kiosk .efa-kiosk-topbar{grid-template-columns:1fr;align-items:stretch}.efa-standalone-kiosk .efa-kiosk-status-strip{justify-content:flex-start}.efa-standalone-kiosk .efa-clock{align-items:flex-start;width:100%;min-width:0}.efa-standalone-kiosk .efa-kiosk-grid{grid-template-columns:1fr}.efa-standalone-kiosk .efa-video-box{min-height:clamp(260px,46dvh,560px)}.efa-standalone-kiosk .efa-action{min-height:clamp(180px,24dvh,320px)}}
@media (max-width:680px){.efa-standalone-kiosk .efa-kiosk-shell{padding:10px}.efa-standalone-kiosk .efa-brand-block{align-items:flex-start}.efa-standalone-kiosk .efa-kiosk-topbar h1{white-space:normal;font-size:24px}.efa-standalone-kiosk .efa-kiosk-actions{grid-template-columns:1fr}.efa-standalone-kiosk .efa-action{min-height:150px;flex-direction:row;justify-content:flex-start;text-align:left}.efa-standalone-kiosk .efa-action span{width:62px;height:62px;font-size:34px}.efa-standalone-kiosk .efa-action strong{font-size:26px}.efa-standalone-kiosk .efa-card-head{flex-direction:column}.efa-standalone-kiosk .efa-small-button{width:100%;min-height:44px}.efa-standalone-kiosk .efa-face-guide{inset:14% 18%}.efa-standalone-kiosk .efa-video-box{min-height:260px}}
@media (max-height:720px) and (orientation:landscape){.efa-standalone-kiosk .efa-kiosk-shell{gap:10px;padding:10px}.efa-standalone-kiosk .efa-kiosk-topbar{padding:10px 12px;grid-template-columns:minmax(260px,1fr) auto auto}.efa-standalone-kiosk .efa-title-icon{width:46px;height:46px;font-size:26px}.efa-standalone-kiosk .efa-kiosk-topbar h1{font-size:24px}.efa-standalone-kiosk .efa-kiosk-topbar p{font-size:12px}.efa-standalone-kiosk .efa-clock{padding:8px 12px;min-width:180px}.efa-standalone-kiosk .efa-clock b{font-size:24px}.efa-standalone-kiosk .efa-kiosk-card{padding:12px;gap:10px}.efa-standalone-kiosk .efa-card-head h2{font-size:20px}.efa-standalone-kiosk .efa-card-head p{font-size:12px}.efa-standalone-kiosk .efa-video-box{min-height:calc(100dvh - 210px)}.efa-standalone-kiosk .efa-action{min-height:calc((100dvh - 250px)/2);gap:8px}.efa-standalone-kiosk .efa-kiosk-actions{grid-template-columns:1fr 1fr}.efa-standalone-kiosk .efa-action span{width:56px;height:56px;font-size:30px}.efa-standalone-kiosk .efa-action strong{font-size:24px}.efa-standalone-kiosk .efa-result{min-height:52px;padding:10px;font-size:13px}.efa-standalone-kiosk .efa-help,.efa-standalone-kiosk .efa-kiosk-footer-note{display:none}}
@media (prefers-reduced-motion:reduce){.efa-standalone-kiosk .efa-scan-line{animation:none}.efa-standalone-kiosk .efa-action{transition:none}}

/* Direct Purchase professional grid and kiosk no-scroll refinement */
.purchase-order-lines-table th{white-space:nowrap;font-weight:800;color:var(--text,#172033);background:var(--soft,#f7f9fc)}
.purchase-order-lines-table td{vertical-align:middle}
.purchase-order-lines-table .purchase-grid-input{min-width:0;width:100%}
.purchase-order-lines-card .purchase-table-wrap{overflow-x:auto;overflow-y:visible;max-height:none}
.purchase-column-card [data-column-list] label{display:flex;align-items:center;gap:10px;min-height:44px;border-bottom:1px solid var(--border,#e2e8f0);font-weight:700}
.purchase-suggestion-list{z-index:1200;max-height:320px;overflow:auto}

html:has(.efa-standalone-kiosk),body.efa-standalone-kiosk{height:100%;overflow:hidden!important}
.efa-standalone-kiosk .efa-kiosk-shell{height:100dvh;min-height:0;overflow:hidden}
.efa-standalone-kiosk .efa-kiosk-grid{overflow:hidden}
.efa-standalone-kiosk .efa-kiosk-card{overflow:hidden}
.efa-standalone-kiosk .efa-video-box{min-height:0;height:auto}
.efa-standalone-kiosk .efa-camera-card .efa-video-box{flex:1}
.efa-standalone-kiosk .efa-action-card{display:grid;grid-template-rows:auto minmax(0,1fr) auto auto}
.efa-standalone-kiosk .efa-kiosk-actions{min-height:0}
.efa-standalone-kiosk .efa-action{min-height:0;height:100%}
@media (max-height:900px){
 .efa-standalone-kiosk .efa-kiosk-shell{padding:10px;gap:10px}
 .efa-standalone-kiosk .efa-kiosk-topbar{padding:10px 14px}
 .efa-standalone-kiosk .efa-title-icon{width:44px;height:44px;font-size:25px}
 .efa-standalone-kiosk .efa-kiosk-topbar h1{font-size:clamp(20px,2.2vw,30px)}
 .efa-standalone-kiosk .efa-clock{padding:7px 12px}.efa-standalone-kiosk .efa-clock b{font-size:24px}
 .efa-standalone-kiosk .efa-kiosk-card{padding:12px;gap:8px}
 .efa-standalone-kiosk .efa-card-head h2{font-size:20px}.efa-standalone-kiosk .efa-card-head p{font-size:12px}
 .efa-standalone-kiosk .efa-help{padding:8px;font-size:12px}
 .efa-standalone-kiosk .efa-result{min-height:44px;padding:8px;font-size:12px}
 .efa-standalone-kiosk .efa-kiosk-footer-note{font-size:11px}
 .efa-standalone-kiosk .efa-action span{width:58px;height:58px;font-size:31px}
 .efa-standalone-kiosk .efa-action strong{font-size:24px}
}
@media (max-width:1180px){
 body.efa-standalone-kiosk{overflow:auto!important}
 .efa-standalone-kiosk .efa-kiosk-shell{height:auto;min-height:100dvh;overflow:visible}
 .efa-standalone-kiosk .efa-kiosk-grid,.efa-standalone-kiosk .efa-kiosk-card{overflow:visible}
}
@media (max-width:1180px) and (min-height:850px){
 body.efa-standalone-kiosk{overflow:hidden!important}
 .efa-standalone-kiosk .efa-kiosk-shell{height:100dvh;min-height:0;overflow:hidden}
 .efa-standalone-kiosk .efa-kiosk-topbar{grid-template-columns:1fr auto;grid-template-areas:'brand clock' 'status status'}
 .efa-standalone-kiosk .efa-brand-block{grid-area:brand}.efa-standalone-kiosk .efa-clock{grid-area:clock;width:auto}.efa-standalone-kiosk .efa-kiosk-status-strip{grid-area:status}
 .efa-standalone-kiosk .efa-kiosk-grid{grid-template-columns:1fr 1fr;overflow:hidden}
 .efa-standalone-kiosk .efa-kiosk-card{overflow:hidden}
}

/* Direct Purchase lookup, catalog, live columns and three-decimal input refinement */
.purchase-supplier-anchor{position:relative}
.purchase-supplier-suggestions{position:absolute!important;left:0;right:44px;top:calc(100% + 4px);width:auto!important;max-height:270px;background:var(--card,#fff);border:1px solid var(--border,#d9e2ef);border-radius:8px;box-shadow:0 14px 34px rgba(15,23,42,.16);overflow:auto;z-index:1500}
.purchase-supplier-suggestions button{width:100%;display:flex;justify-content:space-between;gap:16px;padding:10px 12px;border:0;border-bottom:1px solid var(--border,#e5e7eb);background:var(--card,#fff);color:var(--text,#172033);text-align:left;cursor:pointer}
.purchase-supplier-suggestions button:hover{background:var(--soft,#f3f7fc)}
.purchase-supplier-suggestions button span{color:var(--muted,#64748b);font-size:12px}.purchase-supplier-suggestions .more{justify-content:center;color:var(--brand,#008f83);font-weight:800}
.purchase-product-search-card,.purchase-supplier-search-card{width:min(1080px,96vw);max-width:none;padding:0;overflow:hidden}.purchase-catalog-card{width:min(1500px,97vw);max-width:none;height:min(880px,94vh);padding:0;display:flex;flex-direction:column;overflow:hidden}
.purchase-product-search-card .column-title,.purchase-supplier-search-card .column-title,.purchase-catalog-card .column-title{padding:14px 18px;background:var(--soft,#eef4ff);border-bottom:1px solid var(--border,#cbd5e1)}
.purchase-lookup-searchbar{display:grid;grid-template-columns:auto minmax(220px,1fr) auto auto auto;gap:8px;align-items:center;padding:10px 16px;border-bottom:1px solid var(--border,#dbe4ef);background:var(--card,#fff)}
.purchase-lookup-searchbar>span:first-child{font-size:20px}.purchase-lookup-searchbar>span:not(:first-child){white-space:nowrap;font-weight:700}.purchase-lookup-searchbar button{width:38px;height:38px;border:1px solid var(--border,#cbd5e1);background:var(--soft,#f8fafc);border-radius:6px;font-size:24px;cursor:pointer}.purchase-lookup-searchbar button:disabled{opacity:.4}
.purchase-product-table-head,.purchase-product-table-results button{display:grid;grid-template-columns:42px minmax(260px,1fr) 120px 110px 100px 110px 90px;align-items:center;gap:8px}.purchase-product-table-head{padding:10px 14px;background:var(--soft,#eaf2ff);font-weight:800;border-bottom:1px solid var(--border,#cbd5e1)}
.purchase-product-table-results{max-height:min(570px,66vh);overflow:auto}.purchase-product-table-results button{width:100%;padding:10px 14px;border:0;border-bottom:1px solid var(--border,#dbeafe);background:var(--card,#fff);color:var(--text,#172033);text-align:left;cursor:pointer}.purchase-product-table-results button:hover{background:var(--soft,#eff6ff)}.purchase-product-table-results button small{display:block;color:var(--muted,#64748b)}
.purchase-supplier-table-head,.purchase-supplier-modal-results button{display:grid;grid-template-columns:minmax(220px,1.2fr) 130px 150px minmax(260px,1.5fr);gap:12px;align-items:center}.purchase-supplier-table-head{padding:10px 16px;background:var(--soft,#eaf2ff);font-weight:800}.purchase-supplier-modal-results{max-height:min(560px,66vh);overflow:auto}.purchase-supplier-modal-results button{width:100%;padding:11px 16px;border:0;border-bottom:1px solid var(--border,#dbeafe);background:var(--card,#fff);color:var(--text,#172033);text-align:left;cursor:pointer}.purchase-supplier-modal-results button:hover{background:var(--soft,#eff6ff)}
.purchase-lookup-footer{display:flex;gap:8px;padding:12px 16px;border-top:1px solid var(--border,#dbe4ef);background:var(--card,#fff)}
.purchase-catalog-grid{flex:1;min-height:0;overflow:auto;display:grid;grid-template-columns:repeat(4,minmax(230px,1fr));gap:10px;padding:12px;background:var(--card,#fff);align-content:start}.purchase-catalog-grid article{min-height:148px;border:1px solid var(--border,#cbd5e1);background:var(--card,#fff);padding:14px;display:flex;justify-content:space-between;gap:12px}.purchase-catalog-grid article div{display:flex;flex-direction:column;gap:7px}.purchase-catalog-grid article span,.purchase-catalog-grid article small{color:var(--muted,#64748b)}.purchase-catalog-grid article button{align-self:flex-end;border:0;border-radius:5px;padding:8px 14px;background:var(--soft,#e5e7eb);font-weight:800;cursor:pointer}
.purchase-grid-input.numeric{text-align:right;font-variant-numeric:tabular-nums}.purchase-order-lines-table td.hidden-col,.purchase-order-lines-table th.hidden-col{display:none!important}
@media(max-width:1000px){.purchase-catalog-grid{grid-template-columns:repeat(2,minmax(220px,1fr))}.purchase-product-table-head,.purchase-product-table-results button{grid-template-columns:34px minmax(220px,1fr) 90px 90px 80px 90px 70px}.purchase-product-search-card{width:98vw}}
@media(max-width:650px){.purchase-catalog-grid{grid-template-columns:1fr}.purchase-product-table-head span:nth-child(3),.purchase-product-table-head span:nth-child(5),.purchase-product-table-results button>span:nth-child(3),.purchase-product-table-results button>span:nth-child(5){display:none}.purchase-product-table-head,.purchase-product-table-results button{grid-template-columns:32px minmax(180px,1fr) 85px 80px 65px}.purchase-supplier-table-head,.purchase-supplier-modal-results button{grid-template-columns:1fr 95px}.purchase-supplier-table-head span:nth-child(n+3),.purchase-supplier-modal-results button span:nth-child(n+3){display:none}}

/* Employee kiosk camera proportions: a centered portrait verification area, not an over-wide banner */
.efa-standalone-kiosk .efa-camera-card{align-items:center}.efa-standalone-kiosk .efa-camera-card .efa-card-head,.efa-standalone-kiosk .efa-camera-card .efa-help{width:100%}
.efa-standalone-kiosk .efa-camera-card .efa-video-box{width:min(100%,720px);max-height:calc(100dvh - 250px);aspect-ratio:4/3;align-self:center}
.efa-standalone-kiosk .efa-face-guide{inset:10% 27%;border-radius:46%}.efa-standalone-kiosk .efa-scan-line{left:29%;right:29%}
@media(max-width:1180px){.efa-standalone-kiosk .efa-camera-card .efa-video-box{width:min(100%,640px);max-height:52dvh}}
@media(max-width:680px){.efa-standalone-kiosk .efa-camera-card .efa-video-box{width:100%;aspect-ratio:3/4;max-height:54dvh}.efa-standalone-kiosk .efa-face-guide{inset:12% 18%}.efa-standalone-kiosk .efa-scan-line{left:21%;right:21%}}

/* Direct Purchase catalog selection, fixed column sizing, and compact kiosk viewport fix */
.purchase-order-lines-table{table-layout:fixed;width:max-content;min-width:100%}
.purchase-order-lines-table th[data-col],.purchase-order-lines-table td[data-col]{width:100px;min-width:100px;max-width:100px}
.purchase-order-lines-table th[data-col="product"],.purchase-order-lines-table td[data-col="product"]{width:300px;min-width:300px;max-width:300px}
.purchase-product-cell{width:300px}.purchase-cell-suggestions{width:300px!important;max-width:300px}
.purchase-order-lines-table .purchase-grid-input{border:0;background:transparent;padding:8px 7px;border-radius:0;text-align:left}
.purchase-order-lines-table .purchase-grid-input.numeric{text-align:right}
.purchase-order-lines-table .purchase-grid-input:focus{outline:2px solid var(--brand,#2563eb);outline-offset:-2px;background:var(--card,#fff)}
.purchase-catalog-grid{grid-template-columns:repeat(5,minmax(190px,1fr));gap:10px}
.purchase-catalog-grid article{position:relative;min-height:190px;display:flex;flex-direction:column;justify-content:space-between;cursor:pointer;border-radius:8px;transition:border-color .15s,box-shadow .15s,transform .15s}
.purchase-catalog-grid article:hover{border-color:var(--brand,#2563eb);box-shadow:0 7px 20px rgba(15,23,42,.1);transform:translateY(-1px)}
.purchase-catalog-grid article.catalog-added{border:2px solid #16a34a;background:linear-gradient(180deg,#f0fdf4,var(--card,#fff))}
.purchase-catalog-product-main{display:grid!important;grid-template-columns:1fr 64px;grid-template-rows:auto auto auto;gap:5px 8px!important;min-width:0}
.purchase-catalog-product-main strong{grid-column:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.purchase-catalog-product-main span,.purchase-catalog-product-main small{grid-column:1}
.purchase-catalog-image{grid-column:2;grid-row:1/4;width:64px;height:64px;border:1px solid var(--border,#e2e8f0);border-radius:7px;display:grid!important;place-items:center!important;color:var(--muted,#94a3b8);background:#fff;overflow:hidden}
.purchase-catalog-image img{width:100%;height:100%;object-fit:contain}
.purchase-catalog-card-actions{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:14px}
.purchase-catalog-card-actions>[data-catalog-select]{margin-left:auto;border:1px solid var(--brand,#2563eb);background:var(--brand,#2563eb);color:#fff;border-radius:6px;padding:8px 14px;font-weight:800}
.purchase-catalog-qty{display:grid;grid-template-columns:38px 58px 38px;align-items:center;border:1px solid #16a34a;border-radius:7px;overflow:hidden;background:#fff}
.purchase-catalog-qty button{align-self:stretch!important;border:0!important;border-radius:0!important;background:#dcfce7!important;color:#166534!important;padding:7px!important;font-size:18px;font-weight:900}
.purchase-catalog-qty input{width:58px;border:0;text-align:center;padding:8px 4px;font-weight:800;color:#166534;outline:none}
.purchase-catalog-added-mark{font-size:12px;font-weight:900;color:#15803d;white-space:nowrap}
@media(max-width:1350px){.purchase-catalog-grid{grid-template-columns:repeat(4,minmax(190px,1fr))}}
@media(max-width:900px){.purchase-catalog-grid{grid-template-columns:repeat(2,minmax(180px,1fr))}}

@media (min-width:700px) and (max-width:1180px){
 html:has(.efa-standalone-kiosk),body.efa-standalone-kiosk{height:100%;overflow:hidden!important}
 .efa-standalone-kiosk .efa-kiosk-shell{height:100dvh;min-height:0;overflow:hidden;padding:8px;gap:8px}
 .efa-standalone-kiosk .efa-kiosk-topbar{grid-template-columns:minmax(260px,1fr) auto;grid-template-areas:'brand clock' 'status status';padding:8px 12px;gap:6px}
 .efa-standalone-kiosk .efa-brand-block{grid-area:brand}.efa-standalone-kiosk .efa-clock{grid-area:clock;width:auto;min-width:175px;padding:6px 10px}.efa-standalone-kiosk .efa-kiosk-status-strip{grid-area:status;justify-content:flex-start}
 .efa-standalone-kiosk .efa-kiosk-grid{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);overflow:hidden;gap:8px}
 .efa-standalone-kiosk .efa-kiosk-card{overflow:hidden;padding:10px;gap:7px}
 .efa-standalone-kiosk .efa-camera-card .efa-video-box{width:min(100%,520px);align-self:center;aspect-ratio:4/3;min-height:0;max-height:calc(100dvh - 245px)}
 .efa-standalone-kiosk .efa-help{padding:7px 9px;font-size:11px;line-height:1.25}
 .efa-standalone-kiosk .efa-action-card{display:grid;grid-template-rows:auto minmax(0,1fr) auto auto}
 .efa-standalone-kiosk .efa-kiosk-actions{grid-template-columns:1fr;gap:8px;min-height:0}
 .efa-standalone-kiosk .efa-action{min-height:0;height:100%;flex-direction:row;gap:12px;padding:8px 14px}
 .efa-standalone-kiosk .efa-action span{width:52px;height:52px;font-size:28px;flex:0 0 auto}.efa-standalone-kiosk .efa-action strong{font-size:22px}.efa-standalone-kiosk .efa-action small{font-size:12px}
 .efa-standalone-kiosk .efa-result{min-height:42px;padding:7px;font-size:11px}.efa-standalone-kiosk .efa-kiosk-footer-note{font-size:10px}
}
@media (max-width:699px){body.efa-standalone-kiosk{overflow:auto!important}.efa-standalone-kiosk .efa-kiosk-shell{height:auto;min-height:100dvh;overflow:visible}.efa-standalone-kiosk .efa-camera-card .efa-video-box{aspect-ratio:4/3;min-height:220px}.efa-standalone-kiosk .efa-kiosk-grid{grid-template-columns:1fr}.efa-standalone-kiosk .efa-kiosk-actions{grid-template-columns:1fr 1fr}.efa-standalone-kiosk .efa-action{min-height:120px}}

/* Direct Purchase catalog/grid parity with POS Sales */
.purchase-order-lines-table{table-layout:fixed;min-width:max-content}
.purchase-order-lines-table th,.purchase-order-lines-table td{width:100px;min-width:100px;max-width:100px;box-sizing:border-box}
.purchase-order-lines-table th[data-col="product"],.purchase-order-lines-table td[data-col="product"]{width:300px;min-width:300px;max-width:300px}
.purchase-order-lines-table .purchase-grid-input,.purchase-order-lines-table select.purchase-grid-input{width:100%;min-width:0;box-sizing:border-box}
.purchase-cell-suggestions{width:300px!important;max-width:300px!important}
.purchase-catalog-grid article{border-radius:0;min-height:145px;padding:10px}
.purchase-catalog-card-actions{display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:8px!important}
.purchase-catalog-added-mark{display:inline-flex;align-self:flex-start;background:#2563eb;color:#fff!important;border-radius:999px;padding:3px 8px;font-weight:800}
.purchase-catalog-qty{display:grid!important;grid-template-columns:36px 62px auto 36px auto!important;align-items:center!important;border:0!important;gap:8px!important;background:transparent!important;overflow:visible!important}
.purchase-catalog-qty button{height:32px!important;border-radius:4px!important;background:#2563eb!important;color:#fff!important;padding:4px 10px!important}
.purchase-catalog-qty input{height:32px;width:62px;border:1px solid var(--border,#cbd5e1)!important}
.purchase-catalog-unit{color:var(--muted,#64748b);white-space:nowrap}
.purchase-catalog-qty [data-catalog-remove]{margin-left:auto;background:var(--soft,#e5e7eb)!important;color:var(--text,#111827)!important}
.purchase-catalog-image img{display:block;max-width:100%;max-height:100%;object-fit:contain}

/* Direct Purchase VAT/date/master-space refinement */
.purchase-order-info-card{padding:9px 12px!important}
.purchase-order-info-grid{gap:28px!important;grid-template-columns:minmax(420px,.9fr) minmax(620px,1.35fr)!important}
.purchase-order-info-card .purchase-form-column{grid-template-columns:132px minmax(0,1fr);gap:4px 10px!important;align-content:start}
.purchase-order-info-card .purchase-field{min-height:27px;padding:3px 7px}
.purchase-order-info-card .purchase-supplier-panel{min-height:52px;padding:7px 10px;gap:2px}
.purchase-order-info-card .purchase-supplier-panel span{line-height:1.2}
.purchase-order-info-card .purchase-lookup-row{grid-template-columns:minmax(0,1fr) 34px;gap:6px}
.purchase-order-lines-table .purchase-serial-col{width:1%!important;min-width:34px!important;max-width:52px!important;padding-left:6px!important;padding-right:6px!important;text-align:center;white-space:nowrap}
.purchase-date-cell{display:grid;grid-template-columns:minmax(0,1fr) 27px;align-items:center;position:relative;width:100%}
.purchase-date-cell .purchase-date-text{padding-right:3px!important}
.purchase-calendar-btn{height:27px;width:27px;border:0;border-left:1px solid rgba(37,99,235,.25);background:transparent;color:var(--brand,#2563eb);cursor:pointer;font-size:13px;line-height:1}
.purchase-calendar-btn:hover,.purchase-calendar-btn:focus{background:rgba(37,99,235,.08);outline:none}
.purchase-native-date{position:absolute;right:0;bottom:0;width:1px;height:1px;opacity:0;pointer-events:none}
@media (max-width:1250px){.purchase-order-info-grid{grid-template-columns:1fr!important;gap:10px!important}.purchase-order-info-card .purchase-form-column{grid-template-columns:145px minmax(0,1fr)}}
.purchase-order-lines-table .purchase-tax-readonly{background:rgba(15,23,42,.035);color:#334155;cursor:not-allowed}


/* Direct Purchase unit conversion, expiry picker and compact delete action */
.purchase-order-lines-table .purchase-delete-col{width:42px!important;min-width:42px!important;max-width:42px!important;padding:3px!important;text-align:center}
.purchase-delete-line{display:inline-grid;place-items:center;width:28px;height:28px;padding:0;border:1px solid #fecaca;border-radius:6px;background:#fff5f5;color:#dc2626;cursor:pointer}
.purchase-delete-line:hover,.purchase-delete-line:focus{background:#fee2e2;border-color:#f87171;outline:none}
.purchase-delete-line svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.purchase-date-cell{grid-template-columns:minmax(0,1fr) 30px}
.purchase-calendar-btn{width:30px;height:30px;display:grid;place-items:center;border-left:1px solid rgba(37,99,235,.25);pointer-events:none}
.purchase-calendar-btn svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.purchase-native-date{position:absolute!important;right:0!important;top:0!important;bottom:auto!important;width:30px!important;height:30px!important;opacity:.01!important;pointer-events:auto!important;cursor:pointer!important;z-index:3}
.purchase-native-date::-webkit-calendar-picker-indicator{width:100%;height:100%;margin:0;cursor:pointer}

/* Direct Purchase compact master-field arrangement */
.purchase-order-info-grid{
    grid-template-columns:minmax(480px,1.05fr) minmax(520px,.95fr)!important;
    gap:24px!important;
}
.purchase-order-info-card .purchase-form-column{
    grid-template-columns:128px minmax(220px,360px)!important;
    justify-content:start;
    column-gap:10px!important;
    row-gap:3px!important;
}
.purchase-order-info-card .purchase-master-control{
    width:100%;
    max-width:360px;
}
.purchase-order-info-card .purchase-date-control{max-width:220px}
.purchase-order-info-card .purchase-currency-rate{
    width:100%;
    max-width:300px;
    grid-template-columns:105px 1fr;
}
.purchase-order-info-card .purchase-general-fields{
    grid-template-columns:118px minmax(190px,285px)!important;
}
.purchase-order-info-card .purchase-general-fields .purchase-master-control{max-width:285px}
.purchase-order-info-card .purchase-general-fields .purchase-date-control{max-width:210px}
.purchase-order-info-card .purchase-general-fields .purchase-checkbox{min-height:27px}
@media (min-width:1450px){
    .purchase-order-info-card .purchase-general-fields{
        grid-template-columns:118px minmax(175px,245px) 118px minmax(175px,245px)!important;
        column-gap:10px!important;
    }
    .purchase-order-info-card .purchase-general-fields .purchase-master-control{max-width:245px}
    .purchase-order-info-card .purchase-general-fields .purchase-date-control{max-width:205px}
    .purchase-order-info-card .purchase-general-fields .purchase-currency-rate{max-width:245px;grid-template-columns:88px 1fr}
}
@media (max-width:1250px){
    .purchase-order-info-grid{grid-template-columns:1fr!important}
    .purchase-order-info-card .purchase-form-column,
    .purchase-order-info-card .purchase-general-fields{grid-template-columns:145px minmax(220px,360px)!important}
}
@media (max-width:680px){
    .purchase-order-info-card .purchase-form-column,
    .purchase-order-info-card .purchase-general-fields{grid-template-columns:1fr!important}
    .purchase-order-info-card .purchase-master-control,
    .purchase-order-info-card .purchase-general-fields .purchase-master-control,
    .purchase-order-info-card .purchase-date-control,
    .purchase-order-info-card .purchase-currency-rate{max-width:none}
}

/* Direct Purchase catalog containment, product editor, custom-view header and unrestricted column resizing */
.purchase-catalog-grid article{overflow:hidden;min-width:0}
.purchase-catalog-card-actions{min-width:0;width:100%;box-sizing:border-box}
.purchase-catalog-qty{display:flex!important;flex-wrap:nowrap!important;align-items:center!important;gap:7px!important;width:100%;min-width:0;box-sizing:border-box}
.purchase-catalog-qty button{flex:0 0 36px!important;width:36px!important;height:32px!important;padding:0!important;display:grid!important;place-items:center!important}
.purchase-catalog-qty input{flex:0 0 62px!important;width:62px!important;min-width:0!important}
.purchase-catalog-unit{flex:0 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis}
.purchase-catalog-qty .purchase-catalog-remove-icon{margin-left:auto!important;flex:0 0 32px!important;width:32px!important;border:1px solid #fecaca!important;background:#fff5f5!important;color:#dc2626!important;border-radius:6px!important}
.purchase-catalog-remove-icon svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.purchase-catalog-image-placeholder{color:var(--muted,#94a3b8);font-size:20px}.purchase-catalog-image.image-missing:after{content:'▧';color:var(--muted,#94a3b8);font-size:20px}
.purchase-stock-editor-card{width:min(1380px,97vw);height:min(900px,95vh);max-height:none;padding:0;overflow:hidden;display:flex;flex-direction:column}
.purchase-stock-editor-card .column-title{padding:12px 16px;margin:0;border-bottom:1px solid var(--border,#dbe5e1);background:var(--soft,#eef4ff)}
.purchase-stock-editor-card iframe{width:100%;flex:1;border:0;background:var(--card,#fff)}
.purchase-column-header-btn{width:30px;height:30px;border:1px solid var(--border,#cbd5e1);border-radius:6px;background:var(--card,#fff);color:var(--text,#111827);display:inline-grid;place-items:center;cursor:pointer}
.purchase-column-header-btn svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
.purchase-order-lines-table th[data-col]{position:relative;max-width:none!important}
.purchase-order-lines-table td[data-col]{max-width:none!important}
.purchase-col-resizer{position:absolute;top:0;right:-4px;width:8px;height:100%;cursor:col-resize;touch-action:none;z-index:4}
.purchase-col-resizer:hover:after{content:'';position:absolute;top:4px;bottom:4px;left:3px;width:2px;background:var(--brand,#2563eb)}
.purchase-order-lines-table th[data-col="product"],.purchase-order-lines-table td[data-col="product"]{max-width:none!important}
.purchase-catalog-grid{grid-template-columns:repeat(4,minmax(260px,1fr))!important}
@media(max-width:1180px){.purchase-catalog-grid{grid-template-columns:repeat(3,minmax(250px,1fr))!important}}
@media(max-width:850px){.purchase-catalog-grid{grid-template-columns:repeat(2,minmax(240px,1fr))!important}}
@media(max-width:560px){.purchase-catalog-grid{grid-template-columns:1fr!important}}

/* Direct Purchase document heading and compact supplier invoice identity */
.purchase-title-lines{display:flex;flex-direction:column;align-items:flex-start;gap:3px}
.purchase-document-line{display:flex;align-items:center;gap:8px;min-height:30px}
.purchase-document-line [data-document-number]{font-size:22px;line-height:1.1;color:#062f1d;font-weight:800}
.purchase-document-line .purchase-state-pill{margin-left:0}
.purchase-actual-invoice{grid-column:1 / -1;font-size:clamp(25px,2.5vw,38px);line-height:1.05;font-weight:500;letter-spacing:.01em;color:var(--erp-text,#102033);padding:0 0 8px 0;min-height:38px;overflow-wrap:anywhere}
@media (max-width:700px){.purchase-actual-invoice{font-size:25px}.purchase-document-line [data-document-number]{font-size:19px}}

/* Direct Purchase grid editing alignment and full-text focus */
.purchase-order-lines-table td[data-col="qty"],
.purchase-order-lines-table td[data-col="freeQty"]{text-align:center!important}
.purchase-order-lines-table td[data-col="qty"] .purchase-grid-input,
.purchase-order-lines-table td[data-col="freeQty"] .purchase-grid-input{text-align:center!important;font-variant-numeric:tabular-nums}
.purchase-order-lines-table td[data-col="unitPrice"],
.purchase-order-lines-table td[data-col="netRate"],
.purchase-order-lines-table td[data-col="disc"],
.purchase-order-lines-table td[data-col="disc2"],
.purchase-order-lines-table td[data-col="tax"],
.purchase-order-lines-table td[data-col="taxValue"],
.purchase-order-lines-table td[data-col="mrp"],
.purchase-order-lines-table td[data-col="value"],
.purchase-order-lines-table td[data-col="lastPrice"],
.purchase-order-lines-table td[data-col="stockQty"]{text-align:right!important;font-variant-numeric:tabular-nums}
.purchase-order-lines-table td[data-col="unitPrice"] .purchase-grid-input,
.purchase-order-lines-table td[data-col="netRate"] .purchase-grid-input,
.purchase-order-lines-table td[data-col="disc"] .purchase-grid-input,
.purchase-order-lines-table td[data-col="disc2"] .purchase-grid-input,
.purchase-order-lines-table td[data-col="tax"] .purchase-grid-input,
.purchase-order-lines-table td[data-col="taxValue"] .purchase-grid-input,
.purchase-order-lines-table td[data-col="mrp"] .purchase-grid-input,
.purchase-order-lines-table td[data-col="value"] .purchase-grid-input,
.purchase-order-lines-table td[data-col="lastPrice"] .purchase-grid-input,
.purchase-order-lines-table td[data-col="stockQty"] .purchase-grid-input{text-align:right!important;font-variant-numeric:tabular-nums}


/* Direct Purchase: catalog, product identity and row reorder refinements */
.purchase-product-editor{min-width:0;display:flex;flex-direction:column;gap:2px}
.purchase-product-code-line{display:block;min-height:15px;padding:0 7px;color:var(--muted,#64748b);font-size:11px;font-weight:700;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.purchase-product-cell{align-items:start!important}
.purchase-product-cell>.purchase-product-editor{width:100%}
.purchase-order-lines-table .row-handle{width:34px!important;min-width:34px!important;max-width:34px!important;text-align:center;cursor:grab;user-select:none}
.purchase-order-lines-table .row-handle:active{cursor:grabbing}
.purchase-row-dragging{opacity:.45}
.purchase-row-drop-target{outline:2px solid var(--brand,#2563eb);outline-offset:-2px}
.purchase-catalog-grid article{box-sizing:border-box!important}
.purchase-catalog-card-actions{margin-top:auto!important;overflow:hidden!important}
.purchase-catalog-qty{display:grid!important;grid-template-columns:34px minmax(48px,62px) minmax(24px,auto) 34px 32px!important;width:100%!important;gap:6px!important;align-items:center!important;box-sizing:border-box!important}
.purchase-catalog-qty button{width:34px!important;min-width:34px!important;height:32px!important;padding:0!important;margin:0!important}
.purchase-catalog-qty input{width:100%!important;min-width:0!important;height:32px!important;box-sizing:border-box!important}
.purchase-catalog-unit{min-width:0!important;overflow:hidden!important;text-overflow:ellipsis!important}
.purchase-catalog-remove-icon{margin:0!important}
@media(max-width:720px){.purchase-catalog-qty{grid-template-columns:32px minmax(44px,56px) minmax(22px,auto) 32px 30px!important;gap:4px!important}}

/* Direct Purchase activity/chatter and final active-theme consistency */
.purchase-activity-card{margin-top:14px;padding:0;overflow:hidden;background:var(--card,var(--erp-card-bg,#fff));color:var(--text,var(--erp-text,#102033));border:1px solid var(--border,var(--erp-border,#dbe4ee))}
.purchase-activity-toolbar{display:flex;gap:6px;align-items:center;padding:8px;border-bottom:1px solid var(--border,var(--erp-border,#dbe4ee));background:var(--soft,var(--erp-control-soft,#f7f9fc))}
.purchase-activity-toolbar [data-refresh-purchase-activity]{margin-left:auto}
.purchase-activity-toolbar .active{background:var(--brand,var(--erp-primary,#008c6a))!important;color:var(--brand-contrast,#fff)!important;border-color:var(--brand,var(--erp-primary,#008c6a))!important}
.purchase-activity-note{display:grid;gap:8px;padding:12px;border-bottom:1px solid var(--border,var(--erp-border,#dbe4ee))}
.purchase-activity-note textarea{resize:vertical;min-height:72px}
.purchase-activity-list{min-height:76px;padding:8px 14px 14px}
.purchase-activity-list.activity-only{min-height:130px}
.purchase-activity-empty{padding:18px 8px;color:var(--muted,var(--erp-muted,#64748b));border:1px dashed var(--border,var(--erp-border,#cbd5e1));border-radius:8px}
.purchase-activity-item{display:grid;grid-template-columns:38px 1fr;gap:10px;padding:11px 4px;border-bottom:1px solid var(--border,var(--erp-border,#e5e7eb))}
.purchase-activity-item:last-child{border-bottom:0}.purchase-activity-avatar{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--brand,var(--erp-primary,#008c6a)) 14%,var(--card,#fff));color:var(--brand,var(--erp-primary,#008c6a));font-weight:800}
.purchase-activity-heading{display:flex;justify-content:space-between;gap:12px}.purchase-activity-heading time,.purchase-activity-user{font-size:.78rem;color:var(--muted,var(--erp-muted,#64748b))}.purchase-activity-item p{margin:.35rem 0 0;white-space:pre-wrap}

/* Project-wide theme hardening: controls, grids, lists, dropdowns and lookup/dialog surfaces */
body :where(input:not([type=checkbox]):not([type=radio]),select,textarea){background:var(--theme-input-bg,var(--card,#fff));color:var(--text,#102033);border-color:var(--border,#d8dee8)}
body :where(input:not([type=checkbox]):not([type=radio]),select,textarea):focus{border-color:var(--brand,#008c6a);box-shadow:0 0 0 3px color-mix(in srgb,var(--brand,#008c6a) 14%,transparent);outline:0}
body :where(table,thead,tbody,tr,th,td){border-color:var(--border,#d8dee8)}
body :where(th){background:var(--soft,#f5f7fb);color:var(--text,#102033)}
body :where(td){background:var(--card,#fff);color:var(--text,#102033)}
body :where(.modal-content,.dialog,.lookup-modal,.lookup-panel,.purchase-column-card,.dropdown-menu,.suggestions,.purchase-suggestion-list){background:var(--card,#fff);color:var(--text,#102033);border-color:var(--border,#d8dee8)}
body :where(.dropdown-item,.lookup-row,.suggestion-item,option){color:var(--text,#102033)}
body :where(.dropdown-item:hover,.lookup-row:hover,.suggestion-item:hover){background:var(--soft,#f5f7fb)}
body :where(label,.form-label,.field-label){color:var(--text,#102033)}
body :where(.btn,button){font:inherit}

/* Direct Purchase compact product rows: align with POS Sales grid density. */
.purchase-order-lines-table tbody td{padding:3px 6px!important;height:44px!important;line-height:1.15!important}
.purchase-order-lines-table .purchase-grid-input,
.purchase-order-lines-table select.purchase-grid-input{padding:3px 5px!important;min-height:28px!important;height:28px!important;line-height:20px!important}
.purchase-order-lines-table .purchase-product-cell{min-height:34px!important;align-items:center!important;grid-template-columns:minmax(210px,1fr) 26px!important}
.purchase-order-lines-table .purchase-product-editor{display:flex!important;flex-direction:column!important;justify-content:center!important;min-height:34px!important}
.purchase-order-lines-table .purchase-product-cell button{width:24px!important;height:24px!important;min-width:24px!important;padding:0!important}
.purchase-order-lines-table .purchase-product-code-line{min-height:12px!important;padding:0 5px!important;font-size:10px!important;line-height:12px!important}
.purchase-order-lines-table .purchase-date-cell{min-height:28px!important}
.purchase-order-lines-table .purchase-calendar-btn{width:24px!important;height:24px!important;padding:3px!important}
.purchase-order-lines-table .purchase-delete-line{width:24px!important;height:24px!important;padding:3px!important}

/* 2026-07-11: selected-theme consistency hardening.
   Keep legacy --erp-* and module-specific aliases synchronized with the active user theme. */
body {
    --erp-page-bg: var(--bg);
    --erp-card-bg: var(--card);
    --erp-panel-bg: var(--card);
    --erp-input-bg: var(--card);
    --erp-control-bg: var(--card);
    --erp-control-soft: var(--soft);
    --erp-text: var(--text);
    --erp-text-muted: var(--muted);
    --erp-muted: var(--muted);
    --erp-border: var(--border);
    --erp-primary: var(--brand);
    --erp-primary-dark: var(--brand-dark);
    --erp-primary-soft: var(--soft);
    --theme-input-bg: var(--card);
    --theme-bg: var(--bg);
    --theme-card: var(--card);
    --theme-surface: var(--card);
    --theme-text: var(--text);
    --theme-muted: var(--muted);
    --theme-border: var(--border);
    --theme-soft: var(--soft);
    --theme-primary: var(--brand);
    --theme-secondary: var(--brand-dark);
    --theme-primary-text: var(--on-brand);
    --erp-on-primary: var(--on-brand);
    --brand-contrast: var(--on-brand);
}

/* Direct Purchase must inherit the same selected theme as the rest of ERPWebMvc. */
.purchase-page-shell,
.purchase-page-shell .purchase-topline,
.purchase-page-shell .purchase-action-header,
.purchase-page-shell .purchase-toolbar,
.purchase-page-shell .purchase-card,
.purchase-page-shell .purchase-tabs,
.purchase-page-shell .purchase-table-wrap,
.purchase-page-shell .purchase-row-actions,
.purchase-page-shell .purchase-bottom-grid,
.purchase-page-shell .purchase-activity-card {
    background: var(--card) !important;
    color: var(--text) !important;
    border-color: var(--border) !important;
}
.purchase-page-shell { background: var(--bg) !important; }
.purchase-page-shell :where(h1,h2,h3,h4,h5,h6,strong,label,span,p,div) { color: inherit; }
.purchase-page-shell :where(.purchase-breadcrumb span,.purchase-company,.purchase-product-code-line,.purchase-supplier-panel span,.purchase-activity-user,.purchase-activity-heading time) {
    color: var(--muted) !important;
}
.purchase-page-shell :where(input:not([type=checkbox]):not([type=radio]),select,textarea,.purchase-field,.purchase-grid-input) {
    background: var(--card) !important;
    color: var(--text) !important;
    border-color: var(--border) !important;
}
.purchase-page-shell :where(input:not([type=checkbox]):not([type=radio]),select,textarea,.purchase-field,.purchase-grid-input):focus {
    border-color: var(--brand) !important;
    outline-color: var(--brand) !important;
    box-shadow: 0 0 0 3px color-mix(in srgb,var(--brand) 16%,transparent) !important;
}
.purchase-page-shell :where(.purchase-primary,.purchase-state-pill,.purchase-stagebar .active,.purchase-activity-toolbar .active) {
    background: var(--brand) !important;
    border-color: var(--brand) !important;
    color: var(--brand-contrast) !important;
}
.purchase-page-shell :where(.purchase-outline,.purchase-icon-btn,.purchase-calendar-btn,.purchase-column-header-btn,.purchase-row-actions button,.purchase-record-nav button,.purchase-tabs button) {
    background: var(--card) !important;
    color: var(--brand) !important;
    border-color: var(--border) !important;
}
.purchase-page-shell :where(.purchase-outline,.purchase-icon-btn,.purchase-calendar-btn,.purchase-column-header-btn,.purchase-row-actions button,.purchase-record-nav button,.purchase-tabs button):hover {
    background: var(--soft) !important;
    border-color: var(--brand) !important;
}
.purchase-page-shell .purchase-tabs button.active {
    background: var(--soft) !important;
    color: var(--brand) !important;
    border-color: var(--brand) !important;
}
.purchase-page-shell .purchase-stagebar span {
    background: var(--soft) !important;
    color: var(--muted) !important;
    border-color: var(--border) !important;
}
.purchase-page-shell .purchase-stagebar span.active { color: var(--brand-contrast) !important; }
.purchase-page-shell :where(.purchase-supplier-panel,.purchase-alert,.purchase-activity-toolbar,.purchase-grid-toolbar) {
    background: var(--soft) !important;
    color: var(--text) !important;
    border-color: var(--border) !important;
}
.purchase-page-shell .purchase-actual-invoice,
.purchase-page-shell .purchase-document-line [data-document-number] { color: var(--text) !important; }
.purchase-page-shell table :where(th,td) {
    background: var(--card) !important;
    color: var(--text) !important;
    border-color: var(--border) !important;
}
.purchase-page-shell table th { background: var(--soft) !important; }
.purchase-page-shell .purchase-order-lines-table tbody tr:hover td { background: color-mix(in srgb,var(--soft) 72%,var(--card)) !important; }
.purchase-page-shell :where(.purchase-suggestion-list,.purchase-cell-suggestions,.purchase-product-search-card,.purchase-supplier-search-card,.purchase-catalog-card,.purchase-stock-editor-card,.purchase-column-card) {
    background: var(--card) !important;
    color: var(--text) !important;
    border-color: var(--border) !important;
}
.purchase-page-shell :where(.purchase-suggestion-list button,.purchase-cell-suggestions button,.purchase-product-table-results button,.purchase-supplier-modal-results button) {
    background: var(--card) !important;
    color: var(--text) !important;
    border-color: var(--border) !important;
}
.purchase-page-shell :where(.purchase-suggestion-list button,.purchase-cell-suggestions button,.purchase-product-table-results button,.purchase-supplier-modal-results button):hover {
    background: var(--soft) !important;
}
.purchase-page-shell :where(.purchase-product-table-head,.purchase-supplier-table-head,.purchase-lookup-searchbar,.purchase-lookup-footer,.purchase-catalog-card .column-title,.purchase-stock-editor-card .column-title,.purchase-column-card .column-title) {
    background: var(--soft) !important;
    color: var(--text) !important;
    border-color: var(--border) !important;
}
.purchase-page-shell .purchase-catalog-grid,
.purchase-page-shell .purchase-catalog-grid article {
    background: var(--card) !important;
    color: var(--text) !important;
    border-color: var(--border) !important;
}
.purchase-page-shell .purchase-catalog-grid article.catalog-added {
    background: color-mix(in srgb,var(--brand) 8%,var(--card)) !important;
    border-color: var(--brand) !important;
}
.purchase-page-shell .purchase-catalog-image { background: var(--card) !important; border-color: var(--border) !important; }
.purchase-page-shell .purchase-danger,
.purchase-page-shell .purchase-delete-line,
.purchase-page-shell .purchase-catalog-remove-icon { color:#dc2626 !important; }

/* Shared theme enforcement for pages that still carry old fixed white/grey module CSS. */
body :where(.page-shell,.list-shell,.form-shell,.report-shell,.dashboard-shell,.module-shell,.content-shell,
            .page-card,.form-card,.list-card,.report-card,.dashboard-card,.module-card,.info-card,
            .modal-card,.lookup-card,.dialog-card,.drawer,.side-panel,.toolbar,.filter-bar,.search-bar,
            .table-wrap,.grid-wrap,.list-wrap,.tab-content,.tab-pane) {
    color: var(--text);
    border-color: var(--border);
}
body :where(.page-card,.form-card,.list-card,.report-card,.dashboard-card,.module-card,.info-card,
            .modal-card,.lookup-card,.dialog-card,.drawer,.side-panel,.table-wrap,.grid-wrap,.list-wrap,.tab-content,.tab-pane) {
    background-color: var(--card);
}
body :where(.toolbar,.filter-bar,.search-bar,.section-header,.card-header,.table-toolbar,.grid-toolbar) {
    background-color: var(--soft);
    color: var(--text);
    border-color: var(--border);
}
body :where(.lookup-modal,.modal,.dialog,.drawer,.dropdown-menu,.suggestions,.autocomplete-list) :where(input,select,textarea,button) {
    color: var(--text);
    border-color: var(--border);
}
body :where(.lookup-modal,.modal,.dialog,.drawer,.dropdown-menu,.suggestions,.autocomplete-list) :where(input,select,textarea) {
    background: var(--card);
}

body.theme-dark,
body.theme-midnight,
body.theme-carbon {
    color-scheme: dark;
    --brand-contrast: var(--on-brand);
}
body.theme-dark :where(input,select,textarea,option),
body.theme-midnight :where(input,select,textarea,option),
body.theme-carbon :where(input,select,textarea,option) {
    color-scheme: dark;
}

/* Global page gutter: keep all dashboard/forms close to the viewport edges. */
.main-area { padding-left: 5px !important; padding-right: 5px !important; }

/* ERP date picker year -> month -> day navigation. */
.erp-date-picker-title {
    flex: 1 1 auto;
    min-width: 0;
    border: 0 !important;
    background: transparent !important;
    color: var(--text, #172033) !important;
    font-weight: 800;
    cursor: pointer;
}
.erp-date-picker-choice-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    padding: 8px 2px 10px;
}
.erp-date-picker-choice-grid[hidden] { display: none !important; }
.erp-date-choice {
    min-height: 42px;
    border: 1px solid var(--border, #d5d9e2);
    border-radius: 9px;
    background: var(--surface, #fff);
    color: var(--text, #172033);
    font-weight: 700;
    cursor: pointer;
}
.erp-date-choice:hover,
.erp-date-choice.is-selected {
    border-color: var(--theme-primary, var(--brand, #2563eb));
    background: var(--theme-primary-soft, rgba(37,99,235,.10));
    color: var(--theme-primary, var(--brand, #2563eb));
}

/* Embedded Stock Item editor shown from Direct Purchase: form only, no application chrome. */
.purchase-stock-editor-card iframe { background: var(--surface, #fff); }
body:has(.stock-item-edit-page) .main-area:has(.stock-item-edit-page) {
    padding: 0 !important;
}
body:has(.stock-item-edit-page) .main-area:has(.stock-item-edit-page) > .erp-notification-slot,
body:has(.stock-item-edit-page) .main-area:has(.stock-item-edit-page) > .mobile-sidebar-toggle {
    display: none !important;
}


/* Direct Purchase temporary product row, sticky invoice header, and kiosk scanner motion */
.purchase-sticky-header{
    position:sticky;
    top:0;
    z-index:1200;
    background:var(--erp-page-bg,var(--page-bg,#fff));
    box-shadow:0 1px 0 var(--erp-border,var(--border,#dbe4ef));
}
.purchase-sticky-header .purchase-topline,
.purchase-sticky-header .purchase-action-header,
.purchase-sticky-header .purchase-toolbar{background:inherit!important}
.purchase-temporary-row .row-handle{cursor:default;opacity:.35}
body.efa-standalone-kiosk{cursor:default!important}
.efa-standalone-kiosk .efa-action:disabled{cursor:not-allowed!important}
.efa-standalone-kiosk .efa-scan-line{
    top:22%!important;
    animation:efaScanSweep 2.15s ease-in-out infinite!important;
    will-change:transform,opacity;
}
@keyframes efaScanSweep{
    0%{transform:translateY(0);opacity:.25}
    15%{opacity:1}
    50%{transform:translateY(20vh);opacity:1}
    85%{opacity:1}
    100%{transform:translateY(0);opacity:.25}
}
@media (prefers-reduced-motion:reduce){
    .efa-standalone-kiosk .efa-scan-line{animation:efaScanSweep 2.8s ease-in-out infinite!important}
}


/* Sticky navigation, notification visibility, and typed-only Direct Purchase suggestions */
@media (min-width: 901px) {
    .app-shell > .erp-sidebar {
        position: sticky !important;
        top: 0 !important;
        align-self: start !important;
        height: 100vh !important;
        min-height: 100vh !important;
        max-height: 100vh !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
        overscroll-behavior: contain;
    }
}
.main-area > .erp-notification-slot {
    z-index: 1800 !important;
    top: 8px !important;
    right: 10px !important;
}
.purchase-sticky-header .purchase-company {
    padding-right: 54px;
}
@media (max-width: 720px) {
    .purchase-sticky-header .purchase-company { padding-right: 42px; }
}

/* POS (Sales) sticky header and reliable date picker year/month controls */
.sales-entry-page .sales-sticky-header {
    position: sticky;
    top: 0;
    z-index: 1300;
    background: var(--erp-page-bg, var(--page-bg, #fff));
    box-shadow: 0 1px 0 var(--erp-border, var(--border, #dbe4ef));
}
.sales-entry-page .sales-sticky-header .sales-odoo-mini,
.sales-entry-page .sales-sticky-header .sales-odoo-actionbar {
    background: inherit !important;
}
.sales-entry-page .sales-mini-company {
    padding-right: 58px;
}
.main-area:has(.sales-entry-page) > .erp-notification-slot {
    position: fixed !important;
    top: 8px !important;
    right: 10px !important;
    z-index: 1900 !important;
}
@media (max-width: 720px) {
    .sales-entry-page .sales-mini-company { padding-right: 44px; }
}
.erp-date-picker-title {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1px;
    min-width: 170px;
    min-height: 44px;
    line-height: 1.15;
    text-align: center;
    overflow: visible;
}
.erp-date-picker-title button {
    appearance: none;
    width: auto !important;
    height: auto !important;
    max-width: 100%;
    border: 0 !important;
    background: transparent !important;
    color: inherit !important;
    font: inherit;
    font-weight: 800;
    line-height: 1.15;
    padding: 2px 8px !important;
    min-width: 0 !important;
    cursor: pointer;
    border-radius: 6px;
    white-space: nowrap;
}
.erp-date-picker-title .erp-date-title-year,
.erp-date-picker-title .erp-date-title-range {
    display: block;
    font-size: 15px;
    font-weight: 950;
    letter-spacing: .02em;
}
.erp-date-picker-title .erp-date-title-month,
.erp-date-picker-title .erp-date-title-mode {
    display: block;
    font-size: 12px;
    font-weight: 800;
    color: var(--theme-muted, var(--muted, #64748b));
    white-space: nowrap;
}
.erp-date-picker-title .erp-date-title-month {
    color: var(--theme-text, var(--text, #0f172a));
    font-size: 13px;
}
.erp-date-picker-title button:hover,
.erp-date-picker-title button:focus-visible {
    background: var(--theme-primary-soft, var(--soft, rgba(37,99,235,.10))) !important;
    color: var(--theme-primary, var(--brand, #2563eb)) !important;
    outline: 2px solid color-mix(in srgb, var(--theme-primary, var(--brand, #2563eb)) 35%, transparent);
    outline-offset: 1px;
}
.erp-date-picker-choice-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 7px;
    padding: 10px 0 8px;
}
.daily-sales-date-picker-weekdays[hidden],
.daily-sales-date-picker-grid[hidden],
.erp-date-picker-choice-grid[hidden] {
    display: none !important;
}
.erp-date-picker-choice-grid:not([hidden]) { display: grid !important; }
.erp-date-picker-choice-grid .erp-date-choice {
    min-height: 40px;
    padding: 7px 4px;
    font-size: 12px;
    line-height: 1.15;
    white-space: nowrap;
    cursor: pointer;
}
.erp-date-picker-choice-grid[data-erp-choice-mode="years"] .erp-date-choice {
    font-variant-numeric: tabular-nums;
}
.erp-date-picker-choice-grid .erp-date-choice.outside-range {
    color: color-mix(in srgb, var(--theme-muted, var(--muted, #64748b)) 60%, transparent) !important;
    opacity: .72;
}
.erp-date-picker-choice-grid .erp-date-choice.outside-range:hover,
.erp-date-picker-choice-grid .erp-date-choice.outside-range:focus-visible {
    opacity: 1;
}

/* Direct Purchase: keep the supplier VAT/tax number field explicitly visible. */
.purchase-form-card .purchase-supplier-vat-number {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    min-width: 0;
    width: 100%;
    color: var(--text);
    background: var(--soft);
}

/* Direct Purchase: compact catalog quantity controls and real navigation */
.purchase-catalog-qty{grid-template-columns:34px minmax(48px,62px) 34px 32px!important;justify-content:start!important;width:auto!important;max-width:100%!important}
.purchase-catalog-card-actions{overflow:visible!important}
.purchase-record-nav .purchase-nav-btn{display:inline-grid;place-items:center;width:34px;height:34px;border:1px solid var(--border);border-radius:9px;color:var(--brand);background:var(--card);text-decoration:none;font-weight:800}
.purchase-record-nav .purchase-nav-btn.disabled{pointer-events:none;opacity:.45}

/* POS (Sales): keep the sticky action bar inside the main content column.
   The legacy negative horizontal margin made the Save button paint over the
   collapsed left navigation. */
.sales-entry-page .sales-sticky-header {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    overflow: visible;
}
.sales-entry-page .sales-sticky-header .sales-odoo-mini,
.sales-entry-page .sales-sticky-header .sales-odoo-actionbar {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    margin-left: 0 !important;
    margin-right: 0 !important;
}
.sales-entry-page .sales-sticky-header .sales-odoo-actionbar {
    padding-left: 6px !important;
    padding-right: 6px !important;
}
.sales-entry-page .sales-sticky-header .sales-odoo-mini {
    padding-left: 6px;
    padding-right: 6px;
}
@media (min-width: 721px) {
    .main-area:has(.sales-entry-page) {
        overflow-x: hidden;
    }
}

/* Direct Purchase: paged old-invoice lookup opened by the Load action. */
.purchase-load-search-card{width:min(1180px,calc(100vw - 28px));max-height:min(82vh,760px);display:flex;flex-direction:column}
.purchase-load-table-head,.purchase-load-row{display:grid;grid-template-columns:minmax(130px,1fr) 110px minmax(150px,1.15fr) minmax(220px,1.7fr) minmax(140px,1.1fr) minmax(120px,.8fr);align-items:center;gap:0}
.purchase-load-table-head{padding:9px 12px;background:var(--theme-primary-soft,var(--soft));border-top:1px solid var(--border);border-bottom:1px solid var(--border);font-weight:800;color:var(--text)}
.purchase-load-results{min-height:220px;max-height:55vh;overflow:auto;background:var(--card)}
.purchase-load-row{width:100%;border:0;border-bottom:1px solid var(--border);background:var(--card);color:var(--text);padding:0;text-align:left;cursor:pointer}
.purchase-load-row>span{padding:10px 12px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.purchase-load-row:hover,.purchase-load-row:focus-visible{background:var(--theme-primary-soft,var(--soft));outline:none}
.purchase-load-row .amount{text-align:right;font-variant-numeric:tabular-nums}
.purchase-load-empty{padding:28px;text-align:center;color:var(--muted)}
.purchase-load-empty.error{color:var(--danger,#dc2626)}
@media(max-width:850px){.purchase-load-table-head{display:none}.purchase-load-row{grid-template-columns:1fr 1fr}.purchase-load-row>span:nth-child(4){grid-column:1/-1}.purchase-load-row>span::before{display:block;font-size:11px;color:var(--muted);font-weight:700}.purchase-load-row>span:nth-child(1)::before{content:'Invoice No'}.purchase-load-row>span:nth-child(2)::before{content:'Date'}.purchase-load-row>span:nth-child(3)::before{content:'Supplier Invoice No'}.purchase-load-row>span:nth-child(4)::before{content:'Supplier'}.purchase-load-row>span:nth-child(5)::before{content:'Supplier VAT'}.purchase-load-row>span:nth-child(6)::before{content:'Total Amount'}}

/* Ledger Accounts full ledger lookup and five-row shortlist */
.ledger-lookup-suggestions .ledger-lookup-option-more {
    border-top: 1px solid var(--border, #d7dde8);
    background: var(--surface-soft, #f7f9fc);
}
.ledger-lookup-modal-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 14px;
    border-top: 1px solid var(--border, #d7dde8);
    background: var(--surface-soft, #f7f9fc);
}
.ledger-lookup-modal-footer > div { display: flex; gap: 6px; }

/* Direct Purchase: supplier-specific invoice number duplicate validation */
.purchase-supplier-invoice-wrap{display:flex;flex-direction:column;min-width:0;width:100%;}
.purchase-field-error{display:block;margin-top:4px;font-size:.78rem;font-weight:700;line-height:1.25;color:#dc2626;}
.purchase-field.purchase-field-invalid{border-color:#dc2626!important;box-shadow:0 0 0 2px rgba(220,38,38,.14)!important;}
.purchase-field.purchase-field-invalid:focus{outline:none;border-color:#b91c1c!important;box-shadow:0 0 0 3px rgba(220,38,38,.2)!important;}

/* Direct Purchase invoice OCR Phase 1 */
.purchase-ocr-card{width:min(1450px,calc(100vw - 24px));height:min(90vh,900px);display:flex;flex-direction:column}
.purchase-ocr-layout{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(380px,.75fr);gap:12px;min-height:0;flex:1;padding:12px}
.purchase-ocr-preview{position:relative;min-height:520px;border:1px solid var(--border);border-radius:10px;overflow:hidden;background:var(--surface-soft,#f6f7fb)}
.purchase-ocr-preview iframe{width:100%;height:100%;border:0;background:white}
.purchase-ocr-scanner{position:absolute;inset:0;background:rgba(15,23,42,.42);display:grid;place-items:center;color:white;z-index:3}
.purchase-ocr-scanner span{position:absolute;left:5%;right:5%;height:3px;background:#22c55e;box-shadow:0 0 14px #22c55e;animation:purchaseOcrScan 1.7s ease-in-out infinite alternate}
.purchase-ocr-scanner strong{padding:10px 14px;border-radius:999px;background:rgba(15,23,42,.75)}
@keyframes purchaseOcrScan{from{top:8%}to{top:90%}}
.purchase-ocr-review{min-height:0;overflow:auto;padding-right:4px}.purchase-ocr-fields{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.purchase-ocr-fields label{display:flex;flex-direction:column;gap:4px;font-weight:700;color:var(--text)}
.purchase-ocr-duplicate{margin:10px 0;padding:10px 12px;border:1px solid #dc2626;border-radius:8px;background:rgba(220,38,38,.1);color:#dc2626;font-weight:800}
.purchase-ocr-lines>div{display:grid;grid-template-columns:38px minmax(180px,1fr) repeat(5,80px);gap:6px;padding:7px;border-bottom:1px solid var(--border);align-items:center}.purchase-ocr-lines span{text-align:right}
@media(max-width:900px){.purchase-ocr-card{height:95vh}.purchase-ocr-layout{grid-template-columns:1fr;overflow:auto}.purchase-ocr-preview{min-height:42vh}.purchase-ocr-fields{grid-template-columns:1fr}}


/* Direct Purchase frmPurchase supplementary tab panels */
.purchase-tab-panel{padding:14px;min-height:180px;background:var(--surface,#fff);border:1px solid var(--border,#d7e1ee)}
.purchase-tab-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.purchase-tab-form{display:grid;grid-template-columns:repeat(3,minmax(180px,1fr));gap:12px 18px}
.purchase-tab-form label{display:flex;flex-direction:column;gap:5px;font-weight:600;color:var(--text,#162033)}
.purchase-tab-form label.wide{grid-column:span 2}.purchase-tab-form textarea{min-height:76px;resize:vertical}
.purchase-tab-table-head,.purchase-tab-table-row{display:grid;grid-template-columns:minmax(220px,1fr) 180px 46px;gap:8px;align-items:center;padding:8px;border-bottom:1px solid var(--border,#d7e1ee)}
.purchase-tab-table-head{font-weight:700;background:var(--surface-soft,#eef5ff)}
.purchase-tax-summary>div,.purchase-tax-summary footer{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;padding:9px;border-bottom:1px solid var(--border,#d7e1ee)}
.purchase-product-detail-row{display:grid;grid-template-columns:44px minmax(240px,1fr) 100px 140px 120px 100px 80px 110px;gap:8px;padding:8px;border-bottom:1px solid var(--border,#d7e1ee);align-items:center}
.purchase-account-summary{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.purchase-account-summary>div{padding:12px;border:1px solid var(--border,#d7e1ee);border-radius:8px;display:flex;flex-direction:column;gap:5px}
.purchase-attachment-row{display:grid;grid-template-columns:minmax(180px,1fr) minmax(180px,2fr) 100px 90px;gap:10px;align-items:center;padding:9px;border-bottom:1px solid var(--border,#d7e1ee)}
@media (max-width:900px){.purchase-tab-form{grid-template-columns:1fr 1fr}.purchase-tab-form label.wide{grid-column:span 2}.purchase-account-summary{grid-template-columns:1fr 1fr}}
@media (max-width:600px){.purchase-tab-form{grid-template-columns:1fr}.purchase-tab-form label.wide{grid-column:span 1}.purchase-account-summary{grid-template-columns:1fr}.purchase-tab-table-head,.purchase-tab-table-row{grid-template-columns:1fr 110px 42px}}

/* Direct Purchase bill preview: readable large confirmation/viewer dialog. */
.purchase-attachment-preview-card {
    width: min(1180px, 96vw) !important;
    height: min(92vh, 920px);
    max-height: 92vh !important;
    overflow: hidden !important;
    display: flex;
    flex-direction: column;
    padding: 14px !important;
}
.purchase-attachment-preview-card .column-title { flex: 0 0 auto; }
.purchase-attachment-preview {
    flex: 1 1 auto;
    min-height: 420px;
    overflow: hidden;
    border: 1px solid var(--border, #d7e1ee);
    border-radius: 10px;
    background: var(--card, #fff);
    display: grid;
    place-items: stretch;
}
.purchase-attachment-preview iframe,
.purchase-attachment-preview embed,
.purchase-attachment-preview object {
    width: 100%;
    height: 100%;
    min-height: 420px;
    border: 0;
    background: #fff;
}
.purchase-attachment-preview > img {
    width: 100%;
    height: 100%;
    max-height: 100%;
    object-fit: contain;
    background: #fff;
}
.purchase-attachment-fields {
    flex: 0 0 auto;
    display: grid;
    grid-template-columns: minmax(220px, .7fr) minmax(320px, 1.3fr);
    gap: 12px;
    padding-top: 10px;
}
.purchase-attachment-fields label { display: grid; gap: 5px; padding: 0 !important; border: 0 !important; }
.purchase-attachment-fields textarea { min-height: 58px; resize: vertical; }
.purchase-attachment-preview-card .purchase-lookup-footer { flex: 0 0 auto; padding-top: 10px; }
@media (max-width: 760px) {
    .purchase-attachment-preview-card { width: 98vw !important; height: 96vh; max-height: 96vh !important; padding: 10px !important; }
    .purchase-attachment-preview { min-height: 50vh; }
    .purchase-attachment-fields { grid-template-columns: 1fr; }
}

/* Direct Purchase attachments: neutral table rows with dedicated preview/delete actions. */
.purchase-attachment-table{width:100%;overflow-x:auto;border:1px solid var(--border,#d7e1ee);border-radius:8px;background:var(--card,#fff)}
.purchase-attachment-head,.purchase-attachment-row{display:grid;grid-template-columns:54px minmax(220px,1.4fr) minmax(220px,1fr) 92px 58px;gap:10px;align-items:center;min-width:760px}
.purchase-attachment-head{padding:9px 12px;font-weight:700;background:var(--surface-soft,#eef5ff);color:var(--text,#162033);border-bottom:1px solid var(--border,#d7e1ee)}
.purchase-attachment-row{padding:9px 12px;background:var(--card,#fff);color:var(--text,#162033);border-bottom:1px solid var(--border,#d7e1ee)}
.purchase-attachment-row:last-child{border-bottom:0}
.purchase-attachment-row:hover{background:var(--soft,rgba(37,99,235,.05))}
.purchase-attachment-icon{font-size:20px;text-align:center}
.purchase-attachment-main,.purchase-attachment-meta{min-width:0;display:flex;flex-direction:column;gap:2px;overflow-wrap:anywhere}
.purchase-attachment-main strong{white-space:normal;color:var(--text,#162033)}
.purchase-attachment-main small,.purchase-attachment-meta small{color:var(--muted,#64748b);font-weight:400}
.purchase-attachment-preview-btn{min-height:32px;padding:5px 10px;border:1px solid var(--brand,#2563eb);border-radius:7px;background:transparent;color:var(--brand,#2563eb);font-weight:700;cursor:pointer}
.purchase-attachment-preview-btn:hover,.purchase-attachment-preview-btn:focus{background:var(--brand,#2563eb);color:#fff}
.purchase-attachment-delete-btn{width:34px;height:34px;justify-self:center;border:1px solid rgba(220,38,38,.28);border-radius:7px;background:rgba(220,38,38,.07);color:#dc2626;cursor:pointer;display:grid;place-items:center;font-size:16px}
.purchase-attachment-delete-btn:hover,.purchase-attachment-delete-btn:focus{background:#dc2626;color:#fff}
.purchase-attachment-delete-btn:disabled{opacity:.55;cursor:not-allowed}
.purchase-attachment-empty{padding:20px;text-align:center;color:var(--muted,#64748b);background:var(--card,#fff)}
@media(max-width:760px){.purchase-attachment-head,.purchase-attachment-row{grid-template-columns:46px minmax(180px,1.4fr) minmax(170px,1fr) 82px 52px;min-width:650px}}

/* Direct Purchase OCR product review */
.purchase-ocr-lines{display:grid;gap:6px;margin-top:8px}
.purchase-ocr-line-row{display:grid;grid-template-columns:30px 34px minmax(220px,1.6fr) 70px 70px 90px 70px 90px minmax(180px,auto);gap:8px;align-items:center;padding:8px;border:1px solid var(--border,#d7e1ee);border-radius:8px;background:var(--card,#fff);color:var(--text,#162033)}
.purchase-ocr-line-row>span{text-align:right}
.purchase-ocr-line-desc{min-width:0;display:flex;flex-direction:column;gap:2px}
.purchase-ocr-line-desc strong{overflow-wrap:anywhere}.purchase-ocr-line-desc small{color:var(--muted,#64748b)}
.purchase-ocr-line-actions{display:flex;gap:6px;justify-content:flex-end}.purchase-ocr-line-actions .btn{white-space:nowrap;padding:5px 8px;min-height:30px}
.purchase-ocr-check{display:grid;place-items:center}.purchase-ocr-check input{width:17px;height:17px}
@media(max-width:980px){.purchase-ocr-line-row{grid-template-columns:30px 30px minmax(190px,1fr) repeat(5,70px) minmax(150px,auto);min-width:900px}.purchase-ocr-lines{overflow-x:auto}}

/* Direct Purchase invoice-specific log notes */
.purchase-activity-note[hidden]{display:none!important}
.purchase-note-compose-actions{display:flex;gap:8px;justify-content:flex-start}
.purchase-activity-body{min-width:0}
.purchase-log-note{border:1px solid var(--border,var(--erp-border,#dbe4ee));border-radius:10px;margin:8px 0;padding:12px!important;background:var(--card,var(--erp-card-bg,#fff))}
.purchase-log-note.note-color-yellow{background:color-mix(in srgb,#facc15 18%,var(--card,#fff))}
.purchase-log-note.note-color-green{background:color-mix(in srgb,#22c55e 14%,var(--card,#fff))}
.purchase-log-note.note-color-blue{background:color-mix(in srgb,#3b82f6 13%,var(--card,#fff))}
.purchase-log-note.note-color-pink{background:color-mix(in srgb,#ec4899 12%,var(--card,#fff))}
.purchase-log-note.note-color-purple{background:color-mix(in srgb,#8b5cf6 13%,var(--card,#fff))}
.purchase-log-note.note-color-orange{background:color-mix(in srgb,#f97316 14%,var(--card,#fff))}
.purchase-note-text{margin:.4rem 0;white-space:pre-wrap;overflow-wrap:anywhere}
.purchase-note-tools{display:flex;align-items:center;gap:5px;margin-top:7px;position:relative}
.purchase-note-tools>button{width:30px;height:28px;border:1px solid var(--border,var(--erp-border,#dbe4ee));border-radius:7px;background:var(--card,var(--erp-card-bg,#fff));color:var(--text,var(--erp-text,#102033));cursor:pointer}
.purchase-note-tools>button[data-note-delete]{color:#dc2626;border-color:color-mix(in srgb,#dc2626 35%,var(--border,#ddd))}
.purchase-note-timer{font-size:.72rem;color:var(--muted,var(--erp-muted,#64748b));margin-left:4px}
.purchase-note-edited{font-size:.7rem;color:var(--muted,var(--erp-muted,#64748b));margin-left:7px;font-style:italic}
.purchase-note-reactions{display:flex;gap:5px;flex-wrap:wrap;margin-top:8px}
.purchase-note-reaction{min-width:34px;height:28px;border:1px solid var(--border,var(--erp-border,#dbe4ee));border-radius:999px;background:var(--card,var(--erp-card-bg,#fff));color:var(--text,var(--erp-text,#102033));cursor:pointer;padding:2px 8px}
.purchase-note-reaction.active{border-color:var(--brand,var(--erp-primary,#008c6a));background:color-mix(in srgb,var(--brand,var(--erp-primary,#008c6a)) 14%,var(--card,#fff))}
.purchase-note-reaction span{font-size:.72rem;font-weight:800}
.purchase-note-color-menu{position:absolute;left:68px;top:32px;z-index:20;display:flex;gap:6px;padding:8px;background:var(--card,var(--erp-card-bg,#fff));border:1px solid var(--border,var(--erp-border,#dbe4ee));border-radius:9px;box-shadow:0 8px 24px rgba(15,23,42,.16)}
.note-swatch{width:24px!important;height:24px!important;border-radius:50%!important;border:2px solid var(--border,var(--erp-border,#cbd5e1))!important}
.note-swatch.note-color-default{background:var(--card,var(--erp-card-bg,#fff))!important}.note-swatch.note-color-yellow{background:#facc15!important}.note-swatch.note-color-green{background:#22c55e!important}.note-swatch.note-color-blue{background:#3b82f6!important}.note-swatch.note-color-pink{background:#ec4899!important}.note-swatch.note-color-purple{background:#8b5cf6!important}.note-swatch.note-color-orange{background:#f97316!important}
.purchase-inline-note-editor{min-height:70px;width:100%;resize:vertical}.purchase-inline-note-actions{display:flex;gap:7px;margin-top:6px}
@media(max-width:700px){.purchase-activity-toolbar{flex-wrap:wrap}.purchase-note-color-menu{left:0;max-width:240px;flex-wrap:wrap}}

/* Direct Purchase activity: timestamp follows the user name */
.purchase-page-shell .purchase-activity-heading{justify-content:flex-start;align-items:center;}
.purchase-page-shell .purchase-activity-user{display:flex;align-items:center;gap:4px;margin-top:2px;font-weight:600;}
.purchase-page-shell .purchase-activity-timestamp{font-weight:400;color:var(--muted,var(--erp-muted,#64748b));}
.purchase-page-shell .purchase-note-text{margin-top:4px;}
/* Direct Purchase log-note action reliability */
.purchase-note-tools{position:relative;z-index:3}
.purchase-note-tools button,.purchase-note-reaction,.note-swatch{pointer-events:auto!important;position:relative;z-index:4}
.purchase-note-color-menu{z-index:9999!important}
.purchase-inline-note-editor{display:block!important;width:100%!important;min-height:74px!important;pointer-events:auto!important}
.purchase-inline-note-actions{display:flex;gap:8px;margin-top:8px}
.purchase-note-reaction:disabled{opacity:.65;cursor:wait}

/* Direct Purchase note reaction audit trail */
.purchase-note-reaction-log{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px;font-size:12px;color:var(--muted)}
.purchase-note-reaction-log>span{display:inline-flex;align-items:center;gap:4px;padding:3px 7px;border:1px solid var(--border);border-radius:999px;background:var(--card)}
.purchase-note-reaction-log small{font-size:11px;color:var(--muted)}

/* Direct Purchase log-note persistent color and reaction audit */
.purchase-note-reaction-log{display:flex!important;flex-direction:column!important;align-items:flex-start!important;gap:4px!important;margin-top:7px!important}
.purchase-note-reaction-entry{display:flex;align-items:center;gap:5px;font-size:12px;color:var(--text);padding:2px 0;background:transparent;border:0}
.purchase-note-reaction-entry b{font-size:15px;line-height:1}
.purchase-note-reaction-entry small{color:var(--muted);font-size:11px}
.purchase-log-note.note-color-yellow .purchase-note-text{color:#a16207!important}
.purchase-log-note.note-color-green .purchase-note-text{color:#15803d!important}
.purchase-log-note.note-color-blue .purchase-note-text{color:#1d4ed8!important}
.purchase-log-note.note-color-pink .purchase-note-text{color:#be185d!important}
.purchase-log-note.note-color-purple .purchase-note-text{color:#7e22ce!important}
.purchase-log-note.note-color-orange .purchase-note-text{color:#c2410c!important}

/* Direct Purchase note final persistence and chat-style reactions */
.purchase-log-note .purchase-note-text{color:var(--note-accent,var(--text,var(--erp-text,#102033)))!important}
.purchase-log-note.is-editing .purchase-note-tools[hidden],.purchase-log-note.is-editing .purchase-note-reactions[hidden],.purchase-log-note.is-editing .purchase-note-reaction-log[hidden]{display:none!important}
.purchase-note-reaction-log{border-top:1px dashed var(--border,var(--erp-border,#dbe4ee));padding-top:6px;width:100%}
.purchase-note-reaction-entry{font-variant-numeric:tabular-nums}

/* Direct Purchase OCR review single-line rows and OCR create-product workflow */
.purchase-ocr-lines{
    display:block;
    margin-top:8px;
    overflow-x:auto;
    overscroll-behavior-inline:contain;
    border:1px solid var(--border,var(--erp-border,#d7e1ee));
    border-radius:9px;
    background:var(--card,var(--erp-card-bg,#fff));
}
.purchase-ocr-lines > .purchase-ocr-line-header,
.purchase-ocr-lines > .purchase-ocr-line-row{
    display:grid!important;
    grid-template-columns:30px 34px minmax(240px,1fr) minmax(150px,max-content) max-content max-content max-content max-content max-content max-content!important;
    column-gap:12px;
    align-items:center;
    min-width:max-content;
    width:100%;
    box-sizing:border-box;
}
.purchase-ocr-lines > .purchase-ocr-line-header{
    position:sticky;
    top:0;
    z-index:2;
    padding:8px 10px;
    border-bottom:1px solid var(--border,var(--erp-border,#d7e1ee));
    background:var(--soft,var(--erp-control-soft,#eef5ff));
    color:var(--text,var(--erp-text,#162033));
    font-size:12px;
    font-weight:800;
    white-space:nowrap;
}
.purchase-ocr-lines > .purchase-ocr-line-row{
    padding:9px 10px;
    border:0;
    border-bottom:1px solid var(--border,var(--erp-border,#d7e1ee));
    border-radius:0;
    background:var(--card,var(--erp-card-bg,#fff));
    color:var(--text,var(--erp-text,#162033));
    white-space:nowrap;
}
.purchase-ocr-lines > .purchase-ocr-line-row:last-child{border-bottom:0}
.purchase-ocr-lines > .purchase-ocr-line-row:hover{background:var(--soft,var(--erp-control-soft,#f7f9fc))}
.purchase-ocr-line-desc{
    display:block;
    min-width:240px;
    max-width:min(42vw,520px);
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}
.purchase-ocr-line-desc strong{
    display:block;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    overflow-wrap:normal;
}
.purchase-ocr-number,.purchase-ocr-value{text-align:right!important;font-variant-numeric:tabular-nums}
.purchase-ocr-match-status{
    display:block;
    max-width:260px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:12px;
    font-weight:700;
}
.purchase-ocr-match-status.is-matched{color:var(--brand,var(--erp-primary,#008c6a))}
.purchase-ocr-match-status.is-unmatched{color:var(--muted,var(--erp-muted,#64748b))}
.purchase-ocr-line-actions{
    display:flex;
    justify-content:flex-end;
    align-items:center;
    gap:7px;
    min-width:max-content;
}
.purchase-ocr-line-actions .btn{
    min-width:112px;
    min-height:32px;
    padding:6px 10px;
    line-height:1.1;
    white-space:nowrap;
}
.purchase-ocr-line-actions .purchase-ocr-create-btn{min-width:96px}
.purchase-ocr-check{display:grid;place-items:center;margin:0;padding:0;border:0!important}
.purchase-ocr-check input{width:17px;height:17px;margin:0}
.purchase-column-modal.purchase-stock-editor-over-ocr{z-index:2400!important;background:rgba(15,23,42,.48)}
.purchase-column-modal.purchase-stock-editor-over-ocr .purchase-stock-editor-card{box-shadow:0 30px 90px rgba(15,23,42,.42)}
.purchase-activity-save-first{
    padding:10px 12px;
    border-bottom:1px solid var(--border,var(--erp-border,#dbe4ee));
    background:color-mix(in srgb,var(--brand,var(--erp-primary,#008c6a)) 8%,var(--card,var(--erp-card-bg,#fff)));
    color:var(--muted,var(--erp-muted,#64748b));
    font-weight:700;
}
.purchase-activity-toolbar button:disabled{opacity:.5;cursor:not-allowed}
@media(max-width:980px){
    .purchase-ocr-lines > .purchase-ocr-line-header,
    .purchase-ocr-lines > .purchase-ocr-line-row{
        grid-template-columns:30px 34px minmax(230px,340px) minmax(150px,220px) max-content max-content max-content max-content max-content max-content!important;
        width:max-content;
        min-width:1050px;
    }
    .purchase-ocr-line-desc{max-width:340px}
}
@media(min-width:1100px){
    .purchase-ocr-layout{grid-template-columns:minmax(420px,.85fr) minmax(680px,1.15fr)}
}

/* Direct Purchase Log Note replies - invoice-scoped chat replies */
.purchase-note-reply-button{display:inline-flex;align-items:center;gap:5px;min-height:28px;border:1px solid var(--border,var(--erp-border,#dbe4ee));border-radius:999px;background:var(--card,var(--erp-card-bg,#fff));color:var(--text,var(--erp-text,#102033));cursor:pointer;padding:3px 10px;font-size:12px;font-weight:700}
.purchase-note-reply-button:hover{border-color:var(--brand,var(--erp-primary,#008c6a));background:color-mix(in srgb,var(--brand,var(--erp-primary,#008c6a)) 9%,var(--card,#fff))}
.purchase-note-reply-area{width:100%;margin-top:8px}
.purchase-note-reply-composer{display:flex;flex-direction:column;gap:8px;margin:8px 0;padding:9px;border:1px solid var(--border,var(--erp-border,#dbe4ee));border-radius:9px;background:color-mix(in srgb,var(--card,var(--erp-card-bg,#fff)) 94%,var(--brand,var(--erp-primary,#008c6a)) 6%)}
.purchase-note-reply-input,.purchase-inline-reply-editor{width:100%;min-height:58px;resize:vertical;line-height:1.35}
.purchase-note-reply-compose-footer,.purchase-note-reply-edit-footer{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.purchase-note-reply-colors{display:flex;align-items:center;gap:5px;flex-wrap:wrap}
.purchase-note-reply-colors .note-swatch{width:24px;height:24px;min-width:24px;border-radius:50%;padding:0}
.purchase-note-reply-colors .note-swatch.is-selected{outline:2px solid var(--brand,var(--erp-primary,#008c6a));outline-offset:2px}
.purchase-note-reply-actions{display:flex;align-items:center;justify-content:flex-end;gap:7px;margin-left:auto}
.purchase-note-reply-actions .btn{min-height:30px;padding:4px 12px}
.purchase-note-replies{display:flex;flex-direction:column;gap:7px;margin-top:7px;padding-left:18px;border-left:2px solid color-mix(in srgb,var(--brand,var(--erp-primary,#008c6a)) 25%,var(--border,var(--erp-border,#dbe4ee)))}
.purchase-note-replies:empty{display:none}
.purchase-note-reply-item{padding:7px 9px;border:1px solid var(--border,var(--erp-border,#dbe4ee));border-radius:8px;background:color-mix(in srgb,var(--card,var(--erp-card-bg,#fff)) 96%,var(--brand,var(--erp-primary,#008c6a)) 4%)}
.purchase-note-reply-head{display:flex;align-items:center;gap:6px;min-height:24px;color:var(--text,var(--erp-text,#102033));font-size:12px}
.purchase-note-reply-head strong{font-size:12px}
.purchase-note-reply-head small{color:var(--muted,var(--erp-muted,#64748b));font-size:11px}
.purchase-note-reply-arrow{color:var(--brand,var(--erp-primary,#008c6a));font-size:15px;font-weight:800}
.purchase-note-reply-edited{font-size:10px;color:var(--muted,var(--erp-muted,#64748b));font-style:italic}
.purchase-note-reply-edit{margin-left:auto;width:27px;height:25px;border:1px solid var(--border,var(--erp-border,#dbe4ee));border-radius:6px;background:var(--card,var(--erp-card-bg,#fff));color:var(--text,var(--erp-text,#102033));cursor:pointer}
.purchase-note-reply-text{margin-top:3px;white-space:pre-wrap;overflow-wrap:anywhere;color:var(--reply-accent,var(--text,var(--erp-text,#102033)));font-size:13px;line-height:1.4}
.purchase-note-reply-item.note-color-yellow .purchase-note-reply-text{color:#a16207}
.purchase-note-reply-item.note-color-green .purchase-note-reply-text{color:#15803d}
.purchase-note-reply-item.note-color-blue .purchase-note-reply-text{color:#1d4ed8}
.purchase-note-reply-item.note-color-pink .purchase-note-reply-text{color:#be185d}
.purchase-note-reply-item.note-color-purple .purchase-note-reply-text{color:#7e22ce}
.purchase-note-reply-item.note-color-orange .purchase-note-reply-text{color:#c2410c}
@media (max-width:700px){.purchase-note-replies{padding-left:10px}.purchase-note-reply-compose-footer,.purchase-note-reply-edit-footer{align-items:flex-start}.purchase-note-reply-actions{width:100%}}

/* Payment Voucher MVC - responsive frmPaymentVoucher conversion */
.payment-voucher-shell{--pv-shadow:0 12px 32px color-mix(in srgb,var(--text) 9%,transparent);display:block;min-width:0;padding:10px 12px 28px;color:var(--text)}
.payment-command-bar{position:sticky;top:0;z-index:120;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 10px;margin:-2px -2px 10px;border:1px solid var(--border);border-radius:10px;background:color-mix(in srgb,var(--card) 94%,transparent);backdrop-filter:blur(10px);box-shadow:0 8px 22px color-mix(in srgb,var(--text) 7%,transparent)}
.payment-command-group{display:flex;align-items:center;gap:7px;flex-wrap:wrap}.payment-command-group.right{justify-content:flex-end}
.payment-status-pill{display:inline-flex;align-items:center;min-height:34px;padding:5px 12px;border:1px solid color-mix(in srgb,var(--brand) 40%,var(--border));border-radius:999px;background:color-mix(in srgb,var(--brand) 8%,var(--card));font-size:12px;font-weight:850;letter-spacing:.05em}.payment-status-pill.danger{border-color:color-mix(in srgb,#b91c1c 45%,var(--border));color:#b91c1c;background:color-mix(in srgb,#b91c1c 7%,var(--card))}
.payment-banner,.payment-message{border-radius:9px;font-weight:700}.payment-banner{margin:8px 0;padding:10px 12px;border:1px solid var(--border)}.payment-banner.danger{border-color:#ef4444;background:color-mix(in srgb,#ef4444 8%,var(--card));color:#b91c1c}.payment-banner.warning{border-color:#f59e0b;background:color-mix(in srgb,#f59e0b 9%,var(--card));color:color-mix(in srgb,#b45309 84%,var(--text))}.payment-message{display:none;margin:8px 0;padding:9px 12px;border:1px solid var(--border)}.payment-message.show{display:block}.payment-message.error{border-color:#ef4444;color:#b91c1c;background:color-mix(in srgb,#ef4444 7%,var(--card))}.payment-message.success{border-color:#16a34a;color:#15803d;background:color-mix(in srgb,#16a34a 7%,var(--card))}.payment-message.info{border-color:var(--brand);background:color-mix(in srgb,var(--brand) 7%,var(--card))}
.payment-header-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,340px);gap:10px}.payment-card{min-width:0;border:1px solid var(--border);border-radius:11px;background:var(--card);box-shadow:var(--pv-shadow)}.payment-main-card,.payment-option-card,.payment-lines-card,.payment-project-card,.payment-notes-card{padding:14px}.payment-summary-card{padding:12px 14px}.payment-card-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:12px}.payment-card-heading.compact{align-items:center;margin-bottom:9px}.payment-card-heading h2,.payment-card-heading h3{margin:1px 0 0;color:var(--text)}.payment-card-heading h2{font-size:20px}.payment-card-heading h3{font-size:16px}.payment-eyebrow{display:block;color:var(--brand);font-size:10px;font-weight:900;letter-spacing:.11em;text-transform:uppercase}.payment-document-state{display:inline-flex;padding:5px 9px;border:1px solid var(--border);border-radius:999px;color:var(--muted);font-size:11px;font-weight:900}.payment-document-state.saved{border-color:var(--brand);color:var(--brand);background:color-mix(in srgb,var(--brand) 7%,var(--card))}
.payment-form-grid{display:grid;grid-template-columns:repeat(4,minmax(130px,1fr));gap:9px 10px}.payment-form-grid.compact{grid-template-columns:repeat(3,minmax(150px,1fr))}.payment-field{display:flex;min-width:0;flex-direction:column;gap:5px}.payment-field>span,.payment-notes-card>.payment-eyebrow{font-size:11px;font-weight:800;color:var(--muted)}.payment-field.payment-wide{grid-column:span 2}.payment-payby-field{grid-column:span 2}.payment-lookup{position:relative;display:flex;min-width:0}.payment-lookup>.odoo-input{min-width:0;flex:1;border-top-right-radius:0;border-bottom-right-radius:0}.payment-lookup>.lookup-trigger-btn{min-width:38px;border-top-left-radius:0;border-bottom-left-radius:0}.payment-lookup.grow{flex:1}.payment-suggestions{position:absolute;top:calc(100% + 4px);left:0;right:0;z-index:380;display:none;max-height:260px;overflow:auto;border:1px solid var(--border);border-radius:9px;background:var(--card);box-shadow:0 18px 45px color-mix(in srgb,var(--text) 18%,transparent)}.payment-suggestions.show{display:block}.payment-suggestion-item{display:grid;width:100%;grid-template-columns:minmax(0,1fr) auto;gap:2px 8px;padding:9px 10px;border:0;border-bottom:1px solid var(--border);background:transparent;color:var(--text);text-align:left;cursor:pointer}.payment-suggestion-item:hover,.payment-suggestion-item:focus{background:color-mix(in srgb,var(--brand) 8%,var(--card));outline:none}.payment-suggestion-item strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.payment-suggestion-item span,.payment-suggestion-item small{color:var(--muted);font-size:11px}.payment-suggestion-item small{grid-column:2;grid-row:1/3;align-self:center}
.payment-summary-row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:9px 0;border-bottom:1px solid var(--border)}.payment-summary-row span{color:var(--muted);font-size:12px}.payment-summary-row strong{font-variant-numeric:tabular-nums}.payment-summary-row.payable{margin-top:4px;padding:11px 8px;border:1px solid color-mix(in srgb,var(--brand) 35%,var(--border));border-radius:8px;background:color-mix(in srgb,var(--brand) 7%,var(--card));font-size:16px}.payment-summary-card p{margin:10px 0 0;font-size:11px;line-height:1.45}
.payment-option-card,.payment-lines-card{margin-top:10px}.payment-option-card.hidden,.payment-project-card.hidden{display:none}.payment-switch{display:flex;align-items:center;gap:7px;font-size:12px;font-weight:800}.payment-switch input{width:17px;height:17px;accent-color:var(--brand)}.payment-line-tools{display:flex;gap:7px;flex-wrap:wrap}.payment-table-wrap{width:100%;overflow-x:auto;border:1px solid var(--border);border-radius:9px}.payment-entry-table{width:100%;min-width:1380px;border-collapse:separate;border-spacing:0}.payment-entry-table th{position:sticky;top:0;z-index:4;padding:8px 7px;border-bottom:1px solid var(--border);background:color-mix(in srgb,var(--card) 88%,var(--bg));color:var(--muted);font-size:10px;font-weight:900;letter-spacing:.04em;text-align:left;text-transform:uppercase;white-space:nowrap}.payment-entry-table td{padding:5px;border-bottom:1px solid var(--border);vertical-align:middle}.payment-entry-table tbody tr:hover{background:color-mix(in srgb,var(--brand) 4%,transparent)}.payment-entry-table .odoo-input{min-height:34px;padding:6px 8px}.payment-entry-table th:nth-child(1),.payment-entry-table td:nth-child(1){width:38px;text-align:center}.payment-entry-table th:nth-child(2){width:250px}.payment-entry-table th:nth-child(3){width:105px}.payment-entry-table th:nth-child(4){width:220px}.payment-entry-table th:nth-child(5),.payment-entry-table th:nth-child(6){width:110px}.payment-entry-table th:nth-child(7){width:90px}.payment-entry-table th:nth-child(8){width:78px}.payment-entry-table th:nth-child(9){width:145px}.payment-entry-table th:nth-child(10),.payment-entry-table th:nth-child(11){width:92px}.payment-entry-table tfoot td{padding:9px;font-weight:900;background:color-mix(in srgb,var(--card) 88%,var(--bg))}.payment-money{text-align:right;font-variant-numeric:tabular-nums}.pv-balance{display:block;max-width:110px;color:var(--muted);font-size:11px;white-space:nowrap}.payment-config-btn{width:100%;min-height:31px;padding:4px 7px;border:1px solid color-mix(in srgb,var(--brand) 35%,var(--border));border-radius:7px;background:transparent;color:var(--brand);font-size:11px;font-weight:800;cursor:pointer}.payment-config-btn:hover{background:color-mix(in srgb,var(--brand) 8%,var(--card));border-color:var(--brand)}
.payment-bottom-layout{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(280px,.7fr);gap:10px;margin-top:10px}.payment-notes-card{display:flex;flex-direction:column;gap:7px}.payment-notes-card textarea{min-height:112px;resize:vertical}
.payment-side-panel{position:fixed;inset:0;z-index:500;display:none;justify-content:flex-end;background:color-mix(in srgb,#000 34%,transparent)}.payment-side-panel.open{display:flex}.payment-side-panel-card{width:min(480px,96vw);height:100%;padding:14px;border-left:1px solid var(--border);background:var(--card);box-shadow:-20px 0 55px color-mix(in srgb,#000 22%,transparent);overflow:auto}.payment-voucher-results,.payment-ledger-results,.payment-open-bills,.payment-selected-list{display:flex;flex-direction:column;gap:6px;margin-top:9px}.payment-voucher-result,.payment-ledger-result,.payment-open-bill{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;padding:10px 11px;border:1px solid var(--border);border-radius:9px;background:transparent;color:var(--text);text-align:left;cursor:pointer}.payment-voucher-result:hover,.payment-ledger-result:hover,.payment-open-bill:hover{border-color:var(--brand);background:color-mix(in srgb,var(--brand) 7%,var(--card))}.payment-voucher-result div,.payment-ledger-result div,.payment-open-bill{min-width:0}.payment-voucher-result strong,.payment-voucher-result span,.payment-voucher-result small,.payment-ledger-result strong,.payment-ledger-result span,.payment-open-bill strong,.payment-open-bill span{display:block}.payment-voucher-result span,.payment-voucher-result small,.payment-ledger-result span,.payment-open-bill span{color:var(--muted);font-size:11px}.payment-voucher-result b,.payment-ledger-result b,.payment-open-bill b{white-space:nowrap}
.payment-modal{position:fixed;inset:0;z-index:560;display:none;place-items:center;padding:18px;background:color-mix(in srgb,#0f172a 46%,transparent)}.payment-modal.open{display:grid}.payment-modal-card{width:min(900px,96vw);max-height:92vh;overflow:auto;padding:15px;border:1px solid var(--border);border-radius:12px;background:var(--card);box-shadow:0 30px 90px color-mix(in srgb,#000 34%,transparent)}.payment-ledger-modal-card{width:min(760px,96vw)}.payment-allocation-modal{width:min(1080px,97vw)}.payment-allocation-summary{display:flex;align-items:center;gap:18px;flex-wrap:wrap;padding:9px 10px;border:1px solid var(--border);border-radius:8px;background:color-mix(in srgb,var(--card) 90%,var(--bg));font-size:12px}.payment-allocation-summary strong{margin-left:5px}.payment-allocation-layout{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:10px}.payment-allocation-layout h4{margin:4px 0 8px}.payment-inline-fields{display:flex;align-items:center;gap:7px;flex-wrap:wrap}.payment-inline-fields>.odoo-input{flex:1;min-width:120px}.payment-selected-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:9px;padding:8px 9px;border:1px solid var(--border);border-radius:8px}.payment-selected-row span{display:block;color:var(--muted);font-size:11px}.payment-selected-row button{width:28px;height:28px;border:1px solid var(--border);border-radius:6px;background:transparent;color:var(--text);cursor:pointer}.payment-modal-footer{display:flex;justify-content:flex-end;gap:8px;margin-top:12px;padding-top:10px;border-top:1px solid var(--border)}.payment-empty{padding:14px;color:var(--muted);text-align:center}
@media(max-width:1100px){.payment-header-layout{grid-template-columns:1fr}.payment-summary-card{display:grid;grid-template-columns:repeat(3,1fr);gap:0 12px}.payment-summary-card p{grid-column:1/-1}.payment-form-grid{grid-template-columns:repeat(3,minmax(130px,1fr))}}
@media(max-width:760px){.payment-voucher-shell{padding:7px}.payment-command-bar{align-items:flex-start;flex-direction:column}.payment-command-group.right{width:100%;justify-content:space-between}.payment-form-grid,.payment-form-grid.compact{grid-template-columns:1fr 1fr}.payment-field.payment-wide,.payment-payby-field{grid-column:1/-1}.payment-summary-card{grid-template-columns:1fr 1fr}.payment-bottom-layout,.payment-allocation-layout{grid-template-columns:1fr}.payment-modal{padding:6px}.payment-modal-card{width:100%;max-height:96vh}.payment-inline-fields{align-items:stretch;flex-direction:column}.payment-inline-fields>*{width:100%}}
@media(max-width:480px){.payment-form-grid,.payment-form-grid.compact,.payment-summary-card{grid-template-columns:1fr}.payment-command-group{width:100%}.payment-command-group>*{flex:1;text-align:center;justify-content:center}}

/* Touch POS 2 Actions: advanced outline tiles driven only by the selected user theme */
body .pos-action-modal .pos-action-grid{gap:10px;padding:16px;background:var(--card)}
body .pos-action-modal .pos-action-tile,
body.theme-dark .pos-action-modal .pos-action-tile,
body.theme-midnight .pos-action-modal .pos-action-tile,
body.theme-carbon .pos-action-modal .pos-action-tile{
    position:relative;min-height:112px;padding:18px 16px;border:1px solid color-mix(in srgb,var(--brand) 42%,var(--border))!important;border-radius:12px!important;background:transparent!important;color:var(--text)!important;box-shadow:0 8px 22px color-mix(in srgb,var(--text) 7%,transparent),inset 0 1px 0 color-mix(in srgb,#fff 28%,transparent)!important;transition:border-color .18s ease,background .18s ease,box-shadow .18s ease,transform .18s ease;overflow:hidden
}
body .pos-action-modal .pos-action-tile::after{content:"";position:absolute;inset:auto 16px 0;height:2px;border-radius:999px;background:var(--brand);opacity:0;transform:scaleX(.25);transition:opacity .18s ease,transform .18s ease}
body .pos-action-modal .pos-action-tile:hover,
body .pos-action-modal .pos-action-tile:focus-visible{border-color:var(--brand)!important;background:color-mix(in srgb,var(--brand) 6%,transparent)!important;box-shadow:0 14px 30px color-mix(in srgb,var(--brand) 13%,transparent),inset 0 0 0 1px color-mix(in srgb,var(--brand) 16%,transparent)!important;transform:translateY(-2px);outline:none}
body .pos-action-modal .pos-action-tile:hover::after,body .pos-action-modal .pos-action-tile:focus-visible::after{opacity:1;transform:scaleX(1)}
body .pos-action-modal .pos-action-icon{display:grid;place-items:center;width:38px;height:38px;flex:0 0 38px;border:1px solid color-mix(in srgb,var(--brand) 42%,var(--border));border-radius:10px;background:color-mix(in srgb,var(--brand) 6%,transparent);color:var(--brand);font-size:18px;font-weight:900;line-height:1}
body .pos-action-modal .pos-action-label{font-size:17px;font-weight:850;letter-spacing:.01em;text-align:left}
@media(max-width:760px){body .pos-action-modal .pos-action-grid{grid-template-columns:repeat(2,minmax(150px,1fr))}body .pos-action-modal .pos-action-tile{min-height:92px}}
@media(max-width:430px){body .pos-action-modal .pos-action-grid{grid-template-columns:1fr}body .pos-action-modal .pos-action-tile{min-height:76px;justify-content:flex-start}}

/* Payment Voucher: complete selected-theme pack and advanced outline controls */
body .payment-voucher-shell,
body.theme-dark .payment-voucher-shell,
body.theme-midnight .payment-voucher-shell,
body.theme-carbon .payment-voucher-shell{
    --pv-control-bg:color-mix(in srgb,var(--card) 97%,var(--brand) 3%);
    --pv-control-hover:color-mix(in srgb,var(--brand) 8%,var(--card));
    --pv-control-active:color-mix(in srgb,var(--brand) 13%,var(--card));
    --pv-control-border:color-mix(in srgb,var(--brand) 28%,var(--border));
    --pv-focus-ring:0 0 0 3px color-mix(in srgb,var(--brand) 17%,transparent);
    background:transparent;
    color:var(--text);
}
body .payment-voucher-shell .payment-card,
body .payment-voucher-shell .payment-command-bar,
body .payment-voucher-shell .payment-modal-card,
body .payment-voucher-shell .payment-side-panel-card{
    border-color:var(--border);
    background:var(--card);
    color:var(--text);
}
body .payment-voucher-shell .payment-card{position:relative;overflow:visible}
body .payment-voucher-shell .payment-card::before{
    content:"";position:absolute;left:12px;right:12px;top:-1px;height:2px;border-radius:999px;
    background:linear-gradient(90deg,transparent,var(--brand),transparent);opacity:.42;pointer-events:none
}
body .payment-voucher-shell .payment-field>span,
body .payment-voucher-shell .payment-summary-row span,
body .payment-voucher-shell .payment-empty,
body .payment-voucher-shell .pv-balance,
body .payment-voucher-shell .muted{color:var(--muted)!important}
body .payment-voucher-shell .payment-card-heading h2,
body .payment-voucher-shell .payment-card-heading h3,
body .payment-voucher-shell h4,
body .payment-voucher-shell strong,
body .payment-voucher-shell label{color:var(--text)}
body .payment-voucher-shell .payment-eyebrow{color:var(--brand)}

body .payment-voucher-shell .odoo-input,
body .payment-voucher-shell input:not([type="checkbox"]):not([type="hidden"]),
body .payment-voucher-shell select,
body .payment-voucher-shell textarea{
    min-height:38px;border:1px solid var(--pv-control-border)!important;border-radius:8px;
    background:var(--pv-control-bg)!important;color:var(--text)!important;
    box-shadow:inset 0 1px 0 color-mix(in srgb,#fff 18%,transparent),0 1px 2px color-mix(in srgb,var(--text) 4%,transparent);
    caret-color:var(--brand);transition:border-color .16s ease,box-shadow .16s ease,background .16s ease
}
body .payment-voucher-shell textarea{min-height:112px}
body .payment-voucher-shell .odoo-input:hover,
body .payment-voucher-shell input:not([type="checkbox"]):not([type="hidden"]):hover,
body .payment-voucher-shell select:hover,
body .payment-voucher-shell textarea:hover{border-color:color-mix(in srgb,var(--brand) 55%,var(--border))!important}
body .payment-voucher-shell .odoo-input:focus,
body .payment-voucher-shell input:not([type="checkbox"]):not([type="hidden"]):focus,
body .payment-voucher-shell select:focus,
body .payment-voucher-shell textarea:focus{
    border-color:var(--brand)!important;background:var(--card)!important;box-shadow:var(--pv-focus-ring)!important;outline:none
}
body .payment-voucher-shell input::placeholder,
body .payment-voucher-shell textarea::placeholder{color:color-mix(in srgb,var(--muted) 78%,transparent);opacity:1}
body .payment-voucher-shell input[readonly],
body .payment-voucher-shell input:disabled,
body .payment-voucher-shell select:disabled,
body .payment-voucher-shell textarea:disabled{
    border-color:var(--border)!important;background:color-mix(in srgb,var(--card) 84%,var(--bg))!important;
    color:var(--muted)!important;box-shadow:none;cursor:not-allowed;opacity:.82
}
body .payment-voucher-shell select option{background:var(--card);color:var(--text)}
body .payment-voucher-shell input[type="checkbox"]{accent-color:var(--brand)}

body .payment-voucher-shell .payment-action-btn{
    position:relative;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:38px;
    padding:7px 13px;border:1px solid var(--pv-control-border)!important;border-radius:9px!important;
    background:transparent!important;color:var(--text)!important;text-decoration:none!important;
    font:inherit;font-size:12px;font-weight:850;letter-spacing:.01em;line-height:1;
    box-shadow:0 4px 12px color-mix(in srgb,var(--text) 6%,transparent),inset 0 1px 0 color-mix(in srgb,#fff 20%,transparent)!important;
    cursor:pointer;overflow:hidden;transition:transform .16s ease,border-color .16s ease,background .16s ease,color .16s ease,box-shadow .16s ease
}
body .payment-voucher-shell .payment-action-btn::after{
    content:"";position:absolute;left:12px;right:12px;bottom:0;height:2px;border-radius:999px;background:var(--brand);
    opacity:0;transform:scaleX(.25);transition:opacity .16s ease,transform .16s ease
}
body .payment-voucher-shell .payment-action-btn:hover,
body .payment-voucher-shell .payment-action-btn:focus-visible{
    border-color:var(--brand)!important;background:var(--pv-control-hover)!important;color:var(--text)!important;
    box-shadow:0 8px 20px color-mix(in srgb,var(--brand) 13%,transparent),inset 0 0 0 1px color-mix(in srgb,var(--brand) 11%,transparent)!important;
    transform:translateY(-1px);outline:none
}
body .payment-voucher-shell .payment-action-btn:hover::after,
body .payment-voucher-shell .payment-action-btn:focus-visible::after{opacity:1;transform:scaleX(1)}
body .payment-voucher-shell .payment-action-btn:active{background:var(--pv-control-active)!important;transform:translateY(0)}
body .payment-voucher-shell .payment-action-primary{border-color:color-mix(in srgb,var(--brand) 62%,var(--border))!important;color:var(--brand)!important}
body .payment-voucher-shell .payment-action-secondary{border-color:var(--border)!important;color:var(--text)!important}
body .payment-voucher-shell .payment-action-danger{border-color:color-mix(in srgb,var(--brand-dark) 62%,var(--border))!important;color:var(--brand-dark)!important}
body .payment-voucher-shell .payment-action-danger::after{background:var(--brand-dark)}
body .payment-voucher-shell .payment-action-muted{color:var(--muted)!important}
body .payment-voucher-shell .payment-action-compact{min-height:34px;padding:6px 10px;font-size:11px}
body .payment-voucher-shell .payment-action-icon{
    display:grid;place-items:center;width:22px;height:22px;flex:0 0 22px;border:1px solid color-mix(in srgb,var(--brand) 38%,var(--border));
    border-radius:6px;background:color-mix(in srgb,var(--brand) 7%,transparent);color:var(--brand);font-size:13px;font-weight:950;line-height:1
}
body .payment-voucher-shell .payment-action-danger .payment-action-icon{border-color:color-mix(in srgb,var(--brand-dark) 38%,var(--border));color:var(--brand-dark);background:color-mix(in srgb,var(--brand-dark) 7%,transparent)}
body .payment-voucher-shell .payment-action-btn:disabled,
body .payment-voucher-shell .payment-action-btn[disabled]{
    border-color:var(--border)!important;background:transparent!important;color:var(--muted)!important;
    box-shadow:none!important;cursor:not-allowed;opacity:.5;transform:none!important
}
body .payment-voucher-shell .payment-action-btn:disabled::after{display:none}
body .payment-voucher-shell .payment-action-btn:disabled .payment-action-icon{border-color:var(--border);background:transparent;color:var(--muted)}

body .payment-voucher-shell .lookup-trigger-btn,
body .payment-voucher-shell .payment-icon-btn,
body .payment-voucher-shell .table-icon-action{
    display:inline-grid;place-items:center;border:1px solid var(--pv-control-border)!important;background:transparent!important;color:var(--brand)!important;
    box-shadow:none!important;cursor:pointer;transition:border-color .16s ease,background .16s ease,color .16s ease,transform .16s ease
}
body .payment-voucher-shell .lookup-trigger-btn{min-width:40px;min-height:38px;border-radius:8px}
body .payment-voucher-shell .payment-icon-btn{width:34px;height:34px;border-radius:9px}
body .payment-voucher-shell .lookup-trigger-btn:hover,
body .payment-voucher-shell .payment-icon-btn:hover,
body .payment-voucher-shell .table-icon-action:hover,
body .payment-voucher-shell .lookup-trigger-btn:focus-visible,
body .payment-voucher-shell .payment-icon-btn:focus-visible,
body .payment-voucher-shell .table-icon-action:focus-visible{
    border-color:var(--brand)!important;background:var(--pv-control-hover)!important;color:var(--brand)!important;outline:none;transform:translateY(-1px)
}
body .payment-voucher-shell .payment-config-btn{
    border-color:var(--pv-control-border)!important;background:transparent!important;color:var(--brand)!important;
    box-shadow:inset 0 1px 0 color-mix(in srgb,#fff 18%,transparent);transition:border-color .16s ease,background .16s ease,box-shadow .16s ease
}
body .payment-voucher-shell .payment-config-btn:hover,
body .payment-voucher-shell .payment-config-btn:focus-visible{border-color:var(--brand)!important;background:var(--pv-control-hover)!important;box-shadow:var(--pv-focus-ring);outline:none}

body .payment-voucher-shell .payment-entry-table,
body .payment-voucher-shell .payment-table-wrap{border-color:var(--border);background:var(--card);color:var(--text)}
body .payment-voucher-shell .payment-entry-table th,
body .payment-voucher-shell .payment-entry-table tfoot td{
    border-color:var(--border);background:color-mix(in srgb,var(--card) 88%,var(--bg));color:var(--muted)
}
body .payment-voucher-shell .payment-entry-table td{border-color:var(--border);color:var(--text)}
body .payment-voucher-shell .payment-entry-table tbody tr:hover{background:color-mix(in srgb,var(--brand) 5%,var(--card))}
body .payment-voucher-shell .payment-suggestions,
body .payment-voucher-shell .payment-voucher-result,
body .payment-voucher-shell .payment-ledger-result,
body .payment-voucher-shell .payment-open-bill,
body .payment-voucher-shell .payment-selected-row{
    border-color:var(--border);background:var(--card);color:var(--text)
}
body .payment-voucher-shell .payment-voucher-result:hover,
body .payment-voucher-shell .payment-ledger-result:hover,
body .payment-voucher-shell .payment-open-bill:hover,
body .payment-voucher-shell .payment-suggestion-item:hover,
body .payment-voucher-shell .payment-suggestion-item:focus{
    border-color:var(--brand);background:var(--pv-control-hover);color:var(--text)
}
body .payment-voucher-shell .payment-selected-row button{
    border-color:var(--pv-control-border);background:transparent;color:var(--brand)
}
body .payment-voucher-shell .payment-selected-row button:hover{border-color:var(--brand);background:var(--pv-control-hover)}
body .payment-voucher-shell .payment-status-pill,
body .payment-voucher-shell .payment-document-state,
body .payment-voucher-shell .payment-summary-row.payable,
body .payment-voucher-shell .payment-allocation-summary{
    border-color:var(--pv-control-border);background:color-mix(in srgb,var(--brand) 7%,var(--card));color:var(--text)
}

@media(max-width:760px){
    body .payment-voucher-shell .payment-action-btn{min-height:40px}
    body .payment-voucher-shell .payment-command-group{gap:6px}
    body .payment-voucher-shell .payment-command-group .payment-action-btn{flex:1 1 auto}
}
@media(max-width:480px){
    body .payment-voucher-shell .payment-action-btn{width:100%}
    body .payment-voucher-shell .payment-action-icon{width:20px;height:20px;flex-basis:20px}
}

/* Payment Voucher saved-voucher drawer close/outside-click hardening */
body.payment-voucher-panel-open{overflow:hidden}
body .payment-voucher-shell .payment-side-panel{
    z-index:4000;
    cursor:pointer;
}
body .payment-voucher-shell .payment-side-panel-card{
    position:relative;
    cursor:default;
    isolation:isolate;
}
body .payment-voucher-shell .payment-side-panel-heading{
    position:sticky;
    top:-14px;
    z-index:5;
    margin:-14px -14px 10px;
    padding:14px;
    border-bottom:1px solid var(--border);
    background:color-mix(in srgb,var(--card) 96%,transparent);
    backdrop-filter:blur(12px);
}
body .payment-voucher-shell .payment-panel-close{
    display:inline-grid;
    place-items:center;
    width:38px;
    height:38px;
    min-width:38px;
    padding:0;
    border:1px solid color-mix(in srgb,var(--brand) 42%,var(--border));
    border-radius:999px;
    background:var(--card);
    color:var(--brand);
    box-shadow:0 7px 18px color-mix(in srgb,var(--text) 12%,transparent);
    cursor:pointer;
    transition:border-color .16s ease,background .16s ease,color .16s ease,transform .16s ease,box-shadow .16s ease;
}
body .payment-voucher-shell .payment-panel-close svg{
    width:18px;
    height:18px;
    fill:none;
    stroke:currentColor;
    stroke-width:2.2;
    stroke-linecap:round;
}
body .payment-voucher-shell .payment-panel-close:hover,
body .payment-voucher-shell .payment-panel-close:focus-visible{
    border-color:var(--brand);
    background:color-mix(in srgb,var(--brand) 9%,var(--card));
    color:var(--brand-dark);
    box-shadow:0 10px 24px color-mix(in srgb,var(--brand) 18%,transparent);
    transform:translateY(-1px);
    outline:none;
}
body .payment-voucher-shell .payment-panel-close:active{transform:translateY(0)}


/* Direct Purchase Bill2Bill settlement history */
.purchase-page-shell .purchase-tab-heading>div{display:flex;flex-direction:column;gap:2px;min-width:0}
.purchase-page-shell .purchase-tab-heading>div>small{color:var(--muted,var(--erp-muted,#64748b));font-weight:500}
.purchase-payment-status{display:inline-flex;align-items:center;justify-content:center;min-height:28px;padding:4px 10px;border:1px solid var(--border,var(--erp-border,#dbe4ee));border-radius:999px;background:var(--soft,var(--erp-control-soft,#f7f9fc));font-size:.78rem;font-weight:800;white-space:nowrap}
.purchase-payment-status.is-paid{border-color:color-mix(in srgb,#15803d 40%,var(--border));background:color-mix(in srgb,#22c55e 12%,var(--card));color:#15803d}
.purchase-payment-status.is-partial{border-color:color-mix(in srgb,#b45309 42%,var(--border));background:color-mix(in srgb,#f59e0b 13%,var(--card));color:#a45108}
.purchase-payment-status.is-overpaid{border-color:color-mix(in srgb,#1d4ed8 42%,var(--border));background:color-mix(in srgb,#3b82f6 12%,var(--card));color:#1d4ed8}
.purchase-payment-status.is-unpaid{border-color:color-mix(in srgb,#64748b 42%,var(--border));color:var(--muted,var(--erp-muted,#64748b))}
.purchase-account-summary>div>small{color:var(--muted,var(--erp-muted,#64748b));font-size:.72rem}
.purchase-bill-payment-history{margin-top:14px;border:1px solid var(--border,var(--erp-border,#dbe4ee));border-radius:10px;overflow:hidden;background:var(--card,var(--erp-card-bg,#fff))}
.purchase-bill-payment-title{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 13px;border-bottom:1px solid var(--border,var(--erp-border,#dbe4ee));background:var(--soft,var(--erp-control-soft,#f7f9fc))}
.purchase-bill-payment-title>div{display:flex;flex-direction:column;gap:2px;min-width:0}
.purchase-bill-payment-title small{color:var(--muted,var(--erp-muted,#64748b));font-size:.75rem}
.purchase-bill-payment-title>span{padding:3px 8px;border:1px solid var(--border,var(--erp-border,#dbe4ee));border-radius:999px;color:var(--muted,var(--erp-muted,#64748b));font-size:.74rem;white-space:nowrap}
.purchase-payment-history-empty{padding:20px;color:var(--muted,var(--erp-muted,#64748b));text-align:center}
.purchase-payment-history-scroll{overflow-x:auto}
.purchase-payment-history-table{width:100%;min-width:720px;border-collapse:collapse}
.purchase-payment-history-table th,.purchase-payment-history-table td{padding:10px 12px;border-bottom:1px solid var(--border,var(--erp-border,#e5e7eb));text-align:left;white-space:nowrap}
.purchase-payment-history-table th{background:color-mix(in srgb,var(--soft,var(--erp-control-soft,#f7f9fc)) 78%,var(--card));color:var(--muted,var(--erp-muted,#64748b));font-size:.74rem;text-transform:uppercase;letter-spacing:.025em}
.purchase-payment-history-table tbody tr:last-child td{border-bottom:0}
.purchase-payment-history-table tbody tr:hover{background:color-mix(in srgb,var(--brand,var(--erp-primary,#008c6a)) 5%,var(--card))}
.purchase-payment-history-table .numeric{text-align:right;font-variant-numeric:tabular-nums}
.purchase-payment-history-table a{color:var(--brand,var(--erp-primary,#008c6a));font-weight:800;text-decoration:none}
.purchase-payment-history-table a:hover{text-decoration:underline}
.purchase-payment-history-table .is-reversal{color:#b91c1c}
.purchase-payment-activity{background:color-mix(in srgb,var(--brand,var(--erp-primary,#008c6a)) 3%,var(--card))}
.purchase-payment-activity .purchase-activity-avatar{border:1px solid color-mix(in srgb,var(--brand,var(--erp-primary,#008c6a)) 28%,var(--border))}
.purchase-payment-activity a{color:var(--brand,var(--erp-primary,#008c6a));font-weight:800;text-decoration:none}
.purchase-payment-activity a:hover{text-decoration:underline}
@media(max-width:700px){.purchase-bill-payment-title{align-items:flex-start}.purchase-payment-status{align-self:flex-start}.purchase-page-shell .purchase-tab-heading{align-items:flex-start;flex-wrap:wrap}}

/* Direct Purchase: show registered Bill2Bill settlements in both Payment and Account tabs. */
.purchase-payment-register-panel .purchase-tab-heading>div,
.purchase-payment-source-heading>div{display:flex;flex-direction:column;gap:3px;min-width:0}
.purchase-payment-register-panel .purchase-tab-heading small,
.purchase-payment-source-heading small{color:var(--muted,var(--erp-muted,#64748b));font-size:.76rem;font-weight:500}
.purchase-payment-registration-summary{display:grid;grid-template-columns:repeat(5,minmax(135px,1fr));gap:10px;margin-bottom:14px}
.purchase-payment-registration-summary>div{display:flex;flex-direction:column;gap:5px;padding:12px;border:1px solid var(--border,var(--erp-border,#dbe4ee));border-radius:10px;background:var(--card,var(--erp-card-bg,#fff));min-width:0}
.purchase-payment-registration-summary span{color:var(--muted,var(--erp-muted,#64748b));font-size:.75rem}
.purchase-payment-registration-summary strong{font-size:1rem;font-variant-numeric:tabular-nums;overflow:hidden;text-overflow:ellipsis}
.purchase-payment-source-block{border:1px solid var(--border,var(--erp-border,#dbe4ee));border-radius:10px;overflow:hidden;background:var(--card,var(--erp-card-bg,#fff))}
.purchase-payment-source-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 13px;border-bottom:1px solid var(--border,var(--erp-border,#dbe4ee));background:var(--soft,var(--erp-control-soft,#f7f9fc))}
.purchase-payment-source-heading button{border:1px solid var(--brand,var(--erp-primary,#008c6a));border-radius:8px;background:transparent;color:var(--brand,var(--erp-primary,#008c6a));font-weight:800;padding:7px 11px;cursor:pointer}
.purchase-payment-source-heading button:hover{background:color-mix(in srgb,var(--brand,var(--erp-primary,#008c6a)) 8%,transparent)}
.purchase-payment-tab-history{margin-top:14px}
.purchase-payment-register-table{min-width:900px}
.purchase-account-settlement-summary{grid-template-columns:repeat(3,minmax(150px,1fr))}
@media(max-width:1000px){.purchase-payment-registration-summary{grid-template-columns:repeat(3,minmax(135px,1fr))}.purchase-account-settlement-summary{grid-template-columns:repeat(2,minmax(150px,1fr))}}
@media(max-width:650px){.purchase-payment-registration-summary,.purchase-account-settlement-summary{grid-template-columns:1fr}.purchase-payment-source-heading{align-items:flex-start;flex-direction:column}.purchase-payment-source-heading button{width:100%}}

/* Shared project-wide Document Activity / Log Note component */
.erp-document-activity-card{
    margin-top:14px;
    overflow:hidden;
    border:1px solid var(--border,var(--erp-border,#dbe4ee));
    border-radius:12px;
    background:var(--card,var(--erp-card-bg,#fff));
    color:var(--text,var(--erp-text,#102033));
    box-shadow:0 8px 22px color-mix(in srgb,var(--text,#102033) 7%,transparent);
}
.erp-document-activity-toolbar{
    display:flex;align-items:center;justify-content:flex-start;gap:12px;
    padding:10px 12px;border-bottom:1px solid var(--border,var(--erp-border,#dbe4ee));
    background:var(--soft,var(--erp-control-soft,#f7f9fc));
}
.erp-document-activity-title{display:grid;gap:1px;min-width:0}
.erp-document-activity-title strong{font-size:1rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.erp-document-activity-eyebrow{font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted,var(--erp-muted,#64748b));font-weight:800}
.erp-document-activity-actions{display:flex;align-items:center;justify-content:flex-start;gap:6px;flex-wrap:wrap}
.erp-document-activity-toolbar>.erp-document-activity-refresh{margin-left:auto;flex:0 0 auto}
.erp-document-activity-button,.erp-document-activity-refresh{
    min-height:34px;padding:6px 11px;border:1px solid var(--border,var(--erp-border,#cbd5e1));border-radius:8px;
    background:transparent;color:var(--text,var(--erp-text,#102033));font-weight:750;cursor:pointer;
    transition:border-color .15s ease,background .15s ease,transform .15s ease;
}
.erp-document-activity-refresh{width:36px;padding:0;display:grid;place-items:center;font-size:1.1rem}
.erp-document-activity-button:hover,.erp-document-activity-refresh:hover{border-color:var(--brand,var(--erp-primary,#008c6a));background:color-mix(in srgb,var(--brand,var(--erp-primary,#008c6a)) 9%,transparent)}
.erp-document-activity-button.active,.erp-document-activity-button.primary{
    border-color:var(--brand,var(--erp-primary,#008c6a));background:var(--brand,var(--erp-primary,#008c6a));color:var(--brand-contrast,#fff)
}
.erp-document-activity-button:disabled,.erp-document-activity-refresh:disabled{opacity:.45;cursor:not-allowed;transform:none}
.erp-document-activity-status{padding:8px 12px;border-bottom:1px solid var(--border,#dbe4ee);background:color-mix(in srgb,var(--brand,#008c6a) 10%,var(--card,#fff));color:var(--text,#102033);font-weight:700}
.erp-document-activity-status.error{background:color-mix(in srgb,#dc2626 10%,var(--card,#fff));color:#b91c1c}
.erp-document-activity-save-first{padding:10px 12px;border-bottom:1px solid var(--border,#dbe4ee);background:color-mix(in srgb,#f59e0b 12%,var(--card,#fff));color:var(--text,#102033);font-weight:700}
.erp-document-activity-composer{display:grid;gap:9px;padding:12px;border-bottom:1px solid var(--border,#dbe4ee)}
.erp-document-activity-composer[hidden],.erp-document-activity-save-first[hidden],.erp-document-activity-status[hidden]{display:none!important}
.erp-document-activity-composer textarea,.erp-document-inline-note-editor,.erp-document-inline-reply-editor,.erp-document-reply-composer textarea{
    width:100%;min-height:72px;resize:vertical;padding:9px 10px;border:1px solid var(--border,#cbd5e1);border-radius:8px;background:var(--card,#fff);color:var(--text,#102033)
}
.erp-document-activity-compose-footer,.erp-document-reply-composer-footer{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.erp-document-activity-compose-actions,.erp-document-inline-actions,.erp-document-reply-composer-footer>div:last-child{display:flex;gap:7px;align-items:center}
.erp-document-note-palette{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.erp-document-note-swatch{width:24px!important;height:24px!important;padding:0!important;border:2px solid var(--border,#cbd5e1)!important;border-radius:50%!important;cursor:pointer}
.erp-document-note-swatch.active{outline:2px solid var(--brand,#008c6a);outline-offset:2px}
.erp-document-note-swatch.note-color-default{background:var(--card,#fff)!important}
.erp-document-note-swatch.note-color-yellow{background:#facc15!important}.erp-document-note-swatch.note-color-green{background:#22c55e!important}.erp-document-note-swatch.note-color-blue{background:#3b82f6!important}.erp-document-note-swatch.note-color-pink{background:#ec4899!important}.erp-document-note-swatch.note-color-purple{background:#8b5cf6!important}.erp-document-note-swatch.note-color-orange{background:#f97316!important}
.erp-document-activity-list{min-height:82px;padding:8px 14px 14px}
.erp-document-activity-empty{padding:18px 9px;border:1px dashed var(--border,#cbd5e1);border-radius:9px;color:var(--muted,#64748b)}
.erp-document-activity-item{display:grid;grid-template-columns:38px minmax(0,1fr);gap:10px;padding:11px 4px;border-bottom:1px solid var(--border,#e5e7eb)}
.erp-document-activity-item:last-child{border-bottom:0}
.erp-document-activity-avatar{width:34px;height:34px;display:grid;place-items:center;border-radius:50%;background:color-mix(in srgb,var(--brand,#008c6a) 14%,var(--card,#fff));color:var(--brand,#008c6a);font-weight:850}
.erp-document-activity-body{min-width:0}
.erp-document-activity-heading{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.erp-document-activity-user{margin-top:2px;font-size:.78rem;font-weight:650;color:var(--muted,#64748b)}
.erp-document-activity-user span{font-weight:400}
.erp-document-note-text{margin-top:5px;white-space:pre-wrap;overflow-wrap:anywhere;color:var(--erp-note-accent,var(--text,#102033))}
.erp-document-peppol-files{margin-top:9px;padding:9px;border:1px solid var(--border,#dbe4ee);border-radius:9px;background:var(--soft,#f7f9fc)}
.erp-document-peppol-label{font-size:.7rem;font-weight:850;color:var(--brand,#008c6a);text-transform:uppercase;letter-spacing:.04em;margin-bottom:7px}
.erp-document-peppol-file-row{display:flex;gap:8px;flex-wrap:wrap}
.erp-document-peppol-file{display:flex;align-items:center;gap:8px;min-width:220px;max-width:360px;padding:8px 10px;border:1px solid var(--border,#dbe4ee);border-radius:8px;background:var(--card,#fff);color:var(--text,#102033);text-decoration:none}
.erp-document-peppol-file:hover{border-color:var(--brand,#008c6a)}
.erp-document-peppol-file strong{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.78rem}
.erp-document-peppol-file-badge{width:38px;height:32px;flex:0 0 38px;display:grid;place-items:center;border:1px solid;border-radius:7px;font-size:.67rem;font-weight:900}
.erp-document-peppol-file-badge.pdf{color:#a61f1f;background:#fff0f0;border-color:#efbcbc}
.erp-document-peppol-file-badge.xml{color:#006d7b;background:#eafcff;border-color:#a9e2ea}
.erp-document-log-note{margin:8px 0;padding:12px!important;border:1px solid var(--border,#dbe4ee);border-radius:10px;background:var(--card,#fff)}
.erp-document-log-note.note-color-yellow{background:color-mix(in srgb,#facc15 18%,var(--card,#fff))}.erp-document-log-note.note-color-green{background:color-mix(in srgb,#22c55e 14%,var(--card,#fff))}.erp-document-log-note.note-color-blue{background:color-mix(in srgb,#3b82f6 13%,var(--card,#fff))}.erp-document-log-note.note-color-pink{background:color-mix(in srgb,#ec4899 12%,var(--card,#fff))}.erp-document-log-note.note-color-purple{background:color-mix(in srgb,#8b5cf6 13%,var(--card,#fff))}.erp-document-log-note.note-color-orange{background:color-mix(in srgb,#f97316 14%,var(--card,#fff))}
.erp-document-note-tools{position:relative;display:flex;align-items:center;gap:5px;margin-top:7px}
.erp-document-note-tools>button,.erp-document-reply-edit{min-width:30px;height:28px;padding:2px 7px;border:1px solid var(--border,#dbe4ee);border-radius:7px;background:var(--card,#fff);color:var(--text,#102033);cursor:pointer}
.erp-document-note-tools>button[data-document-note-delete]{color:#dc2626;border-color:color-mix(in srgb,#dc2626 35%,var(--border,#ddd))}
.erp-document-note-edited{font-size:.7rem;color:var(--muted,#64748b);font-style:italic}
.erp-document-note-reactions{display:flex;gap:5px;align-items:center;flex-wrap:wrap;margin-top:8px}
.erp-document-note-reaction,.erp-document-note-reply-button{min-height:28px;padding:2px 8px;border:1px solid var(--border,#dbe4ee);border-radius:999px;background:var(--card,#fff);color:var(--text,#102033);cursor:pointer}
.erp-document-note-reaction.active{border-color:var(--brand,#008c6a);background:color-mix(in srgb,var(--brand,#008c6a) 14%,var(--card,#fff))}
.erp-document-note-reaction span{font-size:.72rem;font-weight:850}
.erp-document-note-reaction-log{display:flex;flex-direction:column;align-items:flex-start;gap:3px;margin-top:7px;padding-top:6px;border-top:1px dashed var(--border,#dbe4ee);font-size:12px}
.erp-document-note-reaction-log>span{display:flex;align-items:center;gap:5px}.erp-document-note-reaction-log small{color:var(--muted,#64748b)}
.erp-document-note-replies{display:grid;gap:7px;margin-top:9px;margin-left:12px;padding-left:10px;border-left:2px solid color-mix(in srgb,var(--brand,#008c6a) 30%,var(--border,#dbe4ee))}
.erp-document-note-reply{position:relative;padding:8px 38px 8px 10px;border:1px solid var(--border,#dbe4ee);border-radius:9px;background:color-mix(in srgb,var(--soft,#f7f9fc) 72%,var(--card,#fff));color:var(--erp-note-accent,var(--text,#102033))}
.erp-document-note-reply-head{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:.76rem}.erp-document-note-reply-head span{color:var(--muted,#64748b);font-weight:400}
.erp-document-note-reply-text{margin-top:4px;white-space:pre-wrap;overflow-wrap:anywhere}.erp-document-reply-edit{position:absolute;right:6px;top:6px}
.erp-document-reply-composer{display:grid;gap:7px;margin-top:8px;padding:9px;border:1px solid var(--border,#dbe4ee);border-radius:9px;background:var(--soft,#f7f9fc)}
.erp-document-note-color-menu{position:absolute;left:36px;top:31px;z-index:9999;display:flex;gap:6px;padding:8px;border:1px solid var(--border,#dbe4ee);border-radius:9px;background:var(--card,#fff);box-shadow:0 10px 26px rgba(15,23,42,.18)}
.erp-document-inline-actions{margin-top:7px}
.payment-voucher-shell .erp-document-activity-card{margin:14px 0 0}
@media(max-width:720px){
    .erp-document-activity-toolbar{align-items:center;flex-direction:row;flex-wrap:wrap}.erp-document-activity-actions{width:auto;flex:1 1 auto}.erp-document-activity-title strong{white-space:normal}
    .erp-document-activity-compose-footer,.erp-document-reply-composer-footer{align-items:flex-start;flex-direction:column}.erp-document-note-replies{margin-left:3px}.erp-document-note-color-menu{left:0;max-width:230px;flex-wrap:wrap}
}
.erp-document-reply-edit-footer{display:flex;align-items:center;justify-content:space-between;gap:9px;flex-wrap:wrap;margin-top:7px}
@media(max-width:720px){.erp-document-reply-edit-footer{align-items:flex-start;flex-direction:column}}

/* Payment Voucher ledger grid final column sizing + no-wrap captions.
   Keeps the delete action icon-width and lets the useful data columns consume the row. */
body .main-area .payment-voucher-shell .payment-entry-table {
    width: 100% !important;
    table-layout: auto !important;
}

body .main-area .payment-voucher-shell .payment-entry-table thead th {
    white-space: nowrap !important;
    overflow-wrap: normal !important;
    word-break: keep-all !important;
}

body .main-area .payment-voucher-shell .payment-entry-table th:nth-child(12),
body .main-area .payment-voucher-shell .payment-entry-table td:nth-child(12) {
    width: 42px !important;
    min-width: 42px !important;
    max-width: 42px !important;
    padding-left: 4px !important;
    padding-right: 4px !important;
    text-align: center !important;
    white-space: nowrap !important;
}

body .main-area .payment-voucher-shell .payment-entry-table td:nth-child(12) .table-icon-action {
    width: 32px !important;
    min-width: 32px !important;
    height: 32px !important;
    padding: 0 !important;
}

/* Daily Sales responsive typography.
   Headers and values stay on one line. Typography becomes compact as the viewport
   narrows and returns to the normal report size on large displays. */
@media screen {
    body .main-area .daily-sales-table-wrap {
        overflow-x: auto !important;
        overflow-y: visible !important;
    }

    body .main-area .daily-sales-table {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        table-layout: fixed !important;
    }

    body .main-area .daily-sales-table th,
    body .main-area .daily-sales-table td {
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        overflow-wrap: normal !important;
        word-break: keep-all !important;
        font-size: clamp(9px, 0.78vw, 13px) !important;
        padding-left: clamp(3px, 0.42vw, 7px) !important;
        padding-right: clamp(3px, 0.42vw, 7px) !important;
    }

    body .main-area .daily-sales-table thead th {
        height: clamp(34px, 2.6vw, 42px) !important;
        padding-top: clamp(6px, 0.65vw, 11px) !important;
        padding-bottom: clamp(6px, 0.65vw, 11px) !important;
        font-size: clamp(8px, 0.68vw, 11px) !important;
        line-height: 1.1 !important;
    }

    body .main-area .daily-sales-table tbody td {
        height: clamp(36px, 3vw, 50px) !important;
    }

    body .main-area .daily-sales-table .daily-sales-status,
    body .main-area .daily-sales-table .daily-sales-item-link,
    body .main-area .daily-sales-table .daily-sales-document-link {
        max-width: 100%;
        white-space: nowrap !important;
        font-size: inherit !important;
    }
}

/* Payroll Departments master - advanced theme-aware UI converted from Departments.vb. */
.departments-topbar{align-items:flex-start;gap:18px;margin-bottom:14px}
.departments-heading-block{min-width:0}
.departments-heading-block h1{margin:4px 0 3px;font-size:clamp(1.7rem,2.4vw,2.35rem);line-height:1.05;letter-spacing:-.03em}
.departments-top-actions{align-items:center;flex-wrap:wrap;justify-content:flex-end}
.departments-shell,.department-edit-shell{display:grid;gap:14px;color:var(--theme-text,var(--text))}
.departments-hero-card{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:16px;padding:16px 18px;border:1px solid var(--theme-border,var(--border));border-radius:15px;background:linear-gradient(135deg,color-mix(in srgb,var(--theme-primary,var(--brand)) 7%,var(--theme-card,var(--card))),var(--theme-card,var(--card)));box-shadow:0 12px 30px color-mix(in srgb,var(--theme-text,var(--text)) 7%,transparent)}
.departments-hero-icon{display:grid;place-items:center;width:54px;height:54px;border:1px solid color-mix(in srgb,var(--theme-primary,var(--brand)) 35%,var(--theme-border,var(--border)));border-radius:15px;background:color-mix(in srgb,var(--theme-primary,var(--brand)) 8%,var(--theme-card,var(--card)));color:var(--theme-primary,var(--brand))}
.departments-hero-icon svg{width:29px;height:29px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.departments-hero-copy{min-width:0}
.departments-hero-copy h2{margin:2px 0 4px;font-size:1.18rem}
.departments-hero-copy p{margin:0;color:var(--theme-muted,var(--muted));font-size:.9rem}
.departments-eyebrow{display:block;color:var(--theme-primary,var(--brand));font-size:.69rem;font-weight:850;letter-spacing:.11em;text-transform:uppercase}
.departments-hero-actions,.department-edit-actions,.department-row-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.department-btn,.department-action-btn,.department-view-btn,.department-pager-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:36px;padding:7px 13px;border:1px solid var(--theme-border,var(--border));border-radius:9px;background:color-mix(in srgb,var(--theme-card,var(--card)) 96%,transparent);color:var(--theme-text,var(--text));font:inherit;font-size:.84rem;font-weight:800;line-height:1;text-decoration:none;white-space:nowrap;cursor:pointer;box-shadow:0 4px 12px color-mix(in srgb,var(--theme-text,var(--text)) 5%,transparent);transition:border-color .16s ease,background .16s ease,color .16s ease,transform .16s ease,box-shadow .16s ease}
.department-btn:hover,.department-btn:focus-visible,.department-action-btn:hover,.department-action-btn:focus-visible,.department-view-btn:hover,.department-view-btn:focus-visible,.department-pager-btn:hover,.department-pager-btn:focus-visible{border-color:var(--theme-primary,var(--brand));background:color-mix(in srgb,var(--theme-primary,var(--brand)) 8%,var(--theme-card,var(--card)));color:var(--theme-primary,var(--brand));box-shadow:0 8px 20px color-mix(in srgb,var(--theme-primary,var(--brand)) 12%,transparent);transform:translateY(-1px);outline:none}
.department-btn-primary{border-color:color-mix(in srgb,var(--theme-primary,var(--brand)) 48%,var(--theme-border,var(--border)));background:color-mix(in srgb,var(--theme-primary,var(--brand)) 5%,var(--theme-card,var(--card)));color:var(--theme-primary,var(--brand))}
.department-btn-primary::after{content:"";position:absolute;left:12px;right:12px;bottom:0;height:2px;border-radius:999px;background:var(--theme-primary,var(--brand));transform:scaleX(.35);opacity:.55;transition:transform .16s ease,opacity .16s ease}
.department-btn-primary:hover::after,.department-btn-primary:focus-visible::after{transform:scaleX(1);opacity:1}
.department-btn-danger,.department-action-btn.danger{border-color:color-mix(in srgb,#dc2626 42%,var(--theme-border,var(--border)));color:#c81e1e;background:color-mix(in srgb,#dc2626 4%,var(--theme-card,var(--card)))}
.department-btn-danger:hover,.department-action-btn.danger:hover{border-color:#dc2626;background:color-mix(in srgb,#dc2626 9%,var(--theme-card,var(--card)));color:#b91c1c}
.department-action-btn.disabled,.department-action-btn:disabled{border-color:var(--theme-border,var(--border));background:transparent;color:var(--theme-muted,var(--muted));box-shadow:none;cursor:not-allowed;opacity:.58;transform:none}
.departments-kpi-grid{display:grid;grid-template-columns:repeat(5,minmax(150px,1fr));gap:10px}
.department-kpi-card{display:grid;gap:4px;min-width:0;padding:13px 14px;border:1px solid var(--theme-border,var(--border));border-radius:13px;background:var(--theme-card,var(--card));box-shadow:0 7px 20px color-mix(in srgb,var(--theme-text,var(--text)) 5%,transparent)}
.department-kpi-card span{color:var(--theme-muted,var(--muted));font-size:.76rem;font-weight:700}
.department-kpi-card strong{font-size:1.32rem;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.department-kpi-card small{color:var(--theme-muted,var(--muted));font-size:.71rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.departments-filter-bar{display:grid;grid-template-columns:minmax(280px,1fr) minmax(190px,240px) 92px auto;align-items:end;gap:10px;padding:12px;border:1px solid var(--theme-border,var(--border));border-radius:13px;background:var(--theme-card,var(--card));box-shadow:0 7px 20px color-mix(in srgb,var(--theme-text,var(--text)) 5%,transparent)}
.department-search-box{position:relative;display:flex;align-items:center;min-width:0}
.department-search-box svg{position:absolute;left:11px;width:17px;height:17px;fill:none;stroke:var(--theme-muted,var(--muted));stroke-width:1.8;stroke-linecap:round;pointer-events:none}
.department-search-box input,.department-filter-field select,.department-field input,.department-field select{width:100%;min-height:40px;border:1px solid var(--theme-border,var(--border));border-radius:9px;background:var(--theme-input-bg,var(--card));color:var(--theme-text,var(--text));font:inherit;outline:none;transition:border-color .16s ease,box-shadow .16s ease,background .16s ease}
.department-search-box input{padding:8px 38px 8px 37px}
.department-search-box input:focus,.department-filter-field select:focus,.department-field input:focus,.department-field select:focus{border-color:var(--theme-primary,var(--brand));box-shadow:0 0 0 3px color-mix(in srgb,var(--theme-primary,var(--brand)) 13%,transparent)}
.department-search-clear{position:absolute;right:7px;display:grid;place-items:center;width:27px;height:27px;border-radius:8px;color:var(--theme-muted,var(--muted));font-size:1.15rem;text-decoration:none}
.department-search-clear:hover{background:color-mix(in srgb,var(--theme-primary,var(--brand)) 8%,transparent);color:var(--theme-primary,var(--brand))}
.department-filter-field{display:grid;gap:5px;min-width:0}
.department-filter-field>span{color:var(--theme-muted,var(--muted));font-size:.7rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase}
.department-filter-field select{padding:7px 31px 7px 10px}
.department-view-switch{display:flex;align-items:center;gap:6px}
.department-view-btn{width:40px;min-width:40px;padding:0;font-size:1rem}
.department-view-btn.active{border-color:var(--theme-primary,var(--brand));background:color-mix(in srgb,var(--theme-primary,var(--brand)) 10%,var(--theme-card,var(--card)));color:var(--theme-primary,var(--brand));box-shadow:inset 0 -2px 0 var(--theme-primary,var(--brand))}
.departments-result-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:42px;padding:8px 12px;border:1px solid var(--theme-border,var(--border));border-radius:11px;background:color-mix(in srgb,var(--theme-control-soft,var(--soft)) 74%,var(--theme-card,var(--card)))}
.departments-result-bar>div:first-child{display:flex;align-items:baseline;gap:5px;min-width:0;color:var(--theme-muted,var(--muted));font-size:.82rem}
.departments-result-bar strong{color:var(--theme-text,var(--text));font-size:1rem}
.departments-result-bar em{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-style:normal}
.department-pager{display:flex;align-items:center;gap:7px;white-space:nowrap}
.department-pager>span{color:var(--theme-muted,var(--muted));font-size:.78rem;font-variant-numeric:tabular-nums}
.department-pager-btn{width:34px;min-width:34px;min-height:32px;padding:0;font-size:1.2rem}
.department-pager-btn.disabled{pointer-events:none;opacity:.42;box-shadow:none}
.departments-table-card{overflow:hidden;border:1px solid var(--theme-border,var(--border));border-radius:14px;background:var(--theme-card,var(--card));box-shadow:0 10px 28px color-mix(in srgb,var(--theme-text,var(--text)) 6%,transparent)}
.departments-table-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 15px;border-bottom:1px solid var(--theme-border,var(--border));background:color-mix(in srgb,var(--theme-control-soft,var(--soft)) 72%,var(--theme-card,var(--card)))}
.departments-table-heading h3{margin:2px 0 0;font-size:1rem}
.departments-table-heading>small{color:var(--theme-muted,var(--muted));font-size:.74rem;text-align:right}
.departments-table-scroll{width:100%;overflow-x:auto;overflow-y:visible}
.departments-table{width:100%;min-width:1080px;border-collapse:separate;border-spacing:0;table-layout:auto}
.departments-tree-table{min-width:850px}
.departments-table th,.departments-table td{padding:10px 11px;border-bottom:1px solid var(--theme-border,var(--border));text-align:left;vertical-align:middle;white-space:nowrap;overflow-wrap:normal;word-break:keep-all}
.departments-table th{height:40px;color:var(--theme-muted,var(--muted))!important;font-size:.7rem;letter-spacing:.055em;text-transform:uppercase}
.departments-table td{font-size:.82rem}
.departments-table tbody tr:last-child td{border-bottom:0}
.departments-table tbody tr:hover{background:color-mix(in srgb,var(--theme-primary,var(--brand)) 4%,var(--theme-card,var(--card)))!important}
.department-primary-row{background:color-mix(in srgb,var(--theme-primary,var(--brand)) 3%,var(--theme-card,var(--card)))}
.department-row-number{display:inline-grid;place-items:center;min-width:27px;height:27px;border:1px solid var(--theme-border,var(--border));border-radius:8px;color:var(--theme-muted,var(--muted));font-size:.73rem;font-variant-numeric:tabular-nums}
.department-name-cell{display:flex;align-items:center;gap:9px;min-width:170px}
.department-name-cell>div{display:grid;gap:2px;min-width:0}
.department-name-cell strong{overflow:hidden;text-overflow:ellipsis}
.department-name-cell small{color:var(--theme-muted,var(--muted));font-size:.7rem}
.department-avatar{display:grid;place-items:center;flex:0 0 auto;width:34px;height:34px;border:1px solid color-mix(in srgb,var(--theme-primary,var(--brand)) 28%,var(--theme-border,var(--border)));border-radius:10px;background:color-mix(in srgb,var(--theme-primary,var(--brand)) 7%,var(--theme-card,var(--card)));color:var(--theme-primary,var(--brand));font-weight:900}
.department-level-pill,.department-metric-pill{display:inline-flex;align-items:center;justify-content:center;min-height:27px;padding:4px 8px;border:1px solid var(--theme-border,var(--border));border-radius:999px;background:color-mix(in srgb,var(--theme-control-soft,var(--soft)) 72%,var(--theme-card,var(--card)));color:var(--theme-muted,var(--muted));font-size:.72rem;font-weight:800;font-variant-numeric:tabular-nums}
.department-metric-pill{min-width:34px;color:var(--theme-text,var(--text))}
.department-metric-pill.is-active{border-color:color-mix(in srgb,#16a34a 32%,var(--theme-border,var(--border)));background:color-mix(in srgb,#22c55e 8%,var(--theme-card,var(--card)));color:#15803d}
.department-actions-cell{width:1%;min-width:175px}
.department-row-actions{justify-content:flex-start;flex-wrap:nowrap}
.department-action-btn{min-height:31px;padding:5px 10px;font-size:.75rem;box-shadow:none}
.department-inline-form{display:inline-flex;margin:0}
.departments-empty-cell{height:120px!important;color:var(--theme-muted,var(--muted));text-align:center!important;font-size:.9rem!important}
.department-tree-name{display:flex;align-items:center;gap:8px;padding-left:calc(var(--department-depth,0) * 23px);min-width:220px}
.department-tree-branch{width:19px;color:var(--theme-primary,var(--brand));text-align:center}
.department-tree-name>div{display:grid;gap:2px}
.department-tree-name small{color:var(--theme-muted,var(--muted));font-size:.7rem}
.department-edit-commandbar{position:sticky;top:0;z-index:8;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 13px;border:1px solid var(--theme-border,var(--border));border-radius:13px;background:color-mix(in srgb,var(--theme-card,var(--card)) 95%,transparent);box-shadow:0 8px 24px color-mix(in srgb,var(--theme-text,var(--text)) 7%,transparent);backdrop-filter:blur(12px)}
.department-edit-status{display:flex;align-items:center;gap:7px;white-space:nowrap}
.department-edit-status strong{font-size:.82rem}
.department-edit-status small{padding-left:7px;border-left:1px solid var(--theme-border,var(--border));color:var(--theme-muted,var(--muted));font-size:.72rem}
.department-status-dot{width:9px;height:9px;border-radius:50%;background:var(--theme-primary,var(--brand));box-shadow:0 0 0 4px color-mix(in srgb,var(--theme-primary,var(--brand)) 13%,transparent)}
.department-edit-grid{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(300px,.75fr);gap:14px;align-items:start}
.department-edit-card{overflow:hidden;border:1px solid var(--theme-border,var(--border));border-radius:14px;background:var(--theme-card,var(--card));box-shadow:0 10px 28px color-mix(in srgb,var(--theme-text,var(--text)) 6%,transparent)}
.department-edit-main-card{padding:18px}
.department-card-heading{display:flex;align-items:center;gap:13px;padding-bottom:15px;border-bottom:1px solid var(--theme-border,var(--border))}
.department-card-heading>div:last-child{min-width:0}
.department-card-heading h2{margin:2px 0 3px;font-size:1.24rem}
.department-card-heading p{margin:0;color:var(--theme-muted,var(--muted));font-size:.82rem}
.department-large-avatar{display:grid;place-items:center;flex:0 0 auto;width:54px;height:54px;border:1px solid color-mix(in srgb,var(--theme-primary,var(--brand)) 35%,var(--theme-border,var(--border)));border-radius:15px;background:color-mix(in srgb,var(--theme-primary,var(--brand)) 8%,var(--theme-card,var(--card)));color:var(--theme-primary,var(--brand));font-size:1.2rem;font-weight:900}
.department-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:17px}
.department-field{display:grid;gap:6px;min-width:0}
.department-field-wide{grid-column:1/-1}
.department-field>span:first-child{font-size:.76rem;font-weight:850}
.department-field em{color:#dc2626;font-style:normal}
.department-field input,.department-field select{padding:9px 11px}
.department-field input[readonly],.department-field select:disabled{background:color-mix(in srgb,var(--theme-muted,var(--muted)) 7%,var(--theme-card,var(--card)));color:var(--theme-muted,var(--muted));cursor:not-allowed}
.department-field small{color:var(--theme-muted,var(--muted));font-size:.7rem}
.department-field .validation{color:#c81e1e;font-size:.72rem}
.department-hierarchy-preview{display:grid;gap:7px;margin-top:17px;padding:13px;border:1px dashed color-mix(in srgb,var(--theme-primary,var(--brand)) 35%,var(--theme-border,var(--border)));border-radius:11px;background:color-mix(in srgb,var(--theme-primary,var(--brand)) 4%,var(--theme-card,var(--card)))}
.department-preview-path{display:flex;align-items:center;gap:9px;min-width:0;font-size:.87rem}
.department-preview-path span,.department-preview-path strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.department-preview-path span{color:var(--theme-muted,var(--muted))}
.department-preview-path b{color:var(--theme-primary,var(--brand))}
.department-edit-side{display:grid;gap:14px}
.department-side-heading{padding:14px 15px 11px;border-bottom:1px solid var(--theme-border,var(--border));background:color-mix(in srgb,var(--theme-control-soft,var(--soft)) 72%,var(--theme-card,var(--card)))}
.department-side-heading h3{margin:2px 0 0;font-size:.98rem}
.department-usage-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px;padding:13px}
.department-usage-grid>div{display:grid;gap:3px;padding:11px;border:1px solid var(--theme-border,var(--border));border-radius:10px;background:color-mix(in srgb,var(--theme-control-soft,var(--soft)) 60%,var(--theme-card,var(--card)))}
.department-usage-grid span{color:var(--theme-muted,var(--muted));font-size:.69rem}
.department-usage-grid strong{font-size:1.08rem;font-variant-numeric:tabular-nums}
.department-protection-note{margin:0 13px 13px;padding:10px;border:1px solid color-mix(in srgb,#f59e0b 32%,var(--theme-border,var(--border)));border-radius:9px;background:color-mix(in srgb,#f59e0b 8%,var(--theme-card,var(--card)));color:var(--theme-text,var(--text));font-size:.75rem;line-height:1.45}
.department-rules-card ul{display:grid;gap:0;margin:0;padding:4px 14px 10px;list-style:none}
.department-rules-card li{display:grid;gap:2px;padding:10px 0;border-bottom:1px solid var(--theme-border,var(--border))}
.department-rules-card li:last-child{border-bottom:0}
.department-rules-card li strong{font-size:.76rem}
.department-rules-card li span{color:var(--theme-muted,var(--muted));font-size:.7rem;line-height:1.4}
.department-hidden-form{display:none!important}
@media(max-width:1180px){.departments-kpi-grid{grid-template-columns:repeat(3,minmax(150px,1fr))}.departments-filter-bar{grid-template-columns:minmax(260px,1fr) minmax(180px,220px) 92px}.department-view-switch{grid-column:1/-1;justify-content:flex-end}.department-edit-grid{grid-template-columns:minmax(0,1.35fr) minmax(280px,.8fr)}}
@media(max-width:880px){.departments-hero-card{grid-template-columns:auto minmax(0,1fr)}.departments-hero-actions{grid-column:1/-1}.departments-kpi-grid{grid-template-columns:repeat(2,minmax(140px,1fr))}.departments-filter-bar{grid-template-columns:1fr 1fr}.department-search-box{grid-column:1/-1}.department-view-switch{grid-column:auto;justify-content:flex-end}.department-edit-grid{grid-template-columns:1fr}.department-edit-commandbar{position:relative;align-items:flex-start;flex-direction:column}.department-edit-status{align-self:flex-end}}
@media(max-width:620px){.departments-topbar{align-items:flex-start;flex-direction:column}.departments-top-actions{justify-content:flex-start}.departments-hero-card{grid-template-columns:1fr}.departments-hero-icon{width:48px;height:48px}.departments-hero-actions{grid-column:auto}.department-btn{flex:1}.departments-kpi-grid{grid-template-columns:1fr}.departments-filter-bar{grid-template-columns:1fr}.department-search-box,.department-view-switch{grid-column:auto}.department-view-switch{justify-content:flex-start}.departments-result-bar{align-items:flex-start;flex-direction:column}.department-pager{width:100%;justify-content:flex-end}.departments-table-heading{align-items:flex-start;flex-direction:column}.departments-table-heading>small{text-align:left}.department-edit-actions{width:100%}.department-edit-actions .department-btn{flex:1}.department-edit-status{align-self:flex-start}.department-card-heading{align-items:flex-start}.department-form-grid{grid-template-columns:1fr}.department-usage-grid{grid-template-columns:1fr}}
@media print{.departments-topbar .user-panel,.departments-hero-actions,.departments-filter-bar,.department-pager,.department-actions-cell,.department-edit-commandbar{display:none!important}.departments-shell{gap:8px}.departments-hero-card,.department-kpi-card,.departments-table-card{box-shadow:none}.departments-table{min-width:0;font-size:9px}.departments-table th,.departments-table td{padding:5px 6px}.departments-kpi-grid{grid-template-columns:repeat(5,1fr)}}

/* User Management compact cards and user-rights matrix */
.usermgmt-card-grid {
    grid-template-columns: repeat(auto-fill, minmax(300px, 370px));
    justify-content: start;
    align-items: start;
    gap: 10px;
}

.usermgmt-card {
    padding: 12px;
    gap: 9px;
    border-radius: 15px;
    box-shadow: 0 6px 18px rgba(15, 23, 42, .055);
}

.usermgmt-card-head {
    gap: 9px;
}

.usermgmt-avatar {
    width: 38px;
    height: 38px;
    border-radius: 12px;
    font-size: .84rem;
}

.usermgmt-card-head h3 {
    font-size: .94rem;
}

.usermgmt-card-head span:not(.usermgmt-pill),
.usermgmt-card-body span,
.usermgmt-card-body strong {
    font-size: .78rem;
}

.usermgmt-card-body {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px 10px;
}

.usermgmt-card-body div {
    display: grid;
    gap: 2px;
    padding: 6px 0;
    border-bottom: 1px dashed var(--border-color, #e5e7eb);
    min-width: 0;
}

.usermgmt-card-body strong {
    text-align: left;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.usermgmt-card-actions {
    gap: 6px;
}

.usermgmt-card-actions .usermgmt-action-btn {
    min-height: 30px;
    padding: 5px 9px;
    font-size: .78rem;
    border-radius: 9px;
}

.usermgmt-action-btn.rights {
    border-color: color-mix(in srgb, var(--theme-primary, #2563eb) 42%, var(--border-color, #e5e7eb));
    color: var(--theme-primary, #2563eb);
    background: color-mix(in srgb, var(--theme-primary, #2563eb) 7%, var(--card-bg, #fff));
}

.userrights-shell {
    width: 100%;
}

.userrights-commandbar,
.userrights-filterbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
}

.userrights-commandbar {
    padding: 12px;
    border: 1px solid var(--border-color, #dbe3ee);
    border-radius: 16px;
    background: var(--card-bg, #fff);
}

.userrights-user-summary {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    min-width: min(100%, 420px);
}

.userrights-user-summary > div:nth-child(2) {
    display: grid;
    min-width: 0;
}

.userrights-user-summary strong {
    color: var(--text-color, #111827);
}

.userrights-user-summary span:not(.usermgmt-pill) {
    color: var(--muted-text, #64748b);
    font-size: .82rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.userrights-actions {
    display: flex;
    gap: 8px;
}

.userrights-stat-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(110px, 1fr));
    gap: 8px;
    margin: 10px 0;
}

.userrights-stat-grid > div {
    display: grid;
    gap: 3px;
    padding: 10px 12px;
    border: 1px solid var(--border-color, #dbe3ee);
    border-radius: 13px;
    background: var(--card-bg, #fff);
}

.userrights-stat-grid span {
    color: var(--muted-text, #64748b);
    font-size: .76rem;
}

.userrights-stat-grid strong {
    color: var(--theme-primary, #2563eb);
    font-size: 1.05rem;
}

.userrights-layout {
    display: grid;
    grid-template-columns: minmax(225px, 270px) minmax(0, 1fr);
    gap: 10px;
    align-items: start;
}

.userrights-side-card,
.userrights-main {
    border: 1px solid var(--border-color, #dbe3ee);
    border-radius: 16px;
    background: var(--card-bg, #fff);
}

.userrights-side-card {
    padding: 12px;
    display: grid;
    gap: 6px;
    position: sticky;
    top: 10px;
}

.userrights-side-head {
    display: grid;
    gap: 3px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--border-color, #dbe3ee);
}

.userrights-side-head span,
.userrights-help span {
    color: var(--muted-text, #64748b);
    font-size: .76rem;
    line-height: 1.35;
}

.userrights-switch {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 34px;
    padding: 6px 8px;
    border-radius: 9px;
    color: var(--text-color, #111827);
    cursor: pointer;
}

.userrights-switch:hover {
    background: color-mix(in srgb, var(--theme-primary, #2563eb) 7%, transparent);
}

.userrights-switch input,
.userrights-table input[type="checkbox"] {
    width: 17px;
    height: 17px;
    accent-color: var(--theme-primary, #2563eb);
}

.userrights-help {
    display: grid;
    gap: 4px;
    margin-top: 6px;
    padding: 9px;
    border-radius: 10px;
    background: color-mix(in srgb, var(--theme-primary, #2563eb) 6%, transparent);
}

.userrights-main {
    min-width: 0;
    overflow: hidden;
}

.userrights-filterbar {
    justify-content: flex-start;
    padding: 10px;
    border-bottom: 1px solid var(--border-color, #dbe3ee);
}

.userrights-filterbar .odoo-input:first-child {
    flex: 1 1 260px;
}

.userrights-filterbar select {
    flex: 0 1 210px;
}

.userrights-table-wrap {
    overflow: auto;
    max-height: calc(100vh - 310px);
    min-height: 360px;
}

.userrights-table {
    width: 100%;
    min-width: 760px;
    border-collapse: separate;
    border-spacing: 0;
    color: var(--text-color, #111827);
}

.userrights-table th,
.userrights-table td {
    padding: 8px 9px;
    border-bottom: 1px solid var(--border-color, #dbe3ee);
    text-align: center;
    white-space: nowrap;
}

.userrights-table thead th {
    position: sticky;
    top: 0;
    z-index: 2;
    background: color-mix(in srgb, var(--theme-primary, #2563eb) 9%, var(--card-bg, #fff));
    font-size: .75rem;
    text-transform: uppercase;
    letter-spacing: .035em;
}

.userrights-table .userrights-menu-col,
.userrights-table .userrights-menu-cell {
    text-align: left;
    min-width: 280px;
}

.userrights-menu-cell {
    display: grid;
    gap: 2px;
}

.userrights-menu-cell strong {
    font-size: .84rem;
}

.userrights-menu-cell span {
    color: var(--muted-text, #64748b);
    font-size: .72rem;
}

.userrights-table tbody tr:hover {
    background: color-mix(in srgb, var(--theme-primary, #2563eb) 4%, transparent);
}

.userrights-empty {
    padding: 40px 16px;
    text-align: center;
    color: var(--muted-text, #64748b);
}

.userrights-empty.is-hidden {
    display: none;
}

.userrights-status {
    min-height: 34px;
    margin-top: 10px;
    padding: 8px 11px;
    border-radius: 10px;
    color: var(--muted-text, #64748b);
}

.userrights-status.success {
    background: rgba(16, 185, 129, .1);
    color: #047857;
}

.userrights-status.error {
    background: rgba(239, 68, 68, .1);
    color: #b91c1c;
}

.userrights-status.working {
    background: color-mix(in srgb, var(--theme-primary, #2563eb) 8%, transparent);
    color: var(--theme-primary, #2563eb);
}

.usermgmt-table .actions-col {
    min-width: 310px;
}

@media (max-width: 900px) {
    .usermgmt-card-grid {
        grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    }

    .userrights-stat-grid {
        grid-template-columns: repeat(2, minmax(110px, 1fr));
    }

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

    .userrights-side-card {
        position: static;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .userrights-side-head,
    .userrights-help {
        grid-column: 1 / -1;
    }

    .userrights-table-wrap {
        max-height: none;
    }
}

@media (max-width: 560px) {
    .usermgmt-card-grid,
    .usermgmt-card-body,
    .userrights-side-card,
    .userrights-stat-grid {
        grid-template-columns: 1fr;
    }

    .userrights-user-summary {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .userrights-user-summary .usermgmt-pill {
        grid-column: 1 / -1;
        justify-self: start;
    }
}


/* =========================================================
   TAX Clauses master - Advanced UI / selected Theme Pack
   Converted from VATLedgers.vb + CreateVatLedgers.vb
   ========================================================= */
.tax-clause-topbar {
    align-items: flex-start;
    gap: 18px;
}
.tax-clause-shell,
.tax-clause-editor {
    --tax-border: color-mix(in srgb, var(--border, #cbd5e1) 78%, transparent);
    --tax-soft: color-mix(in srgb, var(--card-bg, #fff) 92%, var(--accent, #38506d) 8%);
    --tax-accent-soft: color-mix(in srgb, var(--accent, #38506d) 10%, var(--card-bg, #fff));
    --tax-text-soft: var(--muted, #64748b);
    color: var(--text, #172033);
}
.tax-clause-shell {
    border: 1px solid var(--tax-border);
    border-radius: 18px;
    background: color-mix(in srgb, var(--card-bg, #fff) 96%, transparent);
    box-shadow: 0 12px 34px rgba(15, 23, 42, .07);
    overflow: hidden;
}
.tax-clause-toolbar {
    display: grid;
    grid-template-columns: minmax(0, auto) minmax(520px, 1fr);
    gap: 14px;
    align-items: center;
    padding: 14px;
    border-bottom: 1px solid var(--tax-border);
    background: color-mix(in srgb, var(--card-bg, #fff) 97%, var(--accent, #38506d) 3%);
}
.tax-clause-toolbar-actions,
.tax-clause-editor-actions,
.tax-clause-row-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}
.tax-clause-btn {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 8px 13px;
    border: 1px solid color-mix(in srgb, var(--accent, #38506d) 34%, var(--border, #cbd5e1));
    border-radius: 10px;
    background: color-mix(in srgb, var(--card-bg, #fff) 97%, var(--accent, #38506d) 3%);
    color: var(--text, #172033);
    font: inherit;
    font-size: .84rem;
    font-weight: 800;
    line-height: 1;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    box-shadow: 0 3px 10px rgba(15, 23, 42, .05);
    transition: border-color .16s ease, background .16s ease, transform .16s ease, box-shadow .16s ease;
}
.tax-clause-btn:hover,
.tax-clause-btn:focus-visible {
    border-color: var(--accent, #38506d);
    background: var(--tax-accent-soft);
    color: var(--text, #172033);
    transform: translateY(-1px);
    box-shadow: 0 8px 18px rgba(15, 23, 42, .09);
}
.tax-clause-btn.primary {
    border-color: var(--accent, #38506d);
    color: var(--accent, #38506d);
    background: var(--tax-accent-soft);
}
.tax-clause-filter-form {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(240px, 1fr) minmax(125px, .26fr) minmax(125px, .26fr) minmax(100px, .2fr);
    gap: 8px;
}
.tax-clause-filter-form select,
.tax-clause-filter-form input,
.tax-clause-field input,
.tax-clause-field select {
    min-width: 0;
    min-height: 40px;
    width: 100%;
    border: 1px solid var(--tax-border);
    border-radius: 10px;
    background: var(--card-bg, #fff);
    color: var(--text, #172033);
    padding: 8px 11px;
    font: inherit;
    font-size: .88rem;
    outline: none;
    transition: border-color .16s ease, box-shadow .16s ease, background .16s ease;
}
.tax-clause-filter-form select:focus,
.tax-clause-filter-form input:focus,
.tax-clause-field input:focus,
.tax-clause-field select:focus {
    border-color: var(--accent, #38506d);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent, #38506d) 14%, transparent);
}
.tax-clause-search-box {
    position: relative;
    min-width: 0;
}
.tax-clause-search-box > span {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--tax-text-soft);
    z-index: 1;
}
.tax-clause-search-box input { padding-left: 34px; }
.tax-clause-kpis {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 10px;
    padding: 14px;
    border-bottom: 1px solid var(--tax-border);
    background: color-mix(in srgb, var(--page-bg, #f4f7fb) 58%, var(--card-bg, #fff));
}
.tax-clause-kpis article {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 11px;
    padding: 12px;
    border: 1px solid var(--tax-border);
    border-radius: 13px;
    background: var(--card-bg, #fff);
    box-shadow: 0 4px 14px rgba(15, 23, 42, .04);
}
.tax-clause-kpi-icon {
    flex: 0 0 36px;
    width: 36px;
    height: 36px;
    display: grid;
    place-items: center;
    border: 1px solid color-mix(in srgb, var(--accent, #38506d) 23%, var(--tax-border));
    border-radius: 11px;
    background: var(--tax-accent-soft);
    color: var(--accent, #38506d);
    font-weight: 900;
}
.tax-clause-kpis div { min-width: 0; display: grid; }
.tax-clause-kpis small,
.tax-clause-kpis em {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: var(--tax-text-soft);
    font-size: .7rem;
    font-style: normal;
}
.tax-clause-kpis strong { font-size: 1.2rem; line-height: 1.1; }
.tax-clause-list-card { min-width: 0; }
.tax-clause-list-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 14px 16px;
    border-bottom: 1px solid var(--tax-border);
}
.tax-clause-list-heading h2,
.tax-clause-section-heading h2 {
    margin: 0;
    color: var(--text, #172033);
    font-size: 1.02rem;
}
.tax-clause-list-heading p,
.tax-clause-section-heading p {
    margin: 3px 0 0;
    color: var(--tax-text-soft);
    font-size: .78rem;
}
.tax-clause-pager { display: flex; align-items: center; gap: 7px; white-space: nowrap; }
.tax-clause-pager > span { color: var(--tax-text-soft); font-size: .77rem; font-weight: 700; }
.tax-clause-page-btn,
.tax-clause-icon-btn {
    display: inline-grid;
    place-items: center;
    border: 1px solid var(--tax-border);
    border-radius: 9px;
    background: var(--card-bg, #fff);
    color: var(--text, #172033);
    text-decoration: none;
    cursor: pointer;
}
.tax-clause-page-btn { width: 34px; height: 34px; font-size: 1.15rem; }
.tax-clause-page-btn:hover,
.tax-clause-icon-btn:hover { border-color: var(--accent, #38506d); background: var(--tax-accent-soft); }
.tax-clause-page-btn.disabled { pointer-events: none; opacity: .38; }
.tax-clause-table-wrap { width: 100%; overflow-x: auto; overscroll-behavior-inline: contain; }
.tax-clause-table {
    width: 100%;
    min-width: 1480px;
    border-collapse: separate;
    border-spacing: 0;
    table-layout: fixed;
}
.tax-clause-table th,
.tax-clause-table td {
    border-bottom: 1px solid var(--tax-border);
    padding: 10px 9px;
    vertical-align: middle;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: .78rem;
}
.tax-clause-table th {
    position: sticky;
    top: 0;
    z-index: 2;
    background: color-mix(in srgb, var(--card-bg, #fff) 88%, var(--accent, #38506d) 12%);
    color: var(--text, #172033);
    text-transform: uppercase;
    letter-spacing: .035em;
    font-size: .67rem;
    font-weight: 900;
}
.tax-clause-table tbody tr:hover td { background: color-mix(in srgb, var(--accent, #38506d) 4%, var(--card-bg, #fff)); }
.tax-clause-table th:nth-child(1), .tax-clause-table td:nth-child(1) { width: 44px; text-align: center; }
.tax-clause-table th:nth-child(2), .tax-clause-table td:nth-child(2) { width: 230px; }
.tax-clause-table th:nth-child(3), .tax-clause-table td:nth-child(3) { width: 82px; text-align: center; }
.tax-clause-table th:nth-child(4), .tax-clause-table td:nth-child(4) { width: 100px; }
.tax-clause-table th:nth-child(5), .tax-clause-table td:nth-child(5) { width: 90px; }
.tax-clause-table th:nth-child(6), .tax-clause-table td:nth-child(6) { width: 185px; }
.tax-clause-table th:nth-child(7), .tax-clause-table td:nth-child(7) { width: 185px; }
.tax-clause-table th:nth-child(8), .tax-clause-table td:nth-child(8) { width: 190px; }
.tax-clause-table th:nth-child(9), .tax-clause-table td:nth-child(9) { width: 190px; }
.tax-clause-table th:nth-child(10), .tax-clause-table td:nth-child(10) { width: 135px; }
.tax-clause-table th:nth-child(11), .tax-clause-table td:nth-child(11) { width: 118px; }
.tax-clause-name-cell { display: flex; align-items: center; gap: 9px; min-width: 0; }
.tax-clause-name-cell > div { min-width: 0; display: grid; }
.tax-clause-name-cell strong,
.tax-clause-name-cell small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tax-clause-name-cell strong { font-size: .83rem; }
.tax-clause-name-cell small { color: var(--tax-text-soft); font-size: .67rem; }
.tax-clause-rate-avatar {
    flex: 0 0 35px;
    width: 35px;
    height: 35px;
    display: grid;
    place-items: center;
    border-radius: 10px;
    background: var(--tax-accent-soft);
    color: var(--accent, #38506d);
    font-size: .7rem;
    font-weight: 900;
}
.tax-clause-rate-pill,
.tax-clause-type-pill,
.tax-clause-status-pill,
.tax-clause-usage-pill,
.tax-clause-map-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 25px;
    padding: 4px 8px;
    border: 1px solid var(--tax-border);
    border-radius: 999px;
    background: color-mix(in srgb, var(--card-bg, #fff) 93%, var(--accent, #38506d) 7%);
    font-size: .68rem;
    font-weight: 850;
    white-space: nowrap;
}
.tax-clause-rate-pill { color: var(--accent, #38506d); }
.tax-clause-type-pill.service { color: #7c3aed; border-color: color-mix(in srgb, #7c3aed 25%, var(--tax-border)); background: color-mix(in srgb, #7c3aed 8%, var(--card-bg, #fff)); }
.tax-clause-status-pill.active { color: #08775a; border-color: color-mix(in srgb, #0f9f79 28%, var(--tax-border)); background: color-mix(in srgb, #0f9f79 9%, var(--card-bg, #fff)); }
.tax-clause-status-pill.inactive { color: #9a3412; border-color: color-mix(in srgb, #d97706 28%, var(--tax-border)); background: color-mix(in srgb, #d97706 9%, var(--card-bg, #fff)); }
.tax-clause-usage-pill.used { color: #075985; border-color: color-mix(in srgb, #0284c7 25%, var(--tax-border)); background: color-mix(in srgb, #0284c7 8%, var(--card-bg, #fff)); }
.tax-clause-ledger-text,
.tax-clause-ledger-pair { min-width: 0; display: grid; overflow: hidden; text-overflow: ellipsis; }
.tax-clause-ledger-pair b,
.tax-clause-ledger-pair small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tax-clause-ledger-pair b { font-size: .75rem; }
.tax-clause-ledger-pair small { color: var(--tax-text-soft); font-size: .64rem; }
.tax-clause-actions-cell { overflow: visible !important; }
.tax-clause-row-actions { flex-wrap: nowrap; justify-content: flex-end; }
.tax-clause-row-actions form { margin: 0; }
.tax-clause-icon-btn {
    width: 31px;
    height: 31px;
    padding: 0;
    font: inherit;
    font-size: .82rem;
}
.tax-clause-icon-btn.success { color: #08775a; }
.tax-clause-icon-btn.warning { color: #9a3412; }
.tax-clause-icon-btn.danger { color: #b42318; }
.tax-clause-icon-btn.disabled { opacity: .42; cursor: not-allowed; }
.tax-clause-empty { height: 108px; text-align: center; color: var(--tax-text-soft); font-size: .85rem !important; }

.tax-clause-editor {
    display: grid;
    gap: 14px;
    padding-bottom: 24px;
}
.tax-clause-editor-statusbar,
.tax-clause-identity-card,
.tax-clause-ledger-card,
.tax-clause-record-info,
.tax-clause-rate-warning {
    border: 1px solid var(--tax-border);
    border-radius: 16px;
    background: var(--card-bg, #fff);
    box-shadow: 0 8px 24px rgba(15, 23, 42, .05);
}
.tax-clause-editor-statusbar {
    position: sticky;
    top: 0;
    z-index: 20;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 14px;
    padding: 11px 13px;
    background: color-mix(in srgb, var(--card-bg, #fff) 94%, transparent);
    backdrop-filter: blur(12px);
}
.tax-clause-editor-state { display: flex; align-items: center; gap: 9px; }
.tax-clause-editor-code { color: var(--tax-text-soft); font-size: .76rem; font-weight: 750; }
.tax-clause-validation:empty { display: none; }
.tax-clause-validation { margin: 0; }
.tax-clause-rate-warning {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    border-color: color-mix(in srgb, #d97706 30%, var(--tax-border));
    background: color-mix(in srgb, #d97706 6%, var(--card-bg, #fff));
}
.tax-clause-rate-warning > span {
    flex: 0 0 34px;
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    border: 1px solid color-mix(in srgb, #d97706 36%, transparent);
    border-radius: 50%;
    color: #9a3412;
    font-weight: 900;
}
.tax-clause-rate-warning p { margin: 2px 0 0; color: var(--tax-text-soft); font-size: .77rem; }
.tax-clause-identity-card,
.tax-clause-ledger-card { padding: 18px; }
.tax-clause-section-heading {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 18px;
    margin-bottom: 16px;
}
.tax-clause-section-heading > div > small {
    color: var(--accent, #38506d);
    font-size: .66rem;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}
.tax-clause-live-rate {
    min-width: 94px;
    display: grid;
    place-items: center;
    padding: 9px 12px;
    border: 1px solid color-mix(in srgb, var(--accent, #38506d) 28%, var(--tax-border));
    border-radius: 13px;
    background: var(--tax-accent-soft);
}
.tax-clause-live-rate span { color: var(--accent, #38506d); font-size: 1.1rem; font-weight: 900; }
.tax-clause-live-rate small { color: var(--tax-text-soft); font-size: .66rem; }
.tax-clause-form-grid.identity {
    display: grid;
    grid-template-columns: minmax(180px, .65fr) minmax(280px, 1.5fr) minmax(160px, .5fr);
    gap: 13px;
}
.tax-clause-field { min-width: 0; display: grid; gap: 6px; }
.tax-clause-field > span:first-child { color: var(--text, #172033); font-size: .75rem; font-weight: 850; }
.tax-clause-field > span:first-child b { color: #b42318; }
.tax-clause-field > small { color: var(--tax-text-soft); font-size: .67rem; line-height: 1.35; }
.tax-clause-field > span.field-validation-error { color: #b42318; font-size: .69rem; }
.tax-clause-percent-input { position: relative; }
.tax-clause-percent-input input { padding-right: 34px; text-align: right; font-weight: 850; }
.tax-clause-percent-input > span { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); color: var(--tax-text-soft); font-weight: 850; }
.tax-clause-flow-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 11px;
}
.tax-clause-flow-grid article {
    position: relative;
    min-width: 0;
    display: grid;
    align-content: start;
    gap: 11px;
    padding: 14px;
    border: 1px solid var(--tax-border);
    border-radius: 14px;
    background: color-mix(in srgb, var(--card-bg, #fff) 96%, var(--accent, #38506d) 4%);
}
.tax-clause-flow-number {
    position: absolute;
    right: 11px;
    top: 9px;
    color: color-mix(in srgb, var(--accent, #38506d) 42%, transparent);
    font-size: 1.2rem;
    font-weight: 950;
}
.tax-clause-flow-grid article > div:first-of-type { padding-right: 28px; min-height: 66px; }
.tax-clause-flow-grid article small { color: var(--accent, #38506d); font-size: .63rem; font-weight: 850; text-transform: uppercase; }
.tax-clause-flow-grid article strong { display: block; margin-top: 3px; font-size: .85rem; }
.tax-clause-flow-grid article p { margin: 3px 0 0; color: var(--tax-text-soft); font-size: .68rem; line-height: 1.35; }
.tax-clause-field.compact select { font-size: .77rem; }
.tax-clause-auto-map {
    color: var(--tax-text-soft);
    font-size: .63rem;
    font-weight: 700;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.tax-clause-service-layout {
    display: grid;
    grid-template-columns: minmax(180px, .36fr) minmax(280px, 1fr);
    gap: 16px;
    align-items: center;
}
.tax-clause-service-visual {
    min-height: 130px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 3px;
    border: 1px solid color-mix(in srgb, #7c3aed 22%, var(--tax-border));
    border-radius: 14px;
    background: color-mix(in srgb, #7c3aed 6%, var(--card-bg, #fff));
}
.tax-clause-service-visual > span { color: #7c3aed; font-size: 2rem; font-weight: 950; }
.tax-clause-service-visual strong { font-size: .9rem; }
.tax-clause-service-visual small { color: var(--tax-text-soft); }
.tax-clause-record-info {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0;
    overflow: hidden;
}
.tax-clause-record-info > div { display: grid; gap: 3px; padding: 13px 15px; border-right: 1px solid var(--tax-border); }
.tax-clause-record-info > div:last-child { border-right: 0; }
.tax-clause-record-info small { color: var(--tax-text-soft); font-size: .67rem; }
.tax-clause-record-info strong { font-size: .83rem; }

@media (max-width: 1250px) {
    .tax-clause-toolbar { grid-template-columns: 1fr; }
    .tax-clause-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .tax-clause-flow-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 820px) {
    .tax-clause-filter-form { grid-template-columns: 1fr 1fr; }
    .tax-clause-search-box { grid-column: 1 / -1; }
    .tax-clause-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .tax-clause-form-grid.identity { grid-template-columns: 1fr; }
    .tax-clause-flow-grid { grid-template-columns: 1fr; }
    .tax-clause-service-layout { grid-template-columns: 1fr; }
    .tax-clause-record-info { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .tax-clause-record-info > div:nth-child(2) { border-right: 0; }
    .tax-clause-record-info > div:nth-child(-n+2) { border-bottom: 1px solid var(--tax-border); }
    .tax-clause-editor-statusbar { position: static; align-items: flex-start; flex-direction: column; }
}
@media (max-width: 520px) {
    .tax-clause-toolbar-actions,
    .tax-clause-editor-actions { width: 100%; }
    .tax-clause-btn { flex: 1 1 auto; }
    .tax-clause-filter-form { grid-template-columns: 1fr; }
    .tax-clause-search-box { grid-column: auto; }
    .tax-clause-kpis { grid-template-columns: 1fr; }
    .tax-clause-list-heading,
    .tax-clause-section-heading { align-items: stretch; flex-direction: column; }
    .tax-clause-record-info { grid-template-columns: 1fr; }
    .tax-clause-record-info > div { border-right: 0; border-bottom: 1px solid var(--tax-border); }
    .tax-clause-record-info > div:last-child { border-bottom: 0; }
}
@media print {
    .tax-clause-topbar .user-panel,
    .tax-clause-toolbar,
    .tax-clause-pager,
    .tax-clause-actions-column,
    .tax-clause-actions-cell { display: none !important; }
    .tax-clause-shell { border: 0; box-shadow: none; }
    .tax-clause-table-wrap { overflow: visible; }
    .tax-clause-table { min-width: 0; table-layout: auto; }
    .tax-clause-table th,
    .tax-clause-table td { font-size: 7.5pt; padding: 5px; }
}

/* =========================================================
   Maintain Documents - global SQL-backed company library
   Advanced UI / Theme Pack scoped styles
   ========================================================= */
.company-doc-topbar { align-items: flex-start; }
.company-doc-shell,
.company-doc-editor,
.company-doc-details {
    --doc-accent: var(--theme-primary, var(--erp-primary, #36597c));
    --doc-accent-dark: var(--theme-primary-dark, var(--erp-primary-dark, #27435f));
    --doc-accent-soft: color-mix(in srgb, var(--doc-accent) 9%, var(--card-bg, #fff));
    --doc-border: color-mix(in srgb, var(--doc-accent) 20%, var(--border-color, #d7e0ea));
    --doc-border-strong: color-mix(in srgb, var(--doc-accent) 35%, var(--border-color, #c7d3df));
    --doc-surface: var(--card-bg, #fff);
    --doc-surface-soft: color-mix(in srgb, var(--doc-accent) 3%, var(--card-bg, #fff));
    --doc-text: var(--text-color, #14243a);
    --doc-muted: color-mix(in srgb, var(--doc-text) 64%, transparent);
    color: var(--doc-text);
}
.company-doc-shell,
.company-doc-editor,
.company-doc-details { display: grid; gap: 14px; }
.company-doc-toolbar,
.company-doc-editor-bar,
.company-doc-detail-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 11px 13px;
    border: 1px solid var(--doc-border);
    border-radius: 15px;
    background: var(--doc-surface);
    box-shadow: 0 8px 24px rgba(21, 42, 70, .055);
}
.company-doc-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; }
.company-doc-actions form { display: inline-flex; margin: 0; }
.company-doc-btn {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 8px 13px;
    border: 1px solid var(--doc-border-strong);
    border-radius: 10px;
    background: transparent;
    color: var(--doc-text);
    font: inherit;
    font-size: .78rem;
    font-weight: 800;
    line-height: 1;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    transition: border-color .16s ease, background .16s ease, color .16s ease, transform .16s ease, box-shadow .16s ease;
}
.company-doc-btn:hover,
.company-doc-btn:focus-visible {
    border-color: var(--doc-accent);
    background: var(--doc-accent-soft);
    color: var(--doc-accent-dark);
    box-shadow: 0 7px 18px color-mix(in srgb, var(--doc-accent) 12%, transparent);
    transform: translateY(-1px);
}
.company-doc-btn.primary { border-color: var(--doc-accent); color: var(--doc-accent-dark); background: var(--doc-accent-soft); }
.company-doc-btn.danger { border-color: color-mix(in srgb, #dc2626 42%, var(--doc-border)); color: #b91c1c; background: color-mix(in srgb, #dc2626 5%, var(--doc-surface)); }
.company-doc-filter-form {
    flex: 1 1 720px;
    display: grid;
    grid-template-columns: minmax(260px, 1fr) minmax(125px, .32fr) minmax(120px, .28fr) minmax(145px, .34fr) 92px;
    gap: 7px;
}
.company-doc-filter-form input,
.company-doc-filter-form select,
.company-doc-field input,
.company-doc-field select {
    width: 100%;
    min-height: 38px;
    border: 1px solid var(--doc-border-strong);
    border-radius: 10px;
    background: var(--doc-surface);
    color: var(--doc-text);
    padding: 8px 10px;
    font: inherit;
    font-size: .76rem;
    outline: none;
}
.company-doc-filter-form input:focus,
.company-doc-filter-form select:focus,
.company-doc-field input:focus,
.company-doc-field select:focus { border-color: var(--doc-accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--doc-accent) 13%, transparent); }
.company-doc-search { position: relative; display: flex; align-items: center; }
.company-doc-search > span { position: absolute; left: 11px; color: var(--doc-muted); font-weight: 900; }
.company-doc-search input { padding-left: 31px; }
.company-doc-kpis {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 10px;
}
.company-doc-kpis article {
    min-height: 88px;
    display: flex;
    align-items: center;
    gap: 11px;
    padding: 13px 14px;
    border: 1px solid var(--doc-border);
    border-radius: 14px;
    background: var(--doc-surface);
    box-shadow: 0 7px 20px rgba(21, 42, 70, .045);
}
.company-doc-kpis article > span {
    width: 39px;
    height: 39px;
    flex: 0 0 39px;
    display: grid;
    place-items: center;
    border: 1px solid var(--doc-border);
    border-radius: 12px;
    background: var(--doc-accent-soft);
    color: var(--doc-accent-dark);
    font-weight: 950;
}
.company-doc-kpis article.warning > span { color: #9a6700; border-color: #e8cf83; background: #fff8df; }
.company-doc-kpis article.danger > span { color: #b42318; border-color: #f1b8b4; background: #fff0ef; }
.company-doc-kpis article div { min-width: 0; display: grid; gap: 1px; }
.company-doc-kpis small { color: var(--doc-muted); font-size: .65rem; font-weight: 700; white-space: nowrap; }
.company-doc-kpis strong { font-size: 1.12rem; line-height: 1.05; }
.company-doc-kpis em { color: var(--doc-muted); font-size: .62rem; font-style: normal; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.company-doc-list-card,
.company-doc-form-card,
.company-doc-storage-card,
.company-doc-info-card,
.company-doc-file-card {
    border: 1px solid var(--doc-border);
    border-radius: 15px;
    background: var(--doc-surface);
    box-shadow: 0 9px 26px rgba(21, 42, 70, .05);
    overflow: hidden;
}
.company-doc-list-heading,
.company-doc-section-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 13px 15px;
    border-bottom: 1px solid var(--doc-border);
    background: var(--doc-surface-soft);
}
.company-doc-list-heading h2,
.company-doc-section-heading h2 { margin: 0; font-size: .92rem; }
.company-doc-list-heading p,
.company-doc-section-heading p { margin: 2px 0 0; color: var(--doc-muted); font-size: .68rem; }
.company-doc-section-heading small { color: var(--doc-accent-dark); font-size: .58rem; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.company-doc-section-icon { width: 38px; height: 38px; display: grid; place-items: center; border: 1px solid var(--doc-border); border-radius: 12px; color: var(--doc-accent-dark); background: var(--doc-accent-soft); font-weight: 950; }
.company-doc-pager { display: flex; align-items: center; gap: 6px; font-size: .68rem; font-weight: 750; white-space: nowrap; }
.company-doc-page-btn {
    width: 31px;
    height: 31px;
    display: grid;
    place-items: center;
    border: 1px solid var(--doc-border-strong);
    border-radius: 9px;
    color: var(--doc-text);
    text-decoration: none;
    background: transparent;
}
.company-doc-page-btn:hover { border-color: var(--doc-accent); background: var(--doc-accent-soft); }
.company-doc-page-btn.disabled { pointer-events: none; opacity: .38; }
.company-doc-table-wrap,
.company-doc-file-table-wrap { overflow: auto; scrollbar-width: thin; }
.company-doc-table { width: 100%; min-width: 1260px; border-collapse: collapse; table-layout: fixed; }
.company-doc-table th,
.company-doc-table td { border-bottom: 1px solid var(--doc-border); padding: 8px 9px; text-align: left; vertical-align: middle; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.company-doc-table th { position: sticky; top: 0; z-index: 2; background: color-mix(in srgb, var(--doc-accent) 7%, var(--doc-surface)); color: var(--doc-muted); font-size: .61rem; font-weight: 900; letter-spacing: .045em; text-transform: uppercase; }
.company-doc-table td { font-size: .72rem; }
.company-doc-table th:nth-child(1) { width: 42px; }
.company-doc-table th:nth-child(2) { width: 235px; }
.company-doc-table th:nth-child(3) { width: 110px; }
.company-doc-table th:nth-child(4) { width: 130px; }
.company-doc-table th:nth-child(5) { width: 145px; }
.company-doc-table th:nth-child(6) { width: 108px; }
.company-doc-table th:nth-child(7) { width: 170px; }
.company-doc-table th:nth-child(8) { width: 82px; }
.company-doc-table th:nth-child(9) { width: 150px; }
.company-doc-table th:nth-child(10) { width: 120px; }
.company-doc-table tbody tr:hover { background: var(--doc-surface-soft); }
.company-doc-table tbody tr.inactive { opacity: .72; }
.company-doc-table tbody tr.deleted { opacity: .57; text-decoration-color: color-mix(in srgb, var(--doc-text) 25%, transparent); }
.company-doc-serial { text-align: center !important; color: var(--doc-muted); font-weight: 800; }
.company-doc-name { display: flex; align-items: center; gap: 8px; min-width: 0; color: var(--doc-text); text-decoration: none; }
.company-doc-name > span:last-child { min-width: 0; display: grid; }
.company-doc-name strong,
.company-doc-name small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.company-doc-name strong { font-size: .75rem; }
.company-doc-name small { color: var(--doc-muted); font-size: .61rem; }
.company-doc-file-icon { width: 30px; height: 30px; flex: 0 0 30px; display: grid; place-items: center; border: 1px solid var(--doc-border); border-radius: 9px; background: var(--doc-accent-soft); color: var(--doc-accent-dark); font-weight: 900; }
.company-doc-type-pill,
.company-doc-status-pill,
.company-doc-expiry,
.company-doc-lock-pill,
.company-doc-version-pill {
    display: inline-flex;
    align-items: center;
    max-width: 100%;
    gap: 4px;
    padding: 4px 7px;
    border: 1px solid var(--doc-border);
    border-radius: 999px;
    background: var(--doc-surface-soft);
    color: var(--doc-text);
    font-size: .61rem;
    font-weight: 800;
    line-height: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.company-doc-status-pill.active,
.company-doc-version-pill.current { color: #067647; border-color: #9bd8bd; background: #ecfdf3; }
.company-doc-status-pill.inactive { color: #8a5d00; border-color: #e8cf83; background: #fffae8; }
.company-doc-status-pill.deleted,
.company-doc-expiry.expired { color: #b42318; border-color: #f2b7b3; background: #fff0ef; }
.company-doc-expiry.soon { color: #8a5d00; border-color: #e8cf83; background: #fff8df; }
.company-doc-expiry.valid { color: #067647; border-color: #9bd8bd; background: #ecfdf3; }
.company-doc-lock-pill { margin-top: 4px; color: #6941c6; border-color: #c8b5ed; background: #f5f0ff; }
.company-doc-text { display: block; overflow: hidden; text-overflow: ellipsis; }
.company-doc-contact,
.company-doc-file-count { min-width: 0; display: grid; gap: 1px; }
.company-doc-contact b,
.company-doc-contact small,
.company-doc-file-count b,
.company-doc-file-count small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.company-doc-contact small,
.company-doc-file-count small { color: var(--doc-muted); font-size: .6rem; }
.company-doc-actions-col,
.company-doc-actions-cell { text-align: center !important; }
.company-doc-row-actions { display: inline-flex; align-items: center; justify-content: center; gap: 5px; }
.company-doc-row-actions form { display: inline-flex; margin: 0; }
.company-doc-icon-btn {
    width: 31px;
    height: 31px;
    display: grid;
    place-items: center;
    border: 1px solid var(--doc-border-strong);
    border-radius: 9px;
    background: transparent;
    color: var(--doc-text);
    text-decoration: none;
    font: inherit;
    font-size: .72rem;
    font-weight: 900;
    cursor: pointer;
}
.company-doc-icon-btn:hover { border-color: var(--doc-accent); background: var(--doc-accent-soft); color: var(--doc-accent-dark); }
.company-doc-icon-btn.danger { color: #b42318; border-color: #efc3c0; }
.company-doc-icon-btn.warning { color: #8a5d00; border-color: #e8cf83; }
.company-doc-icon-btn.success { color: #067647; border-color: #9bd8bd; }
.company-doc-empty { height: 88px; text-align: center !important; color: var(--doc-muted); }
.company-doc-editor-state,
.company-doc-detail-statuses { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 6px; }
.company-doc-editor-id { color: var(--doc-muted); font-size: .67rem; font-weight: 750; }
.company-doc-validation { margin: 0; }
.company-doc-editor-grid { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(330px, .65fr); gap: 14px; align-items: start; }
.company-doc-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; padding: 15px; }
.company-doc-field { min-width: 0; display: grid; align-content: start; gap: 5px; }
.company-doc-field.wide { grid-column: span 1; }
.company-doc-field.full { grid-column: 1 / -1; }
.company-doc-field > span:first-child { font-size: .68rem; font-weight: 800; }
.company-doc-field > span:first-child b { color: #b42318; }
.company-doc-field small { color: var(--doc-muted); font-size: .61rem; line-height: 1.35; }
.company-doc-field .readonly { background: color-mix(in srgb, var(--doc-text) 3%, var(--doc-surface)); color: var(--doc-muted); }
.company-doc-toggle { grid-column: 1 / -1; display: flex; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid var(--doc-border); border-radius: 11px; background: var(--doc-surface-soft); }
.company-doc-toggle input { width: 18px; height: 18px; accent-color: var(--doc-accent); }
.company-doc-toggle > span { display: grid; gap: 1px; }
.company-doc-toggle strong { font-size: .72rem; }
.company-doc-toggle small { color: var(--doc-muted); font-size: .61rem; }
.company-doc-storage-card { position: sticky; top: 10px; }
.company-doc-dropzone,
.company-doc-mini-dropzone {
    display: grid;
    place-items: center;
    align-content: center;
    gap: 5px;
    margin: 15px;
    min-height: 165px;
    padding: 18px;
    border: 1px dashed var(--doc-border-strong);
    border-radius: 14px;
    background: var(--doc-surface-soft);
    text-align: center;
    cursor: pointer;
    transition: border-color .16s ease, background .16s ease, transform .16s ease;
}
.company-doc-dropzone.dragging,
.company-doc-mini-dropzone.dragging,
.company-doc-dropzone:hover,
.company-doc-mini-dropzone:hover { border-color: var(--doc-accent); background: var(--doc-accent-soft); transform: translateY(-1px); }
.company-doc-dropzone input,
.company-doc-mini-dropzone input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.company-doc-dropzone strong,
.company-doc-mini-dropzone strong { font-size: .78rem; }
.company-doc-dropzone small,
.company-doc-mini-dropzone small { color: var(--doc-muted); font-size: .62rem; }
.company-doc-upload-icon { width: 44px; height: 44px; display: grid; place-items: center; border: 1px solid var(--doc-border); border-radius: 13px; background: var(--doc-surface); color: var(--doc-accent-dark); font-size: 1.25rem; font-weight: 900; }
.company-doc-selected-files { display: grid; gap: 5px; margin: -5px 15px 15px; max-height: 180px; overflow: auto; }
.company-doc-selected-files > span { color: var(--doc-muted); font-size: .65rem; text-align: center; }
.company-doc-selected-files > div { display: grid; grid-template-columns: 24px minmax(0, 1fr) auto; align-items: center; gap: 7px; padding: 7px 9px; border: 1px solid var(--doc-border); border-radius: 9px; }
.company-doc-selected-files strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .66rem; }
.company-doc-selected-files small { color: var(--doc-muted); font-size: .59rem; }
.company-doc-storage-info { display: grid; gap: 8px; padding: 0 15px 15px; }
.company-doc-storage-info > div { display: flex; gap: 9px; align-items: flex-start; padding: 9px 10px; border: 1px solid var(--doc-border); border-radius: 10px; }
.company-doc-storage-info > div > span { width: 27px; height: 27px; flex: 0 0 27px; display: grid; place-items: center; border-radius: 8px; background: var(--doc-accent-soft); color: var(--doc-accent-dark); font-size: .62rem; font-weight: 950; }
.company-doc-storage-info p { margin: 0; display: grid; gap: 1px; }
.company-doc-storage-info strong { font-size: .68rem; }
.company-doc-storage-info small { color: var(--doc-muted); font-size: .59rem; line-height: 1.35; }
.company-doc-readonly-message { margin: 15px; padding: 12px; border: 1px solid var(--doc-border); border-radius: 11px; color: var(--doc-muted); background: var(--doc-surface-soft); font-size: .68rem; }
.company-doc-summary-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.company-doc-summary-grid article { display: grid; gap: 3px; min-height: 82px; padding: 13px 14px; border: 1px solid var(--doc-border); border-radius: 13px; background: var(--doc-surface); }
.company-doc-summary-grid small { color: var(--doc-muted); font-size: .62rem; }
.company-doc-summary-grid strong { font-size: .89rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.company-doc-summary-grid span { color: var(--doc-muted); font-size: .64rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.company-doc-lock-banner { display: flex; align-items: center; gap: 11px; padding: 11px 13px; border: 1px solid #c8b5ed; border-radius: 12px; background: #f7f3ff; color: #4f378b; }
.company-doc-lock-banner > span { font-size: 1.25rem; }
.company-doc-lock-banner strong { font-size: .74rem; }
.company-doc-lock-banner p { margin: 2px 0 0; font-size: .65rem; }
.company-doc-details-grid { display: grid; grid-template-columns: minmax(270px, .34fr) minmax(0, .66fr); gap: 14px; align-items: start; }
.company-doc-definition-list { margin: 0; padding: 6px 15px 15px; }
.company-doc-definition-list > div { display: grid; grid-template-columns: 118px minmax(0, 1fr); gap: 9px; padding: 9px 0; border-bottom: 1px dashed var(--doc-border); }
.company-doc-definition-list > div:last-child { border-bottom: 0; }
.company-doc-definition-list dt { color: var(--doc-muted); font-size: .64rem; }
.company-doc-definition-list dd { margin: 0; font-size: .69rem; font-weight: 720; overflow-wrap: anywhere; }
.company-doc-inline-upload { display: grid; grid-template-columns: minmax(270px, 1fr) auto; align-items: center; gap: 9px; padding: 12px 15px; border-bottom: 1px solid var(--doc-border); }
.company-doc-mini-dropzone { min-height: 54px; margin: 0; grid-template-columns: auto auto 1fr; justify-items: start; text-align: left; padding: 8px 11px; }
.company-doc-mini-dropzone > span { grid-row: 1 / span 2; width: 29px; height: 29px; display: grid; place-items: center; border: 1px solid var(--doc-border); border-radius: 8px; color: var(--doc-accent-dark); }
.company-doc-mini-dropzone strong { align-self: end; }
.company-doc-mini-dropzone small { align-self: start; }
.company-doc-upload-selection { grid-column: 1 / -1; color: var(--doc-muted); font-size: .61rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.company-doc-file-table { width: 100%; min-width: 840px; border-collapse: collapse; table-layout: fixed; }
.company-doc-file-table th,
.company-doc-file-table td { padding: 8px 9px; border-bottom: 1px solid var(--doc-border); font-size: .68rem; text-align: left; vertical-align: middle; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.company-doc-file-table th { background: var(--doc-surface-soft); color: var(--doc-muted); font-size: .59rem; font-weight: 900; letter-spacing: .04em; text-transform: uppercase; }
.company-doc-file-table th:nth-child(1) { width: 270px; }
.company-doc-file-table th:nth-child(2) { width: 105px; }
.company-doc-file-table th:nth-child(3) { width: 80px; }
.company-doc-file-table th:nth-child(4) { width: 125px; }
.company-doc-file-table th:nth-child(5) { width: 145px; }
.company-doc-file-table th:nth-child(6) { width: 120px; }
.company-doc-file-table tr.previous-version { opacity: .62; }
.company-doc-file-name { display: flex; align-items: center; gap: 8px; min-width: 0; }
.company-doc-file-name i { width: 29px; height: 29px; flex: 0 0 29px; display: grid; place-items: center; border: 1px solid var(--doc-border); border-radius: 8px; background: var(--doc-accent-soft); font-style: normal; }
.company-doc-file-name > span { min-width: 0; display: grid; }
.company-doc-file-name strong,
.company-doc-file-name small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.company-doc-file-name small { color: var(--doc-muted); font-size: .57rem; }
.company-doc-file-actions-col,
.company-doc-file-actions-cell { text-align: center !important; }

@media (max-width: 1300px) {
    .company-doc-toolbar { align-items: stretch; flex-direction: column; }
    .company-doc-filter-form { flex-basis: auto; }
    .company-doc-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .company-doc-editor-grid { grid-template-columns: minmax(0, 1fr) minmax(300px, .58fr); }
}
@media (max-width: 980px) {
    .company-doc-filter-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .company-doc-search { grid-column: 1 / -1; }
    .company-doc-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .company-doc-editor-grid,
    .company-doc-details-grid { grid-template-columns: 1fr; }
    .company-doc-storage-card { position: static; }
    .company-doc-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 620px) {
    .company-doc-toolbar,
    .company-doc-editor-bar,
    .company-doc-detail-bar,
    .company-doc-list-heading,
    .company-doc-section-heading { align-items: stretch; flex-direction: column; }
    .company-doc-actions { width: 100%; }
    .company-doc-btn { flex: 1 1 auto; }
    .company-doc-filter-form,
    .company-doc-form-grid,
    .company-doc-kpis,
    .company-doc-summary-grid { grid-template-columns: 1fr; }
    .company-doc-search { grid-column: auto; }
    .company-doc-field.full { grid-column: auto; }
    .company-doc-inline-upload { grid-template-columns: 1fr; }
    .company-doc-mini-dropzone { grid-template-columns: auto 1fr; }
    .company-doc-mini-dropzone small { grid-column: 2; }
    .company-doc-definition-list > div { grid-template-columns: 1fr; gap: 3px; }
}
@media print {
    .company-doc-topbar .user-panel,
    .company-doc-toolbar,
    .company-doc-actions,
    .company-doc-pager,
    .company-doc-actions-col,
    .company-doc-actions-cell,
    .company-doc-inline-upload,
    .company-doc-file-actions-col,
    .company-doc-file-actions-cell,
    .erp-document-activity-card { display: none !important; }
    .company-doc-shell,
    .company-doc-details { gap: 8px; }
    .company-doc-list-card,
    .company-doc-info-card,
    .company-doc-file-card { box-shadow: none; }
    .company-doc-table-wrap,
    .company-doc-file-table-wrap { overflow: visible; }
    .company-doc-table,
    .company-doc-file-table { min-width: 0; table-layout: auto; }
    .company-doc-table th,
    .company-doc-table td,
    .company-doc-file-table th,
    .company-doc-file-table td { font-size: 7.5pt; padding: 5px; }
}

/* Daily Sales adaptive visible-column layout.
   JavaScript assigns widths only to columns currently enabled in Custom View.
   The table fills the available card width without a horizontal scrollbar when
   the visible columns can fit; overflow is enabled only when their readable
   minimum widths genuinely exceed the available space. */
@media screen {
    body .main-area .daily-sales-table-wrap {
        max-width: 100% !important;
        overflow-x: hidden !important;
        overflow-y: visible !important;
        scrollbar-gutter: auto;
    }

    body .main-area .daily-sales-table-wrap.has-horizontal-overflow {
        overflow-x: auto !important;
    }

    body .main-area .daily-sales-table {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        table-layout: fixed !important;
    }

    body .main-area .daily-sales-table col[hidden],
    body .main-area .daily-sales-table th[hidden],
    body .main-area .daily-sales-table td[hidden] {
        display: none !important;
        width: 0 !important;
        min-width: 0 !important;
        max-width: 0 !important;
        padding: 0 !important;
        border: 0 !important;
    }

    body .main-area .daily-sales-table col.daily-sales-check-col,
    body .main-area .daily-sales-table th.daily-sales-check-col,
    body .main-area .daily-sales-table td.daily-sales-check-col {
        width: 38px !important;
        min-width: 38px !important;
        max-width: 38px !important;
        padding-left: 4px !important;
        padding-right: 4px !important;
    }

    body .main-area .daily-sales-table [data-daily-sales-col="sNo"] {
        text-align: center !important;
        font-variant-numeric: tabular-nums;
    }

    body .main-area .daily-sales-table thead th {
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }
}

/* Sales Return / Credit Note – POS workspace mode */
.sales-entry-page.sales-return-mode .sales-mini-link::after {
    content: "Credit Note";
    margin-left: .55rem;
    padding: .15rem .45rem;
    border: 1px solid var(--erp-accent, var(--theme-primary, currentColor));
    border-radius: 999px;
    font-size: .72rem;
    font-weight: 700;
    white-space: nowrap;
}
.sales-entry-page.sales-return-mode [data-open-payment],
.sales-entry-page.sales-return-mode [data-open-customer-display],
.sales-entry-page.sales-return-mode [data-confirm-delivery],
.sales-entry-page.sales-return-mode [data-create-einvoice] { display: none !important; }

/* Direct Purchase OCR: full-page PDF preview and balanced review workspace */
.purchase-column-modal[data-invoice-ocr-modal]{padding:6px!important;align-items:center;justify-content:center}
.purchase-column-modal[data-invoice-ocr-modal] .purchase-ocr-card{
    width:calc(100vw - 12px)!important;
    height:calc(100dvh - 12px)!important;
    max-width:none!important;
    max-height:calc(100dvh - 12px)!important;
    overflow:hidden!important;
    padding:12px!important;
    box-sizing:border-box;
}
.purchase-column-modal[data-invoice-ocr-modal] .purchase-ocr-card>.column-title,
.purchase-column-modal[data-invoice-ocr-modal] .purchase-ocr-card>.purchase-lookup-footer{flex:0 0 auto}
.purchase-column-modal[data-invoice-ocr-modal] .purchase-ocr-layout{
    flex:1 1 auto;
    min-height:0;
    overflow:hidden;
    grid-template-columns:minmax(480px,1fr) minmax(480px,1fr);
    gap:14px;
    padding:10px 0;
}
.purchase-column-modal[data-invoice-ocr-modal] .purchase-ocr-preview{
    min-height:0!important;
    height:100%;
    overflow:hidden;
    display:flex;
    align-items:stretch;
    justify-content:stretch;
}
.purchase-column-modal[data-invoice-ocr-modal] .purchase-ocr-preview iframe{
    display:block;
    flex:1 1 auto;
    width:100%;
    height:100%!important;
    min-height:0!important;
    border:0;
}
.purchase-column-modal[data-invoice-ocr-modal] .purchase-ocr-review{
    height:100%;
    min-height:0;
    overflow:auto;
    overscroll-behavior:contain;
    padding-right:6px;
}
.purchase-column-modal[data-invoice-ocr-modal] .purchase-lookup-footer{gap:8px;flex-wrap:wrap;padding-top:10px}
.purchase-ocr-no-lines{margin:0;padding:14px;color:var(--muted,var(--erp-muted,#64748b));white-space:normal}
@media(max-width:980px){
    .purchase-column-modal[data-invoice-ocr-modal]{padding:4px!important}
    .purchase-column-modal[data-invoice-ocr-modal] .purchase-ocr-card{width:calc(100vw - 8px)!important;height:calc(100dvh - 8px)!important;max-height:calc(100dvh - 8px)!important;padding:9px!important}
    .purchase-column-modal[data-invoice-ocr-modal] .purchase-ocr-layout{grid-template-columns:1fr;overflow:auto}
    .purchase-column-modal[data-invoice-ocr-modal] .purchase-ocr-preview{height:56dvh;min-height:420px!important;flex:0 0 auto}
    .purchase-column-modal[data-invoice-ocr-modal] .purchase-ocr-review{height:auto;overflow:visible}
}


/* POS viewport width containment fix.
   POS (Sales): credit rows must not expand the fixed summary column.
   Touch POS 2: use the available viewport instead of negative page margins and
   allow header/status content to shrink or wrap before it reaches either edge. */
.sales-entry-page,
.sales-entry-page .sales-odoo-sheet,
.sales-entry-page .sales-odoo-footer,
.sales-entry-page .sales-summary-panel,
.sales-entry-page .sales-customer-credit-panel,
.sales-entry-page .sales-customer-credit-list {
    width: 100%;
    max-width: 100%;
    min-width: 0;
}

.sales-entry-page .sales-odoo-footer > *,
.sales-entry-page .sales-summary-panel > *,
.sales-entry-page .sales-total-line,
.sales-entry-page .sales-customer-credit-row > * {
    min-width: 0;
}

.sales-entry-page .sales-summary-panel {
    overflow: hidden;
}

.sales-entry-page .sales-total-line {
    max-width: 100%;
}

.sales-entry-page .sales-total-line strong,
.sales-entry-page .sales-total-line input {
    max-width: 100%;
}

.pos-sidebar-hidden .main-area {
    padding: 0;
    min-width: 0;
    overflow: hidden !important;
}

.pos-sidebar-hidden .pos-touch-page {
    width: 100%;
    max-width: 100%;
    height: 100dvh;
    min-height: 640px;
    margin: 0;
    grid-template-columns: clamp(330px, 24vw, 430px) minmax(0, 1fr);
    gap: 8px;
    overflow: hidden;
}

.pos-sidebar-hidden .pos-order-panel,
.pos-sidebar-hidden .pos-products-panel,
.pos-sidebar-hidden .pos-product-header,
.pos-sidebar-hidden .pos-category-carousel,
.pos-sidebar-hidden .pos-category-strip,
.pos-sidebar-hidden .pos-product-grid,
.pos-sidebar-hidden .pos-product-pager {
    width: 100%;
    max-width: 100%;
    min-width: 0;
}

.pos-sidebar-hidden .pos-order-line {
    max-width: 100%;
    min-width: 0;
    padding-left: 12px;
    padding-right: 10px;
}

.pos-sidebar-hidden .pos-order-line > *,
.pos-sidebar-hidden .pos-customer-row > *,
.pos-sidebar-hidden .pos-tabs > *,
.pos-sidebar-hidden .pos-product-header > * {
    min-width: 0;
}

.pos-sidebar-hidden .pos-product-header {
    padding-right: 64px;
    flex-wrap: wrap;
    align-content: center;
}

.pos-sidebar-hidden .pos-search-wrap {
    flex: 1 1 280px;
    max-width: 440px;
}

.pos-sidebar-hidden .pos-top-status {
    order: 0;
    flex: 1 1 500px;
    width: auto;
    max-width: 100%;
    min-width: 0;
    overflow: visible;
    white-space: normal;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.pos-sidebar-hidden .pos-top-status span {
    flex: 0 1 auto;
    max-width: 100%;
}

.pos-sidebar-hidden .pos-top-status span:last-child {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

@media (max-width: 1350px) {
    .pos-sidebar-hidden .pos-product-header {
        padding-right: 64px;
    }
    .pos-sidebar-hidden .pos-top-status {
        order: 2;
        flex-basis: 100%;
        justify-content: flex-start;
    }
}

@media (max-width: 820px) {
    .pos-sidebar-hidden .main-area {
        overflow: visible !important;
    }
    .pos-sidebar-hidden .pos-touch-page {
        height: auto;
        min-height: 100dvh;
        margin: 0;
        grid-template-columns: minmax(0, 1fr);
        overflow: visible;
    }
    .pos-sidebar-hidden .pos-product-header {
        padding-right: 58px;
    }
}

/* POS Sales and Touch POS 2 viewport containment refinement.
   Keep right-side totals/credit controls inside the sheet and remove the
   negative-margin viewport shift that clipped Touch POS values at both edges. */
.sales-entry-page .sales-summary-panel {
    min-width: 0;
    overflow: visible;
}

.sales-entry-page .sales-total-line {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    grid-template-columns: minmax(0, 1fr) minmax(84px, 116px);
}

.sales-entry-page .sales-total-line > span,
.sales-entry-page .sales-total-line > strong {
    min-width: 0;
    max-width: 100%;
    overflow-wrap: anywhere;
}

.sales-entry-page .sales-total-line.input-line input {
    width: 100%;
    min-width: 0;
    max-width: 116px;
    justify-self: end;
}

.sales-entry-page .sales-customer-credit-row {
    grid-template-columns: minmax(0, 1fr) minmax(42px, auto) minmax(72px, 96px);
    overflow: visible;
}

.sales-entry-page .sales-customer-credit-amount {
    min-width: 0;
    max-width: 96px;
    overflow: visible;
    text-overflow: clip;
    font-size: 11px;
    font-variant-numeric: tabular-nums;
}

.pos-sidebar-hidden .erp-notification-slot {
    top: 10px;
    right: 10px;
}

.pos-sidebar-hidden .pos-touch-page {
    height: calc(100dvh - 10px);
    grid-template-columns: clamp(370px, 24vw, 430px) minmax(0, 1fr);
}

.pos-sidebar-hidden .pos-tabs,
.pos-sidebar-hidden .pos-customer-row,
.pos-sidebar-hidden .pos-scanner-row,
.pos-sidebar-hidden .pos-total-box,
.pos-sidebar-hidden .pos-keypad,
.pos-sidebar-hidden .pos-save-row {
    width: 100%;
    max-width: 100%;
    min-width: 0;
}

.pos-sidebar-hidden .pos-tabs {
    overflow: hidden;
}

.pos-sidebar-hidden .pos-ticket-no {
    min-width: 0;
    max-width: 128px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.pos-sidebar-hidden .pos-line-name,
.pos-sidebar-hidden .pos-line-name small {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

.pos-sidebar-hidden .pos-line-name {
    white-space: nowrap;
}

.pos-sidebar-hidden .pos-line-name small {
    white-space: nowrap;
}

.pos-sidebar-hidden .pos-line-qty,
.pos-sidebar-hidden .pos-order-line strong,
.pos-sidebar-hidden .pos-line-remove {
    white-space: nowrap;
}

.pos-sidebar-hidden .pos-top-status {
    gap: 8px;
    font-size: 11.5px;
}

@media (max-width: 1000px) {
    .pos-sidebar-hidden .pos-touch-page {
        grid-template-columns: 370px minmax(0, 1fr);
    }
}

@media (max-width: 820px) {
    .pos-sidebar-hidden .pos-touch-page {
        height: auto;
        grid-template-columns: minmax(0, 1fr);
    }
}

/* Touch POS 2 control-width and shared activity correction.
   Keep Barcode Mode, User, and Dashboard as full readable touch controls;
   only the search and status regions are allowed to flex/shrink. */
.pos-sidebar-hidden .pos-product-header > .pos-barcode-btn,
.pos-sidebar-hidden .pos-product-header > .pos-user-dot,
.pos-sidebar-hidden .pos-product-header > .pos-menu-btn {
    flex: 0 0 44px !important;
    width: 44px !important;
    min-width: 44px !important;
    max-width: 44px !important;
    min-height: 42px;
    padding: 0 !important;
    overflow: visible;
}

.pos-sidebar-hidden .pos-product-header > .pos-user-dot {
    border-radius: 999px;
}

.pos-activity-modal {
    width: min(920px, calc(100vw - 32px));
    max-width: 920px;
    max-height: min(86vh, 820px);
    overflow: auto;
}

.pos-activity-modal .erp-document-activity-card {
    margin: 0;
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

@media (max-width: 820px) {
    .pos-sidebar-hidden .pos-product-header > .pos-barcode-btn,
    .pos-sidebar-hidden .pos-product-header > .pos-user-dot,
    .pos-sidebar-hidden .pos-product-header > .pos-menu-btn {
        flex-basis: 42px !important;
        width: 42px !important;
        min-width: 42px !important;
        max-width: 42px !important;
    }
}

/* Shared Journal Voucher Log Note host. */
.journal-voucher-activity {
    margin-top: 16px;
}

/* Payroll Duties master conversion. */
.duties-page,
.duty-edit-page {
    display: grid;
    gap: 16px;
    padding-bottom: 28px;
}

.duties-topbar {
    align-items: flex-start;
}

.duties-top-actions {
    flex-wrap: wrap;
    justify-content: flex-end;
}

.duties-hero,
.duty-edit-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 20px;
    border: 1px solid var(--erp-border, #d9dde7);
    border-radius: 18px;
    background: linear-gradient(135deg, color-mix(in srgb, var(--erp-primary, #5b4b8a) 9%, var(--erp-surface, #fff)), var(--erp-surface, #fff));
    box-shadow: var(--erp-shadow-sm, 0 5px 16px rgba(31, 41, 55, .06));
}

.duties-hero h2,
.duty-edit-hero h2,
.duties-list-heading h3,
.duty-form-heading h3 {
    margin: 3px 0 4px;
}

.duties-hero p,
.duty-edit-hero p,
.duty-form-heading small {
    margin: 0;
    color: var(--erp-muted, #667085);
}

.duties-kicker {
    display: block;
    color: var(--erp-primary, #5b4b8a);
    font-size: .74rem;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.duties-create-actions,
.duties-filter-actions,
.duty-card-actions,
.duty-form-actions {
    display: flex;
    align-items: center;
    gap: 9px;
    flex-wrap: wrap;
}

.duties-kpi-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.duties-kpi-grid article {
    min-width: 0;
    padding: 15px 16px;
    border: 1px solid var(--erp-border, #d9dde7);
    border-radius: 15px;
    background: var(--erp-surface, #fff);
    box-shadow: var(--erp-shadow-sm, 0 4px 14px rgba(31, 41, 55, .05));
}

.duties-kpi-grid span,
.duties-kpi-grid small {
    display: block;
    color: var(--erp-muted, #667085);
}

.duties-kpi-grid strong {
    display: block;
    margin: 4px 0 2px;
    font-size: 1.55rem;
    color: var(--erp-text, #1f2937);
}

.duties-filter-card {
    display: grid;
    grid-template-columns: minmax(220px, 1.6fr) repeat(3, minmax(130px, .65fr)) auto;
    align-items: end;
    gap: 12px;
    padding: 15px;
    border: 1px solid var(--erp-border, #d9dde7);
    border-radius: 15px;
    background: var(--erp-surface, #fff);
}

.duties-filter-card label,
.duty-field {
    min-width: 0;
}

.duties-filter-card label > span,
.duty-field > span:first-child {
    display: block;
    margin-bottom: 6px;
    color: var(--erp-muted, #667085);
    font-size: .78rem;
    font-weight: 750;
}

.duties-filter-card input,
.duties-filter-card select,
.duty-field input,
.duty-field select {
    width: 100%;
    min-width: 0;
    min-height: 42px;
    border: 1px solid var(--erp-border, #d0d5dd);
    border-radius: 10px;
    background: var(--erp-input-bg, var(--erp-surface, #fff));
    color: var(--erp-text, #1f2937);
    padding: 9px 11px;
}

.duties-filter-card input:focus,
.duties-filter-card select:focus,
.duty-field input:focus,
.duty-field select:focus {
    border-color: var(--erp-primary, #5b4b8a);
    outline: 3px solid color-mix(in srgb, var(--erp-primary, #5b4b8a) 18%, transparent);
}

.duties-list-heading,
.duties-pager {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.duties-list-heading small,
.duties-pager span {
    color: var(--erp-muted, #667085);
}

.duties-card-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 13px;
}

.duty-card {
    min-width: 0;
    display: grid;
    gap: 14px;
    padding: 16px;
    border: 1px solid var(--erp-border, #d9dde7);
    border-left: 4px solid var(--erp-primary, #5b4b8a);
    border-radius: 16px;
    background: var(--erp-surface, #fff);
    box-shadow: var(--erp-shadow-sm, 0 5px 16px rgba(31, 41, 55, .055));
}

.duty-card.is-double {
    border-left-color: var(--erp-accent, #2f80ed);
}

.duty-card-header,
.duty-card-footer,
.duty-card-title,
.duty-period-title,
.duty-form-heading,
.duty-check-field {
    display: flex;
    align-items: center;
}

.duty-card-header,
.duty-card-footer,
.duty-form-heading {
    justify-content: space-between;
    gap: 12px;
}

.duty-card-title {
    min-width: 0;
    gap: 11px;
}

.duty-card-title h3 {
    margin: 0 0 4px;
    overflow-wrap: anywhere;
}

.duty-type-icon,
.duty-period-title > span {
    display: inline-grid;
    place-items: center;
    flex: 0 0 auto;
    width: 35px;
    height: 35px;
    border-radius: 11px;
    background: color-mix(in srgb, var(--erp-primary, #5b4b8a) 12%, var(--erp-surface, #fff));
    color: var(--erp-primary, #5b4b8a);
    font-weight: 850;
}

.duty-type-badge,
.duty-existing-type {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    padding: 4px 9px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--erp-primary, #5b4b8a) 11%, var(--erp-surface, #fff));
    color: var(--erp-primary, #5b4b8a);
    font-size: .73rem;
    font-weight: 800;
}

.duty-total-hours {
    flex: 0 0 auto;
    text-align: right;
}

.duty-total-hours span,
.duty-total-hours small,
.duty-time-block span,
.duty-card-footer > span {
    display: block;
    color: var(--erp-muted, #667085);
    font-size: .76rem;
}

.duty-total-hours strong {
    display: block;
    margin: 1px 0;
    font-size: 1.35rem;
}

.duty-timeline-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 9px;
}

.duty-time-block {
    min-width: 0;
    padding: 10px 11px;
    border: 1px solid color-mix(in srgb, var(--erp-border, #d9dde7) 75%, transparent);
    border-radius: 11px;
    background: color-mix(in srgb, var(--erp-surface-alt, #f7f8fb) 85%, var(--erp-surface, #fff));
}

.duty-time-block strong {
    display: block;
    margin-top: 4px;
    white-space: nowrap;
    font-size: .9rem;
}

.duty-time-block em {
    color: var(--erp-primary, #5b4b8a);
    font-style: normal;
}

.duty-rule-row {
    display: flex;
    align-items: center;
    gap: 7px;
    flex-wrap: wrap;
}

.duty-rule-pill,
.duty-usage-pill {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 5px 9px;
    border: 1px solid var(--erp-border, #d9dde7);
    border-radius: 999px;
    color: var(--erp-muted, #667085);
    background: var(--erp-surface, #fff);
    font-size: .74rem;
    font-weight: 700;
}

.duty-rule-pill.is-on,
.duty-usage-pill.is-used {
    border-color: color-mix(in srgb, var(--erp-primary, #5b4b8a) 38%, var(--erp-border, #d9dde7));
    color: var(--erp-primary, #5b4b8a);
    background: color-mix(in srgb, var(--erp-primary, #5b4b8a) 8%, var(--erp-surface, #fff));
}

.duty-card-footer {
    padding-top: 11px;
    border-top: 1px solid var(--erp-border, #e4e7ec);
}

.duties-empty-state {
    grid-column: 1 / -1;
    display: grid;
    gap: 5px;
    justify-items: center;
    padding: 36px 18px;
    border: 1px dashed var(--erp-border, #d0d5dd);
    border-radius: 15px;
    background: var(--erp-surface, #fff);
    color: var(--erp-muted, #667085);
    text-align: center;
}

.duties-empty-state strong {
    color: var(--erp-text, #1f2937);
}

.duties-pager > div {
    display: flex;
    gap: 7px;
}

.duty-type-switch {
    display: inline-flex;
    gap: 4px;
    padding: 4px;
    border: 1px solid var(--erp-border, #d9dde7);
    border-radius: 12px;
    background: var(--erp-surface, #fff);
}

.duty-type-switch a {
    padding: 8px 12px;
    border-radius: 9px;
    color: var(--erp-muted, #667085);
    font-weight: 750;
    text-decoration: none;
}

.duty-type-switch a.active {
    background: var(--erp-primary, #5b4b8a);
    color: var(--erp-primary-text, #fff);
}

.duty-edit-form {
    display: grid;
    gap: 14px;
}

.duty-form-card {
    display: grid;
    gap: 15px;
    padding: 18px;
    border: 1px solid var(--erp-border, #d9dde7);
    border-radius: 16px;
    background: var(--erp-surface, #fff);
    box-shadow: var(--erp-shadow-sm, 0 4px 14px rgba(31, 41, 55, .045));
}

.duty-form-heading {
    align-items: flex-start;
}

.duty-name-card .duty-field.wide {
    max-width: 620px;
}

.duty-field > span.field-validation-error,
.duty-field > span[data-valmsg-for] {
    display: block;
    margin-top: 5px;
    color: var(--erp-danger, #b42318);
    font-size: .76rem;
}

.duty-field small {
    display: block;
    margin-top: 6px;
    color: var(--erp-muted, #667085);
}

.duty-live-total {
    flex: 0 0 auto;
    min-width: 155px;
    padding: 9px 12px;
    border-radius: 12px;
    background: color-mix(in srgb, var(--erp-primary, #5b4b8a) 9%, var(--erp-surface, #fff));
    text-align: right;
}

.duty-live-total span {
    display: block;
    color: var(--erp-muted, #667085);
    font-size: .72rem;
}

.duty-live-total strong {
    display: block;
    margin-top: 2px;
    color: var(--erp-primary, #5b4b8a);
    font-size: 1.3rem;
}

.duty-period-grid,
.duty-rule-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.duty-period-panel,
.duty-rule-form-panel {
    min-width: 0;
    padding: 14px;
    border: 1px solid var(--erp-border, #d9dde7);
    border-radius: 13px;
    background: color-mix(in srgb, var(--erp-surface-alt, #f7f8fb) 80%, var(--erp-surface, #fff));
}

.duty-period-panel.is-hidden {
    display: none;
}

.duty-period-title {
    gap: 9px;
    margin-bottom: 12px;
}

.duty-period-panel > small,
.duty-check-field small {
    display: block;
    margin-top: 8px;
    color: var(--erp-muted, #667085);
    font-size: .75rem;
}

.duty-field-grid {
    display: grid;
    gap: 11px;
}

.duty-field-grid.two {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.duty-check-field {
    align-items: flex-start;
    gap: 9px;
    margin-top: 12px;
    cursor: pointer;
}

.duty-check-field input {
    flex: 0 0 auto;
    width: 18px;
    height: 18px;
    margin-top: 2px;
    accent-color: var(--erp-primary, #5b4b8a);
}

.duty-check-field strong {
    display: block;
}

.duty-check-field small {
    margin-top: 2px;
}

.duty-break-grid {
    max-width: 620px;
}

.duty-form-actions {
    justify-content: flex-end;
    padding-top: 2px;
}

@media (max-width: 1180px) {
    .duties-filter-card {
        grid-template-columns: minmax(220px, 1.5fr) repeat(3, minmax(120px, .7fr));
    }

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

    .duties-card-list {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 820px) {
    .duties-hero,
    .duty-edit-hero,
    .duty-card-header,
    .duty-card-footer,
    .duty-form-heading {
        align-items: flex-start;
        flex-direction: column;
    }

    .duties-kpi-grid,
    .duty-period-grid,
    .duty-rule-form-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .duties-filter-card {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .duties-search-field,
    .duties-filter-actions {
        grid-column: 1 / -1;
    }

    .duty-total-hours,
    .duty-live-total {
        text-align: left;
    }

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

@media (max-width: 560px) {
    .duties-kpi-grid,
    .duties-filter-card,
    .duty-period-grid,
    .duty-rule-form-grid,
    .duty-field-grid.two,
    .duty-timeline-grid {
        grid-template-columns: 1fr;
    }

    .duties-filter-card label,
    .duties-search-field,
    .duties-filter-actions {
        grid-column: 1;
    }

    .duties-create-actions,
    .duties-filter-actions,
    .duty-form-actions,
    .duty-card-actions {
        width: 100%;
    }

    .duties-create-actions .erp-btn,
    .duties-filter-actions .erp-btn,
    .duty-form-actions .erp-btn {
        flex: 1 1 100%;
        justify-content: center;
    }

    .duty-card-actions .department-action-btn,
    .duty-card-actions form {
        flex: 1 1 auto;
    }

    .duty-card-actions form .department-action-btn {
        width: 100%;
    }

    .duty-type-switch {
        width: 100%;
    }

    .duty-type-switch a {
        flex: 1 1 50%;
        text-align: center;
    }
}

/* POS Sales unified activity stream: one top toolbar, Log notes before all other activity. */
.sales-entry-page .sales-unified-activity-panel {
    margin-top: 14px;
    overflow: hidden;
    border: 1px solid var(--theme-border, var(--erp-border, var(--border, #d9dde7)));
    border-radius: 14px;
    background: var(--theme-card, var(--erp-surface, var(--card, #fff)));
    box-shadow: 0 7px 20px color-mix(in srgb, var(--theme-text, var(--text, #1f2937)) 7%, transparent);
}

.sales-entry-page .sales-unified-activity-toolbar {
    position: sticky;
    top: 0;
    z-index: 2;
    justify-content: space-between;
    padding: 10px 12px;
    border-bottom: 1px solid var(--theme-border, var(--border, #d9dde7));
    background: color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 5%, var(--theme-card, var(--card, #fff)));
}

.sales-entry-page .sales-unified-activity-toolbar .erp-document-activity-actions {
    justify-content: flex-start;
    flex: 1 1 auto;
    width: auto;
}

.sales-entry-page .sales-unified-activity-toolbar .erp-document-activity-button {
    min-height: 34px;
    padding: 7px 13px;
    border-radius: 9px;
    border: 1px solid color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 32%, var(--theme-border, var(--border, #d9dde7)));
    background: color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 4%, var(--theme-card, var(--card, #fff)));
    color: var(--theme-primary, var(--brand, #714b67));
    font-weight: 800;
    box-shadow: 0 3px 10px color-mix(in srgb, var(--theme-text, var(--text, #1f2937)) 6%, transparent);
}

.sales-entry-page .sales-unified-activity-toolbar .erp-document-activity-button:hover:not(:disabled),
.sales-entry-page .sales-unified-activity-toolbar .erp-document-activity-button.active,
.sales-entry-page .sales-unified-activity-toolbar .erp-document-activity-button.primary {
    border-color: var(--theme-primary, var(--brand, #714b67));
    background: var(--theme-primary, var(--brand, #714b67));
    color: var(--theme-primary-contrast, #fff);
    transform: translateY(-1px);
}

.sales-entry-page .sales-unified-activity-stream {
    display: grid;
    gap: 0;
}

.sales-entry-page .sales-log-note-list {
    order: 1;
    padding: 12px;
    border-bottom: 1px solid var(--theme-border, var(--border, #d9dde7));
    background: color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 2%, var(--theme-card, var(--card, #fff)));
}

.sales-entry-page .sales-other-activity-block {
    order: 2;
    min-width: 0;
}

.sales-entry-page .sales-other-activity-heading {
    padding: 9px 12px;
    border-bottom: 1px solid var(--theme-border, var(--border, #d9dde7));
    color: var(--theme-muted, var(--muted, #667085));
    background: color-mix(in srgb, var(--theme-muted, var(--muted, #667085)) 4%, var(--theme-card, var(--card, #fff)));
    font-size: .76rem;
    font-weight: 850;
    letter-spacing: .055em;
    text-transform: uppercase;
}

.sales-entry-page .sales-unified-activity-panel .sales-chatter-list {
    min-height: 90px;
    padding: 12px;
}

/* Payroll Duties: final page-scoped advanced theme-aware action buttons. */
.duties-page .duties-advanced-btn,
.duty-edit-page .erp-btn,
.duties-page .duties-row-action,
.duties-page .duties-pager-btn {
    position: relative;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 38px;
    padding: 8px 15px;
    border: 1px solid color-mix(in srgb, var(--theme-primary, var(--erp-primary, #5b4b8a)) 36%, var(--theme-border, var(--erp-border, #d9dde7)));
    border-radius: 10px;
    background: color-mix(in srgb, var(--theme-primary, var(--erp-primary, #5b4b8a)) 5%, var(--theme-card, var(--erp-surface, #fff)));
    color: var(--theme-primary, var(--erp-primary, #5b4b8a)) !important;
    text-decoration: none !important;
    font-size: .86rem;
    font-weight: 850;
    line-height: 1;
    white-space: nowrap;
    box-shadow: 0 5px 14px color-mix(in srgb, var(--theme-text, var(--erp-text, #1f2937)) 7%, transparent),
                inset 0 1px 0 color-mix(in srgb, #fff 28%, transparent);
    cursor: pointer;
    transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease, background .16s ease;
}

.duties-page .duties-advanced-btn:hover,
.duty-edit-page .erp-btn:hover,
.duties-page .duties-row-action:hover:not(:disabled),
.duties-page .duties-pager-btn:hover:not(.disabled) {
    transform: translateY(-1px);
    border-color: var(--theme-primary, var(--erp-primary, #5b4b8a));
    box-shadow: 0 8px 19px color-mix(in srgb, var(--theme-primary, var(--erp-primary, #5b4b8a)) 17%, transparent);
}

.duties-page .duties-advanced-btn:focus-visible,
.duty-edit-page .erp-btn:focus-visible,
.duties-page .duties-row-action:focus-visible,
.duties-page .duties-pager-btn:focus-visible {
    outline: 3px solid color-mix(in srgb, var(--theme-primary, var(--erp-primary, #5b4b8a)) 24%, transparent);
    outline-offset: 2px;
}

.duties-page .duties-advanced-btn.primary,
.duties-page .duties-filter-actions button.duties-advanced-btn,
.duty-edit-page .erp-btn.primary {
    border-color: var(--theme-primary, var(--erp-primary, #5b4b8a));
    background: linear-gradient(135deg,
        color-mix(in srgb, var(--theme-primary, var(--erp-primary, #5b4b8a)) 90%, #fff),
        var(--theme-primary, var(--erp-primary, #5b4b8a)));
    color: var(--theme-primary-contrast, #fff) !important;
}

.duties-page .duties-advanced-btn.secondary,
.duty-edit-page .erp-btn.secondary {
    border-color: color-mix(in srgb, var(--theme-primary, var(--erp-primary, #5b4b8a)) 48%, var(--theme-border, var(--erp-border, #d9dde7)));
    background: color-mix(in srgb, var(--theme-primary, var(--erp-primary, #5b4b8a)) 9%, var(--theme-card, var(--erp-surface, #fff)));
    color: var(--theme-primary, var(--erp-primary, #5b4b8a)) !important;
}

.duties-page .duties-advanced-btn.ghost,
.duty-edit-page .erp-btn.ghost {
    border-color: var(--theme-border, var(--erp-border, #d9dde7));
    background: var(--theme-card, var(--erp-surface, #fff));
    color: var(--theme-text, var(--erp-text, #1f2937)) !important;
}

.duties-page .duties-export-btn {
    border-color: color-mix(in srgb, #15803d 40%, var(--theme-border, var(--erp-border, #d9dde7)));
    background: color-mix(in srgb, #15803d 7%, var(--theme-card, var(--erp-surface, #fff)));
    color: #15803d !important;
}

.duties-page .duties-btn-icon {
    display: inline-grid;
    place-items: center;
    width: 20px;
    height: 20px;
    border-radius: 7px;
    background: color-mix(in srgb, currentColor 10%, transparent);
    font-size: .95rem;
    font-weight: 900;
}

.duties-page .duties-create-btn {
    min-height: 42px;
    padding-inline: 17px;
}

.duties-page .duties-row-action {
    min-height: 34px;
    padding: 7px 12px;
    font-size: .8rem;
}

.duties-page button.duties-row-action.danger {
    border-color: color-mix(in srgb, #b42318 34%, var(--theme-border, var(--erp-border, #d9dde7)));
    background: color-mix(in srgb, #b42318 6%, var(--theme-card, var(--erp-surface, #fff)));
    color: #b42318 !important;
}

.duties-page .duties-row-action.disabled,
.duties-page .duties-pager-btn.disabled {
    opacity: .55;
    pointer-events: none;
    transform: none;
    box-shadow: none;
}

.duties-page .duties-pager-btn {
    width: 40px;
    min-width: 40px;
    height: 38px;
    padding: 0;
    font-size: 1.2rem;
}

@media (max-width: 720px) {
    .sales-entry-page .sales-unified-activity-toolbar {
        align-items: flex-start;
    }
    .sales-entry-page .sales-unified-activity-toolbar .erp-document-activity-actions {
        width: 100%;
    }
    .duties-page .duties-create-actions .duties-advanced-btn,
    .duties-page .duties-filter-actions .duties-advanced-btn {
        flex: 1 1 auto;
    }
}

/* Transactions / Payroll / Employees / Duties Management */
.duty-management-page {
    display: grid;
    gap: 16px;
    min-width: 0;
}

.duty-management-hero,
.duty-assignment-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 19px 21px;
    border: 1px solid color-mix(in srgb, var(--theme-primary, var(--erp-primary, #5b4b8a)) 25%, var(--theme-border, var(--erp-border, #d9dde7)));
    border-radius: 17px;
    background: linear-gradient(135deg,
        color-mix(in srgb, var(--theme-primary, var(--erp-primary, #5b4b8a)) 7%, var(--theme-card, var(--erp-surface, #fff))),
        var(--theme-card, var(--erp-surface, #fff)));
    box-shadow: 0 8px 24px color-mix(in srgb, var(--theme-text, var(--erp-text, #1f2937)) 6%, transparent);
}

.duty-management-hero h2,
.duty-assignment-hero h2,
.duty-assignment-heading h3,
.duty-management-card h3 {
    margin: 2px 0 4px;
    color: var(--theme-text, var(--erp-text, #1f2937));
}

.duty-management-hero p,
.duty-assignment-hero p,
.duty-assignment-heading small {
    margin: 0;
    color: var(--theme-muted, var(--erp-muted, #667085));
}

.duty-management-kicker {
    color: var(--theme-primary, var(--erp-primary, #5b4b8a));
    font-size: .72rem;
    font-weight: 900;
    letter-spacing: .085em;
}

.duty-management-create-actions,
.duty-management-filter-actions,
.duty-management-row-actions,
.duty-assignment-actions,
.duty-group-selection-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.duty-management-btn {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 39px;
    padding: 8px 14px;
    border: 1px solid color-mix(in srgb, var(--theme-primary, var(--erp-primary, #5b4b8a)) 34%, var(--theme-border, var(--erp-border, #d9dde7)));
    border-radius: 10px;
    background: color-mix(in srgb, var(--theme-primary, var(--erp-primary, #5b4b8a)) 5%, var(--theme-card, var(--erp-surface, #fff)));
    color: var(--theme-primary, var(--erp-primary, #5b4b8a)) !important;
    text-decoration: none !important;
    font-weight: 850;
    line-height: 1;
    white-space: nowrap;
    box-shadow: 0 5px 14px color-mix(in srgb, var(--theme-text, var(--erp-text, #1f2937)) 7%, transparent);
    cursor: pointer;
    transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease, background .16s ease;
}

.duty-management-btn:hover:not(.disabled):not(:disabled),
.duty-management-btn:focus-visible:not(.disabled):not(:disabled) {
    transform: translateY(-1px);
    border-color: var(--theme-primary, var(--erp-primary, #5b4b8a));
    box-shadow: 0 8px 20px color-mix(in srgb, var(--theme-primary, var(--erp-primary, #5b4b8a)) 17%, transparent);
}

.duty-management-btn.primary {
    border-color: var(--theme-primary, var(--erp-primary, #5b4b8a));
    background: linear-gradient(135deg, color-mix(in srgb, var(--theme-primary, var(--erp-primary, #5b4b8a)) 88%, #fff), var(--theme-primary, var(--erp-primary, #5b4b8a)));
    color: var(--theme-primary-contrast, #fff) !important;
}

.duty-management-btn.secondary {
    background: color-mix(in srgb, var(--theme-primary, var(--erp-primary, #5b4b8a)) 10%, var(--theme-card, var(--erp-surface, #fff)));
}

.duty-management-btn.ghost {
    border-color: var(--theme-border, var(--erp-border, #d9dde7));
    background: var(--theme-card, var(--erp-surface, #fff));
    color: var(--theme-text, var(--erp-text, #1f2937)) !important;
}

.duty-management-btn.export {
    border-color: color-mix(in srgb, #15803d 38%, var(--theme-border, var(--erp-border, #d9dde7)));
    background: color-mix(in srgb, #15803d 7%, var(--theme-card, var(--erp-surface, #fff)));
    color: #15803d !important;
}

.duty-management-btn.danger {
    border-color: color-mix(in srgb, #b42318 35%, var(--theme-border, var(--erp-border, #d9dde7)));
    background: color-mix(in srgb, #b42318 6%, var(--theme-card, var(--erp-surface, #fff)));
    color: #b42318 !important;
}

.duty-management-btn.small {
    min-height: 34px;
    padding: 7px 11px;
    font-size: .8rem;
}

.duty-management-btn.pager {
    width: 39px;
    min-width: 39px;
    padding: 0;
    font-size: 1.3rem;
}

.duty-management-btn.disabled,
.duty-management-btn:disabled {
    opacity: .5;
    pointer-events: none;
    box-shadow: none;
    transform: none;
}

.duty-management-kpis {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.duty-management-kpis article {
    min-width: 0;
    padding: 15px 17px;
    border: 1px solid var(--theme-border, var(--erp-border, #d9dde7));
    border-radius: 14px;
    background: var(--theme-card, var(--erp-surface, #fff));
    box-shadow: 0 4px 14px color-mix(in srgb, var(--theme-text, var(--erp-text, #1f2937)) 5%, transparent);
}

.duty-management-kpis span,
.duty-management-kpis small {
    display: block;
    color: var(--theme-muted, var(--erp-muted, #667085));
}

.duty-management-kpis strong {
    display: block;
    margin: 4px 0 2px;
    color: var(--theme-text, var(--erp-text, #1f2937));
    font-size: 1.45rem;
}

.duty-management-filter-card {
    display: grid;
    grid-template-columns: minmax(220px, 1.5fr) repeat(3, minmax(145px, .8fr));
    gap: 11px;
    align-items: end;
    padding: 16px;
    border: 1px solid var(--theme-border, var(--erp-border, #d9dde7));
    border-radius: 15px;
    background: var(--theme-card, var(--erp-surface, #fff));
}

.duty-management-field {
    display: block;
    min-width: 0;
}

.duty-management-field > span:first-child {
    display: block;
    margin-bottom: 6px;
    color: var(--theme-muted, var(--erp-muted, #667085));
    font-size: .75rem;
    font-weight: 800;
}

.duty-management-field input:not([type="checkbox"]):not([type="color"]),
.duty-management-field select,
.duty-readonly-field {
    width: 100%;
    min-width: 0;
    min-height: 40px;
    padding: 8px 10px;
    border: 1px solid var(--theme-border, var(--erp-border, #d9dde7));
    border-radius: 9px;
    background: var(--theme-input, var(--erp-surface, #fff));
    color: var(--theme-text, var(--erp-text, #1f2937));
}

.duty-management-field input:focus,
.duty-management-field select:focus {
    border-color: var(--theme-primary, var(--erp-primary, #5b4b8a));
    outline: 3px solid color-mix(in srgb, var(--theme-primary, var(--erp-primary, #5b4b8a)) 16%, transparent);
}

.duty-management-field .field-validation-error {
    display: block;
    margin-top: 5px;
    color: var(--theme-danger, #b42318);
    font-size: .75rem;
}

.duty-management-check {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 40px;
    padding: 8px 10px;
    border: 1px solid var(--theme-border, var(--erp-border, #d9dde7));
    border-radius: 9px;
    background: color-mix(in srgb, var(--theme-primary, var(--erp-primary, #5b4b8a)) 4%, var(--theme-card, var(--erp-surface, #fff)));
}

.duty-management-check input {
    width: 18px;
    height: 18px;
    accent-color: var(--theme-primary, var(--erp-primary, #5b4b8a));
}

.duty-management-filter-actions {
    grid-column: 1 / -1;
    justify-content: flex-end;
}

.duty-management-result-bar,
.duty-management-pager,
.duty-management-card-head,
.duty-management-card-foot,
.duty-assignment-heading,
.duty-break-editor-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.duty-management-result-bar {
    padding: 2px 3px;
    color: var(--theme-muted, var(--erp-muted, #667085));
}

.duty-management-result-bar strong {
    color: var(--theme-text, var(--erp-text, #1f2937));
}

.duty-management-setting-pill,
.duty-management-shift-badge,
.duty-management-current-badge,
.duty-management-latest-badge,
.duty-management-history-badge {
    display: inline-flex;
    align-items: center;
    min-height: 27px;
    padding: 5px 9px;
    border-radius: 999px;
    border: 1px solid var(--theme-border, var(--erp-border, #d9dde7));
    font-size: .72rem;
    font-weight: 850;
}

.duty-management-setting-pill,
.duty-management-shift-badge,
.duty-management-latest-badge {
    color: var(--theme-primary, var(--erp-primary, #5b4b8a));
    background: color-mix(in srgb, var(--theme-primary, var(--erp-primary, #5b4b8a)) 8%, var(--theme-card, var(--erp-surface, #fff)));
}

.duty-management-current-badge {
    color: #047857;
    border-color: color-mix(in srgb, #047857 32%, var(--theme-border, var(--erp-border, #d9dde7)));
    background: color-mix(in srgb, #047857 8%, var(--theme-card, var(--erp-surface, #fff)));
}

.duty-management-history-badge {
    color: var(--theme-muted, var(--erp-muted, #667085));
    background: color-mix(in srgb, var(--theme-muted, var(--erp-muted, #667085)) 6%, var(--theme-card, var(--erp-surface, #fff)));
}

.duty-management-list {
    display: grid;
    gap: 11px;
}

.duty-management-card {
    min-width: 0;
    padding: 15px 17px;
    border: 1px solid var(--theme-border, var(--erp-border, #d9dde7));
    border-radius: 15px;
    background: var(--theme-card, var(--erp-surface, #fff));
    box-shadow: 0 5px 15px color-mix(in srgb, var(--theme-text, var(--erp-text, #1f2937)) 5%, transparent);
}

.duty-management-card.is-current {
    border-color: color-mix(in srgb, #047857 32%, var(--theme-border, var(--erp-border, #d9dde7)));
}

.duty-management-employee {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

.duty-management-avatar {
    display: inline-grid;
    place-items: center;
    flex: 0 0 auto;
    width: 37px;
    height: 37px;
    border-radius: 11px;
    background: var(--theme-primary, var(--erp-primary, #5b4b8a));
    color: var(--theme-primary-contrast, #fff);
    font-weight: 900;
}

.duty-management-employee h3,
.duty-management-employee p {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.duty-management-employee p {
    margin: 0;
    color: var(--theme-muted, var(--erp-muted, #667085));
    font-size: .78rem;
}

.duty-management-badges {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.duty-management-card-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 9px;
    margin: 13px 0;
}

.duty-management-card-grid > div {
    min-width: 0;
    padding: 10px;
    border: 1px solid var(--theme-border, var(--erp-border, #d9dde7));
    border-radius: 10px;
    background: color-mix(in srgb, var(--theme-surface-alt, var(--erp-surface-alt, #f7f8fb)) 80%, var(--theme-card, var(--erp-surface, #fff)));
}

.duty-management-card-grid span,
.duty-management-card-foot > span {
    display: block;
    color: var(--theme-muted, var(--erp-muted, #667085));
    font-size: .72rem;
}

.duty-management-card-grid strong {
    display: block;
    margin-top: 3px;
    overflow-wrap: anywhere;
    color: var(--theme-text, var(--erp-text, #1f2937));
    font-size: .83rem;
}

.duty-management-card-foot {
    padding-top: 11px;
    border-top: 1px solid var(--theme-border, var(--erp-border, #d9dde7));
}

.duty-management-row-actions form {
    margin: 0;
}

.duty-management-empty {
    display: grid;
    gap: 5px;
    justify-items: center;
    padding: 34px 18px;
    border: 1px dashed var(--theme-border, var(--erp-border, #d9dde7));
    border-radius: 14px;
    color: var(--theme-muted, var(--erp-muted, #667085));
    text-align: center;
}

.duty-management-empty strong {
    color: var(--theme-text, var(--erp-text, #1f2937));
}

.duty-management-pager {
    padding-top: 2px;
    color: var(--theme-muted, var(--erp-muted, #667085));
}

.duty-management-pager > div {
    display: flex;
    gap: 7px;
}

.duty-assignment-form {
    display: grid;
    gap: 14px;
}

.duty-assignment-status {
    min-width: 180px;
    padding: 10px 13px;
    border: 1px solid color-mix(in srgb, var(--theme-primary, var(--erp-primary, #5b4b8a)) 24%, var(--theme-border, var(--erp-border, #d9dde7)));
    border-radius: 12px;
    background: var(--theme-card, var(--erp-surface, #fff));
    text-align: right;
}

.duty-assignment-status span,
.duty-assignment-status strong {
    display: block;
}

.duty-assignment-status span {
    color: var(--theme-muted, var(--erp-muted, #667085));
    font-size: .72rem;
}

.duty-assignment-status strong {
    margin-top: 3px;
    color: var(--theme-primary, var(--erp-primary, #5b4b8a));
}

.duty-assignment-card {
    display: grid;
    gap: 15px;
    padding: 18px;
    border: 1px solid var(--theme-border, var(--erp-border, #d9dde7));
    border-radius: 16px;
    background: var(--theme-card, var(--erp-surface, #fff));
    box-shadow: 0 5px 16px color-mix(in srgb, var(--theme-text, var(--erp-text, #1f2937)) 5%, transparent);
}

.duty-assignment-heading {
    align-items: flex-start;
}

.duty-assignment-grid {
    display: grid;
    gap: 11px;
}

.duty-assignment-grid.two {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.duty-assignment-grid.three {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.duty-period-inputs {
    max-width: 760px;
}

.duty-shift-preview {
    align-self: end;
    min-height: 64px;
    padding: 10px 12px;
    border: 1px solid color-mix(in srgb, var(--theme-primary, var(--erp-primary, #5b4b8a)) 22%, var(--theme-border, var(--erp-border, #d9dde7)));
    border-radius: 10px;
    background: color-mix(in srgb, var(--theme-primary, var(--erp-primary, #5b4b8a)) 6%, var(--theme-card, var(--erp-surface, #fff)));
}

.duty-shift-preview span,
.duty-shift-preview small,
.duty-shift-preview strong {
    display: block;
}

.duty-shift-preview span,
.duty-shift-preview small {
    color: var(--theme-muted, var(--erp-muted, #667085));
}

.duty-shift-preview strong {
    margin: 2px 0;
    color: var(--theme-text, var(--erp-text, #1f2937));
}

.duty-assignment-periods {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.duty-assignment-period-card {
    padding: 14px;
    border: 1px solid var(--theme-border, var(--erp-border, #d9dde7));
    border-radius: 13px;
    background: color-mix(in srgb, var(--theme-surface-alt, var(--erp-surface-alt, #f7f8fb)) 82%, var(--theme-card, var(--erp-surface, #fff)));
}

.duty-assignment-period-card > div:first-child {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 11px;
}

.duty-assignment-period-card > div:first-child > span {
    display: inline-grid;
    place-items: center;
    width: 27px;
    height: 27px;
    border-radius: 8px;
    background: var(--theme-primary, var(--erp-primary, #5b4b8a));
    color: var(--theme-primary-contrast, #fff);
    font-weight: 900;
}

.duty-assignment-period-card.is-single-shift {
    opacity: .58;
}

.duty-assignment-period-card.is-single-shift::after {
    content: "Not used by the selected single shift";
    display: block;
    margin-top: 8px;
    color: var(--theme-muted, var(--erp-muted, #667085));
    font-size: .74rem;
}

.duty-assignment-periods.is-template-locked input,
.duty-readonly-field {
    background: color-mix(in srgb, var(--theme-muted, var(--erp-muted, #667085)) 7%, var(--theme-card, var(--erp-surface, #fff)));
}

.duty-break-editor-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 11px;
}

.duty-break-editor {
    min-width: 0;
    padding: 13px;
    border: 1px solid var(--theme-border, var(--erp-border, #d9dde7));
    border-radius: 12px;
    background: color-mix(in srgb, var(--theme-surface-alt, var(--erp-surface-alt, #f7f8fb)) 80%, var(--theme-card, var(--erp-surface, #fff)));
}

.duty-break-editor-title {
    justify-content: flex-start;
    margin-bottom: 10px;
}

.duty-break-editor-title input[type="color"] {
    width: 34px;
    height: 30px;
    padding: 2px;
    border: 1px solid var(--theme-border, var(--erp-border, #d9dde7));
    border-radius: 8px;
    background: var(--theme-card, var(--erp-surface, #fff));
}

.duty-assignment-actions {
    justify-content: flex-end;
}

.duty-group-filters {
    display: grid;
    grid-template-columns: minmax(220px, 1.4fr) repeat(2, minmax(150px, .8fr)) auto;
    gap: 10px;
    align-items: end;
}

.duty-group-employee-list {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 9px;
}

.duty-group-employee {
    display: flex;
    align-items: center;
    gap: 9px;
    min-width: 0;
    padding: 10px;
    border: 1px solid var(--theme-border, var(--erp-border, #d9dde7));
    border-radius: 11px;
    background: var(--theme-card, var(--erp-surface, #fff));
    cursor: pointer;
}

.duty-group-employee:hover {
    border-color: color-mix(in srgb, var(--theme-primary, var(--erp-primary, #5b4b8a)) 45%, var(--theme-border, var(--erp-border, #d9dde7)));
}

.duty-group-employee input {
    flex: 0 0 auto;
    width: 18px;
    height: 18px;
    accent-color: var(--theme-primary, var(--erp-primary, #5b4b8a));
}

.duty-group-employee > span:last-child {
    min-width: 0;
}

.duty-group-employee strong,
.duty-group-employee small {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.duty-group-employee small {
    margin-top: 2px;
    color: var(--theme-muted, var(--erp-muted, #667085));
}

@media (max-width: 1180px) {
    .duty-management-filter-card {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    .duty-management-search {
        grid-column: span 2;
    }
    .duty-management-card-grid,
    .duty-management-kpis {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .duty-group-employee-list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .duty-group-filters {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 820px) {
    .duty-management-hero,
    .duty-assignment-hero,
    .duty-management-card-head,
    .duty-management-card-foot,
    .duty-assignment-heading {
        align-items: flex-start;
        flex-direction: column;
    }
    .duty-management-filter-card,
    .duty-assignment-grid.three,
    .duty-assignment-periods,
    .duty-break-editor-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .duty-management-search,
    .duty-management-filter-actions {
        grid-column: 1 / -1;
    }
    .duty-management-badges,
    .duty-management-row-actions {
        justify-content: flex-start;
    }
    .duty-assignment-status {
        text-align: left;
    }
}

@media (max-width: 560px) {
    .duty-management-kpis,
    .duty-management-filter-card,
    .duty-management-card-grid,
    .duty-assignment-grid.two,
    .duty-assignment-grid.three,
    .duty-assignment-periods,
    .duty-break-editor-grid,
    .duty-group-filters,
    .duty-group-employee-list {
        grid-template-columns: 1fr;
    }
    .duty-management-search,
    .duty-management-filter-actions {
        grid-column: 1;
    }
    .duty-management-create-actions,
    .duty-management-filter-actions,
    .duty-assignment-actions,
    .duty-management-row-actions {
        width: 100%;
    }
    .duty-management-create-actions .duty-management-btn,
    .duty-management-filter-actions .duty-management-btn,
    .duty-assignment-actions .duty-management-btn {
        flex: 1 1 100%;
    }
    .duty-management-row-actions form,
    .duty-management-row-actions .duty-management-btn {
        flex: 1 1 auto;
    }
    .duty-management-row-actions form .duty-management-btn {
        width: 100%;
    }
}

/* Payroll Attendance Entry (Double Shift) - ERP Advanced UI
   Deliberately uses a modern teal/blue ERP action palette instead of Odoo purple button styling. */
.ds-att-topbar,
.ds-att-top-actions,
.ds-att-title-row,
.ds-att-filter-panel,
.ds-att-filter-actions,
.ds-att-bulk-actions,
.ds-att-card-head,
.ds-att-legend,
.ds-row-actions,
.ds-modal-head,
.ds-modal-actions,
.ds-att-holiday-card {
    display:flex;
    align-items:center;
    gap:12px;
}
.ds-att-topbar,
.ds-att-filter-panel,
.ds-att-card-head,
.ds-att-holiday-card { justify-content:space-between; }
.ds-att-title-block { min-width:0; }
.ds-att-title-row { align-items:flex-start; margin-top:8px; }
.ds-att-title-row h1 { margin:0 0 5px; font-size:clamp(1.45rem,2.2vw,2rem); letter-spacing:-.02em; }
.ds-att-title-row p { margin:0; max-width:850px; }
.ds-att-title-icon {
    flex:0 0 auto;
    width:46px;
    height:46px;
    display:grid;
    place-items:center;
    border-radius:15px;
    background:linear-gradient(145deg,#0f766e,#0e7490);
    color:#fff;
    font-size:1.45rem;
    font-weight:900;
    box-shadow:0 12px 26px rgba(15,118,110,.24);
}
.ds-att-top-actions { flex-wrap:wrap; justify-content:flex-end; }
.ds-erp-btn {
    --ds-button-bg:var(--card,#fff);
    --ds-button-color:var(--text,#172033);
    --ds-button-border:color-mix(in srgb,var(--border,#d7e0ea) 90%,#0f766e 10%);
    min-height:42px;
    padding:9px 15px;
    border:1px solid var(--ds-button-border);
    border-radius:12px;
    background:var(--ds-button-bg);
    color:var(--ds-button-color);
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    font:inherit;
    font-weight:850;
    line-height:1;
    white-space:nowrap;
    cursor:pointer;
    text-decoration:none;
    box-shadow:0 5px 14px rgba(15,23,42,.08);
    transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease,filter .16s ease;
}
.ds-erp-btn span { font-size:1rem; font-weight:900; }
.ds-erp-btn:hover:not(:disabled) { transform:translateY(-2px); box-shadow:0 10px 24px rgba(15,23,42,.14); filter:saturate(1.04); }
.ds-erp-btn:focus-visible { outline:3px solid rgba(14,116,144,.25); outline-offset:2px; }
.ds-erp-btn:disabled { opacity:.55; cursor:not-allowed; box-shadow:none; }
.ds-erp-btn.primary { --ds-button-bg:linear-gradient(135deg,#0f766e,#0e7490); --ds-button-color:#fff; --ds-button-border:#0f766e; }
.ds-erp-btn.secondary { --ds-button-bg:color-mix(in srgb,var(--card,#fff) 94%,#0e7490 6%); --ds-button-color:color-mix(in srgb,var(--text,#172033) 80%,#0e7490 20%); --ds-button-border:color-mix(in srgb,var(--border,#d7e0ea) 70%,#0e7490 30%); }
.ds-erp-btn.success { --ds-button-bg:linear-gradient(135deg,#047857,#059669); --ds-button-color:#fff; --ds-button-border:#047857; }
.ds-erp-btn.warning { --ds-button-bg:linear-gradient(135deg,#b45309,#d97706); --ds-button-color:#fff; --ds-button-border:#b45309; }
.ds-erp-btn.danger { --ds-button-bg:linear-gradient(135deg,#b91c1c,#dc2626); --ds-button-color:#fff; --ds-button-border:#b91c1c; }
.ds-inline-form { display:inline-flex; margin:0; }
.ds-att-holiday-card,
.ds-att-filter-panel,
.ds-att-card {
    border:1px solid var(--border,#d8e0e8);
    background:var(--card,#fff);
    border-radius:20px;
    box-shadow:0 16px 38px rgba(15,23,42,.08);
}
.ds-att-holiday-card { margin:14px 0; padding:14px 16px; border-color:rgba(217,119,6,.32); }
.ds-att-holiday-icon { width:38px; height:38px; display:grid; place-items:center; border-radius:12px; background:rgba(245,158,11,.16); color:#b45309; font-size:1.2rem; }
.ds-att-holiday-copy { flex:1; display:grid; gap:3px; }
.ds-att-holiday-copy span { color:var(--muted,#64748b); }
.ds-att-filter-panel { margin:16px 0; padding:16px; flex-wrap:wrap; }
.ds-att-filter-form { display:flex; align-items:end; gap:12px; flex-wrap:wrap; flex:1; }
.ds-att-filter-form label,
.ds-modal-field { display:grid; gap:6px; margin:0; min-width:190px; font-weight:800; color:var(--muted,#64748b); }
.ds-att-filter-form input,
.ds-att-filter-form select,
.ds-modal-field input,
.ds-modal-field select,
.ds-mini-input,
.ds-narration-input {
    min-height:40px;
    border:1px solid var(--border,#d8e0e8);
    border-radius:11px;
    background:var(--card,#fff);
    color:var(--text,#172033);
    padding:8px 10px;
    outline:none;
    font:inherit;
}
.ds-att-filter-form input:focus,
.ds-att-filter-form select:focus,
.ds-modal-field input:focus,
.ds-modal-field select:focus,
.ds-mini-input:focus,
.ds-narration-input:focus { border-color:#0e7490; box-shadow:0 0 0 3px rgba(14,116,144,.15); }
.ds-att-filter-actions,
.ds-att-bulk-actions { flex-wrap:wrap; }
.ds-att-kpi-grid { display:grid; grid-template-columns:repeat(4,minmax(150px,1fr)); gap:12px; margin:16px 0; }
.ds-att-kpi {
    position:relative;
    overflow:hidden;
    min-height:108px;
    padding:16px;
    border:1px solid var(--border,#d8e0e8);
    border-radius:17px;
    background:var(--card,#fff);
    box-shadow:0 10px 26px rgba(15,23,42,.07);
    display:grid;
    align-content:center;
    gap:5px;
}
.ds-att-kpi::before { content:""; position:absolute; inset:0 auto 0 0; width:5px; background:#64748b; }
.ds-att-kpi span { color:var(--muted,#64748b); font-size:.8rem; font-weight:850; text-transform:uppercase; letter-spacing:.055em; }
.ds-att-kpi strong { font-size:1.7rem; line-height:1; color:var(--text,#172033); }
.ds-att-kpi small { color:var(--muted,#64748b); }
.ds-att-kpi.full::before { background:#059669; }
.ds-att-kpi.half::before { background:#d97706; }
.ds-att-kpi.progress::before { background:#0284c7; }
.ds-att-kpi.absent::before { background:#dc2626; }
.ds-att-kpi.leave::before { background:#7c3aed; }
.ds-att-kpi.time::before { background:#0f766e; }
.ds-att-kpi.warning::before { background:#b45309; }
.ds-att-card { overflow:visible; margin:16px 0 24px; }
.ds-att-card-head { padding:17px 18px; border-bottom:1px solid var(--border,#d8e0e8); flex-wrap:wrap; }
.ds-att-card-head h2 { margin:3px 0 4px; }
.ds-att-card-head p { margin:0; color:var(--muted,#64748b); }
.ds-att-eyebrow { color:#0f766e; font-weight:900; text-transform:uppercase; letter-spacing:.065em; font-size:.76rem; }
.ds-att-legend { flex-wrap:wrap; justify-content:flex-end; }
.ds-att-legend span { padding:6px 10px; border-radius:999px; font-size:.76rem; font-weight:850; border:1px solid var(--border,#d8e0e8); background:var(--soft,#f7f9fc); }
.ds-att-legend .full { color:#047857; border-color:rgba(5,150,105,.28); background:rgba(5,150,105,.10); }
.ds-att-legend .half { color:#a16207; border-color:rgba(217,119,6,.28); background:rgba(245,158,11,.12); }
.ds-att-legend .progress { color:#0369a1; border-color:rgba(2,132,199,.28); background:rgba(14,165,233,.11); }
.ds-att-legend .absent { color:#b91c1c; border-color:rgba(220,38,38,.28); background:rgba(239,68,68,.10); }
.ds-att-empty { min-height:260px; padding:34px; display:grid; place-items:center; align-content:center; gap:10px; text-align:center; color:var(--muted,#64748b); }
.ds-att-empty>span { width:62px; height:62px; display:grid; place-items:center; border-radius:18px; background:rgba(14,116,144,.10); color:#0e7490; font-size:2rem; font-weight:900; }
.ds-att-empty strong { color:var(--text,#172033); font-size:1.12rem; }
.ds-att-empty p { margin:0; max-width:620px; }
.ds-att-empty>div { display:flex; gap:9px; flex-wrap:wrap; justify-content:center; margin-top:6px; }
.ds-att-table-shell { width:100%; overflow-x:auto; overflow-y:visible; }
.ds-att-table { width:100%; min-width:1680px; border-collapse:separate; border-spacing:0; font-size:.84rem; }
.ds-att-table th,
.ds-att-table td { padding:10px 8px; border-bottom:1px solid var(--border,#e2e8f0); vertical-align:middle; text-align:left; }
.ds-att-table thead th { position:sticky; top:0; z-index:3; background:color-mix(in srgb,var(--card,#fff) 90%,#0e7490 10%); color:var(--text,#172033); font-weight:900; white-space:nowrap; }
.ds-att-table thead tr:nth-child(2) th { top:39px; background:color-mix(in srgb,var(--card,#fff) 94%,#0e7490 6%); }
.ds-att-group-head th[colspan] { text-align:center; color:#0f766e; letter-spacing:.035em; }
.ds-att-row { --row-accent:#64748b; }
.ds-att-row.full-day,
.ds-att-row.present { --row-accent:#059669; }
.ds-att-row.half-day { --row-accent:#d97706; }
.ds-att-row.in-progress { --row-accent:#0284c7; }
.ds-att-row.absent { --row-accent:#dc2626; }
.ds-att-row.leave { --row-accent:#7c3aed; }
.ds-att-row td:first-child { box-shadow:inset 4px 0 0 var(--row-accent); }
.ds-att-row:hover td { background:color-mix(in srgb,var(--card,#fff) 96%,var(--row-accent) 4%); }
.ds-att-row-number { text-align:center!important; font-weight:900; color:var(--muted,#64748b); }
.ds-att-employee-cell { min-width:180px; max-width:230px; }
.ds-att-employee-cell strong,
.ds-att-employee-cell small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ds-att-employee-cell small { color:var(--muted,#64748b); margin-top:3px; }
.ds-shift-name { display:inline-flex; min-width:110px; padding:6px 9px; border:1px solid rgba(14,116,144,.25); border-radius:9px; background:rgba(14,116,144,.08); color:#0f766e; font-weight:850; }
.ds-time-chip { display:inline-flex; align-items:center; justify-content:center; min-width:105px; padding:7px 9px; border-radius:9px; white-space:nowrap; font-weight:850; }
.ds-time-chip.scheduled { background:var(--soft,#f7f9fc); border:1px solid var(--border,#d8e0e8); color:var(--text,#172033); }
.ds-time-button { min-width:74px; min-height:47px; padding:5px 8px; display:grid; gap:1px; place-items:center; border:1px solid var(--border,#d8e0e8); border-radius:10px; background:var(--card,#fff); color:var(--text,#172033); cursor:pointer; box-shadow:0 3px 9px rgba(15,23,42,.06); }
.ds-time-button span { font-size:.62rem; color:var(--muted,#64748b); font-weight:900; letter-spacing:.08em; }
.ds-time-button strong { font-size:.91rem; }
.ds-time-button.has-value { border-color:rgba(5,150,105,.34); background:rgba(5,150,105,.08); color:#047857; }
.ds-time-button:hover:not(:disabled) { border-color:#0e7490; transform:translateY(-1px); box-shadow:0 7px 15px rgba(14,116,144,.13); }
.ds-time-button:disabled { opacity:.6; cursor:not-allowed; box-shadow:none; }
.ds-work-summary { min-width:125px; display:grid; gap:2px; }
.ds-work-summary strong { color:var(--text,#172033); }
.ds-work-summary span,
.ds-work-summary small { color:var(--muted,#64748b); font-size:.73rem; }
.ds-mini-input { width:76px; text-align:right; }
.ds-narration-input { width:145px; }
.ds-status-pill { display:inline-flex; align-items:center; justify-content:center; min-width:84px; min-height:30px; padding:5px 9px; border-radius:999px; border:1px solid var(--border,#d8e0e8); font-weight:900; font-size:.75rem; white-space:nowrap; }
.ds-status-pill.present { color:#047857; border-color:rgba(5,150,105,.30); background:rgba(5,150,105,.11); }
.ds-status-pill.half-day { color:#a16207; border-color:rgba(217,119,6,.32); background:rgba(245,158,11,.13); }
.ds-status-pill.in-progress { color:#0369a1; border-color:rgba(2,132,199,.30); background:rgba(14,165,233,.12); }
.ds-status-pill.absent { color:#b91c1c; border-color:rgba(220,38,38,.28); background:rgba(239,68,68,.11); }
.ds-status-pill.leave { color:var(--leave-color,#6d28d9); border-color:color-mix(in srgb,var(--leave-color,#6d28d9) 38%,transparent); background:color-mix(in srgb,var(--leave-color,#6d28d9) 12%,var(--card,#fff)); }
.ds-leave-name,
.ds-tick-value { display:block; margin-top:4px; color:var(--muted,#64748b); font-size:.7rem; text-align:center; }
.ds-row-actions { min-width:96px; justify-content:center; flex-wrap:wrap; }
.ds-icon-action { width:32px; height:32px; display:grid; place-items:center; border-radius:9px; border:1px solid var(--border,#d8e0e8); background:var(--card,#fff); color:var(--text,#172033); font-weight:900; cursor:pointer; box-shadow:0 3px 8px rgba(15,23,42,.06); }
.ds-icon-action:hover { transform:translateY(-1px); box-shadow:0 7px 14px rgba(15,23,42,.12); }
.ds-icon-action.save { color:#047857; border-color:rgba(5,150,105,.30); background:rgba(5,150,105,.10); }
.ds-icon-action.leave { color:#6d28d9; border-color:rgba(124,58,237,.28); background:rgba(124,58,237,.09); }
.ds-icon-action.danger { color:#b91c1c; border-color:rgba(220,38,38,.28); background:rgba(239,68,68,.10); }
.ds-row-locked { width:32px; height:32px; display:grid; place-items:center; border-radius:9px; background:var(--soft,#f7f9fc); }
.ds-modal-backdrop[hidden],
.ds-modal-backdrop.is-hidden { display:none!important; }
.ds-modal-backdrop { position:fixed; inset:0; z-index:12500; display:grid; place-items:center; padding:20px; background:rgba(15,23,42,.55); backdrop-filter:blur(4px); }
.ds-modal { width:min(470px,100%); border:1px solid color-mix(in srgb,var(--border,#d8e0e8) 72%,#0e7490 28%); border-radius:20px; background:var(--card,#fff); color:var(--text,#172033); box-shadow:0 30px 80px rgba(15,23,42,.28); overflow:hidden; }
.ds-modal form { display:grid; gap:15px; padding:18px; }
.ds-modal-head { justify-content:space-between; border-bottom:1px solid var(--border,#d8e0e8); padding-bottom:13px; }
.ds-modal-head span { color:#0f766e; font-size:.72rem; font-weight:900; text-transform:uppercase; letter-spacing:.065em; }
.ds-modal-head h3 { margin:3px 0; }
.ds-modal-head p { margin:0; color:var(--muted,#64748b); }
.ds-modal-close { width:38px; height:38px; border-radius:11px; border:1px solid var(--border,#d8e0e8); background:var(--soft,#f7f9fc); color:var(--text,#172033); font-size:1.3rem; cursor:pointer; }
.ds-modal-field { min-width:0; color:var(--text,#172033); }
.ds-modal-help { margin:0; padding:10px 12px; border-radius:11px; background:rgba(14,116,144,.08); color:var(--muted,#64748b); font-size:.82rem; line-height:1.45; }
.ds-modal-actions { justify-content:flex-end; flex-wrap:wrap; }

@media (max-width:1180px) {
    .ds-att-kpi-grid { grid-template-columns:repeat(2,minmax(150px,1fr)); }
    .ds-att-topbar { align-items:flex-start; flex-direction:column; }
    .ds-att-top-actions { width:100%; justify-content:flex-start; }
}
@media (max-width:720px) {
    .ds-att-filter-panel,
    .ds-att-card-head,
    .ds-att-holiday-card { align-items:stretch; flex-direction:column; }
    .ds-att-filter-form,
    .ds-att-filter-form label,
    .ds-att-filter-actions,
    .ds-att-bulk-actions,
    .ds-erp-btn { width:100%; }
    .ds-att-kpi-grid { grid-template-columns:1fr; }
    .ds-att-title-row { flex-direction:column; }
    .ds-att-legend { justify-content:flex-start; }
    .ds-att-table { min-width:1540px; }
}

/* Attendance Sheet support for Double Shift half-day values. */
.attendance-status-badge.half-day,
.attendance-legend-item.half-day em {
    color:#a16207;
    background:rgba(245,158,11,.14);
    border-color:rgba(217,119,6,.32);
}
.attendance-total-cell.half-day { color:#a16207; font-weight:900; }
.attendance-sheet-report-card.half-day strong { color:#a16207; }

/* Reports / Others / Daily Sales Summary - Advanced ERP UI */
.daily-summary-page {
    display: grid;
    gap: 16px;
    padding-bottom: 24px;
    color: var(--text);
}
.daily-summary-topbar { align-items: flex-start; }
.daily-summary-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 20px 22px;
    border: 1px solid color-mix(in srgb, var(--brand) 28%, var(--border));
    border-radius: 18px;
    background: linear-gradient(135deg, color-mix(in srgb, var(--brand) 9%, var(--card)), color-mix(in srgb, var(--soft) 45%, var(--card)));
    box-shadow: 0 12px 30px color-mix(in srgb, var(--brand-dark) 10%, transparent);
}
.daily-summary-hero h2 { margin: 2px 0 5px; font-size: 1.45rem; }
.daily-summary-hero p { margin: 0; color: var(--muted); }
.daily-summary-kicker {
    display: inline-block;
    color: var(--brand);
    font-size: .76rem;
    font-weight: 850;
    letter-spacing: .08em;
    text-transform: uppercase;
}
.daily-summary-hero-actions { display: flex; gap: 10px; flex-wrap: wrap; }
.daily-summary-page .daily-summary-advanced-btn {
    min-height: 40px;
    width: auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 9px 15px;
    border-radius: 11px;
    border: 1px solid color-mix(in srgb, var(--brand) 35%, var(--border));
    font-weight: 800;
    line-height: 1;
    text-decoration: none;
    box-shadow: 0 7px 16px color-mix(in srgb, var(--brand-dark) 9%, transparent);
    transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease, background .16s ease;
}
.daily-summary-page .daily-summary-advanced-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 10px 20px color-mix(in srgb, var(--brand-dark) 14%, transparent);
}
.daily-summary-page .daily-summary-advanced-btn:focus-visible {
    outline: 3px solid color-mix(in srgb, var(--brand) 24%, transparent);
    outline-offset: 2px;
}
.daily-summary-page .daily-summary-advanced-btn.primary {
    color: #fff;
    background: linear-gradient(135deg, var(--brand), var(--brand-dark));
    border-color: var(--brand);
}
.daily-summary-page .daily-summary-advanced-btn.secondary {
    color: var(--brand-dark);
    background: linear-gradient(180deg, color-mix(in srgb, var(--soft) 82%, var(--card)), color-mix(in srgb, var(--brand) 11%, var(--card)));
}
.daily-summary-page .daily-summary-advanced-btn.ghost {
    color: var(--text);
    background: color-mix(in srgb, var(--card) 92%, var(--soft));
}
.daily-summary-search-toolbar {
    position: relative;
    z-index: 30;
    display: grid;
    grid-template-columns: minmax(320px, 1fr) auto;
    align-items: center;
    gap: 14px;
}
.daily-summary-search-shell {
    position: relative;
    min-height: 46px;
    display: flex;
    align-items: center;
    border: 1px solid color-mix(in srgb, var(--brand) 38%, var(--border));
    border-radius: 13px;
    background: var(--card);
    box-shadow: 0 7px 20px color-mix(in srgb, var(--brand-dark) 8%, transparent);
    overflow: visible;
}
.daily-summary-search-shell:focus-within {
    border-color: var(--brand);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand) 14%, transparent), 0 9px 24px color-mix(in srgb, var(--brand-dark) 10%, transparent);
}
.daily-summary-search-icon { padding-left: 15px; font-size: 1.25rem; color: var(--brand-dark); }
.daily-summary-search-shell input {
    flex: 1 1 auto;
    min-width: 120px;
    height: 44px;
    border: 0 !important;
    background: transparent !important;
    color: var(--text);
    padding: 0 12px;
    box-shadow: none !important;
    outline: 0;
}
.daily-summary-active-favorite {
    margin-left: 9px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    max-width: 220px;
    padding: 5px 9px;
    border: 1px solid color-mix(in srgb, var(--brand) 28%, var(--border));
    border-radius: 8px;
    background: color-mix(in srgb, var(--soft) 66%, var(--card));
    color: var(--brand-dark);
    font-size: .82rem;
    font-weight: 800;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.daily-summary-search-toggle {
    align-self: stretch;
    width: 48px;
    border: 0;
    border-left: 1px solid var(--border);
    border-radius: 0 12px 12px 0;
    background: color-mix(in srgb, var(--soft) 50%, var(--card));
    color: var(--brand-dark);
    font-size: 1.1rem;
    font-weight: 900;
    cursor: pointer;
}
.daily-summary-search-toggle:hover { background: color-mix(in srgb, var(--brand) 14%, var(--card)); }
.daily-summary-search-menu {
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    width: min(850px, calc(100vw - 44px));
    display: grid;
    grid-template-columns: 1fr 1fr 1.12fr;
    gap: 0;
    padding: 16px;
    border: 1px solid color-mix(in srgb, var(--brand) 24%, var(--border));
    border-radius: 14px;
    background: var(--card);
    box-shadow: 0 20px 44px rgba(15, 23, 42, .2);
}
.daily-summary-search-menu[hidden] { display: none !important; }
.daily-summary-search-menu section { min-width: 0; padding: 0 15px; }
.daily-summary-search-menu section + section { border-left: 1px solid var(--border); }
.daily-summary-search-menu h3 {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 10px;
    font-size: .92rem;
    color: var(--brand-dark);
}
.daily-summary-search-menu section > button,
.daily-summary-favorite-row .favorite-name,
.daily-summary-save-search {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 9px;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: var(--text);
    text-align: left;
    font: inherit;
    cursor: pointer;
}
.daily-summary-search-menu section > button:hover,
.daily-summary-favorite-row .favorite-name:hover,
.daily-summary-save-search:hover { background: color-mix(in srgb, var(--brand) 10%, var(--card)); color: var(--brand-dark); }
.daily-summary-favorite-row { display: grid; grid-template-columns: minmax(0, 1fr) 30px 30px; align-items: center; gap: 4px; }
.daily-summary-favorite-row .favorite-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.daily-summary-favorite-row .favorite-name.is-default { font-weight: 850; color: var(--brand-dark); background: color-mix(in srgb, var(--soft) 55%, var(--card)); }
.daily-summary-favorite-row .favorite-mini {
    width: 29px;
    height: 29px;
    display: grid;
    place-items: center;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: color-mix(in srgb, var(--card) 92%, var(--soft));
    color: var(--brand-dark);
    cursor: pointer;
}
.daily-summary-favorite-row .favorite-mini.danger { color: #b42318; }
.daily-summary-save-search { margin-top: 9px; border-top: 1px solid var(--border); border-radius: 0 0 8px 8px; font-weight: 800; color: var(--brand-dark); }
.daily-summary-no-favorites { margin: 4px 0 9px; padding: 8px; color: var(--muted); font-size: .84rem; }
.daily-summary-toolbar-meta { display: flex; align-items: center; gap: 8px; white-space: nowrap; color: var(--muted); font-size: .86rem; }
.daily-summary-page-btn {
    width: 39px;
    height: 39px;
    display: grid;
    place-items: center;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: color-mix(in srgb, var(--card) 90%, var(--soft));
    color: var(--brand-dark);
    font-weight: 900;
    cursor: pointer;
}
.daily-summary-page-btn:hover:not(:disabled) { border-color: var(--brand); background: color-mix(in srgb, var(--brand) 12%, var(--card)); }
.daily-summary-page-btn:disabled { opacity: .4; cursor: not-allowed; }
.daily-summary-filter-strip {
    display: grid;
    grid-template-columns: 135px 135px 135px minmax(150px, 1fr) minmax(145px, .8fr) minmax(145px, .9fr) 90px auto auto;
    gap: 10px;
    align-items: end;
    padding: 14px;
    border: 1px solid var(--border);
    border-radius: 14px;
    background: var(--card);
    box-shadow: 0 8px 22px rgba(15, 23, 42, .06);
}
.daily-summary-filter-strip label { display: grid; gap: 5px; min-width: 0; }
.daily-summary-filter-strip label > span { color: var(--muted); font-size: .75rem; font-weight: 800; }
.daily-summary-filter-strip input,
.daily-summary-filter-strip select {
    width: 100%;
    min-width: 0;
    height: 40px;
    border: 1px solid var(--border);
    border-radius: 9px;
    background: var(--card);
    color: var(--text);
    padding: 0 10px;
}
.daily-summary-results-shell { display: grid; gap: 15px; transition: opacity .16s ease; }
#dailySalesSummaryResults.is-loading { opacity: .48; pointer-events: none; }
.daily-summary-kpis {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 11px;
}
.daily-summary-kpis article {
    min-width: 0;
    padding: 14px 15px;
    border: 1px solid var(--border);
    border-radius: 14px;
    background: linear-gradient(180deg, var(--card), color-mix(in srgb, var(--soft) 25%, var(--card)));
    box-shadow: 0 7px 18px rgba(15, 23, 42, .055);
}
.daily-summary-kpis article.accent { border-color: color-mix(in srgb, var(--brand) 36%, var(--border)); }
.daily-summary-kpis article.refund { border-color: color-mix(in srgb, #b42318 32%, var(--border)); }
.daily-summary-kpis span { display: block; color: var(--muted); font-size: .78rem; font-weight: 800; }
.daily-summary-kpis strong { display: block; margin: 4px 0 2px; font-size: 1.28rem; color: var(--text); overflow-wrap: anywhere; }
.daily-summary-kpis small { color: var(--muted); }
.daily-payment-ledger-strip {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 10px;
}
.daily-payment-ledger-strip article {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-content: start;
    gap: 9px;
    padding: 12px 14px;
    border: 1px solid color-mix(in srgb, var(--brand) 19%, var(--border));
    border-radius: 13px;
    background: color-mix(in srgb, var(--soft) 32%, var(--card));
}
.daily-payment-ledger-strip article > div:first-child { min-width: 0; }
.daily-payment-ledger-strip article > div:first-child > span {
    display: block;
    font-weight: 850;
    line-height: 1.22;
    white-space: normal;
    overflow: visible;
    text-overflow: clip;
    overflow-wrap: anywhere;
}
.daily-payment-ledger-strip small {
    display: block;
    margin-top: 3px;
    color: var(--muted);
    line-height: 1.3;
    white-space: normal;
    overflow-wrap: anywhere;
}
.daily-ledger-amounts {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    width: 100%;
    gap: 10px;
    align-items: center;
    font-size: .72rem;
    color: var(--muted);
}
.daily-ledger-amounts > span { min-width: 0; }
.daily-ledger-amounts strong { display: block; color: var(--text); font-size: .86rem; white-space: nowrap; }
.daily-ledger-amounts .net strong { color: var(--brand-dark); }
.daily-summary-list-card {
    border: 1px solid var(--border);
    border-radius: 15px;
    background: var(--card);
    box-shadow: 0 10px 28px rgba(15, 23, 42, .07);
    overflow: hidden;
}
.daily-summary-list-heading { display: flex; justify-content: space-between; align-items: center; gap: 14px; padding: 15px 17px; border-bottom: 1px solid var(--border); }
.daily-summary-list-heading h2 { margin: 2px 0 0; font-size: 1.05rem; }
.daily-summary-range { color: var(--muted); font-size: .84rem; }
.daily-summary-table-wrap { overflow-x: auto; }
.daily-summary-table { width: 100%; min-width: 1280px; border-collapse: collapse; font-size: .83rem; }
.daily-summary-table th,
.daily-summary-table td { padding: 9px 11px; border-bottom: 1px solid var(--border); vertical-align: middle; text-align: left; }
.daily-summary-table thead th { position: sticky; top: 0; z-index: 2; background: color-mix(in srgb, var(--soft) 48%, var(--card)); color: var(--brand-dark); font-weight: 850; white-space: nowrap; }
.daily-summary-table thead th[data-daily-col],
.daily-summary-table tbody td[data-daily-col],
.daily-summary-table tfoot td[data-daily-col] {
    white-space: nowrap !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
}
.daily-summary-table thead th[data-daily-col] {
    position: sticky;
    overflow: visible;
}
.daily-summary-resizable-header { padding-right: 18px !important; }
.daily-summary-resize-handle {
    position: absolute;
    top: 0;
    right: -5px;
    bottom: 0;
    z-index: 8;
    width: 11px;
    cursor: col-resize;
    touch-action: none;
}
.daily-summary-resize-handle::after {
    content: "";
    position: absolute;
    top: 8px;
    right: 5px;
    bottom: 8px;
    width: 1px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--brand) 45%, #94a3b8);
    opacity: .45;
}
.daily-summary-resizable-header:hover > .daily-summary-resize-handle::after,
.daily-summary-resizable-header.is-resizing > .daily-summary-resize-handle::after {
    width: 2px;
    opacity: .95;
}
body.daily-summary-column-resizing,
body.daily-summary-column-resizing * {
    cursor: col-resize !important;
    user-select: none !important;
}
.daily-summary-table td small { display: block; margin-top: 2px; color: var(--muted); font-size: .7rem; }
.daily-summary-table .number { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.daily-summary-table tbody tr:not(.daily-summary-group-row):hover { background: color-mix(in srgb, var(--brand) 6%, var(--card)); }
.daily-summary-group-row td { padding: 8px 11px; background: color-mix(in srgb, var(--brand) 10%, var(--card)); border-top: 1px solid color-mix(in srgb, var(--brand) 25%, var(--border)); }
.daily-summary-group-head { display: flex; align-items: center; flex-wrap: wrap; gap: 10px 18px; }
.daily-summary-group-head > span { color: var(--muted); }
.daily-summary-group-head b { color: var(--text); }
.daily-summary-group-head .net b { color: var(--brand-dark); }
.daily-group-chevron { width: 27px; height: 27px; border: 1px solid color-mix(in srgb, var(--brand) 25%, var(--border)); border-radius: 7px; background: var(--card); color: var(--brand-dark); cursor: pointer; }
.daily-transaction-badge,
.daily-state-badge { display: inline-flex; align-items: center; min-height: 23px; padding: 3px 8px; border-radius: 999px; font-size: .7rem; font-weight: 850; white-space: nowrap; }
.daily-transaction-badge.sale { background: color-mix(in srgb, var(--brand) 13%, var(--card)); color: var(--brand-dark); }
.daily-transaction-badge.refund { background: color-mix(in srgb, #b42318 11%, var(--card)); color: #a11b12; }
.daily-state-badge { background: color-mix(in srgb, var(--soft) 64%, var(--card)); color: var(--text); }
.daily-summary-table .positive { color: #087a52; font-weight: 850; }
.daily-summary-table .negative { color: #b42318; font-weight: 850; }
.daily-summary-table tr.is-on-account .number:last-of-type,
.daily-summary-table tr.is-credit .number:last-of-type,
.daily-summary-table tr.is-unpaid .number:last-of-type { color: var(--muted); }
.daily-summary-table tfoot td { position: sticky; bottom: 0; background: color-mix(in srgb, var(--brand) 12%, var(--card)); border-top: 2px solid color-mix(in srgb, var(--brand) 35%, var(--border)); }
.daily-summary-pager { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 13px 16px; color: var(--muted); }
.daily-summary-pager > div { display: flex; gap: 8px; }
.daily-summary-empty { display: grid; place-items: center; gap: 5px; min-height: 190px; padding: 30px; text-align: center; color: var(--muted); }
.daily-summary-empty strong { color: var(--text); font-size: 1.05rem; }
.daily-custom-filter-modal {
    position: fixed;
    inset: 0;
    z-index: 5000;
    display: grid;
    place-items: start center;
    padding: 8vh 18px 18px;
    background: color-mix(in srgb, var(--text) 48%, transparent);
    backdrop-filter: blur(2px);
}
.daily-custom-filter-modal[hidden] { display: none !important; }
.daily-custom-filter-dialog {
    width: min(1120px, 100%);
    max-height: 84vh;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
    border: 1px solid color-mix(in srgb, var(--brand) 28%, var(--border));
    border-radius: 17px;
    background: var(--card);
    box-shadow: 0 30px 70px rgba(15, 23, 42, .3);
    overflow: hidden;
}
.daily-custom-filter-dialog > header { display: flex; justify-content: space-between; align-items: center; padding: 16px 18px; border-bottom: 1px solid var(--border); background: color-mix(in srgb, var(--soft) 35%, var(--card)); }
.daily-custom-filter-dialog h2 { margin: 1px 0 0; font-size: 1.2rem; }
.daily-custom-filter-dialog > header button { width: 37px; height: 37px; border: 1px solid var(--border); border-radius: 10px; background: var(--card); color: var(--text); font-size: 1.35rem; cursor: pointer; }
.daily-custom-filter-body { overflow: auto; padding: 18px; }
.daily-match-row { display: flex; align-items: center; gap: 7px; margin-bottom: 14px; color: var(--muted); }
.daily-match-row select { height: 35px; border: 1px solid var(--border); border-radius: 8px; background: var(--card); color: var(--text); padding: 0 9px; font-weight: 800; }
.daily-rule-list { display: grid; gap: 9px; }
.daily-rule-row { display: grid; grid-template-columns: minmax(160px, .9fr) minmax(190px, .9fr) minmax(190px, 1.3fr) minmax(150px, .8fr) 38px; gap: 9px; align-items: center; }
.daily-rule-row select,
.daily-rule-row input { min-width: 0; height: 40px; border: 1px solid var(--border); border-radius: 9px; background: var(--card); color: var(--text); padding: 0 10px; }
.daily-rule-row button { width: 38px; height: 38px; border: 1px solid color-mix(in srgb, #b42318 24%, var(--border)); border-radius: 9px; background: color-mix(in srgb, #b42318 7%, var(--card)); color: #b42318; cursor: pointer; }
.daily-new-rule { margin-top: 13px; border: 0; background: transparent; color: var(--brand-dark); font-weight: 850; cursor: pointer; }
.daily-custom-filter-dialog > footer { display: flex; gap: 9px; padding: 14px 18px; border-top: 1px solid var(--border); background: color-mix(in srgb, var(--soft) 24%, var(--card)); }
@media (max-width: 1260px) {
    .daily-summary-filter-strip { grid-template-columns: repeat(4, minmax(130px, 1fr)); }
    .daily-summary-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 820px) {
    .daily-summary-hero { align-items: flex-start; flex-direction: column; }
    .daily-summary-search-toolbar { grid-template-columns: 1fr; }
    .daily-summary-toolbar-meta { justify-content: flex-end; }
    .daily-summary-search-menu { grid-template-columns: 1fr; width: 100%; max-height: 70vh; overflow: auto; }
    .daily-summary-search-menu section { padding: 12px 4px; }
    .daily-summary-search-menu section + section { border-left: 0; border-top: 1px solid var(--border); }
    .daily-summary-filter-strip { grid-template-columns: repeat(2, minmax(125px, 1fr)); }
    .daily-payment-ledger-strip article { grid-template-columns: 1fr; }
    .daily-ledger-amounts { justify-content: start; }
    .daily-rule-row { grid-template-columns: 1fr; padding: 12px; border: 1px solid var(--border); border-radius: 12px; }
    .daily-rule-row button { justify-self: end; }
}
@media (max-width: 540px) {
    .daily-summary-kpis { grid-template-columns: 1fr; }
    .daily-summary-filter-strip { grid-template-columns: 1fr; }
    .daily-summary-page .daily-summary-advanced-btn { width: 100%; }
    .daily-summary-hero-actions { width: 100%; }
    .daily-summary-pager { align-items: stretch; flex-direction: column; }
    .daily-summary-pager > div { display: grid; grid-template-columns: 1fr 1fr; }
}


/* Daily Sales Summary selection, reference, amount and state enhancements */
.daily-summary-table .daily-select-col{width:38px;min-width:38px;text-align:center;padding-left:8px;padding-right:8px}
.daily-summary-table input[type="checkbox"]{width:17px;height:17px;accent-color:var(--primary,#3548d4);cursor:pointer}
.daily-reference-link{display:inline-flex;align-items:center;gap:4px;color:var(--primary,#273fd0);font-weight:800;text-decoration:none;border-bottom:1px dashed transparent;transition:.15s ease}
.daily-reference-link:hover,.daily-reference-link:focus{border-bottom-color:currentColor;transform:translateY(-1px)}
.daily-reference-link.is-opening{opacity:.6}
.daily-summary-table .negative,.daily-payment-ledger-strip .negative{color:var(--danger,#b42318)!important;font-weight:850}
.daily-summary-table .positive{color:var(--success,#067647);font-weight:800}
.daily-state-badge{display:inline-flex;align-items:center;justify-content:center;min-width:70px;padding:4px 9px;border-radius:999px;border:1px solid var(--border,#cbd3e8);background:var(--surface-2,#f4f6fb);font-weight:850;font-size:.74rem;text-transform:uppercase;letter-spacing:.025em}
.daily-state-badge.state-pending,.daily-state-badge.state-draft{background:#fff7df;border-color:#e8be4d;color:#7a5200}
.daily-state-badge.state-invoiced,.daily-state-badge.state-paid,.daily-state-badge.state-delivered{background:#e8f7ee;border-color:#61bd7c;color:#136b35}
.daily-state-badge.state-partial-paid,.daily-state-badge.state-partially-refunded{background:#eaf2ff;border-color:#77a4e8;color:#1f4f94}
.daily-state-badge.state-cancelled,.daily-state-badge.state-refunded{background:#fdecec;border-color:#e58b8b;color:#9d1c1c}
.daily-summary-filter-strip{grid-template-columns:minmax(110px,.7fr) minmax(110px,.75fr) minmax(110px,.75fr) minmax(190px,1.35fr) minmax(150px,1fr) minmax(160px,1.05fr) minmax(170px,1.1fr) minmax(80px,.55fr) auto auto}
@media(max-width:1200px){.daily-summary-filter-strip{grid-template-columns:repeat(4,minmax(150px,1fr))}.daily-summary-table{min-width:1600px}}
@media print{.daily-summary-hero-actions,.daily-summary-search-toolbar,.daily-summary-filter-strip,.daily-summary-pager{display:none!important}}

/* Daily Sales Summary context print menu, selected rows, and fixed visual order */
.daily-summary-table tbody tr.is-selected:not(.daily-summary-group-row){
    background:color-mix(in srgb,#f4b400 20%,var(--card))!important;
    box-shadow:inset 4px 0 0 #c88700,inset -1px 0 0 color-mix(in srgb,#c88700 45%,var(--border));
}
.daily-summary-table tbody tr.is-selected td{border-bottom-color:color-mix(in srgb,#c88700 45%,var(--border))}
.daily-summary-context-menu{position:fixed;z-index:9000;width:min(310px,calc(100vw - 16px));padding:7px;border:1px solid color-mix(in srgb,var(--brand) 28%,var(--border));border-radius:13px;background:var(--card);box-shadow:0 22px 55px rgba(15,23,42,.28)}
.daily-summary-context-menu[hidden]{display:none!important}
.daily-summary-context-menu button{width:100%;display:grid;grid-template-columns:34px minmax(0,1fr);align-items:center;gap:8px;padding:10px 11px;border:0;border-radius:9px;background:transparent;color:var(--text);font:inherit;font-weight:750;text-align:left;cursor:pointer}
.daily-summary-context-menu button:hover:not(:disabled){background:color-mix(in srgb,var(--brand) 11%,var(--card));color:var(--brand-dark)}
.daily-summary-context-menu button:disabled{opacity:.42;cursor:not-allowed}
.daily-summary-context-menu button>span:first-child{display:grid;place-items:center;min-height:26px;border-radius:7px;background:color-mix(in srgb,var(--brand) 10%,var(--card));color:var(--brand-dark);font-size:.76rem;font-weight:900}
.daily-summary-context-separator{height:1px;margin:5px 4px;background:var(--border)}


/* Daily Sales Summary currency, print actions, and selected-summary recalculation */
.daily-summary-print-action{font-weight:500!important}
.daily-summary-context-menu button.daily-summary-print-action{font-weight:500!important}
.daily-summary-results-shell.has-selection-summary .daily-summary-kpis article,
.daily-summary-results-shell.has-selection-summary .daily-payment-ledger-strip article{
    border-color:color-mix(in srgb,#c88700 38%,var(--border));
}
.daily-summary-table tbody tr.is-selected:not(.daily-summary-group-row){
    background:color-mix(in srgb,#f4b400 26%,var(--card))!important;
    box-shadow:inset 5px 0 0 #c88700,inset -1px 0 0 color-mix(in srgb,#c88700 55%,var(--border));
    outline:1px solid color-mix(in srgb,#c88700 55%,transparent);
    outline-offset:-1px;
}
.daily-summary-table tbody tr.is-selected td{background:transparent!important}


/* Daily Sales Summary inline report actions and ledger visibility */
.daily-summary-hero-actions{
    display:flex!important;
    flex-wrap:nowrap!important;
    align-items:center;
    justify-content:flex-end;
    gap:8px;
    max-width:100%;
    overflow-x:auto;
    white-space:nowrap;
    scrollbar-width:thin;
}
.daily-summary-hero-actions .daily-summary-advanced-btn{
    flex:0 0 auto;
    width:auto!important;
    font-weight:500!important;
}
.daily-summary-hero-actions .daily-summary-print-action span:last-child{font-weight:500!important}
.daily-payment-ledger-strip{
    grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
}
.daily-payment-ledger-strip article{min-height:104px}
.daily-payment-ledger-strip [data-ledger-code]{font-weight:700;color:var(--text)}
@media(max-width:540px){
    .daily-summary-hero-actions{width:100%;justify-content:flex-start}
    .daily-summary-hero-actions .daily-summary-advanced-btn{width:auto!important}
}

/* Daily Sales Summary: saved invoice time under the business date. */
.daily-summary-table td.daily-document-date > span { display:block; white-space:nowrap; font-weight:750; }
.daily-summary-table td.daily-document-date > small { display:block; margin-top:2px; font-size:.68rem; line-height:1.15; color:var(--muted); white-space:nowrap; font-weight:600; }


/* Search product in Invoice: compact, left-aligned invoice-row search only. */
.invoice-product-search-bar[hidden] {
    display: none !important;
}
.invoice-product-search-bar {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
    min-width: 0;
    min-height: 34px;
    box-sizing: border-box;
}
.invoice-product-search-field {
    display: block;
    flex: 0 1 430px;
    width: min(430px, 100%);
    min-width: 250px;
    margin: 0;
}
.invoice-product-search-field > span {
    display: none !important;
}
.invoice-product-search-input {
    width: 100%;
    height: 34px !important;
    min-height: 34px !important;
    min-width: 250px;
    margin: 0 !important;
    padding: 6px 10px !important;
    line-height: 20px !important;
    box-sizing: border-box;
}
.invoice-product-search-actions {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex: 0 0 auto;
    min-height: 34px;
}
.invoice-product-search-count {
    min-width: 88px;
    color: var(--muted, #6b7280);
    font-size: .78rem;
    font-weight: 700;
    text-align: center;
    white-space: nowrap;
}
.invoice-product-search-actions button {
    min-width: 34px;
    width: auto;
    height: 34px;
    min-height: 34px;
    padding: 5px 9px;
    border: 1px solid var(--border, #d1d5db);
    border-radius: 7px;
    background: var(--card, #fff);
    color: var(--text, #1f2937);
    cursor: pointer;
    font: inherit;
    font-weight: 800;
    box-sizing: border-box;
}
.invoice-product-search-actions button:hover:not(:disabled),
.invoice-product-search-actions button:focus-visible {
    border-color: var(--theme-primary, var(--brand, #714b67));
    color: var(--theme-primary, var(--brand, #714b67));
    outline: none;
}
.invoice-product-search-actions button:disabled {
    cursor: default;
    opacity: .45;
}

.invoice-product-search-toggle.is-active {
    border-color: var(--theme-primary, var(--brand, #714b67)) !important;
    background: color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 14%, var(--card, #fff)) !important;
    color: var(--theme-primary, var(--brand, #714b67)) !important;
}
.sales-invoice-product-search {
    justify-content: flex-start;
    min-height: 44px;
    padding: 5px 8px;
    margin-top: -1px;
    box-sizing: border-box;
    border: 1px solid var(--border, #e5e7eb);
    background: color-mix(in srgb, var(--card, #fff) 96%, var(--theme-primary, var(--brand, #714b67)));
}
.purchase-order-grid-toolbar {
    grid-template-columns: auto minmax(0, 1fr) !important;
    align-items: center !important;
    min-height: 44px;
    margin: 6px 0 !important;
    padding: 5px 8px;
    box-sizing: border-box;
}
.purchase-order-grid-toolbar .purchase-invoice-product-search {
    grid-column: 2;
    justify-self: start;
    justify-content: flex-start;
    width: min(720px, 100%);
    margin: 0;
}
.sales-items-table tbody tr.invoice-product-search-match > td,
.purchase-order-lines-table tbody tr.invoice-product-search-match > td {
    background: color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 10%, var(--card, #fff)) !important;
}
.sales-items-table tbody tr.invoice-product-search-active > td,
.purchase-order-lines-table tbody tr.invoice-product-search-active > td {
    background: color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 18%, var(--card, #fff)) !important;
    box-shadow: inset 0 2px 0 var(--theme-primary, var(--brand, #714b67)), inset 0 -2px 0 var(--theme-primary, var(--brand, #714b67));
}
.purchase-order-lines-table tbody tr.invoice-product-search-active:focus {
    outline: none;
}
@media (max-width: 900px) {
    .invoice-product-search-bar {
        align-items: center;
        flex-wrap: wrap;
    }
    .invoice-product-search-field {
        flex: 1 1 260px;
        width: auto;
        min-width: 0;
    }
    .invoice-product-search-input {
        min-width: 0;
    }
    .purchase-order-grid-toolbar {
        grid-template-columns: 1fr !important;
        align-items: stretch !important;
    }
    .purchase-order-grid-toolbar .purchase-invoice-product-search {
        grid-column: 1;
        justify-content: flex-start;
        width: 100%;
    }
}

/* Direct Purchase product-row purchase history lookup */
.purchase-order-lines-table .purchase-product-cell{
    grid-template-columns:minmax(210px,1fr) auto!important;
}
.purchase-product-actions{
    display:flex;
    align-items:center;
    gap:3px;
    flex:0 0 auto;
}
.purchase-order-lines-table .purchase-product-actions>button{
    width:24px!important;
    height:24px!important;
    min-width:24px!important;
    padding:0!important;
    display:inline-flex!important;
    align-items:center;
    justify-content:center;
}
.purchase-order-lines-table [data-open-product-history] svg{
    width:15px;
    height:15px;
    fill:none;
    stroke:currentColor;
    stroke-width:2;
    stroke-linecap:round;
    stroke-linejoin:round;
}
.purchase-order-lines-table [data-open-product-history]{
    color:var(--theme-primary,var(--erp-primary,#2563eb));
}
.purchase-product-history-card{
    width:min(980px,calc(100vw - 28px));
    max-height:min(82vh,760px);
    display:flex;
    flex-direction:column;
    overflow:hidden;
}
.purchase-product-history-product{
    display:flex;
    align-items:baseline;
    gap:10px;
    flex-wrap:wrap;
    padding:10px 12px;
    margin-bottom:10px;
    border:1px solid var(--border,#dbe5ef);
    border-radius:8px;
    background:var(--theme-primary-soft,var(--soft,#f4f7fb));
}
.purchase-product-history-product span{
    color:var(--muted,#64748b);
    font-size:12px;
}
.purchase-product-history-head,
.purchase-product-history-row{
    display:grid;
    grid-template-columns:130px minmax(145px,1fr) minmax(230px,1.7fr) 120px 120px;
    align-items:center;
}
.purchase-product-history-head{
    padding:9px 12px;
    background:var(--theme-primary-soft,var(--soft,#f4f7fb));
    border-top:1px solid var(--border,#dbe5ef);
    border-bottom:1px solid var(--border,#dbe5ef);
    font-weight:800;
}
.purchase-product-history-results{
    min-height:190px;
    max-height:480px;
    overflow:auto;
    border-bottom:1px solid var(--border,#dbe5ef);
}
.purchase-product-history-row{
    min-height:42px;
    padding:7px 12px;
    border-bottom:1px solid var(--border,#e6edf5);
    background:var(--surface,#fff);
}
.purchase-product-history-row:hover{
    background:var(--theme-primary-soft,var(--soft,#f4f7fb));
}
.purchase-product-history-row>span{
    min-width:0;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    padding-right:10px;
}
.purchase-product-history-row .numeric{
    text-align:right;
    font-variant-numeric:tabular-nums;
}
.purchase-product-history-footer{
    align-items:center;
    justify-content:flex-end;
    gap:8px;
    flex-wrap:wrap;
}
.purchase-product-history-footer>[data-product-history-range]{
    margin-right:auto;
    color:var(--muted,#64748b);
    font-weight:700;
}
@media(max-width:760px){
    .purchase-product-history-head{display:none}
    .purchase-product-history-row{
        grid-template-columns:1fr 1fr;
        gap:8px;
        padding:10px 12px;
    }
    .purchase-product-history-row>span:nth-child(3){grid-column:1/-1}
    .purchase-product-history-row>span::before{
        display:block;
        font-size:10px;
        color:var(--muted,#64748b);
        font-weight:700;
    }
    .purchase-product-history-row>span:nth-child(1)::before{content:'Purchase Date'}
    .purchase-product-history-row>span:nth-child(2)::before{content:'Invoice No'}
    .purchase-product-history-row>span:nth-child(3)::before{content:'Supplier'}
    .purchase-product-history-row>span:nth-child(4)::before{content:'Qty'}
    .purchase-product-history-row>span:nth-child(5)::before{content:'Price'}
}
.purchase-order-lines-table [data-open-product-history]:disabled{
    opacity:.4;
    cursor:not-allowed;
}

/* Direct Purchase workflow stage readability - final stage is always reached on this screen. */
.purchase-page-shell .purchase-stagebar {
    isolation: isolate;
    overflow: visible;
}
.purchase-page-shell .purchase-stagebar span {
    position: relative;
    z-index: 1;
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1.15;
    text-shadow: none !important;
}
.purchase-page-shell .purchase-stagebar span.completed {
    background: #fff7ed !important;
    color: #9a3412 !important;
    border-color: #fdba74 !important;
}
.purchase-page-shell .purchase-stagebar span.completed:nth-child(2) {
    z-index: 2;
    background: #ffedd5 !important;
    color: #7c2d12 !important;
    border-color: #fb923c !important;
}
.purchase-page-shell .purchase-stagebar span.active.is-final {
    z-index: 3;
    min-width: 164px;
    background: linear-gradient(135deg, #0f766e 0%, #047857 100%) !important;
    color: #ffffff !important;
    border-color: #065f46 !important;
    font-weight: 900 !important;
    letter-spacing: .01em;
    filter: drop-shadow(0 3px 5px rgba(6, 78, 59, .28));
}
.purchase-page-shell .purchase-stagebar span.active.is-final::after {
    content: "✓";
    display: inline-grid;
    place-items: center;
    width: 18px;
    height: 18px;
    margin-left: 8px;
    border-radius: 50%;
    background: #ffffff;
    color: #047857;
    font-size: 12px;
    font-weight: 1000;
    line-height: 1;
}
@media (max-width: 720px) {
    .purchase-page-shell .purchase-stagebar {
        width: 100%;
        overflow-x: auto;
        padding-block: 3px;
    }
    .purchase-page-shell .purchase-stagebar span {
        flex: 0 0 auto;
    }
}


/* Direct Purchase product cell: use full Product column width and keep row actions at the far right. */
.purchase-order-lines-table td[data-col="product"] .purchase-product-cell {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    box-sizing: border-box;
    grid-template-columns: minmax(0, 1fr) auto !important;
    column-gap: 6px !important;
}
.purchase-order-lines-table td[data-col="product"] .purchase-product-editor {
    width: 100% !important;
    min-width: 0 !important;
}
.purchase-order-lines-table td[data-col="product"] .purchase-grid-input.product {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    box-sizing: border-box;
}
.purchase-order-lines-table td[data-col="product"] .purchase-product-actions {
    justify-self: end;
    margin-left: auto;
    white-space: nowrap;
}


/* Direct Purchase: show invoice-product search directly below the row actions. */
.purchase-lines-card .purchase-row-actions-search {
    justify-content: flex-start;
    width: 100%;
    min-height: 44px;
    margin: 6px 0 0;
    padding: 5px 8px;
    box-sizing: border-box;
    border: 1px solid var(--border, #e5e7eb);
    background: color-mix(in srgb, var(--card, #fff) 96%, var(--theme-primary, var(--brand, #714b67)));
}
@media (max-width: 900px) {
    .purchase-lines-card .purchase-row-actions-search {
        align-items: center;
        width: 100%;
    }
}


/* Direct Purchase save validation / database commit lock */
.purchase-save-validation-overlay[hidden] { display: none !important; }
.purchase-save-validation-overlay {
    position: fixed;
    inset: 0;
    z-index: 2147482500;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    background: color-mix(in srgb, var(--erp-surface, #ffffff) 68%, rgba(15, 23, 42, .58));
    backdrop-filter: blur(3px);
    cursor: wait;
    pointer-events: all;
}
.purchase-save-validation-card {
    width: min(470px, calc(100vw - 32px));
    display: grid;
    justify-items: center;
    gap: 12px;
    padding: 26px 28px;
    border: 1px solid color-mix(in srgb, var(--erp-primary, #2563eb) 55%, #ffffff);
    border-radius: 14px;
    background: var(--erp-surface, #ffffff);
    color: var(--erp-text, #0f172a);
    box-shadow: 0 24px 70px rgba(15, 23, 42, .28);
    text-align: center;
}
.purchase-save-validation-card strong { font-size: 18px; line-height: 1.25; }
.purchase-save-validation-card > span:not(.purchase-save-validation-spinner) { font-size: 13px; line-height: 1.5; }
.purchase-save-validation-card small { color: var(--erp-muted, #64748b); line-height: 1.45; }
.purchase-save-validation-spinner {
    width: 44px;
    height: 44px;
    border: 4px solid color-mix(in srgb, var(--erp-primary, #2563eb) 20%, transparent);
    border-top-color: var(--erp-primary, #2563eb);
    border-radius: 50%;
    animation: direct-purchase-save-spin .78s linear infinite;
}
.purchase-save-validation-progress {
    width: 100%;
    height: 5px;
    overflow: hidden;
    border-radius: 999px;
    background: color-mix(in srgb, var(--erp-primary, #2563eb) 14%, transparent);
}
.purchase-save-validation-progress span {
    display: block;
    width: 42%;
    height: 100%;
    border-radius: inherit;
    background: var(--erp-primary, #2563eb);
    animation: direct-purchase-save-progress 1.15s ease-in-out infinite;
}
body.purchase-save-page-locked { overflow: hidden !important; cursor: wait; }
@keyframes direct-purchase-save-spin { to { transform: rotate(360deg); } }
@keyframes direct-purchase-save-progress {
    0% { transform: translateX(-120%); }
    50% { transform: translateX(90%); }
    100% { transform: translateX(250%); }
}
@media (prefers-reduced-motion: reduce) {
    .purchase-save-validation-spinner,
    .purchase-save-validation-progress span { animation-duration: 2.4s; }
}

/* Global account menu stacking fix.
   Keep the logged-in user/theme dropdown above sticky command bars and page content,
   while leaving modal dialogs and full-page blocking overlays above it. */
body .topbar,
body .company-topbar {
    position: relative;
    z-index: 200;
    overflow: visible;
}

body .topbar .user-panel,
body .company-topbar .user-panel,
body .account-menu {
    position: relative;
    z-index: 210;
    overflow: visible;
}

body .account-dropdown {
    z-index: 220;
}

/* Masters / Account Masters / Invoice Types */
.invoice-types-topbar {
    border-bottom: 1px solid var(--border, #e5e7eb);
}
.invoice-types-page {
    display: grid;
    gap: 16px;
    padding: 18px 22px 34px;
    color: var(--text, #1f2937);
}
.invoice-types-commandbar {
    position: sticky;
    top: 0;
    z-index: 120;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 11px 13px;
    border: 1px solid var(--border, #e5e7eb);
    border-radius: 12px;
    background: color-mix(in srgb, var(--card, #fff) 95%, var(--soft, #f7f4f6));
    box-shadow: 0 8px 24px rgba(15, 23, 42, .06);
}
.invoice-types-command-actions,
.invoice-types-section-links {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}
.invoice-types-primary-btn,
.invoice-types-secondary-btn,
.invoice-types-close-btn,
.invoice-types-panel-new,
.invoice-types-edit-link,
.invoice-types-search-form button,
.invoice-types-search-form a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 36px;
    padding: 7px 13px;
    border: 1px solid transparent;
    border-radius: 8px;
    font: inherit;
    font-size: 13px;
    font-weight: 700;
    line-height: 1;
    text-decoration: none;
    cursor: pointer;
    transition: transform .15s ease, box-shadow .15s ease, background .15s ease, border-color .15s ease;
}
.invoice-types-primary-btn,
.invoice-types-panel-new,
.invoice-types-save-btn {
    border-color: var(--brand, #714b67) !important;
    background: var(--brand, #714b67) !important;
    color: #fff !important;
}
.invoice-types-secondary-btn {
    border-color: color-mix(in srgb, var(--brand, #714b67) 48%, var(--border, #e5e7eb));
    background: color-mix(in srgb, var(--brand, #714b67) 10%, var(--card, #fff));
    color: var(--brand, #714b67);
}
.invoice-types-close-btn,
.invoice-types-search-form a {
    border-color: var(--border, #e5e7eb);
    background: var(--card, #fff);
    color: var(--text, #1f2937);
}
.invoice-types-primary-btn:hover,
.invoice-types-secondary-btn:hover,
.invoice-types-close-btn:hover,
.invoice-types-panel-new:hover,
.invoice-types-edit-link:hover,
.invoice-types-search-form button:hover,
.invoice-types-search-form a:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 14px rgba(15, 23, 42, .11);
}
.invoice-types-section-links a {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 34px;
    padding: 6px 10px;
    border: 1px solid transparent;
    border-radius: 999px;
    color: var(--muted, #64748b);
    font-size: 13px;
    font-weight: 700;
    text-decoration: none;
}
.invoice-types-section-links a span {
    min-width: 24px;
    padding: 2px 7px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--muted, #64748b) 13%, transparent);
    color: inherit;
    text-align: center;
}
.invoice-types-section-links a.active {
    border-color: color-mix(in srgb, var(--brand, #714b67) 38%, var(--border, #e5e7eb));
    background: color-mix(in srgb, var(--brand, #714b67) 11%, var(--card, #fff));
    color: var(--brand, #714b67);
}
.invoice-types-summary-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}
.invoice-types-summary-card {
    display: flex;
    align-items: center;
    gap: 13px;
    min-height: 86px;
    padding: 16px;
    border: 1px solid var(--border, #e5e7eb);
    border-radius: 12px;
    background: var(--card, #fff);
    box-shadow: 0 5px 16px rgba(15, 23, 42, .045);
}
.invoice-types-summary-icon {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    border-radius: 12px;
    background: color-mix(in srgb, var(--brand, #714b67) 12%, var(--card, #fff));
    color: var(--brand, #714b67);
    font-size: 22px;
}
.invoice-types-summary-card div {
    display: grid;
    gap: 2px;
}
.invoice-types-summary-card strong {
    color: var(--text, #1f2937);
    font-size: 24px;
    line-height: 1;
}
.invoice-types-summary-card div span {
    color: var(--muted, #64748b);
    font-size: 13px;
}
.invoice-types-master-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.12fr) minmax(420px, .88fr);
    gap: 16px;
    align-items: start;
}
.invoice-types-master-grid.voucher-first #voucherTypePanel { order: -1; }
.invoice-types-panel {
    min-width: 0;
    overflow: hidden;
    border: 1px solid var(--border, #e5e7eb);
    border-radius: 14px;
    background: var(--card, #fff);
    box-shadow: 0 9px 26px rgba(15, 23, 42, .055);
}
.invoice-types-panel.is-active {
    border-color: color-mix(in srgb, var(--brand, #714b67) 55%, var(--border, #e5e7eb));
    box-shadow: 0 10px 28px color-mix(in srgb, var(--brand, #714b67) 13%, transparent);
}
.invoice-types-panel-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
    padding: 17px 18px 13px;
    border-bottom: 1px solid var(--border, #e5e7eb);
    background: color-mix(in srgb, var(--soft, #f7f4f6) 72%, var(--card, #fff));
}
.invoice-types-panel-header h2 {
    margin: 2px 0 3px;
    color: var(--text, #1f2937);
    font-size: 20px;
}
.invoice-types-panel-header p {
    margin: 0;
    color: var(--muted, #64748b);
    font-size: 12px;
}
.invoice-types-panel-header code {
    color: var(--brand, #714b67);
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
}
.invoice-types-panel-kicker {
    color: var(--brand, #714b67);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}
.invoice-types-search-form {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    gap: 8px;
    padding: 12px 14px;
    border-bottom: 1px solid var(--border, #e5e7eb);
}
.invoice-types-search-form input {
    width: 100%;
    min-height: 38px;
    padding: 8px 11px;
    border: 1px solid var(--border, #e5e7eb);
    border-radius: 8px;
    outline: none;
    background: var(--card, #fff);
    color: var(--text, #1f2937);
    font: inherit;
}
.invoice-types-search-form input:focus {
    border-color: var(--brand, #714b67);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand, #714b67) 13%, transparent);
}
.invoice-types-search-form button {
    border-color: var(--brand, #714b67);
    background: var(--brand, #714b67);
    color: #fff;
}
.invoice-types-table-wrap {
    width: 100%;
    overflow-x: auto;
}
.invoice-types-table {
    width: 100%;
    min-width: 780px;
    border-collapse: collapse;
    color: var(--text, #1f2937);
    font-size: 13px;
}
.voucher-types-table { min-width: 620px; }
.invoice-types-table th,
.invoice-types-table td {
    padding: 11px 12px;
    border-bottom: 1px solid var(--border, #e5e7eb);
    vertical-align: middle;
    text-align: left;
}
.invoice-types-table th {
    position: sticky;
    top: 0;
    z-index: 2;
    background: color-mix(in srgb, var(--soft, #f7f4f6) 86%, var(--card, #fff));
    color: var(--muted, #64748b);
    font-size: 11px;
    letter-spacing: .04em;
    text-transform: uppercase;
}
.invoice-types-table tbody tr:hover td {
    background: color-mix(in srgb, var(--brand, #714b67) 4.5%, var(--card, #fff));
}
.invoice-types-table tbody tr:last-child td { border-bottom: 0; }
.invoice-types-tax-pill,
.invoice-types-type-pill,
.invoice-types-status-pill {
    display: inline-flex;
    align-items: center;
    min-height: 25px;
    padding: 3px 8px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 750;
    white-space: nowrap;
}
.invoice-types-tax-pill {
    background: color-mix(in srgb, #0ea5e9 12%, var(--card, #fff));
    color: color-mix(in srgb, #0b7fab 82%, var(--text, #1f2937));
}
.invoice-types-type-pill {
    background: color-mix(in srgb, var(--brand, #714b67) 11%, var(--card, #fff));
    color: var(--brand, #714b67);
}
.invoice-types-status-pill.enabled {
    background: color-mix(in srgb, #16a34a 12%, var(--card, #fff));
    color: #15803d;
}
.invoice-types-status-pill.disabled {
    background: color-mix(in srgb, var(--muted, #64748b) 12%, var(--card, #fff));
    color: var(--muted, #64748b);
}
.invoice-types-notes {
    display: block;
    max-width: 360px;
    overflow: hidden;
    color: var(--muted, #64748b);
    text-overflow: ellipsis;
    white-space: nowrap;
}
.invoice-types-edit-link {
    min-height: 30px;
    padding: 5px 10px;
    border-color: color-mix(in srgb, var(--brand, #714b67) 38%, var(--border, #e5e7eb));
    background: color-mix(in srgb, var(--brand, #714b67) 8%, var(--card, #fff));
    color: var(--brand, #714b67);
}
.invoice-types-readonly {
    color: var(--muted, #64748b);
    font-size: 12px;
}
.invoice-types-edit-shell {
    margin: 18px 22px 34px;
}
.invoice-types-editor-header {
    align-items: center;
}
.invoice-types-large-icon {
    display: grid;
    flex: 0 0 auto;
    place-items: center;
    width: 62px;
    height: 62px;
    border: 1px solid color-mix(in srgb, var(--brand, #714b67) 22%, var(--border, #e5e7eb));
    border-radius: 15px;
    background: color-mix(in srgb, var(--brand, #714b67) 10%, var(--card, #fff));
    font-size: 30px;
}
.invoice-types-editor-grid {
    align-items: stretch;
}
.invoice-types-editor-grid .odoo-field-group {
    min-width: 0;
}
.invoice-types-editor-grid .odoo-row small {
    display: block;
    margin-top: 5px;
    color: var(--muted, #64748b);
    line-height: 1.45;
}
.invoice-types-tax-input-wrap {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 42px;
    align-items: stretch;
}
.invoice-types-tax-input-wrap .odoo-input {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}
.invoice-types-tax-input-wrap > span {
    display: grid;
    place-items: center;
    border: 1px solid var(--border, #e5e7eb);
    border-left: 0;
    border-radius: 0 8px 8px 0;
    background: color-mix(in srgb, var(--soft, #f7f4f6) 84%, var(--card, #fff));
    color: var(--muted, #64748b);
    font-weight: 800;
}
.invoice-types-notes-row textarea {
    width: 100%;
    resize: vertical;
}
.invoice-types-rule-card {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin: 0 20px 20px;
    padding: 13px 15px;
    border: 1px solid color-mix(in srgb, var(--brand, #714b67) 22%, var(--border, #e5e7eb));
    border-radius: 10px;
    background: color-mix(in srgb, var(--brand, #714b67) 6%, var(--card, #fff));
    color: var(--text, #1f2937);
    font-size: 13px;
    line-height: 1.5;
}
.invoice-types-rule-card strong { color: var(--brand, #714b67); white-space: nowrap; }
.invoice-types-switch-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-top: 18px;
    padding: 14px;
    border: 1px solid var(--border, #e5e7eb);
    border-radius: 10px;
    background: color-mix(in srgb, var(--soft, #f7f4f6) 72%, var(--card, #fff));
}
.invoice-types-switch-row > div {
    display: grid;
    gap: 4px;
}
.invoice-types-switch-row > div span {
    color: var(--muted, #64748b);
    font-size: 12px;
}
.invoice-types-switch {
    position: relative;
    flex: 0 0 auto;
    width: 48px;
    height: 27px;
}
.invoice-types-switch input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
}
.invoice-types-switch span {
    position: absolute;
    inset: 0;
    border: 1px solid var(--border, #e5e7eb);
    border-radius: 999px;
    background: color-mix(in srgb, var(--muted, #64748b) 25%, var(--card, #fff));
    cursor: pointer;
    transition: .18s ease;
}
.invoice-types-switch span::after {
    content: "";
    position: absolute;
    top: 3px;
    left: 3px;
    width: 19px;
    height: 19px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 2px 6px rgba(15, 23, 42, .25);
    transition: .18s ease;
}
.invoice-types-switch input:checked + span {
    border-color: var(--brand, #714b67);
    background: var(--brand, #714b67);
}
.invoice-types-switch input:checked + span::after { transform: translateX(21px); }
.invoice-types-switch input:focus-visible + span {
    outline: 3px solid color-mix(in srgb, var(--brand, #714b67) 20%, transparent);
    outline-offset: 2px;
}
.invoice-types-voucher-effects ul {
    display: grid;
    gap: 9px;
    margin: 0;
    padding-left: 19px;
    color: var(--muted, #64748b);
    line-height: 1.45;
}
.invoice-types-voucher-effects b { color: var(--text, #1f2937); }
@media (max-width: 1180px) {
    .invoice-types-master-grid {
        grid-template-columns: 1fr;
    }
    .invoice-types-master-grid.voucher-first #voucherTypePanel { order: -1; }
}
@media (max-width: 760px) {
    .invoice-types-page { padding: 14px 12px 26px; }
    .invoice-types-commandbar { position: static; align-items: stretch; flex-direction: column; }
    .invoice-types-summary-grid { grid-template-columns: 1fr; }
    .invoice-types-search-form { grid-template-columns: 1fr auto; }
    .invoice-types-search-form a { grid-column: 1 / -1; }
    .invoice-types-edit-shell { margin: 14px 12px 26px; }
    .invoice-types-rule-card { flex-direction: column; }
    .invoice-types-rule-card strong { white-space: normal; }
}


/* =========================================================
   GST Clauses master (GSTfrm / CreateNewGSTfrm conversion)
   ========================================================= */
.gst-clauses-page {
    padding: 18px 22px 34px;
    display: grid;
    gap: 18px;
}
.gst-clauses-commandbar {
    position: sticky;
    top: 0;
    z-index: 12;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 12px;
    border: 1px solid var(--border, #dfe3ea);
    border-radius: 14px;
    background: color-mix(in srgb, var(--surface, #fff) 94%, transparent);
    box-shadow: 0 10px 24px rgba(15, 23, 42, .06);
    backdrop-filter: blur(10px);
}
.gst-clauses-command-actions,
.gst-clauses-row-actions,
.gst-clause-toolbar-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}
.gst-clauses-primary-btn,
.gst-clauses-secondary-btn,
.gst-clauses-close-btn,
.gst-clauses-edit-btn,
.gst-clauses-delete-btn,
.gst-clauses-auto-btn {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border: 1px solid var(--border, #d9dee8);
    border-radius: 9px;
    padding: 8px 13px;
    font: inherit;
    font-weight: 700;
    line-height: 1.1;
    text-decoration: none;
    cursor: pointer;
}
.gst-clauses-primary-btn,
.gst-clauses-save-btn {
    border-color: var(--primary, var(--brand));
    background: var(--primary, var(--brand));
    color: var(--primary-contrast, #fff);
}
.gst-clauses-secondary-btn,
.gst-clauses-auto-btn {
    border-color: color-mix(in srgb, var(--primary, var(--brand)) 35%, var(--border, #d9dee8));
    background: color-mix(in srgb, var(--primary, var(--brand)) 10%, var(--surface, #fff));
    color: var(--primary, var(--brand));
}
.gst-clauses-close-btn {
    background: var(--surface-muted, #f4f6f9);
    color: var(--text, #1f2937);
}
.gst-clauses-edit-btn {
    min-height: 32px;
    padding: 6px 11px;
    border-color: color-mix(in srgb, var(--primary, var(--brand)) 35%, var(--border, #d9dee8));
    background: color-mix(in srgb, var(--primary, var(--brand)) 8%, var(--surface, #fff));
    color: var(--primary, var(--brand));
}
.gst-clauses-delete-btn {
    min-height: 32px;
    padding: 6px 10px;
    border-color: color-mix(in srgb, #b42318 40%, var(--border, #d9dee8));
    background: color-mix(in srgb, #b42318 7%, var(--surface, #fff));
    color: #b42318;
}
.gst-clauses-delete-btn:disabled,
.gst-clauses-delete-toolbar:disabled {
    opacity: .5;
    cursor: not-allowed;
}
.gst-clauses-primary-btn:hover,
.gst-clauses-save-btn:hover {
    filter: brightness(.96);
}
.gst-clauses-secondary-btn:hover,
.gst-clauses-auto-btn:hover,
.gst-clauses-edit-btn:hover {
    background: color-mix(in srgb, var(--primary, var(--brand)) 16%, var(--surface, #fff));
}
.gst-clauses-search-form {
    min-width: min(620px, 55vw);
    display: grid;
    grid-template-columns: minmax(210px, 1fr) auto auto auto;
    align-items: center;
    gap: 8px;
}
.gst-clauses-search-form input,
.gst-clauses-search-form select {
    width: 100%;
    min-height: 38px;
    border: 1px solid var(--border, #d9dee8);
    border-radius: 9px;
    padding: 8px 11px;
    background: var(--surface, #fff);
    color: var(--text, #1f2937);
}
.gst-clauses-search-form button,
.gst-clauses-search-form a {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--border, #d9dee8);
    border-radius: 9px;
    padding: 8px 12px;
    background: var(--surface-muted, #f4f6f9);
    color: var(--text, #1f2937);
    font-weight: 700;
    text-decoration: none;
}
.gst-clauses-summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}
.gst-clauses-summary-card {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px;
    border: 1px solid var(--border, #dfe3ea);
    border-radius: 14px;
    background: var(--surface, #fff);
    box-shadow: 0 8px 22px rgba(15, 23, 42, .045);
}
.gst-clauses-summary-card > span {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 12px;
    background: color-mix(in srgb, var(--primary, var(--brand)) 12%, var(--surface, #fff));
    font-size: 20px;
}
.gst-clauses-summary-card div {
    min-width: 0;
    display: grid;
}
.gst-clauses-summary-card strong {
    font-size: 1.45rem;
    color: var(--text, #1f2937);
}
.gst-clauses-summary-card small {
    color: var(--muted, #6b7280);
}
.gst-clauses-list-card {
    border: 1px solid var(--border, #dfe3ea);
    border-radius: 16px;
    background: var(--surface, #fff);
    box-shadow: 0 10px 28px rgba(15, 23, 42, .05);
}
.gst-clauses-list-heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 16px;
    padding: 18px 20px 14px;
    border-bottom: 1px solid var(--border, #e4e7ec);
}
.gst-clauses-list-heading h2,
.gst-section-heading h2,
.gst-ledger-card-heading h3 {
    margin: 2px 0 0;
    color: var(--text, #1f2937);
}
.gst-clauses-kicker {
    color: var(--primary, var(--brand));
    font-size: .75rem;
    font-weight: 800;
    letter-spacing: .09em;
    text-transform: uppercase;
}
.gst-clauses-table {
    width: 100%;
    table-layout: fixed;
    border-collapse: collapse;
}
.gst-clauses-table th,
.gst-clauses-table td {
    padding: 12px 10px;
    border-bottom: 1px solid var(--border, #e7eaf0);
    color: var(--text, #1f2937);
    text-align: left;
    vertical-align: middle;
    overflow-wrap: anywhere;
}
.gst-clauses-table th {
    background: var(--surface-muted, #f6f7fa);
    color: var(--muted, #667085);
    font-size: .78rem;
    letter-spacing: .035em;
    text-transform: uppercase;
}
.gst-clauses-table tr:last-child td { border-bottom: 0; }
.gst-col-name { width: 18%; }
.gst-col-ledgers { width: 25%; }
.gst-col-actions { width: 150px; }
.gst-col-name strong {
    display: block;
    margin-bottom: 5px;
}
.gst-col-ledgers span {
    display: block;
    max-width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: var(--muted, #667085);
    font-size: .82rem;
}
.gst-clauses-status,
.gst-rate-pill,
.gst-usage-pill {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    padding: 4px 8px;
    font-size: .76rem;
    font-weight: 800;
}
.gst-clauses-status.active,
.gst-usage-pill.free {
    background: color-mix(in srgb, #168a45 12%, var(--surface, #fff));
    color: #13753b;
}
.gst-clauses-status.inactive,
.gst-usage-pill.used {
    background: color-mix(in srgb, #b54708 12%, var(--surface, #fff));
    color: #9a3e07;
}
.gst-rate-pill {
    min-width: 58px;
    justify-content: center;
    background: color-mix(in srgb, var(--primary, var(--brand)) 10%, var(--surface, #fff));
    color: var(--primary, var(--brand));
}
.gst-rate-pill.igst {
    background: color-mix(in srgb, #0f6cbd 12%, var(--surface, #fff));
    color: #0f5f9f;
}
.gst-clauses-row-actions { justify-content: flex-start; }
.gst-clauses-readonly {
    color: var(--muted, #667085);
    font-size: .82rem;
}
.gst-clauses-pager {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 14px;
    border-top: 1px solid var(--border, #e4e7ec);
}
.gst-clauses-pager a {
    min-height: 36px;
    display: inline-flex;
    align-items: center;
    border: 1px solid var(--border, #d9dee8);
    border-radius: 8px;
    padding: 7px 12px;
    color: var(--text, #1f2937);
    text-decoration: none;
}
.gst-clauses-pager a.disabled {
    opacity: .45;
    pointer-events: none;
}
.gst-clause-edit-shell {
    margin: 18px 22px 34px;
}
.gst-clause-editor-header {
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 24px;
    border-bottom: 1px solid var(--border, #e5e7eb);
}
.gst-clause-large-icon {
    width: 64px;
    height: 64px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 18px;
    background: color-mix(in srgb, var(--primary, var(--brand)) 14%, var(--surface, #fff));
    color: var(--primary, var(--brand));
    font-size: 2rem;
    font-weight: 900;
}
.gst-rate-section {
    padding: 22px 24px;
    border-bottom: 1px solid var(--border, #e5e7eb);
}
.gst-section-heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 16px;
}
.gst-section-heading > span {
    max-width: 520px;
    color: var(--muted, #667085);
    text-align: right;
}
.gst-rate-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(150px, 1fr)) minmax(220px, 1.15fr);
    gap: 12px;
}
.gst-rate-field,
.gst-rate-equation {
    min-width: 0;
    display: grid;
    gap: 7px;
    padding: 15px;
    border: 1px solid var(--border, #dfe3ea);
    border-radius: 13px;
    background: var(--surface-muted, #f8f9fb);
}
.gst-rate-field > span:first-child,
.gst-rate-equation > span {
    color: var(--muted, #667085);
    font-size: .77rem;
    font-weight: 800;
    letter-spacing: .04em;
    text-transform: uppercase;
}
.gst-rate-field > div {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 8px;
}
.gst-rate-field input {
    min-width: 0;
    width: 100%;
    border: 0;
    border-bottom: 2px solid var(--border-strong, #c9ced8);
    padding: 7px 2px;
    background: transparent;
    color: var(--text, #1f2937);
    font-size: 1.5rem;
    font-weight: 800;
    outline: 0;
}
.gst-rate-field input:focus { border-bottom-color: var(--primary, var(--brand)); }
.gst-rate-field small,
.gst-rate-equation small {
    color: var(--muted, #667085);
}
.gst-rate-field.igst-field {
    border-color: color-mix(in srgb, #0f6cbd 35%, var(--border, #dfe3ea));
    background: color-mix(in srgb, #0f6cbd 6%, var(--surface, #fff));
}
.gst-rate-equation {
    align-content: center;
    background: color-mix(in srgb, var(--primary, var(--brand)) 6%, var(--surface, #fff));
}
.gst-rate-equation strong { color: var(--text, #1f2937); font-size: 1rem; }
.gst-rate-equation small.balanced { color: #13753b; font-weight: 700; }
.gst-rate-equation small.unbalanced { color: #b42318; font-weight: 700; }
.gst-rate-warning {
    margin-top: 12px;
    padding: 11px 13px;
    border: 1px solid color-mix(in srgb, #b54708 35%, var(--border, #dfe3ea));
    border-radius: 10px;
    background: color-mix(in srgb, #b54708 8%, var(--surface, #fff));
    color: #8a3506;
    font-weight: 700;
}
.gst-ledger-sections {
    display: grid;
    grid-template-columns: 1.4fr 1fr 1fr;
    gap: 14px;
    padding: 22px 24px;
}
.gst-ledger-card {
    min-width: 0;
    border: 1px solid var(--border, #dfe3ea);
    border-radius: 14px;
    background: var(--surface, #fff);
}
.gst-ledger-card-heading {
    display: flex;
    align-items: center;
    gap: 11px;
    padding: 14px 15px;
    border-bottom: 1px solid var(--border, #e5e7eb);
    background: color-mix(in srgb, var(--primary, var(--brand)) 6%, var(--surface, #fff));
}
.gst-ledger-card-heading > span {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 10px;
    background: var(--primary, var(--brand));
    color: var(--primary-contrast, #fff);
    font-size: .78rem;
    font-weight: 900;
}
.gst-ledger-card-heading.purchase {
    background: color-mix(in srgb, #b54708 6%, var(--surface, #fff));
}
.gst-ledger-card-heading.purchase > span { background: #b54708; }
.gst-ledger-card-heading.sales {
    background: color-mix(in srgb, #168a45 6%, var(--surface, #fff));
}
.gst-ledger-card-heading.sales > span { background: #168a45; }
.gst-ledger-card-heading p {
    margin: 2px 0 0;
    color: var(--muted, #667085);
    font-size: .8rem;
}
.gst-ledger-grid {
    display: grid;
    gap: 12px;
    padding: 15px;
}
.gst-ledger-grid .odoo-row {
    display: grid;
    gap: 6px;
}
.gst-ledger-grid .odoo-row label {
    color: var(--muted, #667085);
    font-size: .8rem;
    font-weight: 700;
}
.gst-ledger-grid .odoo-input {
    width: 100%;
    min-width: 0;
}
.gst-clause-rule-card {
    display: flex;
    align-items: center;
    gap: 16px;
    margin: 0 24px 24px;
    padding: 14px 16px;
    border: 1px solid color-mix(in srgb, var(--primary, var(--brand)) 28%, var(--border, #dfe3ea));
    border-radius: 12px;
    background: color-mix(in srgb, var(--primary, var(--brand)) 6%, var(--surface, #fff));
    color: var(--muted, #667085);
}
.gst-clause-rule-card strong {
    color: var(--primary, var(--brand));
    white-space: nowrap;
}
@media (max-width: 1180px) {
    .gst-clauses-commandbar { position: static; align-items: stretch; flex-direction: column; }
    .gst-clauses-search-form { min-width: 0; width: 100%; }
    .gst-clauses-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .gst-ledger-sections { grid-template-columns: 1fr 1fr; }
    .gst-ledger-card:first-child { grid-column: 1 / -1; }
}
@media (max-width: 920px) {
    .gst-col-ledgers { display: none; }
    .gst-col-name { width: 25%; }
    .gst-col-actions { width: 142px; }
    .gst-rate-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .gst-rate-equation { grid-column: 1 / -1; }
}
@media (max-width: 720px) {
    .gst-clauses-page { padding: 12px 10px 24px; }
    .gst-clause-edit-shell { margin: 12px 10px 24px; }
    .gst-clauses-search-form { grid-template-columns: 1fr auto; }
    .gst-clauses-search-form input { grid-column: 1 / -1; }
    .gst-clauses-summary-grid { grid-template-columns: 1fr; }
    .gst-clauses-table th:nth-child(4),
    .gst-clauses-table td:nth-child(4),
    .gst-clauses-table th:nth-child(6),
    .gst-clauses-table td:nth-child(6) { display: none; }
    .gst-col-name { width: 34%; }
    .gst-col-actions { width: 118px; }
    .gst-clauses-row-actions { display: grid; }
    .gst-clauses-edit-btn,
    .gst-clauses-delete-btn { width: 100%; }
    .gst-clause-editor-header,
    .gst-rate-section,
    .gst-ledger-sections { padding-left: 14px; padding-right: 14px; }
    .gst-clause-editor-header { align-items: flex-start; }
    .gst-section-heading { align-items: flex-start; flex-direction: column; }
    .gst-section-heading > span { text-align: left; }
    .gst-rate-grid { grid-template-columns: 1fr; }
    .gst-rate-equation { grid-column: auto; }
    .gst-ledger-sections { grid-template-columns: 1fr; }
    .gst-ledger-card:first-child { grid-column: auto; }
    .gst-clause-rule-card { margin: 0 14px 18px; align-items: flex-start; flex-direction: column; }
    .gst-clause-rule-card strong { white-space: normal; }
}

/* CESS Clauses uses the GST master visual language with its four-field desktop data model. */
#cessClauseForm .gst-rate-grid {
    grid-template-columns: minmax(190px, .7fr) minmax(280px, 1.3fr);
}
#cessClauseForm .gst-rate-equation { grid-column: auto; }
.cess-clauses-table .gst-col-name { width: 18%; }
.cess-clauses-table .gst-col-ledgers { width: 24%; }
@media (max-width: 920px) {
    #cessClauseForm .gst-rate-grid { grid-template-columns: minmax(180px, .7fr) minmax(240px, 1.3fr); }
    #cessClauseForm .gst-rate-equation { grid-column: auto; }
}
@media (max-width: 720px) {
    #cessClauseForm .gst-rate-grid { grid-template-columns: 1fr; }
    .cess-clauses-table th:nth-child(6),
    .cess-clauses-table td:nth-child(6) { display: table-cell; }
}

/* Salesmen master converted from SalesPersons.vb / CreateSalesPersons.vb. */
.salesmen-page {
    padding: 18px 24px 32px;
    display: grid;
    gap: 18px;
}
.salesmen-commandbar {
    position: sticky;
    top: 10px;
    z-index: 8;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 12px;
    border: 1px solid var(--border, #dfe3ea);
    border-radius: 14px;
    background: color-mix(in srgb, var(--surface, #fff) 94%, var(--primary, var(--brand)));
    box-shadow: 0 8px 24px rgba(15, 23, 42, .08);
}
.salesmen-command-actions,
.salesmen-row-actions,
.salesman-toolbar-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}
.salesmen-primary-btn,
.salesmen-secondary-btn,
.salesmen-close-btn,
.salesmen-edit-btn,
.salesmen-status-btn,
.salesmen-delete-btn {
    width: auto;
    min-height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 7px 12px;
    border: 1px solid var(--border, #dfe3ea);
    border-radius: 9px;
    background: var(--surface, #fff);
    color: var(--text, #1f2937);
    font: inherit;
    font-size: .82rem;
    font-weight: 750;
    text-decoration: none;
    cursor: pointer;
}
.salesmen-primary-btn,
.salesmen-save-btn {
    border-color: var(--primary, var(--brand));
    background: var(--primary, var(--brand));
    color: var(--primary-contrast, #fff);
}
.salesmen-close-btn { color: var(--muted, #667085); }
.salesmen-search-form {
    min-width: min(620px, 100%);
    display: grid;
    grid-template-columns: minmax(220px, 1fr) auto auto auto;
    align-items: center;
    gap: 8px;
}
.salesmen-search-form input,
.salesmen-search-form select,
.salesmen-search-form button,
.salesmen-search-form a {
    min-height: 36px;
    border: 1px solid var(--border, #dfe3ea);
    border-radius: 9px;
    background: var(--field-bg, var(--surface, #fff));
    color: var(--text, #1f2937);
    padding: 7px 10px;
    font: inherit;
}
.salesmen-search-form button,
.salesmen-search-form a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    text-decoration: none;
    cursor: pointer;
}
.salesmen-summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}
.salesmen-summary-card {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
    padding: 15px 16px;
    border: 1px solid var(--border, #dfe3ea);
    border-radius: 13px;
    background: var(--surface, #fff);
}
.salesmen-summary-card > span {
    width: 40px;
    height: 40px;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    border-radius: 11px;
    background: color-mix(in srgb, var(--primary, var(--brand)) 10%, var(--surface, #fff));
    font-size: 1.05rem;
}
.salesmen-summary-card strong,
.salesmen-summary-card small { display: block; }
.salesmen-summary-card strong { color: var(--text, #1f2937); font-size: 1.25rem; }
.salesmen-summary-card small { color: var(--muted, #667085); }
.salesmen-list-card,
.salesman-edit-shell {
    border: 1px solid var(--border, #dfe3ea);
    border-radius: 15px;
    background: var(--surface, #fff);
    overflow: hidden;
    box-shadow: 0 12px 30px rgba(15, 23, 42, .07);
}
.salesmen-list-heading {
    display: flex;
    justify-content: space-between;
    align-items: end;
    gap: 16px;
    padding: 17px 18px;
    border-bottom: 1px solid var(--border, #dfe3ea);
}
.salesmen-list-heading h2 { margin: 2px 0 0; font-size: 1.1rem; }
.salesmen-kicker {
    color: var(--primary, var(--brand));
    font-size: .68rem;
    font-weight: 900;
    letter-spacing: .13em;
}
.salesmen-table-wrap { width: 100%; overflow-x: auto; }
.salesmen-table { width: 100%; border-collapse: collapse; min-width: 960px; }
.salesmen-table th,
.salesmen-table td {
    padding: 12px 13px;
    border-bottom: 1px solid var(--border, #e5e7eb);
    text-align: left;
    vertical-align: middle;
}
.salesmen-table th {
    background: color-mix(in srgb, var(--primary, var(--brand)) 6%, var(--surface, #fff));
    color: var(--muted, #667085);
    font-size: .72rem;
    font-weight: 850;
    letter-spacing: .04em;
    text-transform: uppercase;
}
.salesmen-table td { color: var(--text, #1f2937); font-size: .86rem; }
.salesmen-col-name { width: 18%; }
.salesmen-col-name strong,
.salesmen-col-name span,
.salesmen-main-value,
.salesmen-table td small { display: block; }
.salesmen-col-name span,
.salesmen-table td small { margin-top: 3px; color: var(--muted, #667085); font-size: .73rem; }
.salesmen-col-actions { width: 255px; }
.salesman-inactive-row { opacity: .78; }
.salesmen-status-pill,
.salesmen-usage-pill,
.salesmen-commission-pill {
    display: inline-flex;
    align-items: center;
    min-height: 27px;
    padding: 4px 9px;
    border-radius: 999px;
    font-size: .72rem;
    font-weight: 800;
    white-space: nowrap;
}
.salesmen-status-pill.active,
.salesmen-usage-pill.free,
.salesmen-status-btn.activate {
    background: color-mix(in srgb, #168a45 12%, var(--surface, #fff));
    color: #126a37;
    border-color: color-mix(in srgb, #168a45 35%, var(--border, #dfe3ea));
}
.salesmen-status-pill.inactive,
.salesmen-status-btn.deactivate {
    background: color-mix(in srgb, #b54708 10%, var(--surface, #fff));
    color: #93420a;
    border-color: color-mix(in srgb, #b54708 30%, var(--border, #dfe3ea));
}
.salesmen-usage-pill.used {
    background: color-mix(in srgb, var(--primary, var(--brand)) 10%, var(--surface, #fff));
    color: var(--primary, var(--brand));
}
.salesmen-commission-pill {
    background: color-mix(in srgb, #1769aa 9%, var(--surface, #fff));
    color: #175f94;
}
.salesmen-edit-btn { color: var(--primary, var(--brand)); }
.salesmen-delete-btn { color: #b42318; }
.salesmen-delete-btn:disabled,
.salesmen-disabled-action {
    opacity: .46;
    cursor: not-allowed;
}
.salesmen-disabled-action {
    min-height: 34px;
    display: inline-flex;
    align-items: center;
    padding: 7px 12px;
    border: 1px dashed var(--border, #dfe3ea);
    border-radius: 9px;
    color: var(--muted, #667085);
    font-size: .82rem;
    font-weight: 700;
}
.salesmen-pager {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 14px;
}
.salesmen-pager a {
    padding: 7px 12px;
    border: 1px solid var(--border, #dfe3ea);
    border-radius: 8px;
    color: var(--text, #1f2937);
    text-decoration: none;
}
.salesmen-pager a.disabled { opacity: .4; pointer-events: none; }
.salesman-edit-form { padding: 0; }
.salesman-edit-shell { margin: 18px 24px 30px; }
.salesman-editor-header {
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 24px;
    border-bottom: 1px solid var(--border, #dfe3ea);
}
.salesman-avatar {
    width: 72px;
    height: 72px;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    border-radius: 22px;
    background: color-mix(in srgb, var(--primary, var(--brand)) 13%, var(--surface, #fff));
    color: var(--primary, var(--brand));
    font-size: 1.45rem;
    font-weight: 900;
}
.salesman-editor-header .odoo-title-area { flex: 1; min-width: 0; }
.salesman-editor-header small { display: block; margin-top: 6px; color: var(--muted, #667085); }
.salesman-form-grid {
    display: grid;
    grid-template-columns: 1.15fr .85fr;
    gap: 16px;
    padding: 20px 24px;
}
.salesman-form-card {
    border: 1px solid var(--border, #dfe3ea);
    border-radius: 13px;
    overflow: hidden;
    background: var(--surface, #fff);
}
.salesman-form-card.identity-card { grid-row: span 2; }
.salesman-card-heading {
    display: flex;
    align-items: center;
    gap: 11px;
    padding: 13px 15px;
    border-bottom: 1px solid var(--border, #dfe3ea);
    background: color-mix(in srgb, var(--primary, var(--brand)) 6%, var(--surface, #fff));
}
.salesman-card-heading > span {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 10px;
    background: var(--primary, var(--brand));
    color: var(--primary-contrast, #fff);
    font-size: .75rem;
    font-weight: 900;
}
.salesman-card-heading h2 { margin: 0; font-size: 1rem; }
.salesman-card-heading p { margin: 2px 0 0; color: var(--muted, #667085); font-size: .76rem; }
.salesman-fields-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 13px;
    padding: 16px;
}
.salesman-fields-grid .odoo-row { display: grid; gap: 6px; }
.salesman-fields-grid .odoo-row.full { grid-column: 1 / -1; }
.salesman-fields-grid label { color: var(--muted, #667085); font-size: .79rem; font-weight: 750; }
.salesman-fields-grid .odoo-input { width: 100%; min-width: 0; }
.salesman-percent-input { position: relative; }
.salesman-percent-input .odoo-input { padding-right: 34px; }
.salesman-percent-input b { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); color: var(--muted, #667085); }
.barcode-input { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; letter-spacing: .04em; }
.salesman-rule-card {
    display: flex;
    align-items: flex-start;
    gap: 15px;
    margin: 0 24px 24px;
    padding: 14px 16px;
    border: 1px solid color-mix(in srgb, var(--primary, var(--brand)) 28%, var(--border, #dfe3ea));
    border-radius: 12px;
    background: color-mix(in srgb, var(--primary, var(--brand)) 6%, var(--surface, #fff));
    color: var(--muted, #667085);
}
.salesman-rule-card strong { color: var(--primary, var(--brand)); white-space: nowrap; }
@media (max-width: 1180px) {
    .salesmen-commandbar { position: static; align-items: stretch; flex-direction: column; }
    .salesmen-search-form { width: 100%; min-width: 0; }
    .salesmen-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
    .salesman-form-grid { grid-template-columns: 1fr; }
    .salesman-form-card.identity-card { grid-row: auto; }
}
@media (max-width: 720px) {
    .salesmen-page { padding: 12px 10px 24px; }
    .salesman-edit-shell { margin: 12px 10px 24px; }
    .salesmen-search-form { grid-template-columns: 1fr auto; }
    .salesmen-search-form input { grid-column: 1 / -1; }
    .salesmen-summary-grid { grid-template-columns: 1fr; }
    .salesman-editor-header { align-items: flex-start; padding: 18px 14px; }
    .salesman-avatar { width: 56px; height: 56px; border-radius: 17px; }
    .salesman-form-grid { padding: 14px; }
    .salesman-fields-grid { grid-template-columns: 1fr; }
    .salesman-fields-grid .odoo-row.full { grid-column: auto; }
    .salesman-rule-card { margin: 0 14px 18px; flex-direction: column; }
    .salesman-rule-card strong { white-space: normal; }
}
@media print {
    .salesmen-page { padding: 0; }
    .salesmen-summary-grid { grid-template-columns: repeat(4, 1fr); }
    .salesmen-list-card { border: 0; box-shadow: none; }
    .salesmen-table { min-width: 0; font-size: 9pt; }
    .salesmen-table th,
    .salesmen-table td { padding: 6px; }
    .no-print,
    .topbar .user-panel { display: none !important; }
}

/* Maintain Vehicles - VehicleFrm.vb / CreateNewVehicle.vb conversion */
.vehicles-page { padding: 18px 24px 32px; }
.vehicles-commandbar {
    position: sticky;
    top: 0;
    z-index: 12;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 12px 14px;
    margin-bottom: 16px;
    border: 1px solid var(--border, #dfe3ea);
    border-radius: 13px;
    background: color-mix(in srgb, var(--surface, #fff) 95%, transparent);
    box-shadow: 0 8px 24px rgba(16, 24, 40, .06);
    backdrop-filter: blur(12px);
}
.vehicles-command-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.vehicles-primary-btn,
.vehicles-secondary-btn,
.vehicles-close-btn,
.vehicles-search-form button,
.vehicles-search-form a,
.vehicles-edit-btn,
.vehicles-status-btn,
.vehicles-delete-btn,
.vehicle-file-button,
.vehicle-add-attachment button,
.vehicle-file-actions a,
.vehicle-file-actions button {
    min-height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 9px;
    border: 1px solid var(--border, #dfe3ea);
    padding: 7px 12px;
    font: inherit;
    font-size: .82rem;
    font-weight: 760;
    text-decoration: none;
    cursor: pointer;
}
.vehicles-primary-btn { border-color: var(--primary, var(--brand)); background: var(--primary, var(--brand)); color: var(--primary-contrast, #fff); }
.vehicles-secondary-btn, .vehicles-close-btn, .vehicles-search-form a { background: var(--surface, #fff); color: var(--text, #202734); }
.vehicles-search-form { display: grid; grid-template-columns: minmax(230px, 1fr) 150px 105px auto auto auto; align-items: center; gap: 8px; min-width: min(100%, 720px); }
.vehicles-search-form input[type="text"],
.vehicles-search-form > input,
.vehicles-search-form select {
    width: 100%; min-height: 38px; border: 1px solid var(--border, #dfe3ea); border-radius: 9px; padding: 7px 10px; background: var(--surface, #fff); color: var(--text, #202734);
}
.vehicles-show-all { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; color: var(--muted, #667085); font-size: .79rem; }
.vehicles-search-form button { border-color: var(--primary, var(--brand)); background: var(--primary, var(--brand)); color: var(--primary-contrast, #fff); }
.vehicles-summary-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; margin-bottom: 16px; }
.vehicles-summary-card { display: flex; align-items: center; gap: 12px; min-height: 86px; padding: 15px; border: 1px solid var(--border, #dfe3ea); border-radius: 13px; background: var(--surface, #fff); }
.vehicles-summary-card > span { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 12px; background: color-mix(in srgb, var(--primary, var(--brand)) 10%, var(--surface, #fff)); }
.vehicles-summary-card strong { display: block; font-size: 1.35rem; line-height: 1; }
.vehicles-summary-card small { display: block; margin-top: 5px; color: var(--muted, #667085); }
.vehicles-summary-card.warning { border-color: color-mix(in srgb, #d97706 38%, var(--border, #dfe3ea)); }
.vehicles-list-card, .vehicle-related-shell { border: 1px solid var(--border, #dfe3ea); border-radius: 14px; background: var(--surface, #fff); overflow: hidden; }
.vehicles-list-heading, .vehicle-related-heading { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; padding: 16px 18px; border-bottom: 1px solid var(--border, #dfe3ea); }
.vehicles-list-heading h2, .vehicle-related-heading h2 { margin: 2px 0 0; font-size: 1.08rem; }
.vehicles-kicker { color: var(--primary, var(--brand)); font-size: .7rem; font-weight: 900; letter-spacing: .13em; }
.vehicles-table-wrap, .vehicle-history-table-wrap { overflow-x: auto; }
.vehicles-table { width: 100%; min-width: 1060px; border-collapse: collapse; }
.vehicles-table th, .vehicles-table td { padding: 11px 12px; border-bottom: 1px solid var(--border, #dfe3ea); text-align: left; vertical-align: middle; }
.vehicles-table th { color: var(--muted, #667085); font-size: .72rem; text-transform: uppercase; letter-spacing: .05em; background: color-mix(in srgb, var(--surface, #fff) 94%, var(--primary, var(--brand))); }
.vehicles-table td strong, .vehicles-table td small { display: block; }
.vehicles-table td small { margin-top: 3px; color: var(--muted, #667085); }
.vehicle-inactive-row { background: color-mix(in srgb, var(--surface, #fff) 93%, #98a2b3); }
.vehicle-deleted-row { opacity: .68; background: color-mix(in srgb, var(--surface, #fff) 91%, #f04438); }
.vehicle-expiry-pill, .vehicle-status-pill { display: inline-flex; padding: 4px 8px; border-radius: 999px; font-size: .72rem; font-weight: 850; }
.vehicle-expiry-pill.valid { color: #027a48; background: #ecfdf3; }
.vehicle-expiry-pill.soon { color: #b54708; background: #fffaeb; }
.vehicle-expiry-pill.expired { color: #b42318; background: #fef3f2; }
.vehicle-status-pill.active { color: #027a48; background: #ecfdf3; }
.vehicle-status-pill.inactive { color: #475467; background: #f2f4f7; }
.vehicle-status-pill.deleted { color: #b42318; background: #fef3f2; }
.vehicles-row-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
.vehicles-row-actions form { margin: 0; }
.vehicles-edit-btn { color: var(--primary, var(--brand)); background: color-mix(in srgb, var(--primary, var(--brand)) 7%, var(--surface, #fff)); }
.vehicles-status-btn.activate { color: #027a48; background: #ecfdf3; }
.vehicles-status-btn.deactivate { color: #b54708; background: #fffaeb; }
.vehicles-delete-btn { color: #b42318; background: #fef3f2; }
.vehicles-disabled-action { display: inline-flex; padding: 8px 11px; color: var(--muted, #667085); border: 1px dashed var(--border, #dfe3ea); border-radius: 9px; font-size: .8rem; }
.vehicles-pager { display: flex; align-items: center; justify-content: flex-end; gap: 10px; padding: 13px 16px; }
.vehicles-pager a { border: 1px solid var(--border, #dfe3ea); border-radius: 8px; padding: 7px 11px; color: var(--text, #202734); text-decoration: none; }
.vehicles-pager a.disabled { opacity: .4; pointer-events: none; }
.vehicle-edit-form { padding: 0; }
.vehicle-edit-shell { margin: 18px 24px 22px; }
.vehicle-editor-header { display: flex; align-items: center; gap: 20px; padding: 22px 24px; border-bottom: 1px solid var(--border, #dfe3ea); }
.vehicle-photo-card { width: 142px; flex: 0 0 142px; display: grid; gap: 8px; }
.vehicle-photo-preview { width: 142px; height: 108px; display: grid; place-items: center; overflow: hidden; border: 1px solid var(--border, #dfe3ea); border-radius: 14px; background: color-mix(in srgb, var(--primary, var(--brand)) 6%, var(--surface, #fff)); font-size: 2.4rem; }
.vehicle-photo-preview img { width: 100%; height: 100%; object-fit: cover; }
.vehicle-file-input { position: absolute; width: 1px; height: 1px; opacity: 0; overflow: hidden; }
.vehicle-file-button { color: var(--primary, var(--brand)); background: var(--surface, #fff); }
.vehicle-remove-check { display: flex; align-items: center; gap: 6px; color: var(--muted, #667085); font-size: .72rem; }
.vehicle-editor-header .odoo-title-area { flex: 1; min-width: 0; }
.vehicle-title-meta { display: flex; flex-wrap: wrap; gap: 8px 18px; margin-top: 8px; color: var(--muted, #667085); font-size: .76rem; }
.vehicle-tabs { display: flex; gap: 4px; padding: 10px 18px 0; border-bottom: 1px solid var(--border, #dfe3ea); }
.vehicle-tabs button { border: 0; border-bottom: 3px solid transparent; padding: 10px 14px; background: transparent; color: var(--muted, #667085); font: inherit; font-size: .82rem; font-weight: 800; cursor: pointer; }
.vehicle-tabs button.active { border-bottom-color: var(--primary, var(--brand)); color: var(--primary, var(--brand)); }
.vehicle-tab-panel { display: none; }
.vehicle-tab-panel.active { display: block; }
.vehicle-form-grid, .vehicle-insurance-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; padding: 18px 22px; }
.vehicle-insurance-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.vehicle-contact-card { grid-column: 1 / -1; }
.vehicle-form-card { border: 1px solid var(--border, #dfe3ea); border-radius: 13px; overflow: hidden; background: var(--surface, #fff); }
.vehicle-card-heading { display: flex; align-items: center; gap: 11px; padding: 13px 15px; border-bottom: 1px solid var(--border, #dfe3ea); background: color-mix(in srgb, var(--primary, var(--brand)) 6%, var(--surface, #fff)); }
.vehicle-card-heading > span { width: 34px; height: 34px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 10px; background: var(--primary, var(--brand)); color: var(--primary-contrast, #fff); font-size: .75rem; font-weight: 900; }
.vehicle-card-heading h2 { margin: 0; font-size: 1rem; }
.vehicle-card-heading p { margin: 2px 0 0; color: var(--muted, #667085); font-size: .75rem; }
.vehicle-fields-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; padding: 16px; }
.vehicle-fields-grid .odoo-row { display: grid; gap: 6px; }
.vehicle-fields-grid .odoo-row.full { grid-column: 1 / -1; }
.vehicle-fields-grid label { color: var(--muted, #667085); font-size: .78rem; font-weight: 760; }
.vehicle-fields-grid .odoo-input { width: 100%; min-width: 0; }
.vehicle-check-row label { display: flex; align-items: center; gap: 8px; }
.vehicle-legacy-upload-grid { display: grid; gap: 10px; padding: 16px; }
.vehicle-legacy-upload { display: grid; grid-template-columns: minmax(180px, 1fr) minmax(220px, 1.4fr) auto; align-items: center; gap: 10px; padding: 11px; border: 1px solid var(--border, #dfe3ea); border-radius: 10px; }
.vehicle-legacy-upload small { display: block; color: var(--muted, #667085); margin-top: 2px; }
.vehicle-legacy-upload label { color: var(--muted, #667085); font-size: .76rem; white-space: nowrap; }
.vehicle-rule-card { display: flex; align-items: flex-start; gap: 15px; margin: 0 22px 20px; padding: 14px 16px; border: 1px solid color-mix(in srgb, var(--primary, var(--brand)) 28%, var(--border, #dfe3ea)); border-radius: 12px; background: color-mix(in srgb, var(--primary, var(--brand)) 6%, var(--surface, #fff)); color: var(--muted, #667085); }
.vehicle-rule-card strong { color: var(--primary, var(--brand)); white-space: nowrap; }
.vehicle-related-shell { margin: 0 24px 32px; }
.vehicle-related-card { margin: 16px; border: 1px solid var(--border, #dfe3ea); border-radius: 12px; overflow: hidden; background: var(--surface, #fff); }
.vehicle-related-card-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 13px 15px; border-bottom: 1px solid var(--border, #dfe3ea); background: color-mix(in srgb, var(--primary, var(--brand)) 4%, var(--surface, #fff)); }
.vehicle-related-card-head h3 { margin: 0; font-size: .95rem; }
.vehicle-related-card-head p { margin: 3px 0 0; color: var(--muted, #667085); font-size: .74rem; }
.vehicle-related-card-head > span { min-width: 30px; height: 30px; display: grid; place-items: center; border-radius: 999px; background: color-mix(in srgb, var(--primary, var(--brand)) 10%, var(--surface, #fff)); color: var(--primary, var(--brand)); font-size: .75rem; font-weight: 900; }
.vehicle-add-attachment { display: flex; align-items: center; gap: 9px; padding: 12px 15px; border-bottom: 1px solid var(--border, #dfe3ea); }
.vehicle-add-attachment input { flex: 1; min-width: 0; }
.vehicle-add-attachment button { color: var(--primary-contrast, #fff); border-color: var(--primary, var(--brand)); background: var(--primary, var(--brand)); }
.vehicle-file-list { display: grid; }
.vehicle-file-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 11px 15px; border-bottom: 1px solid var(--border, #dfe3ea); }
.vehicle-file-row:last-child { border-bottom: 0; }
.vehicle-file-row small { display: block; margin-top: 2px; color: var(--muted, #667085); }
.vehicle-file-actions { display: flex; gap: 7px; }
.vehicle-file-actions form { margin: 0; }
.vehicle-file-actions a { color: var(--primary, var(--brand)); background: var(--surface, #fff); }
.vehicle-file-actions button { color: #b42318; background: #fef3f2; }
.empty-related { padding: 15px; margin: 0; color: var(--muted, #667085); }
.vehicle-history-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.vehicle-history-table { width: 100%; min-width: 520px; border-collapse: collapse; }
.vehicle-history-table th, .vehicle-history-table td { padding: 9px 10px; border-bottom: 1px solid var(--border, #dfe3ea); text-align: left; vertical-align: top; font-size: .78rem; }
.vehicle-history-table th { color: var(--muted, #667085); background: color-mix(in srgb, var(--surface, #fff) 95%, var(--primary, var(--brand))); }
.vehicle-readonly-note { margin: 0 16px 18px; padding: 11px 13px; border-radius: 10px; background: #fffaeb; color: #7a2e0e; font-size: .78rem; }
@media (max-width: 1220px) {
    .vehicles-commandbar { position: static; align-items: stretch; flex-direction: column; }
    .vehicles-search-form { min-width: 0; width: 100%; }
    .vehicles-summary-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .vehicle-insurance-grid { grid-template-columns: 1fr; }
}
@media (max-width: 900px) {
    .vehicle-form-grid, .vehicle-history-grid { grid-template-columns: 1fr; }
    .vehicle-contact-card { grid-column: auto; }
    .vehicle-legacy-upload { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
    .vehicles-page { padding: 12px 10px 24px; }
    .vehicle-edit-shell, .vehicle-related-shell { margin: 12px 10px 24px; }
    .vehicles-search-form { grid-template-columns: 1fr 1fr; }
    .vehicles-search-form > input { grid-column: 1 / -1; }
    .vehicles-summary-grid { grid-template-columns: 1fr; }
    .vehicle-editor-header { align-items: flex-start; flex-direction: column; padding: 17px 14px; }
    .vehicle-photo-card { width: 100%; grid-template-columns: 108px 1fr; align-items: center; }
    .vehicle-photo-preview { width: 108px; height: 86px; grid-row: span 2; }
    .vehicle-tabs { overflow-x: auto; padding-left: 8px; }
    .vehicle-tabs button { white-space: nowrap; }
    .vehicle-form-grid, .vehicle-insurance-grid { padding: 12px; }
    .vehicle-fields-grid { grid-template-columns: 1fr; }
    .vehicle-fields-grid .odoo-row.full { grid-column: auto; }
    .vehicle-rule-card { margin: 0 12px 16px; flex-direction: column; }
    .vehicle-rule-card strong { white-space: normal; }
    .vehicle-related-heading { align-items: flex-start; flex-direction: column; }
    .vehicle-file-row, .vehicle-add-attachment { align-items: flex-start; flex-direction: column; }
}
@media print {
    .vehicles-page { padding: 0; }
    .vehicles-summary-grid { grid-template-columns: repeat(5, 1fr); }
    .vehicles-list-card { border: 0; box-shadow: none; }
    .vehicles-table { min-width: 0; font-size: 8.5pt; }
    .vehicles-table th, .vehicles-table td { padding: 5px; }
    .no-print, .topbar .user-panel { display: none !important; }
}

/* Masters / Work Periods */
.work-periods-page { padding: 18px 24px 34px; }
.work-periods-control-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(380px, .85fr); gap: 16px; margin-bottom: 16px; }
.work-period-current-card, .work-period-action-card, .work-periods-list-card { border: 1px solid var(--border, #dfe3ea); border-radius: 15px; background: var(--surface, #fff); box-shadow: 0 8px 25px rgba(16, 24, 40, .045); }
.work-period-current-card { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 16px; padding: 20px; overflow: hidden; position: relative; }
.work-period-current-card::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 5px; background: #98a2b3; }
.work-period-current-card.open::before { background: #12b76a; }
.work-period-state-icon { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 14px; background: #f2f4f7; color: #667085; font-size: 1rem; font-weight: 900; }
.work-period-current-card.open .work-period-state-icon { color: #027a48; background: #ecfdf3; }
.work-period-state-copy h2 { margin: 3px 0 4px; font-size: 1.22rem; }
.work-period-state-copy p { margin: 0; color: var(--muted, #667085); font-size: .82rem; }
.work-period-eyebrow { color: var(--primary, var(--brand)); font-size: .68rem; font-weight: 900; letter-spacing: .1em; }
.work-period-status-badge { display: inline-flex; align-items: center; justify-content: center; min-width: 68px; padding: 6px 10px; border-radius: 999px; font-size: .72rem; font-weight: 850; }
.work-period-status-badge.open { color: #027a48; background: #ecfdf3; }
.work-period-status-badge.closed { color: #475467; background: #f2f4f7; }
.work-period-action-card { padding: 18px; }
.work-period-action-form { display: grid; gap: 9px; }
.work-period-action-form label { color: var(--text, #202734); font-size: .8rem; font-weight: 800; }
.work-period-action-form small { color: var(--muted, #667085); line-height: 1.45; }
.work-period-input-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 9px; }
.work-period-input-row input, .work-periods-search-form input, .work-periods-search-form select { min-width: 0; border: 1px solid var(--border, #dfe3ea); border-radius: 9px; padding: 10px 11px; color: var(--text, #202734); background: var(--surface, #fff); font: inherit; font-size: .82rem; }
.work-period-start-btn, .work-period-end-btn, .work-periods-search-form button { border: 1px solid transparent; border-radius: 9px; padding: 9px 14px; font: inherit; font-size: .8rem; font-weight: 850; cursor: pointer; }
.work-period-start-btn { color: #fff; background: #079455; }
.work-period-end-btn { color: #fff; background: #d92d20; }
.work-periods-summary-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-bottom: 16px; }
.work-periods-summary-grid article { display: flex; align-items: center; gap: 12px; min-height: 76px; padding: 14px 16px; border: 1px solid var(--border, #dfe3ea); border-radius: 13px; background: var(--surface, #fff); }
.work-periods-summary-grid article > span { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 10px; color: var(--primary, var(--brand)); background: color-mix(in srgb, var(--primary, var(--brand)) 8%, var(--surface, #fff)); font-weight: 900; }
.work-periods-summary-grid strong, .work-periods-summary-grid small { display: block; }
.work-periods-summary-grid strong { font-size: 1.05rem; }
.work-periods-summary-grid small { margin-top: 2px; color: var(--muted, #667085); font-size: .72rem; }
.work-periods-list-card { overflow: hidden; }
.work-periods-list-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 16px 18px; border-bottom: 1px solid var(--border, #dfe3ea); }
.work-periods-list-heading h2 { margin: 3px 0 0; font-size: 1.05rem; }
.work-periods-search-form { display: grid; grid-template-columns: minmax(220px, 1fr) auto auto auto; gap: 7px; align-items: center; }
.work-periods-search-form button { color: var(--primary-contrast, #fff); background: var(--primary, var(--brand)); }
.work-periods-search-form a { color: var(--primary, var(--brand)); font-size: .78rem; font-weight: 750; text-decoration: none; }
.work-periods-table-wrap { overflow-x: auto; }
.work-periods-table { width: 100%; min-width: 880px; border-collapse: collapse; }
.work-periods-table th, .work-periods-table td { padding: 11px 13px; border-bottom: 1px solid var(--border, #dfe3ea); text-align: left; vertical-align: middle; font-size: .79rem; }
.work-periods-table th { color: var(--muted, #667085); background: color-mix(in srgb, var(--surface, #fff) 95%, var(--primary, var(--brand))); font-size: .72rem; letter-spacing: .02em; }
.work-period-open-row { background: color-mix(in srgb, #12b76a 5%, var(--surface, #fff)); }
.work-periods-footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 16px; color: var(--muted, #667085); font-size: .76rem; }
.work-periods-pager { display: flex; align-items: center; gap: 9px; }
.work-periods-pager a { border: 1px solid var(--border, #dfe3ea); border-radius: 8px; padding: 7px 10px; color: var(--text, #202734); text-decoration: none; }
.work-periods-pager a.disabled { opacity: .4; pointer-events: none; }
@media (max-width: 1050px) {
    .work-periods-control-grid { grid-template-columns: 1fr; }
    .work-periods-list-heading { align-items: stretch; flex-direction: column; }
    .work-periods-search-form { width: 100%; }
}
@media (max-width: 760px) {
    .work-periods-page { padding: 12px 10px 24px; }
    .work-periods-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .work-period-current-card { grid-template-columns: auto minmax(0, 1fr); }
    .work-period-current-card > .work-period-status-badge { grid-column: 1 / -1; justify-self: start; }
    .work-period-input-row, .work-periods-search-form { grid-template-columns: 1fr; }
    .work-periods-footer { align-items: flex-start; flex-direction: column; }
}
@media (max-width: 460px) {
    .work-periods-summary-grid { grid-template-columns: 1fr; }
}
@media print {
    .work-periods-control-grid, .work-periods-summary-grid, .work-periods-search-form, .work-periods-footer, .topbar .user-panel { display: none !important; }
    .work-periods-page { padding: 0; }
    .work-periods-list-card { border: 0; box-shadow: none; }
    .work-periods-table { min-width: 0; font-size: 9pt; }
}


/* Company create/alter mandatory-field feedback */
.odoo-company-form .company-required-note {
    margin: 10px 2px 12px;
    color: var(--muted, #6b7280);
    font-size: 12px;
    font-weight: 700;
}

.odoo-company-form .company-required-note span,
.odoo-company-form .company-required-label::after {
    color: #c62828;
    font-weight: 900;
}

.odoo-company-form .company-required-label::after {
    content: " *";
}

.odoo-company-form .company-validation-summary.validation-summary-valid {
    display: none;
}

.odoo-company-form .company-validation-summary.validation-summary-errors {
    display: block;
    margin: 10px 0 12px;
    border: 1px solid rgba(198, 40, 40, .38);
    border-left: 5px solid #c62828;
    background: rgba(254, 226, 226, .96);
    color: #7f1d1d;
    border-radius: 10px;
    padding: 12px 16px;
    box-shadow: 0 10px 22px rgba(127, 29, 29, .10);
}

.odoo-company-form .company-validation-summary ul {
    margin: 7px 0 0 20px;
    padding: 0;
}

.odoo-company-form .company-validation-summary li + li {
    margin-top: 3px;
}

.odoo-company-form .company-required-missing,
.odoo-company-form .input-validation-error {
    border-color: #c62828 !important;
    outline: 2px solid rgba(198, 40, 40, .16) !important;
    outline-offset: 1px;
    background: rgba(254, 242, 242, .98) !important;
}

.odoo-company-form .odoo-company-name-input.company-required-missing,
.odoo-company-form .odoo-company-name-input.input-validation-error {
    border-bottom-color: #c62828 !important;
}

.odoo-company-form .field-validation-error,
.odoo-company-form .validation.field-validation-error {
    display: block;
    margin-top: 4px;
    color: #b91c1c;
    font-size: 12px;
    font-weight: 800;
}

body.theme-dark .odoo-company-form .company-validation-summary.validation-summary-errors,
body.theme-midnight .odoo-company-form .company-validation-summary.validation-summary-errors,
body.theme-carbon .odoo-company-form .company-validation-summary.validation-summary-errors {
    background: rgba(127, 29, 29, .34);
    color: #fecaca;
    border-color: rgba(248, 113, 113, .55);
}

/* ERPWebStore website branding settings */
.ecommerce-branding-page .branding-editor-card{background:var(--card-bg,#fff);border:1px solid var(--border-color,#d8e1ec);border-radius:14px;padding:18px}.branding-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.branding-asset-card{border:1px solid var(--border-color,#d8e1ec);border-radius:12px;padding:16px;display:flex;flex-direction:column;gap:10px;min-width:0}.branding-asset-card h2{margin:0;font-size:1.05rem}.branding-asset-card p{margin:0;color:var(--muted-color,#64748b);min-height:42px}.branding-preview{height:150px;border:1px dashed var(--border-color,#cbd5e1);border-radius:10px;background:var(--surface-muted,#f8fafc);display:flex;align-items:center;justify-content:center;padding:12px;text-align:center;overflow:hidden}.branding-preview.compact{height:100px}.branding-preview.favicon{height:80px}.branding-preview img{display:block;max-width:100%;max-height:100%;object-fit:contain}.branding-alt-field{display:grid;gap:6px;margin-top:18px;max-width:720px}.branding-alt-field>span{font-weight:700}.branding-alt-field input{min-height:42px;border:1px solid var(--border-color,#cbd5e1);border-radius:8px;padding:8px 10px;background:var(--input-bg,#fff);color:inherit}.branding-alt-field small{color:var(--muted-color,#64748b)}@media(max-width:900px){.branding-grid{grid-template-columns:1fr}}

/* ERPWebStore website branding - advanced UI */
.ecommerce-branding-page { padding-bottom: 32px; }
.ecommerce-branding-page .branding-page-head { display:flex; align-items:flex-start; justify-content:space-between; gap:24px; margin-bottom:18px; }
.ecommerce-branding-page .branding-title-row { display:flex; align-items:flex-start; gap:14px; margin-top:5px; }
.ecommerce-branding-page .branding-title-icon { width:42px; height:42px; display:grid; place-items:center; flex:0 0 auto; border-radius:12px; color:var(--primary,#2563eb); background:color-mix(in srgb,var(--primary,#2563eb) 10%,var(--surface,#fff)); border:1px solid color-mix(in srgb,var(--primary,#2563eb) 22%,var(--border,#d8e1ec)); font-size:18px; }
.ecommerce-branding-page .branding-title-row h1 { margin:0; font-size:clamp(1.65rem,2.4vw,2.15rem); letter-spacing:-.025em; }
.ecommerce-branding-page .branding-title-row p { max-width:790px; margin:7px 0 0; color:var(--muted,#64748b); line-height:1.55; }
.ecommerce-branding-page .branding-back-btn { display:inline-flex; align-items:center; gap:8px; min-height:40px; white-space:nowrap; }
.ecommerce-branding-page .branding-message { display:flex; align-items:center; gap:12px; margin:0 0 16px; border-radius:12px; }
.ecommerce-branding-page .branding-message > div { display:grid; gap:2px; }
.ecommerce-branding-page .branding-message span:last-child { font-size:.82rem; }
.ecommerce-branding-page .branding-alert-icon { width:30px; height:30px; display:grid; place-items:center; border-radius:50%; background:rgba(18,183,106,.14); font-weight:900; }
.ecommerce-branding-page .branding-summary-strip { display:flex; align-items:center; justify-content:space-between; gap:18px; padding:14px 16px; margin-bottom:16px; border:1px solid var(--border,#d8e1ec); border-radius:13px; background:color-mix(in srgb,var(--surface,#fff) 94%,var(--primary,#2563eb)); }
.ecommerce-branding-page .branding-summary-main { display:flex; align-items:center; gap:12px; min-width:0; }
.ecommerce-branding-page .branding-summary-icon { width:34px; height:34px; display:grid; place-items:center; flex:0 0 auto; border-radius:10px; color:var(--primary,#2563eb); background:color-mix(in srgb,var(--primary,#2563eb) 10%,var(--surface,#fff)); }
.ecommerce-branding-page .branding-summary-main div { display:grid; gap:2px; min-width:0; }
.ecommerce-branding-page .branding-summary-main span:last-child { color:var(--muted,#64748b); font-size:.78rem; }
.ecommerce-branding-page .branding-status-pill { flex:0 0 auto; border-radius:999px; padding:7px 11px; font-size:.72rem; font-weight:850; }
.ecommerce-branding-page .branding-status-pill.is-custom { color:#067647; background:#ecfdf3; border:1px solid #abefc6; }
.ecommerce-branding-page .branding-status-pill.is-fallback { color:#92400e; background:#fffbeb; border:1px solid #fde68a; }
.ecommerce-branding-page .branding-editor-card { padding:0; overflow:hidden; background:var(--surface,#fff); border:1px solid var(--border,#d8e1ec); border-radius:16px; box-shadow:0 10px 30px rgba(15,23,42,.055); }
.ecommerce-branding-page .branding-section-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:18px; padding:20px 22px 17px; border-bottom:1px solid var(--border,#d8e1ec); background:color-mix(in srgb,var(--surface,#fff) 97%,var(--primary,#2563eb)); }
.ecommerce-branding-page .branding-section-heading h2 { margin:3px 0 4px; font-size:1.18rem; }
.ecommerce-branding-page .branding-section-heading p { margin:0; color:var(--muted,#64748b); font-size:.8rem; }
.ecommerce-branding-page .branding-kicker { color:var(--primary,#2563eb); font-size:.67rem; font-weight:900; letter-spacing:.11em; text-transform:uppercase; }
.ecommerce-branding-page .branding-file-note { flex:0 0 auto; color:var(--muted,#64748b); font-size:.72rem; font-weight:750; }
.ecommerce-branding-page .branding-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; padding:18px 20px 20px; }
.ecommerce-branding-page .branding-asset-card { position:relative; display:flex; flex-direction:column; gap:13px; min-width:0; padding:16px; border:1px solid var(--border,#d8e1ec); border-radius:14px; background:var(--surface,#fff); transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease; }
.ecommerce-branding-page .branding-asset-card:hover { border-color:color-mix(in srgb,var(--primary,#2563eb) 38%,var(--border,#d8e1ec)); box-shadow:0 10px 24px rgba(15,23,42,.06); transform:translateY(-1px); }
.ecommerce-branding-page .branding-card-head { display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:11px; align-items:start; }
.ecommerce-branding-page .branding-card-icon { width:34px; height:34px; display:grid; place-items:center; border-radius:9px; color:var(--primary,#2563eb); background:color-mix(in srgb,var(--primary,#2563eb) 9%,var(--surface,#fff)); border:1px solid color-mix(in srgb,var(--primary,#2563eb) 17%,var(--border,#d8e1ec)); }
.ecommerce-branding-page .branding-card-head h3 { margin:1px 0 4px; font-size:.96rem; }
.ecommerce-branding-page .branding-card-head p { margin:0; min-height:0; color:var(--muted,#64748b); font-size:.73rem; line-height:1.45; }
.ecommerce-branding-page .branding-required-badge,.ecommerce-branding-page .branding-optional-badge { align-self:start; border-radius:999px; padding:5px 8px; font-size:.62rem; font-weight:850; }
.ecommerce-branding-page .branding-required-badge { color:#1d4ed8; background:#eff6ff; border:1px solid #bfdbfe; }
.ecommerce-branding-page .branding-optional-badge { color:#475569; background:#f8fafc; border:1px solid #e2e8f0; }
.ecommerce-branding-page .branding-preview { position:relative; display:flex; align-items:center; justify-content:center; width:100%; height:176px; padding:16px; overflow:hidden; border:1px dashed color-mix(in srgb,var(--primary,#2563eb) 25%,var(--border,#cbd5e1)); border-radius:12px; background:repeating-linear-gradient(45deg,color-mix(in srgb,var(--surface,#fff) 96%,#94a3b8) 0 10px,color-mix(in srgb,var(--surface,#fff) 99%,#94a3b8) 10px 20px); }
.ecommerce-branding-page .branding-preview-compact { height:128px; }
.ecommerce-branding-page .branding-preview-favicon { height:128px; }
.ecommerce-branding-page .branding-preview.has-image { border-style:solid; background:var(--surface,#fff); }
.ecommerce-branding-page .branding-preview img { display:block; max-width:100%; max-height:100%; object-fit:contain; }
.ecommerce-branding-page .branding-preview-favicon img { max-width:76px; max-height:76px; image-rendering:auto; }
.ecommerce-branding-page .branding-empty-state { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; color:var(--muted,#64748b); text-align:center; }
.ecommerce-branding-page .branding-empty-state[hidden] { display:none !important; }
.ecommerce-branding-page .branding-empty-icon { width:36px; height:36px; display:grid; place-items:center; margin-bottom:3px; border-radius:10px; color:var(--primary,#2563eb); background:color-mix(in srgb,var(--primary,#2563eb) 9%,var(--surface,#fff)); font-size:19px; }
.ecommerce-branding-page .branding-empty-state strong { color:var(--text,#1e293b); font-size:.79rem; }
.ecommerce-branding-page .branding-empty-state small { max-width:230px; font-size:.68rem; line-height:1.4; }
.ecommerce-branding-page .branding-upload-control { position:relative; display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:10px; min-height:56px; padding:8px 10px; cursor:pointer; border:1px solid var(--border,#d8e1ec); border-radius:11px; background:color-mix(in srgb,var(--surface,#fff) 97%,var(--primary,#2563eb)); transition:border-color .18s ease,background .18s ease; }
.ecommerce-branding-page .branding-upload-control:hover { border-color:color-mix(in srgb,var(--primary,#2563eb) 48%,var(--border,#d8e1ec)); background:color-mix(in srgb,var(--surface,#fff) 93%,var(--primary,#2563eb)); }
.ecommerce-branding-page .branding-upload-control input { position:absolute; width:1px; height:1px; overflow:hidden; opacity:0; pointer-events:none; }
.ecommerce-branding-page .branding-upload-icon { width:32px; height:32px; display:grid; place-items:center; border-radius:9px; color:var(--primary,#2563eb); background:color-mix(in srgb,var(--primary,#2563eb) 10%,var(--surface,#fff)); font-size:17px; font-weight:900; }
.ecommerce-branding-page .branding-upload-copy { display:grid; gap:2px; min-width:0; }
.ecommerce-branding-page .branding-upload-copy strong { font-size:.76rem; }
.ecommerce-branding-page .branding-upload-copy small { overflow:hidden; color:var(--muted,#64748b); font-size:.66rem; text-overflow:ellipsis; white-space:nowrap; }
.ecommerce-branding-page .branding-browse-label { border-radius:8px; padding:7px 10px; color:var(--primary,#2563eb); background:var(--surface,#fff); border:1px solid color-mix(in srgb,var(--primary,#2563eb) 24%,var(--border,#d8e1ec)); font-size:.7rem; font-weight:850; }
.ecommerce-branding-page .branding-card-actions { display:flex; align-items:center; justify-content:space-between; gap:10px; min-height:32px; margin-top:auto; }
.ecommerce-branding-page .branding-dimension-note { color:var(--muted,#64748b); font-size:.64rem; line-height:1.35; }
.ecommerce-branding-page .branding-remove-btn { display:inline-flex; align-items:center; gap:6px; min-height:32px; padding:6px 9px; white-space:nowrap; font-size:.68rem; }
.ecommerce-branding-page .branding-accessibility-card { display:grid; grid-template-columns:auto minmax(220px,1fr) minmax(280px,1.15fr); align-items:center; gap:16px; margin:0 20px 20px; padding:16px; border:1px solid var(--border,#d8e1ec); border-radius:13px; background:color-mix(in srgb,var(--surface,#fff) 96%,#8b5cf6); }
.ecommerce-branding-page .branding-accessibility-icon { width:44px; height:44px; display:grid; place-items:center; border-radius:12px; color:#6d28d9; background:#f5f3ff; border:1px solid #ddd6fe; font-weight:900; }
.ecommerce-branding-page .branding-accessibility-copy h3 { margin:3px 0 3px; font-size:.93rem; }
.ecommerce-branding-page .branding-accessibility-copy p { margin:0; color:var(--muted,#64748b); font-size:.72rem; }
.ecommerce-branding-page .branding-alt-field { display:grid; gap:5px; margin:0; max-width:none; }
.ecommerce-branding-page .branding-alt-field > span { font-size:.71rem; font-weight:850; }
.ecommerce-branding-page .branding-alt-field input { width:100%; min-height:42px; padding:9px 11px; border:1px solid var(--border,#cbd5e1); border-radius:9px; background:var(--input-bg,var(--surface,#fff)); color:var(--text,#1e293b); }
.ecommerce-branding-page .branding-alt-field input:focus { border-color:var(--primary,#2563eb); outline:3px solid color-mix(in srgb,var(--primary,#2563eb) 14%,transparent); }
.ecommerce-branding-page .branding-alt-field small { justify-self:end; color:var(--muted,#64748b); font-size:.64rem; }
.ecommerce-branding-page .branding-save-bar { display:flex; align-items:center; justify-content:space-between; gap:18px; padding:15px 20px; border-top:1px solid var(--border,#d8e1ec); background:color-mix(in srgb,var(--surface,#fff) 96%,var(--primary,#2563eb)); }
.ecommerce-branding-page .branding-save-bar > div:first-child { display:grid; gap:2px; }
.ecommerce-branding-page .branding-save-bar > div:first-child strong { font-size:.8rem; }
.ecommerce-branding-page .branding-save-bar > div:first-child span { color:var(--muted,#64748b); font-size:.69rem; }
.ecommerce-branding-page .branding-save-actions { display:flex; align-items:center; gap:9px; }
.ecommerce-branding-page .branding-save-btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-width:188px; }
.ecommerce-branding-page .branding-save-btn.is-busy { cursor:wait; opacity:.82; }
.ecommerce-branding-page .branding-spinner { width:14px; height:14px; border:2px solid rgba(255,255,255,.45); border-top-color:#fff; border-radius:50%; animation:branding-spin .75s linear infinite; }
@keyframes branding-spin { to { transform:rotate(360deg); } }
body.theme-dark .ecommerce-branding-page .branding-status-pill.is-custom,body.theme-midnight .ecommerce-branding-page .branding-status-pill.is-custom,body.theme-carbon .ecommerce-branding-page .branding-status-pill.is-custom { color:#6ce9a6; background:rgba(6,118,71,.22); border-color:rgba(108,233,166,.28); }
body.theme-dark .ecommerce-branding-page .branding-status-pill.is-fallback,body.theme-midnight .ecommerce-branding-page .branding-status-pill.is-fallback,body.theme-carbon .ecommerce-branding-page .branding-status-pill.is-fallback { color:#fcd34d; background:rgba(146,64,14,.22); border-color:rgba(253,230,138,.28); }
body.theme-dark .ecommerce-branding-page .branding-required-badge,body.theme-midnight .ecommerce-branding-page .branding-required-badge,body.theme-carbon .ecommerce-branding-page .branding-required-badge { color:#93c5fd; background:rgba(29,78,216,.24); border-color:rgba(147,197,253,.25); }
body.theme-dark .ecommerce-branding-page .branding-optional-badge,body.theme-midnight .ecommerce-branding-page .branding-optional-badge,body.theme-carbon .ecommerce-branding-page .branding-optional-badge { color:#cbd5e1; background:rgba(71,85,105,.28); border-color:rgba(203,213,225,.18); }
@media (max-width:1100px) { .ecommerce-branding-page .branding-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .ecommerce-branding-page .branding-asset-card:last-child { grid-column:1/-1; } }
@media (max-width:800px) { .ecommerce-branding-page .branding-page-head,.ecommerce-branding-page .branding-summary-strip,.ecommerce-branding-page .branding-section-heading,.ecommerce-branding-page .branding-save-bar { align-items:stretch; flex-direction:column; } .ecommerce-branding-page .branding-back-btn { align-self:flex-start; } .ecommerce-branding-page .branding-grid { grid-template-columns:1fr; padding:14px; } .ecommerce-branding-page .branding-asset-card:last-child { grid-column:auto; } .ecommerce-branding-page .branding-accessibility-card { grid-template-columns:auto 1fr; margin:0 14px 14px; } .ecommerce-branding-page .branding-alt-field { grid-column:1/-1; } .ecommerce-branding-page .branding-save-actions { justify-content:flex-end; } }
@media (max-width:520px) { .ecommerce-branding-page .branding-title-row { gap:10px; } .ecommerce-branding-page .branding-title-icon { width:36px; height:36px; } .ecommerce-branding-page .branding-card-head { grid-template-columns:auto minmax(0,1fr); } .ecommerce-branding-page .branding-card-head > :last-child { grid-column:2; justify-self:start; } .ecommerce-branding-page .branding-preview { height:145px; } .ecommerce-branding-page .branding-save-actions { align-items:stretch; flex-direction:column-reverse; width:100%; } .ecommerce-branding-page .branding-save-actions .erp-btn { width:100%; } .ecommerce-branding-page .branding-card-actions { align-items:flex-start; flex-direction:column; } }
.ecommerce-branding-page .branding-initial-hidden { display:none !important; }

.ecommerce-branding-page .branding-size-controls{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:11px;border:1px solid var(--border,#d8e1ec);border-radius:11px;background:color-mix(in srgb,var(--surface,#fff) 97%,var(--primary,#2563eb))}
.ecommerce-branding-page .branding-size-controls>label{display:grid;gap:5px}.ecommerce-branding-page .branding-size-controls>label>span:first-child{font-size:.68rem;font-weight:850;color:var(--text,#1e293b)}
.ecommerce-branding-page .branding-number-input{display:grid;grid-template-columns:1fr auto;align-items:center;overflow:hidden;border:1px solid var(--border,#cbd5e1);border-radius:9px;background:var(--surface,#fff)}
.ecommerce-branding-page .branding-number-input input{width:100%;min-height:38px;padding:7px 9px;border:0;background:transparent;color:var(--text,#1e293b);font-weight:750}.ecommerce-branding-page .branding-number-input input:focus{outline:none}
.ecommerce-branding-page .branding-number-input small{padding:0 10px;color:var(--muted,#64748b);font-size:.66rem;font-weight:800}.ecommerce-branding-page .branding-size-controls p{grid-column:1/-1;margin:0;color:var(--muted,#64748b);font-size:.64rem;line-height:1.4}
@media(max-width:520px){.ecommerce-branding-page .branding-size-controls{grid-template-columns:1fr}}

/* E-Commerce website branding: header logo alignment */
.branding-alignment-control{border:0;padding:0;margin:14px 0 0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.branding-alignment-control legend{font-weight:800;margin-bottom:8px;color:var(--erp-text,#172033)}
.branding-alignment-control label{position:relative;display:flex;align-items:center;justify-content:center;gap:7px;min-height:42px;border:1px solid var(--erp-border,#d9e1ee);border-radius:10px;background:var(--erp-surface,#fff);cursor:pointer;font-size:13px}
.branding-alignment-control label:hover,.branding-alignment-control label:focus-within{border-color:#2f6fed;box-shadow:0 0 0 3px rgba(47,111,237,.12)}
.branding-alignment-control label.is-selected:has(input:checked),.branding-alignment-control label:has(input:checked){border-color:#2f6fed;background:#eef4ff;color:#174ea6}
.branding-alignment-control input{position:absolute;opacity:0;pointer-events:none}

/* Branding preview follows the selected header alignment. */
.branding-preview-main{display:flex!important;align-items:center!important;padding:18px!important}
.branding-preview-main[data-logo-preview-alignment="left"]{justify-content:flex-start!important}
.branding-preview-main[data-logo-preview-alignment="center"]{justify-content:center!important}
.branding-preview-main[data-logo-preview-alignment="right"]{justify-content:flex-end!important}
.branding-preview-main[data-logo-preview-alignment] img{width:auto!important;max-width:90%!important;height:auto!important;max-height:145px!important;object-fit:contain!important}

/* Product-Level Promotional Offers - Advanced ERP UI */
.promotion-advanced-page {
    display: grid;
    gap: 16px;
    padding: 18px 24px 34px;
    color: var(--text, var(--theme-text, #1f2937));
}
.promotion-advanced-page .promo-page-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
    padding: 2px 0 4px;
}
.promotion-advanced-page .promo-title-row {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    margin-top: 8px;
}
.promotion-advanced-page .promo-title-icon {
    width: 46px;
    height: 46px;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    border: 1px solid color-mix(in srgb, var(--primary, var(--theme-primary, #2563eb)) 32%, var(--border, #d8e1ec));
    border-radius: 14px;
    background: color-mix(in srgb, var(--primary, var(--theme-primary, #2563eb)) 10%, var(--surface, #fff));
    color: var(--primary, var(--theme-primary, #2563eb));
    font-size: 1.15rem;
    font-weight: 950;
    box-shadow: inset 0 1px 0 color-mix(in srgb, #fff 30%, transparent);
}
.promotion-advanced-page .promo-title-row h1 {
    margin: 0;
    font-size: clamp(1.55rem, 2.6vw, 2.2rem);
    line-height: 1.12;
}
.promotion-advanced-page .promo-title-row p {
    max-width: 850px;
    margin: 7px 0 0;
    color: var(--muted, var(--theme-muted, #64748b));
    line-height: 1.55;
}
.promotion-advanced-page .promo-title-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 5px;
}
.promotion-advanced-page .promo-title-meta span,
.promotion-advanced-page .promo-kicker {
    color: var(--primary, var(--theme-primary, #2563eb));
    font-size: .68rem;
    font-weight: 900;
    letter-spacing: .11em;
    text-transform: uppercase;
}
.promotion-advanced-page .promo-title-meta span {
    padding: 4px 7px;
    border: 1px solid color-mix(in srgb, var(--primary, var(--theme-primary, #2563eb)) 20%, var(--border, #d8e1ec));
    border-radius: 999px;
    background: color-mix(in srgb, var(--primary, var(--theme-primary, #2563eb)) 6%, var(--surface, #fff));
    letter-spacing: .05em;
}
.promotion-advanced-page .promo-head-actions,
.promotion-advanced-page .promo-filter-actions,
.promotion-advanced-page .promo-row-actions,
.promotion-advanced-page .promo-save-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}
.promotion-advanced-page .promo-btn {
    position: relative;
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 8px 13px;
    border: 1px solid var(--border, var(--theme-border, #d8e1ec));
    border-radius: 9px;
    background: var(--surface, var(--theme-card, #fff));
    color: var(--text, var(--theme-text, #1f2937));
    font: inherit;
    font-size: .79rem;
    font-weight: 850;
    line-height: 1;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    box-shadow: 0 5px 14px color-mix(in srgb, var(--text, #1f2937) 6%, transparent);
    transition: transform .16s ease, border-color .16s ease, background .16s ease, color .16s ease, box-shadow .16s ease;
}
.promotion-advanced-page .promo-btn:hover,
.promotion-advanced-page .promo-btn:focus-visible {
    border-color: var(--primary, var(--theme-primary, #2563eb));
    background: color-mix(in srgb, var(--primary, var(--theme-primary, #2563eb)) 7%, var(--surface, #fff));
    color: var(--primary, var(--theme-primary, #2563eb));
    box-shadow: 0 8px 19px color-mix(in srgb, var(--primary, var(--theme-primary, #2563eb)) 14%, transparent);
    outline: none;
    transform: translateY(-1px);
}
.promotion-advanced-page .promo-btn.primary {
    border-color: var(--primary, var(--theme-primary, #2563eb));
    background: var(--primary, var(--theme-primary, #2563eb));
    color: var(--primary-contrast, #fff);
}
.promotion-advanced-page .promo-btn.primary:hover,
.promotion-advanced-page .promo-btn.primary:focus-visible {
    border-color: color-mix(in srgb, var(--primary, var(--theme-primary, #2563eb)) 78%, #000);
    background: color-mix(in srgb, var(--primary, var(--theme-primary, #2563eb)) 88%, #000);
    color: var(--primary-contrast, #fff);
}
.promotion-advanced-page .promo-btn.ghost {
    border-color: transparent;
    background: transparent;
    color: var(--muted, var(--theme-muted, #64748b));
    box-shadow: none;
}
.promotion-advanced-page .promo-btn.ghost:hover,
.promotion-advanced-page .promo-btn.ghost:focus-visible {
    border-color: var(--border, var(--theme-border, #d8e1ec));
    background: color-mix(in srgb, var(--surface, #fff) 93%, var(--primary, #2563eb));
    color: var(--text, var(--theme-text, #1f2937));
}
.promotion-advanced-page .promo-btn.compact { min-height: 34px; padding: 7px 10px; font-size: .73rem; }
.promotion-advanced-page .promo-btn:disabled,
.promotion-advanced-page .promo-btn.is-busy {
    border-color: var(--border, var(--theme-border, #d8e1ec)) !important;
    background: color-mix(in srgb, var(--surface, #fff) 90%, var(--muted, #64748b)) !important;
    color: var(--muted, var(--theme-muted, #64748b)) !important;
    box-shadow: none !important;
    cursor: wait;
    opacity: .78;
    transform: none;
}
.promotion-advanced-page .promo-message {
    display: flex;
    align-items: center;
    gap: 11px;
}
.promotion-advanced-page .promo-message > div { display: grid; gap: 2px; }
.promotion-advanced-page .promo-alert-icon {
    width: 32px;
    height: 32px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 9px;
    background: color-mix(in srgb, #027a48 12%, var(--surface, #fff));
    color: #027a48;
    font-weight: 950;
}
.promotion-advanced-page .promo-summary-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 11px;
}
.promotion-advanced-page .promo-summary-card {
    min-height: 82px;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px;
    border: 1px solid var(--border, var(--theme-border, #d8e1ec));
    border-radius: 13px;
    background: var(--surface, var(--theme-card, #fff));
    box-shadow: 0 7px 20px color-mix(in srgb, var(--text, #1f2937) 5%, transparent);
}
.promotion-advanced-page .promo-summary-card > span {
    width: 39px;
    height: 39px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 11px;
    background: color-mix(in srgb, var(--primary, var(--theme-primary, #2563eb)) 9%, var(--surface, #fff));
    color: var(--primary, var(--theme-primary, #2563eb));
    font-weight: 900;
}
.promotion-advanced-page .promo-summary-card strong { display: block; font-size: 1.32rem; line-height: 1; }
.promotion-advanced-page .promo-summary-card small { display: block; margin-top: 5px; color: var(--muted, var(--theme-muted, #64748b)); }
.promotion-advanced-page .promo-summary-card.is-active > span { color: #027a48; background: color-mix(in srgb, #027a48 10%, var(--surface, #fff)); }
.promotion-advanced-page .promo-summary-card.is-scheduled > span { color: #b54708; background: color-mix(in srgb, #b54708 10%, var(--surface, #fff)); }
.promotion-advanced-page .promo-summary-card.is-closed > span { color: #667085; background: color-mix(in srgb, #667085 10%, var(--surface, #fff)); }
.promotion-advanced-page .promo-list-shell,
.promotion-advanced-page .promo-editor-card,
.promotion-advanced-page .promo-editor-intro,
.promotion-advanced-page .promo-save-bar {
    border: 1px solid var(--border, var(--theme-border, #d8e1ec));
    border-radius: 14px;
    background: var(--surface, var(--theme-card, #fff));
    box-shadow: 0 8px 22px color-mix(in srgb, var(--text, #1f2937) 5%, transparent);
}
.promotion-advanced-page .promo-list-shell { overflow: hidden; }
.promotion-advanced-page .promo-list-heading,
.promotion-advanced-page .promo-section-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 16px 18px;
    border-bottom: 1px solid var(--border, var(--theme-border, #d8e1ec));
    background: color-mix(in srgb, var(--surface, #fff) 96%, var(--primary, #2563eb));
}
.promotion-advanced-page .promo-list-heading h2,
.promotion-advanced-page .promo-section-head h2 { margin: 3px 0 0; font-size: 1.05rem; }
.promotion-advanced-page .promo-list-heading p,
.promotion-advanced-page .promo-section-head p { margin: 4px 0 0; color: var(--muted, var(--theme-muted, #64748b)); font-size: .75rem; }
.promotion-advanced-page .promo-record-count,
.promotion-advanced-page .promo-section-badge,
.promotion-advanced-page .promo-editor-state {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 28px;
    padding: 5px 9px;
    border: 1px solid color-mix(in srgb, var(--primary, var(--theme-primary, #2563eb)) 22%, var(--border, #d8e1ec));
    border-radius: 999px;
    background: color-mix(in srgb, var(--primary, var(--theme-primary, #2563eb)) 7%, var(--surface, #fff));
    color: var(--primary, var(--theme-primary, #2563eb));
    font-size: .69rem;
    font-weight: 850;
    white-space: nowrap;
}
.promotion-advanced-page .promo-section-badge.optional { color: var(--muted, var(--theme-muted, #64748b)); border-color: var(--border, #d8e1ec); background: var(--surface, #fff); }
.promotion-advanced-page .promo-filter-panel {
    display: grid;
    grid-template-columns: minmax(280px, 1fr) 190px auto;
    align-items: end;
    gap: 10px;
    padding: 13px 18px;
    border-bottom: 1px solid var(--border, var(--theme-border, #d8e1ec));
}
.promotion-advanced-page .promo-filter-panel label,
.promotion-advanced-page .promo-form-grid > label,
.promotion-advanced-page .promo-rule-panel > label,
.promotion-advanced-page .promo-language-panel > label {
    display: grid;
    gap: 6px;
    margin: 0;
    color: var(--text, var(--theme-text, #1f2937));
    font-size: .75rem;
    font-weight: 800;
}
.promotion-advanced-page .promo-filter-panel label > span,
.promotion-advanced-page .promo-form-grid label > span,
.promotion-advanced-page .promo-rule-panel label > span,
.promotion-advanced-page .promo-language-panel label > span { color: var(--text, var(--theme-text, #1f2937)); }
.promotion-advanced-page .promo-input-with-icon,
.promotion-advanced-page .promo-product-search {
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    overflow: hidden;
    border: 1px solid var(--border, var(--theme-border, #cbd5e1));
    border-radius: 9px;
    background: var(--input-bg, var(--surface, #fff));
}
.promotion-advanced-page .promo-input-with-icon > span,
.promotion-advanced-page .promo-product-search > span { padding-left: 10px; color: var(--muted, var(--theme-muted, #64748b)); font-size: 1rem; }
.promotion-advanced-page .promo-input-with-icon input,
.promotion-advanced-page .promo-product-search input { border: 0; border-radius: 0; }
.promotion-advanced-page .promo-filter-panel input,
.promotion-advanced-page .promo-filter-panel select,
.promotion-advanced-page .promo-form-grid input,
.promotion-advanced-page .promo-form-grid select,
.promotion-advanced-page .promo-rule-panel input,
.promotion-advanced-page .promo-rule-panel select,
.promotion-advanced-page .promo-language-panel input,
.promotion-advanced-page .promo-language-panel textarea,
.promotion-advanced-page .promo-product-search input {
    width: 100%;
    min-height: 40px;
    padding: 8px 10px;
    border: 1px solid var(--border, var(--theme-border, #cbd5e1));
    border-radius: 9px;
    background: var(--input-bg, var(--surface, #fff));
    color: var(--text, var(--theme-text, #1f2937));
    font: inherit;
}
.promotion-advanced-page .promo-language-panel textarea { min-height: 78px; resize: vertical; }
.promotion-advanced-page .promo-language-panel textarea[rows="5"] { min-height: 125px; }
.promotion-advanced-page .promo-filter-panel input:focus,
.promotion-advanced-page .promo-filter-panel select:focus,
.promotion-advanced-page .promo-form-grid input:focus,
.promotion-advanced-page .promo-form-grid select:focus,
.promotion-advanced-page .promo-rule-panel input:focus,
.promotion-advanced-page .promo-language-panel input:focus,
.promotion-advanced-page .promo-language-panel textarea:focus,
.promotion-advanced-page .promo-product-search:focus-within {
    border-color: var(--primary, var(--theme-primary, #2563eb));
    outline: 3px solid color-mix(in srgb, var(--primary, var(--theme-primary, #2563eb)) 13%, transparent);
}
.promotion-advanced-page .promo-form-grid label small { color: var(--muted, var(--theme-muted, #64748b)); font-size: .65rem; font-weight: 600; line-height: 1.35; }
.promotion-advanced-page .promo-table-wrap { overflow-x: auto; }
.promotion-advanced-page .promo-table { width: 100%; min-width: 1130px; border-collapse: collapse; }
.promotion-advanced-page .promo-table th,
.promotion-advanced-page .promo-table td { padding: 11px 12px; border-bottom: 1px solid var(--border, var(--theme-border, #e5e7eb)); text-align: left; vertical-align: middle; }
.promotion-advanced-page .promo-table th { background: color-mix(in srgb, var(--surface, #fff) 93%, var(--primary, #2563eb)); color: var(--muted, var(--theme-muted, #64748b)); font-size: .69rem; font-weight: 900; letter-spacing: .05em; text-transform: uppercase; }
.promotion-advanced-page .promo-table tbody tr:hover { background: color-mix(in srgb, var(--surface, #fff) 96%, var(--primary, #2563eb)); }
.promotion-advanced-page .promo-table tbody tr:last-child td { border-bottom: 0; }
.promotion-advanced-page .promo-actions-column { width: 158px; }
.promotion-advanced-page .promo-offer-identity,
.promotion-advanced-page .promo-date-range { display: grid; gap: 4px; }
.promotion-advanced-page .promo-offer-identity strong { font-size: .82rem; }
.promotion-advanced-page .promo-code-badge,
.promotion-advanced-page .promo-rule-pill,
.promotion-advanced-page .promo-ribbon-preview {
    display: inline-flex;
    width: max-content;
    max-width: 220px;
    padding: 4px 7px;
    border-radius: 7px;
    font-size: .68rem;
    font-weight: 800;
}
.promotion-advanced-page .promo-code-badge { color: var(--primary, var(--theme-primary, #2563eb)); background: color-mix(in srgb, var(--primary, #2563eb) 8%, var(--surface, #fff)); font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
.promotion-advanced-page .promo-rule-pill { border: 1px solid var(--border, #d8e1ec); background: var(--surface, #fff); color: var(--text, #1f2937); }
.promotion-advanced-page .promo-ribbon-preview { overflow: hidden; background: color-mix(in srgb, #b54708 9%, var(--surface, #fff)); color: #b54708; text-overflow: ellipsis; white-space: nowrap; }
.promotion-advanced-page .promo-product-count { display: block; font-size: 1rem; }
.promotion-advanced-page .promo-table td > small,
.promotion-advanced-page .promo-date-range span { color: var(--muted, var(--theme-muted, #64748b)); font-size: .69rem; }
.promotion-advanced-page .promo-date-range strong { font-size: .75rem; }
.promotion-advanced-page .promo-status-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 8px;
    border-radius: 999px;
    font-size: .68rem;
    font-weight: 850;
    white-space: nowrap;
}
.promotion-advanced-page .promo-status-pill i { width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.promotion-advanced-page .promo-status-pill.is-active { color: #027a48; background: color-mix(in srgb, #027a48 10%, var(--surface, #fff)); }
.promotion-advanced-page .promo-status-pill.is-scheduled { color: #b54708; background: color-mix(in srgb, #b54708 10%, var(--surface, #fff)); }
.promotion-advanced-page .promo-status-pill.is-inactive { color: #667085; background: color-mix(in srgb, #667085 10%, var(--surface, #fff)); }
.promotion-advanced-page .promo-row-actions { flex-wrap: nowrap; }
.promotion-advanced-page .promo-row-actions form { margin: 0; }
.promotion-advanced-page .promo-row-btn {
    min-height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 6px 9px;
    border: 1px solid var(--border, var(--theme-border, #d8e1ec));
    border-radius: 8px;
    background: var(--surface, var(--theme-card, #fff));
    color: var(--text, var(--theme-text, #1f2937));
    font: inherit;
    font-size: .7rem;
    font-weight: 820;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
}
.promotion-advanced-page .promo-row-btn:hover,
.promotion-advanced-page .promo-row-btn:focus-visible { border-color: var(--primary, #2563eb); color: var(--primary, #2563eb); background: color-mix(in srgb, var(--primary, #2563eb) 7%, var(--surface, #fff)); outline: none; }
.promotion-advanced-page .promo-row-btn.danger { color: #b42318; }
.promotion-advanced-page .promo-row-btn.danger:hover,
.promotion-advanced-page .promo-row-btn.danger:focus-visible { border-color: #f04438; background: color-mix(in srgb, #f04438 8%, var(--surface, #fff)); color: #b42318; }
.promotion-advanced-page .promo-empty-state { min-height: 210px; display: grid; place-items: center; align-content: center; gap: 7px; text-align: center; color: var(--muted, #64748b); }
.promotion-advanced-page .promo-empty-state > span { width: 45px; height: 45px; display: grid; place-items: center; border-radius: 14px; background: color-mix(in srgb, var(--primary, #2563eb) 8%, var(--surface, #fff)); color: var(--primary, #2563eb); font-weight: 950; }
.promotion-advanced-page .promo-empty-state strong { color: var(--text, #1f2937); }
.promotion-advanced-page .promo-empty-state small { max-width: 400px; }

/* Promotion advanced editor */
.promotion-edit-page { padding-bottom: 100px; }
.promotion-edit-page .promo-editor-form { display: grid; gap: 14px; }
.promotion-edit-page .promo-validation:empty { display: none; }
.promotion-edit-page .promo-editor-intro {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 13px 16px;
}
.promotion-edit-page .promo-editor-intro > div:first-child { display: flex; align-items: center; gap: 11px; }
.promotion-edit-page .promo-editor-intro > div:first-child > div { display: grid; gap: 2px; }
.promotion-edit-page .promo-editor-intro > div:first-child span:last-child { color: var(--muted, #64748b); font-size: .72rem; }
.promotion-edit-page .promo-editor-intro-icon { width: 35px; height: 35px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 10px; color: var(--primary, #2563eb); background: color-mix(in srgb, var(--primary, #2563eb) 9%, var(--surface, #fff)); font-weight: 900; }
.promotion-edit-page .promo-editor-card { overflow: hidden; }
.promotion-edit-page .promo-section-head { justify-content: flex-start; }
.promotion-edit-page .promo-section-head > div { flex: 1; min-width: 0; }
.promotion-edit-page .promo-section-icon { width: 39px; height: 39px; display: grid; place-items: center; flex: 0 0 auto; border: 1px solid color-mix(in srgb, var(--primary, #2563eb) 24%, var(--border, #d8e1ec)); border-radius: 11px; background: var(--surface, #fff); color: var(--primary, #2563eb); font-weight: 950; }
.promotion-edit-page .promo-section-body { display: grid; gap: 16px; padding: 18px; }
.promotion-edit-page .promo-form-grid { display: grid; gap: 13px; }
.promotion-edit-page .promo-form-grid.two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.promotion-edit-page .promo-form-grid.three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.promotion-edit-page .promo-form-grid.four { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.promotion-edit-page .promo-rule-workspace { overflow: hidden; border: 1px solid color-mix(in srgb, var(--primary, #2563eb) 22%, var(--border, #d8e1ec)); border-radius: 12px; background: color-mix(in srgb, var(--surface, #fff) 96%, var(--primary, #2563eb)); }
.promotion-edit-page .promo-rule-workspace-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 13px; border-bottom: 1px solid color-mix(in srgb, var(--primary, #2563eb) 16%, var(--border, #d8e1ec)); }
.promotion-edit-page .promo-rule-workspace-head strong { font-size: .78rem; }
.promotion-edit-page .promo-rule-workspace-head span { color: var(--muted, #64748b); font-size: .67rem; }
.promotion-edit-page .promo-rule-panel { display: none; grid-template-columns: repeat(2, minmax(0, 280px)); gap: 13px; padding: 14px; }
.promotion-edit-page .promo-rule-panel.active { display: grid; }
.promotion-edit-page .promo-switch-card {
    min-height: 68px;
    display: flex !important;
    align-items: center;
    gap: 10px;
    align-self: end;
    padding: 11px;
    border: 1px solid var(--border, #d8e1ec);
    border-radius: 11px;
    background: color-mix(in srgb, var(--surface, #fff) 96%, var(--primary, #2563eb));
    cursor: pointer;
}
.promotion-edit-page .promo-switch-card.compact { min-height: 58px; align-self: auto; }
.promotion-edit-page .promo-switch-card > input { width: 18px; height: 18px; min-height: 0; flex: 0 0 auto; padding: 0; accent-color: var(--primary, #2563eb); }
.promotion-edit-page .promo-switch-card > span { display: grid; gap: 2px; }
.promotion-edit-page .promo-switch-card strong { font-size: .75rem; }
.promotion-edit-page .promo-switch-card small { color: var(--muted, #64748b); font-size: .64rem; line-height: 1.35; }
.promotion-edit-page .promo-language-tabs { display: grid; grid-template-columns: repeat(3, minmax(0, 150px)); gap: 8px; }
.promotion-edit-page .promo-language-tab {
    min-height: 49px;
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    gap: 8px;
    padding: 8px 11px;
    border: 1px solid var(--border, #d8e1ec);
    border-radius: 10px;
    background: var(--surface, #fff);
    color: var(--text, #1f2937);
    text-align: left;
    cursor: pointer;
}
.promotion-edit-page .promo-language-tab strong { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 8px; background: color-mix(in srgb, var(--primary, #2563eb) 8%, var(--surface, #fff)); color: var(--primary, #2563eb); font-size: .7rem; }
.promotion-edit-page .promo-language-tab span { color: var(--muted, #64748b); font-size: .72rem; font-weight: 750; }
.promotion-edit-page .promo-language-tab:hover,
.promotion-edit-page .promo-language-tab:focus-visible { border-color: var(--primary, #2563eb); outline: 3px solid color-mix(in srgb, var(--primary, #2563eb) 12%, transparent); }
.promotion-edit-page .promo-language-tab.active { border-color: var(--primary, #2563eb); background: color-mix(in srgb, var(--primary, #2563eb) 8%, var(--surface, #fff)); box-shadow: inset 0 -2px 0 var(--primary, #2563eb); }
.promotion-edit-page .promo-language-tab.active strong { background: var(--primary, #2563eb); color: var(--primary-contrast, #fff); }
.promotion-edit-page .promo-language-panel { display: none; gap: 13px; }
.promotion-edit-page .promo-language-panel.active { display: grid; }
.promotion-edit-page .promo-image-editor { display: grid; grid-template-columns: minmax(280px, 430px) minmax(0, 1fr); gap: 18px; align-items: center; }
.promotion-edit-page .promo-image-preview { height: 210px; display: grid; place-items: center; overflow: hidden; border: 1px dashed color-mix(in srgb, var(--primary, #2563eb) 36%, var(--border, #d8e1ec)); border-radius: 13px; background: color-mix(in srgb, var(--surface, #fff) 96%, var(--primary, #2563eb)); }
.promotion-edit-page .promo-image-preview img { width: 100%; height: 100%; object-fit: contain; }
.promotion-edit-page .promo-image-empty { display: grid; place-items: center; gap: 5px; padding: 20px; text-align: center; color: var(--muted, #64748b); }
.promotion-edit-page .promo-image-empty > span { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 12px; background: color-mix(in srgb, var(--primary, #2563eb) 9%, var(--surface, #fff)); color: var(--primary, #2563eb); }
.promotion-edit-page .promo-image-empty strong { color: var(--text, #1f2937); }
.promotion-edit-page .promo-image-empty small { max-width: 280px; }
.promotion-edit-page .promo-image-controls { display: grid; gap: 12px; }
.promotion-edit-page .promo-image-controls > p { margin: 0; color: var(--muted, #64748b); font-size: .71rem; line-height: 1.5; }
.promotion-edit-page .promo-upload-control { position: relative; display: grid !important; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 10px; min-height: 64px; padding: 10px 11px; border: 1px dashed color-mix(in srgb, var(--primary, #2563eb) 42%, var(--border, #d8e1ec)); border-radius: 11px; background: color-mix(in srgb, var(--surface, #fff) 96%, var(--primary, #2563eb)); cursor: pointer; }
.promotion-edit-page .promo-upload-control input { position: absolute; width: 1px; height: 1px; min-height: 0; padding: 0; overflow: hidden; opacity: 0; pointer-events: none; }
.promotion-edit-page .promo-upload-icon { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 10px; background: color-mix(in srgb, var(--primary, #2563eb) 10%, var(--surface, #fff)); color: var(--primary, #2563eb); font-size: 1rem; font-weight: 900; }
.promotion-edit-page .promo-upload-control > span:nth-of-type(2) { min-width: 0; display: grid; gap: 2px; }
.promotion-edit-page .promo-upload-control strong { font-size: .75rem; }
.promotion-edit-page .promo-upload-control small { overflow: hidden; color: var(--muted, #64748b); font-size: .65rem; text-overflow: ellipsis; white-space: nowrap; }
.promotion-edit-page .promo-upload-control b { padding: 7px 9px; border: 1px solid color-mix(in srgb, var(--primary, #2563eb) 25%, var(--border, #d8e1ec)); border-radius: 8px; background: var(--surface, #fff); color: var(--primary, #2563eb); font-size: .68rem; }
.promotion-edit-page .promo-product-toolbar { display: grid; grid-template-columns: minmax(260px, 1fr) auto auto; gap: 8px; align-items: center; }
.promotion-edit-page .promo-product-search { min-height: 38px; }
.promotion-edit-page .promo-product-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; max-height: 580px; overflow: auto; padding: 2px; }
.promotion-edit-page .promo-product-card { position: relative; min-height: 84px; display: grid !important; grid-template-columns: auto minmax(0, 1fr); align-items: start; gap: 10px; padding: 11px; border: 1px solid var(--border, #d8e1ec); border-radius: 11px; background: var(--surface, #fff); cursor: pointer; transition: border-color .15s ease, background .15s ease, box-shadow .15s ease; }
.promotion-edit-page .promo-product-card:hover { border-color: color-mix(in srgb, var(--primary, #2563eb) 50%, var(--border, #d8e1ec)); box-shadow: 0 7px 16px color-mix(in srgb, var(--text, #1f2937) 6%, transparent); }
.promotion-edit-page .promo-product-card > input { position: absolute; opacity: 0; pointer-events: none; }
.promotion-edit-page .promo-product-check { width: 21px; height: 21px; display: grid; place-items: center; border: 1px solid var(--border, #cbd5e1); border-radius: 6px; background: var(--surface, #fff); color: transparent; font-size: .68rem; font-weight: 950; }
.promotion-edit-page .promo-product-card:has(input:checked) { border-color: var(--primary, #2563eb); background: color-mix(in srgb, var(--primary, #2563eb) 7%, var(--surface, #fff)); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--primary, #2563eb) 20%, transparent); }
.promotion-edit-page .promo-product-card:has(input:checked) .promo-product-check { border-color: var(--primary, #2563eb); background: var(--primary, #2563eb); color: var(--primary-contrast, #fff); }
.promotion-edit-page .promo-product-copy { min-width: 0; display: grid; gap: 3px; }
.promotion-edit-page .promo-product-copy strong { overflow: hidden; font-size: .77rem; text-overflow: ellipsis; white-space: nowrap; }
.promotion-edit-page .promo-product-copy span,
.promotion-edit-page .promo-product-copy small { overflow: hidden; color: var(--muted, #64748b); font-size: .65rem; text-overflow: ellipsis; white-space: nowrap; }
.promotion-edit-page .promo-save-bar { position: sticky; bottom: 10px; z-index: 9; display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 13px 15px; background: color-mix(in srgb, var(--surface, #fff) 94%, transparent); backdrop-filter: blur(12px); }
.promotion-edit-page .promo-save-bar > div:first-child { display: grid; gap: 2px; }
.promotion-edit-page .promo-save-bar > div:first-child strong { font-size: .78rem; }
.promotion-edit-page .promo-save-bar > div:first-child span { color: var(--muted, #64748b); font-size: .68rem; }
.promotion-edit-page .promo-save-btn { min-width: 155px; }

/* Website Language Texts - Advanced ERP buttons and responsive editor */
.language-texts-page {
    display: grid;
    gap: 16px;
    padding: 18px 24px 34px;
    color: var(--text, var(--theme-text, #1f2937));
}
.language-texts-page .language-page-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
}
.language-texts-page .language-title-row { display: flex; align-items: flex-start; gap: 14px; margin-top: 8px; }
.language-texts-page .language-title-icon {
    width: 46px;
    height: 46px;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    border: 1px solid color-mix(in srgb, var(--primary, var(--theme-primary, #2563eb)) 30%, var(--border, #d8e1ec));
    border-radius: 14px;
    background: color-mix(in srgb, var(--primary, var(--theme-primary, #2563eb)) 9%, var(--surface, #fff));
    color: var(--primary, var(--theme-primary, #2563eb));
    font-size: 1.05rem;
    font-weight: 950;
}
.language-texts-page .language-title-row h1 { margin: 0; font-size: clamp(1.55rem, 2.6vw, 2.2rem); line-height: 1.12; }
.language-texts-page .language-title-row p { max-width: 830px; margin: 7px 0 0; color: var(--muted, var(--theme-muted, #64748b)); line-height: 1.55; }
.language-texts-page .language-title-meta { display: flex; gap: 5px; margin-bottom: 5px; }
.language-texts-page .language-title-meta span { min-width: 29px; display: inline-grid; place-items: center; padding: 4px 6px; border: 1px solid color-mix(in srgb, var(--primary, #2563eb) 21%, var(--border, #d8e1ec)); border-radius: 999px; background: color-mix(in srgb, var(--primary, #2563eb) 6%, var(--surface, #fff)); color: var(--primary, #2563eb); font-size: .63rem; font-weight: 900; }
.language-texts-page .language-head-actions,
.language-texts-page .language-filter-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.language-texts-page .language-action-btn {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 8px 13px;
    border: 1px solid var(--border, var(--theme-border, #d8e1ec));
    border-radius: 9px;
    background: var(--surface, var(--theme-card, #fff));
    color: var(--text, var(--theme-text, #1f2937));
    font: inherit;
    font-size: .78rem;
    font-weight: 850;
    line-height: 1;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    box-shadow: 0 5px 14px color-mix(in srgb, var(--text, #1f2937) 6%, transparent);
    transition: transform .16s ease, border-color .16s ease, background .16s ease, color .16s ease, box-shadow .16s ease;
}
.language-texts-page .language-action-btn:hover,
.language-texts-page .language-action-btn:focus-visible { border-color: var(--primary, var(--theme-primary, #2563eb)); background: color-mix(in srgb, var(--primary, #2563eb) 7%, var(--surface, #fff)); color: var(--primary, #2563eb); box-shadow: 0 8px 19px color-mix(in srgb, var(--primary, #2563eb) 14%, transparent); outline: none; transform: translateY(-1px); }
.language-texts-page .language-action-btn.primary { border-color: var(--primary, var(--theme-primary, #2563eb)); background: var(--primary, var(--theme-primary, #2563eb)); color: var(--primary-contrast, #fff); }
.language-texts-page .language-action-btn.primary:hover,
.language-texts-page .language-action-btn.primary:focus-visible { border-color: color-mix(in srgb, var(--primary, #2563eb) 78%, #000); background: color-mix(in srgb, var(--primary, #2563eb) 88%, #000); color: var(--primary-contrast, #fff); }
.language-texts-page .language-action-btn.ghost { border-color: transparent; background: transparent; color: var(--muted, #64748b); box-shadow: none; }
.language-texts-page .language-action-btn.ghost:hover,
.language-texts-page .language-action-btn.ghost:focus-visible { border-color: var(--border, #d8e1ec); background: color-mix(in srgb, var(--surface, #fff) 94%, var(--primary, #2563eb)); color: var(--text, #1f2937); }
.language-texts-page .language-action-btn.compact { min-width: 78px; min-height: 36px; padding: 7px 10px; font-size: .72rem; }
.language-texts-page .language-action-btn:disabled,
.language-texts-page .language-action-btn.is-busy { border-color: var(--border, #d8e1ec) !important; background: color-mix(in srgb, var(--surface, #fff) 90%, var(--muted, #64748b)) !important; color: var(--muted, #64748b) !important; box-shadow: none !important; cursor: wait; opacity: .78; transform: none; }
.language-texts-page .language-message { display: flex; align-items: center; gap: 11px; }
.language-texts-page .language-message > div { display: grid; gap: 2px; }
.language-texts-page .language-alert-icon { width: 32px; height: 32px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 9px; background: color-mix(in srgb, currentColor 9%, var(--surface, #fff)); font-weight: 950; }
.language-texts-page .language-import-card,
.language-texts-page .language-register-card { border: 1px solid var(--border, var(--theme-border, #d8e1ec)); border-radius: 14px; background: var(--surface, var(--theme-card, #fff)); box-shadow: 0 8px 22px color-mix(in srgb, var(--text, #1f2937) 5%, transparent); }
.language-texts-page .language-import-card { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 16px 18px; }
.language-texts-page .language-import-copy { min-width: 0; display: flex; align-items: center; gap: 13px; }
.language-texts-page .language-import-copy > div { min-width: 0; }
.language-texts-page .language-import-copy h2,
.language-texts-page .language-register-heading h2 { margin: 3px 0 0; font-size: 1.03rem; }
.language-texts-page .language-import-copy p,
.language-texts-page .language-register-heading p { margin: 4px 0 0; color: var(--muted, #64748b); font-size: .73rem; line-height: 1.45; }
.language-texts-page .language-import-icon { width: 44px; height: 44px; flex: 0 0 auto; display: grid; place-items: center; border: 1px solid color-mix(in srgb, #027a48 25%, var(--border, #d8e1ec)); border-radius: 12px; background: color-mix(in srgb, #027a48 9%, var(--surface, #fff)); color: #027a48; font-size: .75rem; font-weight: 950; }
.language-texts-page .language-kicker { color: var(--primary, var(--theme-primary, #2563eb)); font-size: .67rem; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }
.language-texts-page .language-import-form { display: flex; align-items: center; gap: 8px; }
.language-texts-page .language-file-picker { position: relative; min-width: 340px; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 9px; min-height: 54px; padding: 8px 9px; border: 1px dashed color-mix(in srgb, var(--primary, #2563eb) 38%, var(--border, #d8e1ec)); border-radius: 10px; background: color-mix(in srgb, var(--surface, #fff) 96%, var(--primary, #2563eb)); cursor: pointer; }
.language-texts-page .language-file-picker input { position: absolute; width: 1px; height: 1px; overflow: hidden; opacity: 0; pointer-events: none; }
.language-texts-page .language-file-icon { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 9px; background: color-mix(in srgb, var(--primary, #2563eb) 10%, var(--surface, #fff)); color: var(--primary, #2563eb); font-weight: 900; }
.language-texts-page .language-file-picker > span:nth-of-type(2) { min-width: 0; display: grid; gap: 2px; }
.language-texts-page .language-file-picker strong { font-size: .72rem; }
.language-texts-page .language-file-picker small { overflow: hidden; color: var(--muted, #64748b); font-size: .63rem; text-overflow: ellipsis; white-space: nowrap; }
.language-texts-page .language-file-picker b { padding: 6px 8px; border: 1px solid color-mix(in srgb, var(--primary, #2563eb) 24%, var(--border, #d8e1ec)); border-radius: 8px; background: var(--surface, #fff); color: var(--primary, #2563eb); font-size: .66rem; }
.language-texts-page .language-register-card { overflow: hidden; }
.language-texts-page .language-register-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 16px 18px; border-bottom: 1px solid var(--border, #d8e1ec); background: color-mix(in srgb, var(--surface, #fff) 96%, var(--primary, #2563eb)); }
.language-texts-page .language-count { display: inline-flex; align-items: center; justify-content: center; min-height: 29px; padding: 5px 9px; border: 1px solid color-mix(in srgb, var(--primary, #2563eb) 22%, var(--border, #d8e1ec)); border-radius: 999px; background: color-mix(in srgb, var(--primary, #2563eb) 7%, var(--surface, #fff)); color: var(--primary, #2563eb); font-size: .69rem; font-weight: 850; white-space: nowrap; }
.language-texts-page .language-filter-bar { display: grid; grid-template-columns: minmax(280px, 1fr) 205px auto; align-items: end; gap: 10px; padding: 13px 18px; border-bottom: 1px solid var(--border, #d8e1ec); }
.language-texts-page .language-filter-bar > label { display: grid; gap: 6px; margin: 0; font-size: .74rem; font-weight: 800; }
.language-texts-page .language-search-field > div { display: grid; grid-template-columns: auto 1fr; align-items: center; overflow: hidden; border: 1px solid var(--border, #cbd5e1); border-radius: 9px; background: var(--input-bg, var(--surface, #fff)); }
.language-texts-page .language-search-field > div > span { padding-left: 10px; color: var(--muted, #64748b); font-size: 1rem; }
.language-texts-page .language-filter-bar input,
.language-texts-page .language-filter-bar select { width: 100%; min-height: 40px; padding: 8px 10px; border: 1px solid var(--border, #cbd5e1); border-radius: 9px; background: var(--input-bg, var(--surface, #fff)); color: var(--text, #1f2937); font: inherit; }
.language-texts-page .language-search-field input { border: 0; border-radius: 0; }
.language-texts-page .language-filter-bar input:focus,
.language-texts-page .language-filter-bar select:focus,
.language-texts-page .language-search-field > div:focus-within { border-color: var(--primary, #2563eb); outline: 3px solid color-mix(in srgb, var(--primary, #2563eb) 13%, transparent); }
.language-texts-page .language-table-wrap { overflow-x: auto; }
.language-texts-page .language-table { width: 100%; min-width: 1220px; border-collapse: collapse; }
.language-texts-page .language-table th,
.language-texts-page .language-table td { padding: 11px 12px; border-bottom: 1px solid var(--border, #e5e7eb); text-align: left; vertical-align: top; }
.language-texts-page .language-table th { background: color-mix(in srgb, var(--surface, #fff) 93%, var(--primary, #2563eb)); color: var(--muted, #64748b); font-size: .68rem; font-weight: 900; letter-spacing: .05em; text-transform: uppercase; }
.language-texts-page .language-table tbody tr:hover { background: color-mix(in srgb, var(--surface, #fff) 97%, var(--primary, #2563eb)); }
.language-texts-page .language-table tbody tr:last-child td { border-bottom: 0; }
.language-texts-page .language-table td:first-child { width: 255px; }
.language-texts-page .language-screen,
.language-texts-page .language-table code,
.language-texts-page .language-table td:first-child small { display: block; }
.language-texts-page .language-screen { color: var(--primary, #2563eb); font-size: .62rem; font-weight: 900; letter-spacing: .06em; text-transform: uppercase; }
.language-texts-page .language-table code { margin: 6px 0; color: var(--text, #1f2937); font-size: .72rem; font-weight: 850; word-break: break-word; }
.language-texts-page .language-table td:first-child small { color: var(--muted, #64748b); font-size: .65rem; line-height: 1.4; }
.language-texts-page .language-row-form { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)) 82px 86px; gap: 8px; align-items: end; }
.language-texts-page .language-row-form > label:not(.language-active-switch) { display: grid; gap: 5px; margin: 0; }
.language-texts-page .language-row-form > label:not(.language-active-switch) > span { display: none; color: var(--muted, #64748b); font-size: .65rem; font-weight: 800; }
.language-texts-page .language-row-form textarea { width: 100%; min-height: 74px; resize: vertical; padding: 8px 9px; border: 1px solid var(--border, #cbd5e1); border-radius: 9px; background: var(--input-bg, var(--surface, #fff)); color: var(--text, #1f2937); font: inherit; font-size: .73rem; line-height: 1.4; }
.language-texts-page .language-row-form textarea:focus { border-color: var(--primary, #2563eb); outline: 3px solid color-mix(in srgb, var(--primary, #2563eb) 12%, transparent); }
.language-texts-page .language-row-form textarea.is-missing { border-color: color-mix(in srgb, #b54708 55%, var(--border, #d8e1ec)); background: color-mix(in srgb, #fdb022 9%, var(--surface, #fff)) !important; }
.language-texts-page .language-active-switch { min-height: 74px; display: grid; place-items: center; align-content: center; gap: 5px; margin: 0; border: 1px solid var(--border, #d8e1ec); border-radius: 9px; background: color-mix(in srgb, var(--surface, #fff) 96%, var(--primary, #2563eb)); cursor: pointer; }
.language-texts-page .language-active-switch input { position: absolute; opacity: 0; pointer-events: none; }
.language-texts-page .language-active-switch > span { width: 31px; height: 18px; position: relative; border-radius: 999px; background: color-mix(in srgb, var(--muted, #64748b) 32%, var(--surface, #fff)); transition: background .16s ease; }
.language-texts-page .language-active-switch > span::after { content: ""; position: absolute; top: 3px; left: 3px; width: 12px; height: 12px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(15, 23, 42, .24); transition: transform .16s ease; }
.language-texts-page .language-active-switch:has(input:checked) > span { background: var(--primary, #2563eb); }
.language-texts-page .language-active-switch:has(input:checked) > span::after { transform: translateX(13px); }
.language-texts-page .language-active-switch b { color: var(--muted, #64748b); font-size: .63rem; }
.language-texts-page .language-empty { min-height: 250px; display: grid; place-items: center; align-content: center; gap: 7px; padding: 30px; text-align: center; color: var(--muted, #64748b); }
.language-texts-page .language-empty > span { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 14px; background: color-mix(in srgb, var(--primary, #2563eb) 8%, var(--surface, #fff)); color: var(--primary, #2563eb); font-weight: 950; }
.language-texts-page .language-empty strong { color: var(--text, #1f2937); }

@media (max-width: 1180px) {
    .promotion-advanced-page .promo-summary-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .promotion-edit-page .promo-form-grid.four { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .promotion-edit-page .promo-product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .language-texts-page .language-import-card { align-items: stretch; flex-direction: column; }
    .language-texts-page .language-import-form { justify-content: flex-end; }
}
@media (max-width: 900px) {
    .promotion-advanced-page .promo-page-head,
    .promotion-edit-page .promo-editor-intro,
    .promotion-edit-page .promo-save-bar,
    .language-texts-page .language-page-head,
    .language-texts-page .language-register-heading { align-items: stretch; flex-direction: column; }
    .promotion-advanced-page .promo-head-actions,
    .language-texts-page .language-head-actions { justify-content: flex-start; }
    .promotion-advanced-page .promo-filter-panel,
    .language-texts-page .language-filter-bar { grid-template-columns: 1fr 190px; }
    .promotion-advanced-page .promo-filter-actions,
    .language-texts-page .language-filter-actions { grid-column: 1 / -1; }
    .promotion-edit-page .promo-form-grid.three { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .promotion-edit-page .promo-image-editor { grid-template-columns: 1fr; }
    .promotion-edit-page .promo-product-toolbar { grid-template-columns: 1fr auto auto; }
    .language-texts-page .language-import-form { align-items: stretch; flex-direction: column; }
    .language-texts-page .language-file-picker { min-width: 0; width: 100%; }
}
@media (max-width: 650px) {
    .promotion-advanced-page,
    .language-texts-page { padding: 12px 10px 26px; }
    .promotion-advanced-page .promo-title-row,
    .language-texts-page .language-title-row { gap: 10px; }
    .promotion-advanced-page .promo-title-icon,
    .language-texts-page .language-title-icon { width: 39px; height: 39px; border-radius: 12px; }
    .promotion-advanced-page .promo-head-actions,
    .language-texts-page .language-head-actions { align-items: stretch; flex-direction: column; }
    .promotion-advanced-page .promo-head-actions .promo-btn,
    .language-texts-page .language-head-actions .language-action-btn { width: 100%; }
    .promotion-advanced-page .promo-summary-grid { grid-template-columns: 1fr 1fr; }
    .promotion-advanced-page .promo-filter-panel,
    .language-texts-page .language-filter-bar { grid-template-columns: 1fr; }
    .promotion-advanced-page .promo-filter-actions,
    .language-texts-page .language-filter-actions { grid-column: auto; }
    .promotion-edit-page .promo-section-head { align-items: flex-start; flex-wrap: wrap; }
    .promotion-edit-page .promo-section-head > div { min-width: calc(100% - 58px); }
    .promotion-edit-page .promo-section-badge { margin-left: 49px; }
    .promotion-edit-page .promo-section-body { padding: 14px; }
    .promotion-edit-page .promo-form-grid.two,
    .promotion-edit-page .promo-form-grid.three,
    .promotion-edit-page .promo-form-grid.four,
    .promotion-edit-page .promo-rule-panel.active,
    .promotion-edit-page .promo-product-grid { grid-template-columns: 1fr; }
    .promotion-edit-page .promo-rule-workspace-head { align-items: flex-start; flex-direction: column; }
    .promotion-edit-page .promo-language-tabs { grid-template-columns: repeat(3, 1fr); }
    .promotion-edit-page .promo-language-tab { grid-template-columns: 1fr; justify-items: center; text-align: center; }
    .promotion-edit-page .promo-product-toolbar { grid-template-columns: 1fr 1fr; }
    .promotion-edit-page .promo-product-search { grid-column: 1 / -1; }
    .promotion-edit-page .promo-save-actions { width: 100%; }
    .promotion-edit-page .promo-save-actions .promo-btn { flex: 1; }
    .language-texts-page .language-import-copy { align-items: flex-start; }
}
@media (max-width: 430px) {
    .promotion-advanced-page .promo-summary-grid { grid-template-columns: 1fr; }
    .promotion-edit-page .promo-language-tabs { grid-template-columns: 1fr; }
    .promotion-edit-page .promo-language-tab { grid-template-columns: auto 1fr; justify-items: stretch; text-align: left; }
    .promotion-edit-page .promo-product-toolbar { grid-template-columns: 1fr; }
    .promotion-edit-page .promo-product-search { grid-column: auto; }
    .promotion-edit-page .promo-save-actions { align-items: stretch; flex-direction: column-reverse; }
    .language-texts-page .language-file-picker { grid-template-columns: auto minmax(0, 1fr); }
    .language-texts-page .language-file-picker b { grid-column: 2; justify-self: start; }
}

/* Shared ERP select presenter: bounded, searchable dropdowns for normal single-select fields.
   The original select remains in the form for validation/submission and can opt out with
   data-erp-native-select="true". */
.erp-select-presenter {
    position: relative;
    display: inline-grid;
    grid-template-columns: minmax(0, 1fr);
    min-width: min(100%, var(--erp-select-source-width, 132px));
    width: var(--erp-select-source-width, auto);
    max-width: 100%;
    vertical-align: middle;
    box-sizing: border-box;
}
.erp-select-presenter.erp-select-fill { width: 100%; min-width: 0; }
.erp-select-presenter > select.erp-select-native-source {
    position: absolute !important;
    inset: 0 !important;
    width: 1px !important;
    height: 1px !important;
    min-width: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    opacity: 0 !important;
    pointer-events: none !important;
    clip-path: inset(50%) !important;
    overflow: hidden !important;
}
.erp-select-trigger {
    appearance: none;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 24px;
    align-items: center;
    gap: 5px;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 36px;
    margin: 0 !important;
    padding: 7px 7px 7px 11px !important;
    border: 1px solid var(--border, #cbd5e1) !important;
    border-radius: 8px !important;
    background: var(--card, #fff) !important;
    color: var(--text, #172033) !important;
    box-shadow: none !important;
    font: inherit;
    font-weight: 600 !important;
    line-height: 1.25 !important;
    text-align: left !important;
    cursor: pointer;
    box-sizing: border-box;
}
.erp-select-trigger:hover,
.erp-select-presenter.is-open .erp-select-trigger {
    border-color: var(--theme-primary, var(--brand, #2563eb)) !important;
    background: color-mix(in srgb, var(--theme-primary, var(--brand, #2563eb)) 4%, var(--card, #fff)) !important;
}
.erp-select-trigger:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--theme-primary, var(--brand, #2563eb)) 34%, transparent) !important;
    outline-offset: 1px;
    border-color: var(--theme-primary, var(--brand, #2563eb)) !important;
}
.erp-select-trigger:disabled,
.erp-select-presenter.is-disabled .erp-select-trigger {
    cursor: not-allowed;
    opacity: .68;
    background: var(--soft, #f1f5f9) !important;
}
.erp-select-trigger-value {
    display: block;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: inherit !important;
}
.erp-select-trigger-arrow {
    display: grid;
    place-items: center;
    width: 24px;
    height: 24px;
    border-left: 1px solid color-mix(in srgb, var(--border, #cbd5e1) 75%, transparent);
    color: var(--muted, #64748b) !important;
    font-size: 14px;
    line-height: 1;
    transition: transform .14s ease;
}
.erp-select-presenter.is-open .erp-select-trigger-arrow { transform: rotate(180deg); }
.erp-select-presenter.erp-select-compact .erp-select-trigger {
    min-height: 30px;
    padding: 4px 5px 4px 8px !important;
    border-radius: 6px !important;
    font-size: 12px;
}
.erp-select-presenter.erp-select-compact .erp-select-trigger-arrow { width: 20px; height: 20px; }

.erp-select-portal {
    position: fixed !important;
    z-index: 2147483000 !important;
    display: flex !important;
    flex-direction: column;
    gap: 6px;
    box-sizing: border-box !important;
    margin: 0 !important;
    padding: 6px !important;
    border: 1px solid color-mix(in srgb, var(--theme-primary, var(--brand, #2563eb)) 22%, var(--border, #cbd5e1)) !important;
    border-radius: 10px !important;
    background: var(--card, #fff) !important;
    color: var(--text, #172033) !important;
    box-shadow: 0 18px 46px rgba(15, 23, 42, .22) !important;
    overflow: hidden !important;
    isolation: isolate;
}
.erp-select-portal[hidden] { display: none !important; }
.erp-select-search-shell {
    display: grid;
    grid-template-columns: 24px minmax(0, 1fr);
    align-items: center;
    min-height: 38px;
    border: 1px solid var(--border, #cbd5e1);
    border-radius: 7px;
    background: var(--soft, #f8fafc);
    overflow: hidden;
}
.erp-select-search-shell[hidden] { display: none !important; }
.erp-select-search-icon {
    display: grid;
    place-items: center;
    color: var(--muted, #64748b);
    font-size: 14px;
}
.erp-select-search {
    appearance: none;
    width: 100% !important;
    min-width: 0 !important;
    height: 36px !important;
    margin: 0 !important;
    padding: 6px 8px 6px 0 !important;
    border: 0 !important;
    outline: 0 !important;
    background: transparent !important;
    color: var(--text, #172033) !important;
    box-shadow: none !important;
    font: inherit;
}
.erp-select-listbox {
    display: flex;
    flex-direction: column;
    min-height: 0;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
    outline: 0;
}
.erp-select-listbox[hidden] { display: none !important; }
.erp-select-group {
    padding: 8px 9px 4px;
    color: var(--muted, #64748b);
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .06em;
    text-transform: uppercase;
}
.erp-select-option {
    appearance: none;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 22px;
    align-items: center;
    gap: 6px;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 36px;
    margin: 0 !important;
    padding: 7px 7px 7px 10px !important;
    border: 0 !important;
    border-radius: 6px !important;
    background: transparent !important;
    color: var(--text, #172033) !important;
    box-shadow: none !important;
    font: inherit;
    font-size: 13px;
    font-weight: 650 !important;
    line-height: 1.25 !important;
    text-align: left !important;
    cursor: pointer;
}
.erp-select-option:hover,
.erp-select-option.is-active {
    background: color-mix(in srgb, var(--theme-primary, var(--brand, #2563eb)) 9%, var(--card, #fff)) !important;
    color: var(--theme-primary, var(--brand, #2563eb)) !important;
}
.erp-select-option.is-selected {
    background: color-mix(in srgb, var(--theme-primary, var(--brand, #2563eb)) 14%, var(--card, #fff)) !important;
    color: var(--theme-primary, var(--brand, #2563eb)) !important;
    font-weight: 850 !important;
}
.erp-select-option:disabled {
    cursor: not-allowed;
    opacity: .5;
}
.erp-select-option-text {
    display: block;
    min-width: 0;
    overflow-wrap: anywhere;
    white-space: normal;
}
.erp-select-option-check {
    display: grid;
    place-items: center;
    color: var(--theme-primary, var(--brand, #2563eb));
    font-weight: 950;
}
.erp-select-empty {
    padding: 16px 10px;
    color: var(--muted, #64748b);
    font-size: 13px;
    font-weight: 700;
    text-align: center;
}
.erp-select-empty[hidden] { display: none !important; }

/* Keep wrappers aligned on existing report, request, toolbar and form layouts. */
.daily-summary-filter-strip label > .erp-select-presenter,
.daily-sales-filter-strip label > .erp-select-presenter,
.odoo-row > .erp-select-presenter,
.payment-field > .erp-select-presenter,
.erp-form-field > .erp-select-presenter,
.form-field > .erp-select-presenter { width: 100%; min-width: 0; }
.cr-filters > .erp-select-presenter { min-width: 190px; width: auto; }
.daily-summary-filter-strip .erp-select-trigger,
.daily-sales-filter-strip .erp-select-trigger { min-height: 38px; border-radius: 8px !important; }

body.theme-dark .erp-select-portal,
body.theme-midnight .erp-select-portal,
body.theme-carbon .erp-select-portal {
    box-shadow: 0 20px 52px rgba(0, 0, 0, .46) !important;
}
@media (max-width: 720px) {
    .erp-select-presenter:not(.erp-select-compact) { width: 100%; min-width: 0; }
    .erp-select-portal { border-radius: 9px !important; }
    .cr-filters > .erp-select-presenter { width: 100%; min-width: 0; }
}

/* E-Commerce Website Pages & Footer Quick Links */
.website-content-admin{display:grid;gap:18px;padding-bottom:34px;color:var(--text,var(--theme-text,#1f2937))}
.website-content-command{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:20px;border:1px solid var(--border,var(--theme-border,#d8e1ec));border-radius:16px;background:var(--surface,var(--theme-card,#fff));box-shadow:0 9px 24px color-mix(in srgb,var(--text,#1f2937) 6%,transparent)}
.website-content-command h1{margin:4px 0 5px;font-size:clamp(1.55rem,2.4vw,2.2rem)}
.website-content-command p{margin:0;color:var(--muted,var(--theme-muted,#64748b))}
.website-content-kicker{font-size:.7rem;font-weight:900;letter-spacing:.1em;text-transform:uppercase;color:var(--primary,var(--theme-primary,#2563eb))}
.website-content-command-actions,.website-content-save-row,.website-content-row-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.website-content-btn{min-height:38px;display:inline-flex;align-items:center;justify-content:center;padding:8px 13px;border:1px solid transparent;border-radius:9px;font:inherit;font-size:.75rem;font-weight:850;text-decoration:none;cursor:pointer}
.website-content-btn.primary{background:var(--primary,var(--theme-primary,#2563eb));color:var(--primary-contrast,#fff)}
.website-content-btn.primary:hover,.website-content-btn.primary:focus-visible{background:var(--primary-dark,var(--theme-primary-dark,#1d4ed8));outline:none}
.website-content-btn.secondary{border-color:var(--border,var(--theme-border,#cbd5e1));background:var(--surface,var(--theme-card,#fff));color:var(--text,var(--theme-text,#1f2937))}
.website-content-btn.secondary:hover,.website-content-btn.secondary:focus-visible{border-color:var(--primary,var(--theme-primary,#2563eb));color:var(--primary,var(--theme-primary,#2563eb));outline:none}
.website-content-alert,.website-content-validation:not(:empty){padding:12px 14px;border:1px solid color-mix(in srgb,var(--primary,#2563eb) 25%,var(--border,#d8e1ec));border-radius:11px;background:color-mix(in srgb,var(--primary,#2563eb) 7%,var(--surface,#fff));font-size:.78rem;font-weight:750}
.website-content-validation:empty{display:none}.website-content-validation ul{margin:0;padding-left:18px}
.website-content-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.website-content-kpis article{display:flex;align-items:center;gap:11px;padding:14px;border:1px solid var(--border,var(--theme-border,#d8e1ec));border-radius:13px;background:var(--surface,var(--theme-card,#fff))}
.website-content-kpis article>span{width:38px;height:38px;display:grid;place-items:center;border-radius:10px;background:color-mix(in srgb,var(--primary,#2563eb) 9%,var(--surface,#fff));color:var(--primary,var(--theme-primary,#2563eb));font-weight:900}
.website-content-kpis strong,.website-content-kpis small{display:block}.website-content-kpis strong{font-size:1.25rem;line-height:1}.website-content-kpis small{margin-top:5px;color:var(--muted,var(--theme-muted,#64748b));font-size:.68rem}
.website-content-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(390px,.8fr);gap:16px;align-items:start}
.website-content-grid.footer-grid{grid-template-columns:minmax(430px,.9fr) minmax(0,1.1fr)}
.website-content-card{overflow:hidden;border:1px solid var(--border,var(--theme-border,#d8e1ec));border-radius:15px;background:var(--surface,var(--theme-card,#fff));box-shadow:0 8px 22px color-mix(in srgb,var(--text,#1f2937) 5%,transparent)}
.website-content-card-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:15px 17px;border-bottom:1px solid var(--border,var(--theme-border,#d8e1ec));background:color-mix(in srgb,var(--surface,#fff) 96%,var(--primary,#2563eb))}
.website-content-card-head span:first-child{font-size:.66rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:var(--primary,var(--theme-primary,#2563eb))}
.website-content-card-head h2{margin:3px 0 0;font-size:1.02rem}.website-content-state{padding:5px 8px;border:1px solid var(--border,#d8e1ec);border-radius:999px;color:var(--muted,#64748b);font-size:.65rem;font-weight:850;white-space:nowrap}
.website-content-form{display:grid;gap:13px;padding:16px 17px}.website-content-form>label,.website-content-fields label,.website-content-destination label,.website-language-panel>label{display:grid;gap:6px;margin:0;font-size:.73rem;font-weight:800}
.website-content-form label>span,.website-language-panel label>span{color:var(--text,var(--theme-text,#1f2937))}.website-content-form label small{color:var(--muted,var(--theme-muted,#64748b));font-size:.63rem;font-weight:600}
.website-content-form input,.website-content-form select,.website-content-form textarea{width:100%;min-height:39px;padding:8px 10px;border:1px solid var(--border,var(--theme-border,#cbd5e1));border-radius:9px;background:var(--input-bg,var(--surface,#fff));color:var(--text,var(--theme-text,#1f2937));font:inherit}
.website-content-form textarea{resize:vertical;line-height:1.5}.website-content-form input:focus,.website-content-form select:focus,.website-content-form textarea:focus{border-color:var(--primary,var(--theme-primary,#2563eb));outline:3px solid color-mix(in srgb,var(--primary,#2563eb) 12%,transparent)}
.website-content-fields{display:grid;gap:10px}.website-content-fields.two{grid-template-columns:repeat(2,minmax(0,1fr))}.website-content-fields.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.website-content-toggle{display:flex!important;align-items:flex-start;gap:10px;padding:11px;border:1px solid var(--border,var(--theme-border,#d8e1ec));border-radius:10px;background:color-mix(in srgb,var(--surface,#fff) 97%,var(--primary,#2563eb))}.website-content-toggle input{width:18px!important;min-height:18px!important;margin-top:1px}.website-content-toggle strong,.website-content-toggle small{display:block}.website-content-toggle small{margin-top:3px}
.website-language-tabs{display:flex;gap:7px;padding-top:2px;border-bottom:1px solid var(--border,var(--theme-border,#d8e1ec))}.website-language-tabs button{display:flex;align-items:center;gap:6px;padding:8px 11px;border:0;border-bottom:2px solid transparent;background:transparent;color:var(--muted,var(--theme-muted,#64748b));font:inherit;font-size:.7rem;font-weight:900;cursor:pointer}.website-language-tabs button span{font-size:.62rem;font-weight:650}.website-language-tabs button.active{border-bottom-color:var(--primary,var(--theme-primary,#2563eb));color:var(--primary,var(--theme-primary,#2563eb))}
.website-language-panel{display:none;gap:11px}.website-language-panel.active{display:grid}.website-content-save-row{justify-content:flex-end;padding-top:2px}
.website-content-table-wrap{overflow:auto}.website-content-table{width:100%;min-width:650px;border-collapse:collapse}.website-content-table th,.website-content-table td{padding:10px 11px;border-bottom:1px solid var(--border,var(--theme-border,#e5e7eb));text-align:left;vertical-align:middle}.website-content-table th{background:color-mix(in srgb,var(--surface,#fff) 94%,var(--primary,#2563eb));color:var(--muted,var(--theme-muted,#64748b));font-size:.65rem;font-weight:900;letter-spacing:.05em;text-transform:uppercase}.website-content-table td{font-size:.72rem}.website-content-table td strong,.website-content-table td span{display:block}.website-content-table td>span{margin-top:4px;color:var(--muted,var(--theme-muted,#64748b));font-size:.64rem}
.website-content-pill{display:inline-flex!important;width:max-content;padding:4px 7px;border-radius:999px;font-size:.62rem!important;font-weight:850}.website-content-pill.active{color:#027a48;background:color-mix(in srgb,#027a48 10%,var(--surface,#fff))}.website-content-pill.inactive{color:#667085;background:color-mix(in srgb,#667085 10%,var(--surface,#fff))}
.website-content-row-actions{flex-wrap:nowrap}.website-content-row-actions form{margin:0}.website-content-row-actions a,.website-content-row-actions button{padding:5px 7px;border:1px solid var(--border,#d8e1ec);border-radius:7px;background:var(--surface,#fff);color:var(--text,#1f2937);font:inherit;font-size:.63rem;font-weight:800;white-space:nowrap;cursor:pointer}.website-content-row-actions .danger{color:#b42318}.website-content-empty{display:grid;gap:5px;padding:32px;text-align:center;color:var(--muted,#64748b)}.website-content-empty strong{color:var(--text,#1f2937)}
.website-content-destination[hidden]{display:none!important}.website-content-destination-badge{display:inline-flex!important;width:max-content;margin:0 5px 0 0!important;padding:3px 6px;border-radius:6px;background:color-mix(in srgb,var(--primary,#2563eb) 8%,var(--surface,#fff));color:var(--primary,#2563eb)!important;font-size:.6rem!important;font-weight:850}
@media(max-width:1180px){.website-content-grid,.website-content-grid.footer-grid{grid-template-columns:1fr}.website-content-page-register{order:-1}}
@media(max-width:760px){.website-content-command{align-items:flex-start;flex-direction:column}.website-content-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.website-content-fields.two,.website-content-fields.three{grid-template-columns:1fr}.website-content-command-actions{width:100%}.website-content-command-actions .website-content-btn{flex:1}.website-language-tabs{overflow-x:auto}.website-content-table{min-width:580px}}

/* Website Content restored page banners and rich description editor */
.website-content-banner-editor{display:grid;grid-template-columns:minmax(320px,1.15fr) minmax(280px,.85fr);gap:14px;padding:14px;border:1px solid var(--border,var(--theme-border,#d8e1ec));border-radius:13px;background:color-mix(in srgb,var(--surface,#fff) 97%,var(--primary,#2563eb))}
.website-content-banner-preview{position:relative;isolation:isolate;min-height:220px;overflow:hidden;display:flex;align-items:flex-end;padding:24px;border:1px dashed var(--border,var(--theme-border,#cbd5e1));border-radius:12px;background-color:color-mix(in srgb,var(--surface,#fff) 90%,var(--primary,#2563eb));background-position:center;background-size:cover}
.website-content-banner-preview.has-image{border-style:solid;color:#fff}.website-content-banner-overlay{position:absolute;inset:0;z-index:-1;background:transparent}.website-content-banner-preview.has-image .website-content-banner-overlay{background:rgba(8,12,20,.58)}
.website-content-banner-preview-copy{position:relative;z-index:1;display:grid;gap:7px;max-width:92%}.website-content-banner-preview-copy>span{font-size:.62rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:var(--primary,var(--theme-primary,#2563eb))}.website-content-banner-preview-copy>strong{font-size:clamp(1.35rem,2.3vw,2rem);line-height:1.05}.website-content-banner-preview-copy>p{margin:0;color:var(--muted,var(--theme-muted,#64748b));font-size:.76rem;line-height:1.5}.website-content-banner-preview.has-image .website-content-banner-preview-copy>span,.website-content-banner-preview.has-image .website-content-banner-preview-copy>strong,.website-content-banner-preview.has-image .website-content-banner-preview-copy>p{color:#fff;text-shadow:0 2px 14px rgba(0,0,0,.45)}
.website-content-banner-empty{position:absolute;top:10px;right:10px;z-index:2;display:flex;gap:5px;padding:5px 8px;border:1px solid var(--border,var(--theme-border,#cbd5e1));border-radius:999px;background:color-mix(in srgb,var(--surface,#fff) 94%,transparent);color:var(--muted,var(--theme-muted,#64748b));font-size:.58rem}.website-content-banner-empty strong{color:var(--text,var(--theme-text,#1f2937))}.website-content-banner-fields{display:grid;align-content:start;gap:11px}.website-content-toggle.compact{padding:9px}.website-content-initial-hidden{display:none!important}
.website-content-rich-label{display:grid!important;gap:6px}.website-content-rich-label>small{color:var(--muted,var(--theme-muted,#64748b));font-size:.64rem;font-weight:600}.website-content-rich-toolbar{display:flex;align-items:center;gap:5px;flex-wrap:wrap;padding:7px;border:1px solid var(--border,var(--theme-border,#cbd5e1));border-bottom:0;border-radius:10px 10px 0 0;background:color-mix(in srgb,var(--surface,#fff) 94%,var(--primary,#2563eb))}.website-content-rich-toolbar button{min-width:32px;min-height:29px;padding:4px 7px;border:1px solid var(--border,var(--theme-border,#cbd5e1));border-radius:6px;background:var(--surface,var(--theme-card,#fff));color:var(--text,var(--theme-text,#1f2937));font:inherit;font-size:.67rem;font-weight:800;cursor:pointer}.website-content-rich-toolbar button:hover,.website-content-rich-toolbar button:focus-visible{border-color:var(--primary,var(--theme-primary,#2563eb));color:var(--primary,var(--theme-primary,#2563eb));outline:none}.website-content-rich-editor{min-height:230px;max-height:560px;overflow:auto;padding:14px;border:1px solid var(--border,var(--theme-border,#cbd5e1));border-radius:0 0 10px 10px;background:var(--input-bg,var(--surface,#fff));color:var(--text,var(--theme-text,#1f2937));font-family:inherit;font-size:.78rem;font-weight:400;line-height:1.65;white-space:normal}.website-content-rich-editor:focus{border-color:var(--primary,var(--theme-primary,#2563eb));outline:3px solid color-mix(in srgb,var(--primary,#2563eb) 12%,transparent)}.website-content-rich-editor:empty:before{content:'Type normally or paste formatted content here…';color:var(--muted,var(--theme-muted,#94a3b8));pointer-events:none}.website-content-rich-editor img{max-width:100%;height:auto}.website-content-rich-editor table{max-width:100%;border-collapse:collapse}.website-content-rich-editor td,.website-content-rich-editor th{border:1px solid var(--border,var(--theme-border,#cbd5e1));padding:6px}.website-content-media-state{display:inline-flex!important;width:max-content;margin-top:5px!important;padding:3px 6px;border-radius:6px;background:color-mix(in srgb,var(--primary,#2563eb) 9%,var(--surface,#fff));color:var(--primary,var(--theme-primary,#2563eb))!important;font-size:.59rem!important;font-weight:850}
@media(max-width:760px){.website-content-banner-editor{grid-template-columns:1fr}.website-content-banner-preview{min-height:190px;padding:20px}.website-content-rich-editor{min-height:190px}}


/* ERPWebStore Contact Messages + SMTP Communications Phase 1 */
.erp-notification-slot{display:flex;gap:8px;align-items:center}.erp-email-notification{background:color-mix(in srgb,var(--theme-accent,#6b4eff) 13%,var(--surface,#fff))}.comm-page{padding:20px;display:grid;gap:18px}.comm-command{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;padding:24px;border:1px solid var(--border-color,#d5dbea);border-radius:18px;background:var(--card-bg,#fff)}.comm-command span{font-size:.76rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--theme-accent,#5b54d6)}.comm-command h1{margin:.25rem 0;font-size:clamp(1.8rem,4vw,2.7rem)}.comm-command p{margin:0;color:var(--muted-color,#667085)}.comm-command>div:last-child{display:flex;gap:8px}.comm-command form{display:inline}.comm-btn{display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:0 15px;border-radius:10px;border:1px solid var(--border-color,#ccd4e2);font-weight:800;text-decoration:none;cursor:pointer}.comm-btn.primary{background:var(--theme-accent,#273a5b);border-color:transparent;color:#fff}.comm-btn.secondary{background:var(--card-bg,#fff);color:inherit}.comm-kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.comm-kpis article{padding:18px;border:1px solid var(--border-color,#d5dbea);border-radius:15px;background:var(--card-bg,#fff)}.comm-kpis strong{display:block;font-size:1.7rem}.comm-kpis span{color:var(--muted-color,#667085)}.comm-toolbar{display:flex;justify-content:space-between;gap:16px;align-items:center}.comm-toolbar nav{display:flex;gap:7px}.comm-toolbar nav a{padding:9px 14px;border-radius:10px;text-decoration:none;color:inherit}.comm-toolbar nav a.active{background:var(--theme-accent,#273a5b);color:#fff}.comm-toolbar form{display:flex;gap:8px;flex:1;max-width:600px}.comm-toolbar input,.comm-form input,.comm-form textarea,.comm-test input,.subject-form input{width:100%;padding:11px 12px;border:1px solid var(--border-color,#cdd5e2);border-radius:10px;background:var(--input-bg,#fff);color:inherit}.comm-list{display:grid;border:1px solid var(--border-color,#d5dbea);border-radius:16px;overflow:hidden;background:var(--card-bg,#fff)}.comm-message{display:grid;grid-template-columns:44px 1fr auto;gap:14px;padding:16px;border-bottom:1px solid var(--border-color,#e1e5ed);text-decoration:none;color:inherit}.comm-message:last-child{border-bottom:0}.comm-message.unread{background:color-mix(in srgb,var(--theme-accent,#5b54d6) 7%,var(--card-bg,#fff))}.comm-avatar{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:var(--theme-accent,#273a5b);color:white;font-weight:900}.comm-message h3{margin:5px 0 2px;font-size:1rem}.comm-message p,.comm-message small{margin:0;color:var(--muted-color,#667085)}.comm-message time{font-size:.82rem;color:var(--muted-color,#667085)}.comm-empty{padding:30px;text-align:center;color:var(--muted-color,#667085)}.comm-detail-grid,.comm-settings-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(320px,.9fr);gap:16px}.comm-card{padding:22px;border:1px solid var(--border-color,#d5dbea);border-radius:16px;background:var(--card-bg,#fff)}.comm-card dl{display:grid;grid-template-columns:100px 1fr;gap:8px}.comm-card dt{font-weight:800}.comm-card dd{margin:0}.comm-original-message{white-space:pre-wrap;margin:20px 0;padding:18px;border-radius:12px;background:var(--surface-muted,#f5f7fb);line-height:1.55}.comm-form{display:grid;gap:13px}.comm-form label{display:grid;gap:6px;font-weight:700}.comm-two{display:grid;grid-template-columns:1fr 1fr;gap:12px}.comm-check{display:flex!important;align-items:center;gap:8px}.comm-check input{width:auto}.comm-test{display:flex;gap:8px;margin-top:14px}.comm-history{display:grid;gap:12px}.comm-history article{border-top:1px solid var(--border-color,#e2e6ee);padding-top:14px}.comm-history header{display:flex;gap:12px;align-items:center}.comm-history time{margin-left:auto}.comm-error{color:#b42318}.comm-link-btn{border:0;background:none;color:var(--theme-accent,#4055a8);font-weight:800;cursor:pointer}.comm-link-btn.danger{color:#b42318}.comm-subject-list{display:grid;margin-top:18px}.comm-subject-list article{display:grid;grid-template-columns:1fr auto auto;gap:10px;padding:12px 0;border-top:1px solid var(--border-color,#e1e5ed)}.comm-subject-list small{display:block;color:var(--muted-color,#667085)}@media(max-width:850px){.comm-command,.comm-toolbar{align-items:stretch;flex-direction:column}.comm-kpis,.comm-detail-grid,.comm-settings-grid{grid-template-columns:1fr}.comm-message{grid-template-columns:42px 1fr}.comm-message time{grid-column:2}.comm-two{grid-template-columns:1fr}}

.erp-notification-count.is-empty{display:none}.comm-setup{padding:16px 18px;border:1px solid #f3c26b;border-radius:13px;background:#fff8e7;color:#7a4b00}.comm-setup p{margin:6px 0}.comm-setup code{display:block;overflow-wrap:anywhere}.comm-subject-edit{display:grid!important;grid-template-columns:1fr auto!important;align-items:center}.comm-subject-edit-form{display:grid;grid-template-columns:130px repeat(3,minmax(135px,1fr)) 80px auto auto;gap:7px;align-items:center}.comm-subject-edit-form input{min-width:0;padding:8px 9px;border:1px solid var(--border-color,#d5dbea);border-radius:8px;background:var(--input-bg,#fff);color:inherit}.comm-subject-delete{display:inline}.comm-card-heading p{margin:3px 0 0;color:var(--muted-color,#667085)}.comm-table-wrap{overflow:auto}.comm-delivery-log table{width:100%;border-collapse:collapse;min-width:850px}.comm-delivery-log th,.comm-delivery-log td{padding:10px;border-bottom:1px solid var(--border-color,#e1e5ed);text-align:left;vertical-align:top}.comm-delivery-log th{font-size:.75rem;text-transform:uppercase;letter-spacing:.05em}.comm-status{display:inline-flex;padding:3px 8px;border-radius:999px;font-weight:800;font-size:.75rem}.comm-status.sent{background:#e7f8ef;color:#08783e}.comm-status.failed{background:#fff0ef;color:#b42318}@media(max-width:1100px){.comm-subject-edit-form{grid-template-columns:1fr 1fr}.comm-subject-edit{grid-template-columns:1fr!important}.comm-subject-delete{justify-self:end}}

/* Communications settings separation */
.comm-settings-single{display:grid;grid-template-columns:minmax(0,760px);justify-content:center}.comm-smtp-card{width:100%}.comm-card-intro,.comm-card-heading p{margin:.25rem 0 1rem;color:var(--muted-color,#667085)}.comm-card-heading{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}.comm-subjects-page .subject-form{grid-template-columns:minmax(150px,.8fr) repeat(3,minmax(160px,1fr)) 100px auto auto;align-items:end}.comm-subject-edit{display:grid!important;grid-template-columns:1fr auto!important;align-items:center}.comm-subject-edit-form{display:grid;grid-template-columns:minmax(135px,.7fr) repeat(3,minmax(145px,1fr)) 90px auto auto;gap:8px;align-items:center}.comm-subject-edit-form input{min-width:0;padding:10px 11px;border:1px solid var(--border-color,#cdd5e2);border-radius:9px;background:var(--input-bg,#fff);color:inherit}.comm-subject-delete{align-self:center}@media(max-width:1180px){.comm-subjects-page .subject-form,.comm-subject-edit-form{grid-template-columns:repeat(2,minmax(0,1fr))}.comm-subject-edit-form .comm-check,.comm-subject-edit-form .comm-btn,.comm-subjects-page .comm-check,.comm-subjects-page .comm-btn{justify-self:start}}@media(max-width:650px){.comm-subjects-page .subject-form,.comm-subject-edit-form{grid-template-columns:1fr}.comm-subject-edit{grid-template-columns:1fr!important}.comm-subject-delete{justify-self:start}}


/* Website Content storefront address used by Open links. */
.website-storefront-address{display:grid;grid-template-columns:minmax(280px,520px) auto;gap:10px 12px;align-items:end;margin:12px 0;padding:12px 14px;border:1px solid var(--theme-border,#d7dfeb);border-radius:12px;background:var(--theme-surface,#fff)}
.website-storefront-address label{display:grid;gap:5px;margin:0}.website-storefront-address label span{font-size:12px;font-weight:800;color:var(--theme-text,#15233a)}
.website-storefront-address input{width:100%;min-height:38px;border:1px solid var(--theme-border,#cbd6e4);border-radius:8px;padding:8px 10px;background:var(--theme-input-bg,#fff);color:var(--theme-text,#15233a)}
.website-storefront-address small{grid-column:1/-1;color:var(--theme-muted,#637083);font-size:11px}
@media(max-width:760px){.website-storefront-address{grid-template-columns:1fr}.website-storefront-address .website-content-btn{width:100%}.website-storefront-address small{grid-column:1}}


/* E-Commerce shared navigation and theme-readability hardening. */
.ecommerce-global-breadcrumb{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin:12px 16px 0;padding:10px 14px;border:1px solid var(--border);border-radius:11px;background:color-mix(in srgb,var(--card) 94%,var(--soft));color:var(--muted);font-size:.8rem;font-weight:750}.ecommerce-global-breadcrumb a{color:var(--brand);text-decoration:none}.ecommerce-global-breadcrumb a:hover{text-decoration:underline}.ecommerce-global-breadcrumb strong{color:var(--text)}

/* Website Branding actions must keep Advanced ERP button sizing and contrast in every selected theme. */
body .ecommerce-branding-page .branding-remove-btn{width:auto!important;min-width:0!important;min-height:36px!important;padding:7px 12px!important;border:1px solid color-mix(in srgb,#b42318 48%,var(--border))!important;border-radius:9px!important;background:color-mix(in srgb,#b42318 7%,var(--card))!important;color:#9b1c14!important;box-shadow:none!important;white-space:nowrap!important}.ecommerce-branding-page .branding-remove-btn:hover{background:color-mix(in srgb,#b42318 13%,var(--card))!important;border-color:#b42318!important}.ecommerce-branding-page .branding-cancel-btn{width:auto!important;min-width:0!important;min-height:40px!important;padding:8px 15px!important;border:1px solid var(--border)!important;background:var(--card)!important;color:var(--text)!important;box-shadow:none!important}.ecommerce-branding-page .branding-save-btn{width:auto!important;min-width:0!important;min-height:40px!important;padding:8px 17px!important;border:1px solid var(--brand)!important;background:linear-gradient(135deg,var(--brand),var(--brand-dark))!important;color:var(--theme-primary-text,#fff)!important;box-shadow:0 6px 16px color-mix(in srgb,var(--brand) 18%,transparent)!important}.ecommerce-branding-page .branding-save-actions{display:flex!important;align-items:center!important;justify-content:flex-end!important;gap:9px!important}

/* Contact Messages controls stay readable in light, dark and high-accent ERP themes. */
body .comm-page{color:var(--text)!important}.comm-page .comm-command,.comm-page .comm-card,.comm-page .comm-list,.comm-page .comm-kpis article{background:var(--card)!important;border-color:var(--border)!important;color:var(--text)!important}.comm-page h1,.comm-page h2,.comm-page h3,.comm-page label,.comm-page dt,.comm-page dd,.comm-page strong{color:var(--text)!important}.comm-page .comm-command>div>span,.comm-page .comm-command p,.comm-page small,.comm-page time,.comm-page .comm-card-heading p{color:var(--muted)!important}.comm-page .comm-original-message{background:var(--soft)!important;color:var(--text)!important}.comm-page input,.comm-page textarea,.comm-page select{background:var(--theme-input-bg,var(--card))!important;color:var(--text)!important;border-color:var(--border)!important}.comm-page .comm-btn{width:auto!important;min-width:0!important;min-height:40px!important;padding:8px 15px!important;border-radius:9px!important;font-weight:850!important;opacity:1}.comm-page .comm-btn.primary{background:linear-gradient(135deg,var(--brand),var(--brand-dark))!important;color:var(--theme-primary-text,#fff)!important;border-color:var(--brand)!important}.comm-page .comm-btn.secondary{background:var(--card)!important;color:var(--text)!important;border-color:var(--border)!important}.comm-page .comm-link-btn{color:var(--brand)!important}.comm-page button:disabled{background:var(--soft)!important;color:var(--muted)!important;border-color:var(--border)!important;opacity:.82!important}

@media(max-width:640px){.ecommerce-global-breadcrumb{margin-inline:8px}.ecommerce-branding-page .branding-save-actions{align-items:stretch!important;flex-direction:column-reverse!important}.ecommerce-branding-page .branding-save-actions .erp-btn{width:100%!important}}


/* E-Commerce caption-sized navigation buttons */
.ec-caption-button{
    width:auto!important;
    min-width:0!important;
    max-width:max-content!important;
    min-height:38px!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:7px!important;
    flex:0 0 auto!important;
    padding:8px 13px!important;
    white-space:nowrap!important;
    text-decoration:none!important;
    border:1px solid var(--theme-border,var(--border))!important;
    border-radius:9px!important;
    background:var(--theme-card,var(--card))!important;
    color:var(--theme-text,var(--text))!important;
    box-shadow:0 4px 12px color-mix(in srgb,var(--theme-text,var(--text)) 6%,transparent)!important;
}
.ec-caption-button:hover,.ec-caption-button:focus-visible{
    border-color:var(--theme-primary,var(--brand))!important;
    background:color-mix(in srgb,var(--theme-primary,var(--brand)) 7%,var(--theme-card,var(--card)))!important;
    color:var(--theme-primary,var(--brand))!important;
}
@media(max-width:640px){
    .ec-caption-button{max-width:100%!important}
}


/* Global message / notification rail collision fix.
   The fixed icons keep their global visibility, while every header that owns the
   logged-in account control reserves the rail width. Touch POS 2 and POS Sales
   reserve the same top-right area so user/company controls are never covered. */
:root {
    --erp-global-notification-rail: 104px;
}

.main-area > .erp-notification-slot {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    flex-wrap: nowrap !important;
    gap: 8px !important;
    width: max-content !important;
    max-width: calc(100vw - 20px) !important;
    isolation: isolate;
}

.main-area > .erp-notification-slot > .erp-notification-bell {
    flex: 0 0 40px !important;
    width: 40px !important;
    min-width: 40px !important;
    max-width: 40px !important;
}

.main-area:has(> .erp-notification-slot) .topbar:has(.account-menu),
.main-area:has(> .erp-notification-slot) .company-topbar:has(.account-menu) {
    box-sizing: border-box;
    padding-right: var(--erp-global-notification-rail) !important;
}

.main-area:has(> .erp-notification-slot) .topbar:has(.account-menu) .user-panel,
.main-area:has(> .erp-notification-slot) .company-topbar:has(.account-menu) .user-panel {
    min-width: 0;
    flex: 0 1 auto;
}


/* POS Sales company identity and Touch POS 2 header get an explicit safe area. */
.main-area:has(> .erp-notification-slot) .sales-entry-page .sales-mini-company {
    box-sizing: border-box;
    padding-right: var(--erp-global-notification-rail) !important;
}
.main-area:has(> .erp-notification-slot) .pos-product-header {
    box-sizing: border-box;
    padding-right: calc(12px + var(--erp-global-notification-rail)) !important;
}

/* The E-Commerce breadcrumb is often the first header row and also needs the rail. */
.main-area > .erp-notification-slot + .ecommerce-global-breadcrumb {
    box-sizing: border-box;
    padding-right: var(--erp-global-notification-rail) !important;
}

@media (max-width: 760px) {
    :root {
        --erp-global-notification-rail: 92px;
    }
    .main-area > .erp-notification-slot > .erp-notification-bell {
        flex-basis: 36px !important;
        width: 36px !important;
        min-width: 36px !important;
        max-width: 36px !important;
    }
    .main-area:has(> .erp-notification-slot) .topbar:has(.account-menu) .user-panel,
    .main-area:has(> .erp-notification-slot) .company-topbar:has(.account-menu) .user-panel,
    .main-area:has(> .erp-notification-slot) .topbar:has(.account-menu) .account-menu,
    .main-area:has(> .erp-notification-slot) .company-topbar:has(.account-menu) .account-menu,
    .main-area:has(> .erp-notification-slot) .topbar:has(.account-menu) .account-menu-button,
    .main-area:has(> .erp-notification-slot) .company-topbar:has(.account-menu) .account-menu-button {
        width: auto !important;
        max-width: 100%;
    }
    .main-area:has(> .erp-notification-slot) .account-name {
        max-width: 110px;
    }
}

@media (max-width: 520px) {
    .main-area:has(> .erp-notification-slot) .account-name,
    .main-area:has(> .erp-notification-slot) .account-caret {
        display: none;
    }
    .main-area:has(> .erp-notification-slot) .account-menu-button {
        padding-right: 7px;
    }
}

/* Unified website notifications: Contact Us, Web Orders, quote acceptance and registrations. */
.erp-email-notification.has-unread .erp-notification-count {
    animation: erp-website-notification-attention 1.05s ease-in-out infinite alternate;
}

@keyframes erp-website-notification-attention {
    from { opacity: .45; transform: scale(.94); }
    to { opacity: 1; transform: scale(1.12); }
}

@media (prefers-reduced-motion: reduce) {
    .erp-email-notification.has-unread .erp-notification-count {
        animation: none;
    }
}

.comm-system-message .comm-source-event {
    font-size: 1.05rem;
}

.comm-source-contact,
.comm-source-event {
    line-height: 1;
}

.comm-notification-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
}

.comm-notification-actions form {
    margin: 0;
}

.comm-notification-help {
    margin: 18px 0 0;
    color: var(--muted-color, #667085);
    line-height: 1.5;
}

/* ERP global breadcrumb fallback: mandatory on authenticated pages that do not provide a page-specific trail. */
.erp-global-breadcrumb {
    display: flex;
    align-items: center;
    gap: 7px;
    flex-wrap: wrap;
    box-sizing: border-box;
    margin: 12px 16px 0;
    padding: 10px 14px;
    border: 1px solid var(--border, var(--theme-border, #d8e1ec));
    border-radius: 11px;
    background: color-mix(in srgb, var(--card, var(--theme-card, #fff)) 94%, var(--soft, var(--theme-soft, #f6f8fb)));
    color: var(--muted, var(--theme-muted, #64748b));
    font-size: .82rem;
    font-weight: 750;
    line-height: 1.35;
}
.erp-global-breadcrumb[hidden] { display: none !important; }
.erp-global-breadcrumb a {
    color: var(--brand, var(--theme-primary, #2563eb));
    text-decoration: none;
}
.erp-global-breadcrumb a:hover,
.erp-global-breadcrumb a:focus-visible {
    text-decoration: underline;
}
.erp-global-breadcrumb strong {
    color: var(--text, var(--theme-text, #1f2937));
    font-weight: 850;
}
.erp-global-breadcrumb-separator {
    color: var(--muted, var(--theme-muted, #94a3b8));
    user-select: none;
}
.main-area > .erp-notification-slot + .erp-global-breadcrumb {
    padding-right: var(--erp-global-notification-rail, 104px);
}
@media (max-width: 640px) {
    .erp-global-breadcrumb {
        margin-inline: 8px;
        padding: 9px 11px;
        font-size: .76rem;
    }
    .main-area > .erp-notification-slot + .erp-global-breadcrumb {
        padding-right: var(--erp-global-notification-rail, 92px);
    }
}
@media print {
    .erp-global-breadcrumb { display: none !important; }
}

/* Purchase Request */
.prq-page{display:grid;gap:14px}.prq-header{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}.prq-header h1{margin:0}.prq-header p{margin:.3rem 0 0;color:var(--muted,#64748b)}.prq-actions{display:flex;gap:7px;flex-wrap:wrap}.prq-card{background:var(--card-bg,#fff);border:1px solid var(--border-color,#dbe3ec);border-radius:12px;padding:14px;box-shadow:0 6px 18px rgba(15,23,42,.05)}.prq-form-grid{display:grid;grid-template-columns:repeat(4,minmax(150px,1fr));gap:10px}.prq-form-grid label,.prq-product-entry label,.prq-notes label{display:grid;gap:5px;font-weight:600;font-size:12px}.prq-form-grid input,.prq-form-grid select,.prq-form-grid textarea,.prq-product-entry input,.prq-notes textarea,.prq-totals input{width:100%;padding:8px;border:1px solid var(--border-color,#cbd5e1);border-radius:7px;background:var(--input-bg,#fff);color:inherit}.prq-wide{grid-column:span 2}.prq-lookup{display:flex}.prq-lookup input{border-radius:7px 0 0 7px}.prq-lookup button{border:1px solid var(--border-color,#cbd5e1);border-left:0;border-radius:0 7px 7px 0;padding:0 12px}.prq-product-entry{display:grid;grid-template-columns:minmax(260px,1fr) 120px auto;gap:10px;align-items:end;margin-bottom:12px}.prq-table-wrap{overflow:auto}.prq-table{width:100%;border-collapse:collapse;min-width:1100px}.prq-table th,.prq-table td{border:1px solid var(--border-color,#dbe3ec);padding:6px}.prq-table th{background:var(--table-head-bg,#f1f5f9);font-size:11px;text-transform:uppercase}.prq-table td input{width:100%;min-width:70px;border:0;background:transparent;color:inherit;padding:4px}.prq-table td small{display:block;color:var(--muted,#64748b)}.prq-table .num{text-align:right}.prq-bottom{display:grid;grid-template-columns:1fr 330px;gap:18px}.prq-totals{display:grid;gap:6px}.prq-totals label,.prq-totals div{display:flex;justify-content:space-between;align-items:center;gap:12px}.prq-totals input{width:130px}.prq-totals .grand{font-size:18px;border-top:2px solid var(--border-color,#94a3b8);padding-top:8px}.prq-page dialog{width:min(720px,92vw);border:0;border-radius:12px;padding:16px}.prq-dialog-close{float:right;border:0;background:transparent;font-size:24px}.prq-page dialog input{width:100%;padding:9px;margin:8px 0;border:1px solid #cbd5e1;border-radius:7px}.prq-dialog-results{display:grid;max-height:55vh;overflow:auto}.prq-dialog-results button{text-align:left;padding:10px;border:0;border-bottom:1px solid #e2e8f0;background:transparent}.prq-dialog-results button:hover{background:#f1f5f9}.prq-dialog-results small{display:block;color:#64748b}@media(max-width:1000px){.prq-form-grid{grid-template-columns:repeat(2,1fr)}.prq-bottom{grid-template-columns:1fr}}@media(max-width:650px){.prq-header{display:block}.prq-actions{margin-top:10px}.prq-form-grid,.prq-product-entry{grid-template-columns:1fr}.prq-wide{grid-column:auto}}

/* Purchase Request: Direct Purchase layout parity */
.purchase-request-shell .purchase-stagebar span{min-width:118px}
.purchase-request-product-entry{display:grid;grid-template-columns:minmax(320px,1fr) 120px auto;gap:10px;align-items:end;padding:10px 12px;border-bottom:1px solid var(--erp-border,#d8e2ea)}
.purchase-request-product-entry label{display:grid;gap:4px;font-size:12px;font-weight:700}
.purchase-request-lines-table input{width:100%;min-width:74px;border:1px solid transparent;background:transparent;padding:6px;border-radius:6px}
.purchase-request-lines-table input:focus{border-color:var(--erp-primary,#078f61);background:var(--erp-surface,#fff);outline:none}
.purchase-request-lines-table .purchase-product-cell{min-width:230px}.purchase-request-lines-table .purchase-product-cell small{display:block;color:var(--erp-muted,#667085);font-size:11px;margin-top:2px}
.purchase-request-notes-grid{display:grid;grid-template-columns:minmax(340px,1.4fr) minmax(260px,.8fr);gap:18px;padding:16px}.purchase-request-notes-grid label{display:grid;gap:6px;font-weight:700}
.purchase-help-card{padding:14px;border:1px solid var(--erp-border,#d8e2ea);border-radius:10px;background:var(--erp-soft,#f7faf9)}.purchase-help-card p{margin:8px 0 0;color:var(--erp-muted,#667085)}
.purchase-request-charge-grid{display:grid;grid-template-columns:repeat(4,minmax(180px,1fr));gap:14px;padding:16px}.purchase-request-charge-grid label{display:grid;gap:6px;font-weight:700}
.purchase-request-recent-list{display:grid;gap:8px;padding:14px}.purchase-request-recent-list button{display:grid;grid-template-columns:minmax(180px,.7fr) 1fr auto;gap:12px;text-align:left;align-items:center;border:1px solid var(--erp-border,#d8e2ea);background:var(--erp-surface,#fff);padding:10px 12px;border-radius:9px}.purchase-request-recent-list button:hover{border-color:var(--erp-primary,#078f61)}.purchase-request-recent-list span{color:var(--erp-muted,#667085)}.purchase-request-recent-list em{font-style:normal;font-weight:800}
.purchase-request-footer-card{display:grid;grid-template-columns:1fr minmax(520px,.9fr);gap:18px;align-items:center;padding:14px}.purchase-request-summary-note{display:grid;gap:4px}.purchase-request-summary-note span{color:var(--erp-muted,#667085)}.purchase-request-summary-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}.purchase-request-summary-grid>div{display:grid;gap:4px;padding:9px 10px;border:1px solid var(--erp-border,#d8e2ea);border-radius:8px}.purchase-request-summary-grid span{font-size:11px;color:var(--erp-muted,#667085)}.purchase-request-summary-total{background:rgba(7,143,97,.08);border-color:rgba(7,143,97,.28)!important}
.purchase-request-dialog{width:min(760px,92vw);max-height:80vh;border:0;border-radius:14px;padding:0;box-shadow:0 24px 70px color-mix(in srgb,var(--text) 28%,transparent)}.purchase-request-dialog form{padding:18px}.purchase-request-dialog::backdrop{background:rgba(15,23,42,.48)}.purchase-request-dialog .prq-dialog-close{float:right;border:0;background:transparent;font-size:24px}.purchase-request-dialog h3{margin:0 0 12px}.prq-dialog-results{display:grid;gap:7px;max-height:52vh;overflow:auto;margin-top:12px}.prq-dialog-results button{display:grid;text-align:left;gap:3px;padding:10px;border:1px solid var(--erp-border,#d8e2ea);border-radius:8px;background:var(--erp-surface,#fff)}.prq-dialog-results button:hover{border-color:var(--erp-primary,#078f61)}.prq-dialog-results small{color:var(--erp-muted,#667085)}
@media(max-width:1000px){.purchase-request-product-entry{grid-template-columns:1fr 110px}.purchase-request-product-entry .btn{grid-column:1/-1}.purchase-request-charge-grid{grid-template-columns:repeat(2,1fr)}.purchase-request-footer-card{grid-template-columns:1fr}.purchase-request-summary-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:680px){.purchase-request-product-entry,.purchase-request-notes-grid,.purchase-request-charge-grid{grid-template-columns:1fr}.purchase-request-summary-grid{grid-template-columns:repeat(2,1fr)}.purchase-request-recent-list button{grid-template-columns:1fr}.purchase-request-lines-table{min-width:1100px}}


/* Website Notifications read-state audit styling. */
.comm-page .comm-message.read {
    background: color-mix(in srgb, var(--muted, var(--theme-muted, #667085)) 7%, var(--card, var(--theme-card, #fff))) !important;
    color: var(--muted, var(--theme-muted, #667085)) !important;
}
.comm-page .comm-message.read strong,
.comm-page .comm-message.read h3,
.comm-page .comm-message.read p,
.comm-page .comm-message.read small,
.comm-page .comm-message.read time {
    color: var(--muted, var(--theme-muted, #667085)) !important;
    font-weight: 400 !important;
}
.comm-page .comm-message.read .comm-avatar {
    background: color-mix(in srgb, var(--muted, var(--theme-muted, #667085)) 18%, var(--card, var(--theme-card, #fff))) !important;
    color: var(--muted, var(--theme-muted, #667085)) !important;
    font-weight: 400 !important;
}

.comm-page .comm-read-audit {
    display: block;
    margin-top: 6px;
    color: var(--muted, var(--theme-muted, #667085)) !important;
    font-weight: 400 !important;
}

/* ERP customer default/additional address geolocation and OpenStreetMap pin picker */
.customer-geolocation-card {
    margin-top: 18px;
    border: 1px solid color-mix(in srgb, var(--theme-primary, var(--brand)) 26%, var(--border-color));
    border-radius: 16px;
    padding: 16px;
    background: color-mix(in srgb, var(--theme-primary, var(--brand)) 4%, var(--card-bg));
    min-width: 0;
}
.customer-address-geolocation {
    grid-column: 1 / -1;
    margin-top: 4px;
}
.customer-geolocation-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 14px;
}
.customer-geolocation-heading h3 {
    margin: 3px 0 4px;
    font-size: 1rem;
}
.customer-geolocation-heading p {
    margin: 0;
    color: var(--muted-text);
    font-size: .82rem;
    line-height: 1.45;
}
.customer-geolocation-kicker {
    display: block;
    color: var(--theme-primary, var(--brand));
    font-size: .7rem;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}
.customer-geolocation-state {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 4px 10px;
    border-radius: 999px;
    border: 1px solid var(--border-color);
    color: var(--muted-text);
    background: var(--card-bg);
    font-size: .76rem;
    font-weight: 600;
    white-space: nowrap;
}
.customer-geolocation-card.has-coordinates .customer-geolocation-state {
    color: #166534;
    border-color: #a7d7b5;
    background: #effaf2;
}
.customer-geolocation-warning {
    margin-bottom: 14px;
    padding: 10px 12px;
    border: 1px solid #f2c66d;
    border-radius: 10px;
    background: #fff8e6;
    color: #92400e;
    font-size: .82rem;
}
.customer-geolocation-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 420px);
    gap: 16px;
    align-items: stretch;
    min-width: 0;
}
.customer-geolocation-fields {
    display: grid;
    align-content: start;
    gap: 11px;
    min-width: 0;
}
.customer-coordinate-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}
.customer-coordinate-grid label,
.customer-map-coordinate-bar label {
    display: grid;
    gap: 5px;
    color: var(--muted-text);
    font-size: .74rem;
    font-weight: 700;
}
.customer-coordinate-grid .odoo-input[readonly],
.customer-map-coordinate-bar .odoo-input[readonly] {
    background: color-mix(in srgb, var(--theme-primary, var(--brand)) 3%, var(--card-bg));
    color: var(--text-color, #1f2937);
}
.customer-geolocation-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 14px;
    color: var(--muted-text);
    font-size: .76rem;
}
.customer-geolocation-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.customer-geolocation-actions button {
    width: auto;
    min-width: 0;
}
.customer-geolocation-message {
    min-height: 18px;
    color: #166534;
    font-size: .78rem;
}
.customer-geolocation-message.is-error,
.customer-map-status.is-error {
    color: #b42318;
}
.customer-geolocation-preview {
    position: relative;
    min-height: 230px;
    width: 100%;
    overflow: hidden;
    border: 1px solid var(--border-color);
    border-radius: 13px;
    background: #edf3f0;
    cursor: pointer;
    isolation: isolate;
}
.customer-geolocation-preview:focus-visible {
    outline: 3px solid color-mix(in srgb, var(--theme-primary, var(--brand)) 34%, transparent);
    outline-offset: 2px;
}
.customer-geolocation-preview.is-empty {
    display: grid;
    place-items: center;
    min-height: 170px;
    padding: 18px;
    color: var(--muted-text);
    background: color-mix(in srgb, var(--theme-primary, var(--brand)) 3%, var(--card-bg));
    border-style: dashed;
    text-align: center;
    font-size: .82rem;
}
.customer-geolocation-preview .leaflet-container,
.customer-geolocation-preview.leaflet-container {
    min-height: 230px;
    height: 100%;
    width: 100%;
    font-family: inherit;
}
.customer-map-modal-open {
    overflow: hidden;
}
.customer-map-modal-backdrop {
    position: fixed;
    inset: 0;
    z-index: 10050;
    display: none;
    place-items: center;
    padding: 18px;
    background: rgba(15, 23, 42, .58);
    backdrop-filter: blur(3px);
}
.customer-map-modal-backdrop.open {
    display: grid;
}
.customer-map-modal {
    width: min(1040px, 96vw);
    max-height: 94vh;
    overflow: auto;
    border: 1px solid var(--border-color);
    border-radius: 18px;
    background: var(--card-bg);
    color: var(--text-color, #1f2937);
    box-shadow: 0 26px 80px rgba(15, 23, 42, .3);
}
.customer-map-modal-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    padding: 16px 18px 13px;
    border-bottom: 1px solid var(--border-color);
}
.customer-map-modal-header h3 {
    margin: 3px 0 4px;
}
.customer-map-modal-header p {
    margin: 0;
    color: var(--muted-text);
    font-size: .82rem;
}
.customer-map-toolbar {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    padding: 12px 18px;
    border-bottom: 1px solid var(--border-color);
}
.customer-map-toolbar button {
    width: auto;
    min-width: 0;
}
.customer-map-status {
    flex: 1 1 260px;
    color: var(--muted-text);
    font-size: .8rem;
}
.customer-map-picker-stage {
    width: 100%;
    height: min(58vh, 560px);
    min-height: 360px;
    background: #edf3f0;
}
.customer-map-picker-stage.leaflet-container {
    font-family: inherit;
}
.customer-map-coordinate-bar {
    display: grid;
    grid-template-columns: minmax(160px, 220px) minmax(160px, 220px) minmax(0, 1fr);
    gap: 10px;
    align-items: end;
    padding: 13px 18px;
    border-top: 1px solid var(--border-color);
}
.customer-map-display-name {
    min-width: 0;
    color: var(--muted-text);
    font-size: .78rem;
    overflow-wrap: anywhere;
}
.customer-map-modal-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    padding: 13px 18px 17px;
    border-top: 1px solid var(--border-color);
}
.customer-map-modal-actions button {
    width: auto;
    min-width: 0;
}
@media (max-width: 900px) {
    .customer-geolocation-layout {
        grid-template-columns: 1fr;
    }
    .customer-geolocation-preview,
    .customer-geolocation-preview .leaflet-container,
    .customer-geolocation-preview.leaflet-container {
        min-height: 210px;
    }
}
@media (max-width: 640px) {
    .customer-geolocation-card {
        padding: 12px;
    }
    .customer-geolocation-heading {
        display: grid;
        gap: 9px;
    }
    .customer-geolocation-state {
        justify-self: start;
    }
    .customer-coordinate-grid,
    .customer-map-coordinate-bar {
        grid-template-columns: 1fr;
    }
    .customer-geolocation-actions,
    .customer-map-toolbar,
    .customer-map-modal-actions {
        display: grid;
        grid-template-columns: 1fr;
    }
    .customer-geolocation-actions button,
    .customer-map-toolbar button,
    .customer-map-modal-actions button {
        width: 100%;
    }
    .customer-map-modal-backdrop {
        padding: 0;
    }
    .customer-map-modal {
        width: 100vw;
        max-height: 100vh;
        min-height: 100vh;
        border-radius: 0;
    }
    .customer-map-picker-stage {
        height: 48vh;
        min-height: 310px;
    }
}



/* Saved customer geolocation review summary shown below each ERP address map. */
.customer-geolocation-saved-summary {
    margin-top: 14px;
    padding: 13px 14px;
    border-top: 1px solid color-mix(in srgb, var(--theme-primary, var(--brand)) 20%, var(--border-color));
    background: color-mix(in srgb, var(--theme-primary, var(--brand)) 2%, var(--card-bg));
    display: grid;
    grid-template-columns: minmax(110px, auto) minmax(0, 1fr) auto;
    gap: 10px 18px;
    align-items: center;
    min-width: 0;
}
.customer-geolocation-saved-title {
    grid-column: 1 / -1;
    color: var(--text-color, #1f2937);
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: .03em;
    text-transform: uppercase;
}
.customer-geolocation-saved-details {
    grid-column: 1 / 3;
    display: grid;
    grid-template-columns: minmax(92px, auto) auto 1fr auto 1fr auto;
    gap: 7px 10px;
    align-items: center;
    min-width: 0;
    color: var(--text-color, #1f2937);
    font-size: .82rem;
}
.customer-geolocation-saved-details strong {
    font-weight: 500;
    font-variant-numeric: tabular-nums;
    overflow-wrap: anywhere;
}
.customer-geolocation-saved-label {
    color: var(--muted-text);
    white-space: nowrap;
}
.customer-geolocation-saved-spacer {
    min-width: 12px;
}
.customer-geolocation-refresh-link {
    grid-column: 3;
    justify-self: end;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    width: auto !important;
    min-width: 0 !important;
    padding: 6px 0;
    border: 0;
    background: transparent;
    color: var(--theme-primary, var(--brand));
    font: inherit;
    font-size: .82rem;
    font-weight: 700;
    cursor: pointer;
}
.customer-geolocation-refresh-link:hover,
.customer-geolocation-refresh-link:focus-visible {
    text-decoration: underline;
}
.customer-geolocation-refresh-link:disabled {
    opacity: .48;
    cursor: not-allowed;
    text-decoration: none;
}
.customer-geolocation-saved-summary.has-location {
    border-top-color: #a7d7b5;
}
@media (max-width: 900px) {
    .customer-geolocation-saved-summary {
        grid-template-columns: 1fr auto;
    }
    .customer-geolocation-saved-details {
        grid-column: 1 / -1;
        grid-template-columns: minmax(92px, auto) minmax(0, 1fr);
    }
    .customer-geolocation-saved-spacer {
        display: none;
    }
    .customer-geolocation-refresh-link {
        grid-column: 2;
        grid-row: 1;
    }
}
@media (max-width: 560px) {
    .customer-geolocation-saved-summary {
        grid-template-columns: 1fr;
        padding: 12px;
    }
    .customer-geolocation-refresh-link {
        grid-column: 1;
        grid-row: auto;
        justify-self: start;
    }
    .customer-geolocation-saved-details {
        grid-template-columns: 1fr;
        gap: 4px;
    }
}

/* ERP customer address geolocation: automatic lookup guidance */
.customer-geolocation-auto-note {
    margin-top: 8px;
    color: var(--text-muted, #667085);
    font-size: 12px;
    line-height: 1.45;
}

/* ERP customer geolocation persistence and map-link import refinement */
.customer-coordinate-grid .odoo-input {
    font-variant-numeric: tabular-nums;
}
.customer-map-import-panel {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 9px 12px;
    align-items: end;
    padding: 14px 18px;
    border-bottom: 1px solid var(--border-color);
    background: color-mix(in srgb, var(--theme-primary, var(--brand)) 4%, var(--card-bg));
}
.customer-map-import-panel label {
    display: grid;
    gap: 6px;
    min-width: 0;
    color: var(--text-color, #1f2937);
    font-size: .78rem;
    font-weight: 700;
}
.customer-map-import-panel p {
    grid-column: 1 / -1;
    margin: 0;
    color: var(--muted-text);
    font-size: .75rem;
    line-height: 1.45;
}
.customer-map-query-input {
    width: 100%;
    min-height: 42px;
}
.customer-map-primary-action,
.customer-map-action,
.customer-map-apply-coordinates {
    width: auto !important;
    min-width: 0;
    min-height: 40px;
    padding-inline: 14px;
    border-radius: 10px;
    font-weight: 650;
    white-space: nowrap;
}
.customer-map-primary-action {
    min-height: 42px;
}
.customer-map-toolbar {
    background: color-mix(in srgb, var(--theme-primary, var(--brand)) 2%, var(--card-bg));
}
.customer-map-coordinate-bar {
    grid-template-columns: minmax(160px, 220px) minmax(160px, 220px) auto;
}
.customer-map-coordinate-bar .customer-map-display-name {
    grid-column: 1 / -1;
    min-height: 18px;
}
.customer-map-coordinate-bar .odoo-input {
    font-variant-numeric: tabular-nums;
}
.customer-map-modal-actions .odoo-save,
.customer-map-modal-actions .odoo-discard {
    min-height: 40px;
    padding-inline: 18px;
    border-radius: 10px;
    font-weight: 650;
}
@media (max-width: 760px) {
    .customer-map-import-panel {
        grid-template-columns: 1fr;
        padding: 12px;
    }
    .customer-map-import-panel p {
        grid-column: 1;
    }
    .customer-map-primary-action,
    .customer-map-action,
    .customer-map-apply-coordinates {
        width: 100% !important;
    }
    .customer-map-coordinate-bar {
        grid-template-columns: 1fr;
    }
    .customer-map-coordinate-bar .customer-map-display-name {
        grid-column: 1;
    }
}
.customer-geolocation-actions .odoo-save,
.customer-geolocation-actions .odoo-discard {
    min-height: 38px;
    padding-inline: 13px;
    border-radius: 9px;
    font-weight: 650;
}

/* ERP Driver Order History delivery media gallery */
.driver-delivery-proof-panel{display:grid;gap:14px}.driver-proof-count{display:inline-flex;align-items:center;justify-content:center;min-height:30px;padding:5px 10px;border:1px solid var(--border-color);border-radius:999px;background:var(--muted-bg,#f8fafc);color:var(--muted-text);font-size:.76rem;font-weight:600;white-space:nowrap}.driver-proof-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px}.driver-proof-card{display:grid;grid-template-rows:minmax(145px,1fr) auto;overflow:hidden;border:1px solid var(--border-color);border-radius:12px;background:var(--card-bg);color:var(--text-color);text-decoration:none;min-width:0}.driver-proof-card:hover{border-color:var(--theme-primary,var(--brand));box-shadow:0 8px 24px rgba(15,23,42,.08)}.driver-proof-card img{width:100%;height:100%;min-height:145px;max-height:230px;object-fit:cover;background:var(--muted-bg,#f8fafc)}.driver-proof-file{display:grid;place-items:center;min-height:145px;font-size:2rem;background:var(--muted-bg,#f8fafc)}.driver-proof-meta{display:grid;gap:3px;padding:10px 11px;min-width:0}.driver-proof-meta strong{font-size:.78rem;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.driver-proof-meta small{color:var(--muted-text);font-size:.69rem}.driver-proof-empty{padding:18px;border:1px dashed var(--border-color);border-radius:10px;background:var(--muted-bg,#f8fafc);color:var(--muted-text);text-align:center;font-size:.82rem}@media(max-width:640px){.driver-proof-gallery{grid-template-columns:repeat(2,minmax(0,1fr))}.driver-proof-card{grid-template-rows:minmax(110px,1fr) auto}.driver-proof-card img,.driver-proof-file{min-height:110px}}

/* ERP Customer geolocation Advanced UI, viewport-fit map picker and address review. */
.customer-geolocation-card {
    border-color: color-mix(in srgb, var(--theme-primary, var(--brand)) 32%, var(--theme-border, #d8dee8));
    border-radius: 18px;
    background: linear-gradient(145deg,
        color-mix(in srgb, var(--theme-card, #fff) 97%, var(--theme-primary, var(--brand)) 3%),
        color-mix(in srgb, var(--theme-card, #fff) 94%, var(--theme-primary, var(--brand)) 6%));
    box-shadow: 0 12px 30px color-mix(in srgb, var(--theme-text, #172033) 8%, transparent);
}
.customer-geolocation-heading h3,
.customer-map-modal-header h3 {
    color: var(--theme-text, var(--text-color, #172033));
    font-weight: 800;
    letter-spacing: -.015em;
}
.customer-geolocation-layout {
    grid-template-columns: minmax(0, 1fr) minmax(300px, 390px);
    align-items: start;
}
.customer-geolocation-preview,
.customer-geolocation-preview .leaflet-container,
.customer-geolocation-preview.leaflet-container {
    min-height: 190px;
    height: 190px;
}
.customer-geolocation-preview {
    border-color: color-mix(in srgb, var(--theme-primary, var(--brand)) 26%, var(--theme-border, #d8dee8));
    box-shadow: inset 0 0 0 1px color-mix(in srgb, #fff 45%, transparent);
}
.customer-geolocation-meta {
    color: var(--theme-text, var(--text-color, #172033));
    font-variant-numeric: tabular-nums;
}
.customer-geolocation-actions {
    align-items: center;
}
.customer-geo-btn {
    position: relative;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 7px;
    width: auto !important;
    min-width: 0 !important;
    min-height: 38px;
    padding: 8px 13px !important;
    border: 1px solid transparent !important;
    border-radius: 10px !important;
    background: var(--theme-card, #fff) !important;
    color: var(--theme-text, #172033) !important;
    font: inherit;
    font-size: .8rem;
    font-weight: 750 !important;
    line-height: 1.1;
    text-decoration: none;
    white-space: nowrap;
    box-shadow: 0 5px 14px color-mix(in srgb, var(--theme-text, #172033) 8%, transparent) !important;
    cursor: pointer;
    transition: transform .16s ease, border-color .16s ease, background .16s ease, color .16s ease, box-shadow .16s ease;
}
.customer-geo-btn:hover:not(:disabled),
.customer-geo-btn:focus-visible:not(:disabled) {
    transform: translateY(-1px);
    box-shadow: 0 8px 18px color-mix(in srgb, var(--theme-text, #172033) 12%, transparent) !important;
}
.customer-geo-btn:focus-visible {
    outline: 3px solid color-mix(in srgb, var(--theme-primary, var(--brand)) 24%, transparent);
    outline-offset: 2px;
}
.customer-geo-btn.is-primary {
    border-color: var(--theme-primary, var(--brand)) !important;
    background: linear-gradient(135deg,
        var(--theme-primary, var(--brand)),
        color-mix(in srgb, var(--theme-primary, var(--brand)) 76%, #111827 24%)) !important;
    color: #fff !important;
}
.customer-geo-btn.is-secondary {
    border-color: color-mix(in srgb, var(--theme-primary, var(--brand)) 45%, var(--theme-border, #d8dee8)) !important;
    background: color-mix(in srgb, var(--theme-primary, var(--brand)) 7%, var(--theme-card, #fff)) !important;
    color: var(--theme-primary, var(--brand)) !important;
}
.customer-geo-btn.is-ghost {
    border-color: var(--theme-border, #d8dee8) !important;
    background: var(--theme-card, #fff) !important;
    color: var(--theme-text, #172033) !important;
}
.customer-geo-btn.is-danger-ghost {
    border-color: color-mix(in srgb, #dc2626 45%, var(--theme-border, #d8dee8)) !important;
    background: color-mix(in srgb, #dc2626 5%, var(--theme-card, #fff)) !important;
    color: #b42318 !important;
}
.customer-geo-btn:disabled {
    opacity: .52;
    transform: none;
    box-shadow: none !important;
    cursor: not-allowed;
}

.customer-geolocation-saved-summary {
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 7px 18px;
    margin-top: 15px;
    padding: 13px 15px;
    border: 1px solid color-mix(in srgb, var(--theme-primary, var(--brand)) 20%, var(--theme-border, #d8dee8));
    border-radius: 12px;
    background: color-mix(in srgb, var(--theme-primary, var(--brand)) 3%, var(--theme-card, #fff));
}
.customer-geolocation-saved-title {
    grid-column: 1 / -1;
    font-size: .72rem;
    color: var(--theme-primary, var(--brand));
}
.customer-geolocation-saved-details {
    grid-column: 1 / 3;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px 24px;
    font-size: .8rem;
}
.customer-geolocation-saved-details strong {
    color: var(--theme-text, #172033);
    font-weight: 500;
    overflow-wrap: normal;
    white-space: nowrap;
}
.customer-geolocation-saved-label {
    color: var(--theme-muted, var(--muted-text, #667085));
}
.customer-geolocation-saved-spacer { display: none; }
.customer-geolocation-refresh-link {
    grid-column: 3;
    align-self: center;
    min-height: 34px;
    padding: 6px 10px !important;
    border: 1px solid color-mix(in srgb, var(--theme-primary, var(--brand)) 30%, var(--theme-border, #d8dee8));
    border-radius: 9px;
    background: var(--theme-card, #fff);
    color: var(--theme-primary, var(--brand));
    text-decoration: none !important;
}

.customer-map-modal-backdrop {
    padding: 10px;
    background: rgba(15, 23, 42, .66);
}
.customer-map-modal {
    display: grid;
    grid-template-rows: auto auto auto minmax(190px, 1fr) auto auto;
    width: min(1180px, calc(100vw - 20px));
    height: min(820px, calc(100dvh - 20px));
    max-height: none;
    overflow: hidden;
    border-radius: 18px;
    background: var(--theme-card, var(--card-bg, #fff));
    box-shadow: 0 28px 90px rgba(15, 23, 42, .42);
}
.customer-map-modal-header {
    padding: 13px 16px 11px;
    background: linear-gradient(135deg,
        color-mix(in srgb, var(--theme-primary, var(--brand)) 7%, var(--theme-card, #fff)),
        var(--theme-card, #fff));
}
.customer-map-modal-header h3 { font-size: 1.05rem; }
.customer-map-modal-header p {
    max-width: 760px;
    color: var(--theme-muted, #667085);
    line-height: 1.35;
}
.customer-map-import-panel {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 7px 10px;
    padding: 9px 16px;
    background: var(--theme-card, #fff);
}
.customer-map-import-panel label { gap: 4px; }
.customer-map-import-panel p {
    line-height: 1.3;
    color: var(--theme-muted, #667085);
}
.customer-map-query-input {
    min-height: 38px;
    border-radius: 9px !important;
}
.customer-map-toolbar {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    padding: 8px 16px;
    background: color-mix(in srgb, var(--theme-primary, var(--brand)) 3%, var(--theme-card, #fff));
}
.customer-map-status {
    min-width: 220px;
    color: var(--theme-text, #172033);
    font-weight: 600;
    line-height: 1.3;
}
.customer-map-stage-shell {
    position: relative;
    min-height: 0;
    overflow: hidden;
    background: #e8eef0;
}
.customer-map-picker-stage,
.customer-map-picker-stage.leaflet-container {
    width: 100%;
    height: 100%;
    min-height: 0;
    font-family: inherit;
}
.customer-map-stage-hint {
    position: absolute;
    z-index: 500;
    left: 14px;
    bottom: 14px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    max-width: calc(100% - 28px);
    padding: 8px 11px;
    border: 1px solid rgba(255, 255, 255, .86);
    border-radius: 10px;
    background: rgba(17, 24, 39, .84);
    color: #fff;
    font-size: .76rem;
    font-weight: 650;
    line-height: 1.25;
    box-shadow: 0 6px 16px rgba(15, 23, 42, .24);
    pointer-events: none;
}
.customer-map-picker-stage .leaflet-control-zoom a {
    color: #172033 !important;
    background: #fff !important;
}
.customer-map-picker-stage .leaflet-control-attribution {
    padding: 2px 5px;
    background: rgba(255, 255, 255, .9) !important;
    color: #334155 !important;
    font-size: 10px;
}
.customer-map-picker-stage .leaflet-control-attribution a { color: #1d4ed8 !important; }
.customer-map-coordinate-bar {
    grid-template-columns: minmax(180px, 240px) minmax(180px, 240px) auto minmax(0, 1fr);
    gap: 8px 10px;
    padding: 9px 16px;
    background: var(--theme-card, #fff);
}
.customer-map-coordinate-bar .customer-map-display-name {
    grid-column: 4;
    align-self: center;
    min-height: 0;
    color: var(--theme-text, #172033);
    line-height: 1.3;
}
.customer-map-modal-actions {
    gap: 8px;
    padding: 9px 16px 11px;
    background: color-mix(in srgb, var(--theme-primary, var(--brand)) 3%, var(--theme-card, #fff));
}

.customer-address-review-section {
    margin-top: 22px;
    padding: 18px;
    border: 1px solid color-mix(in srgb, var(--theme-primary, var(--brand)) 24%, var(--theme-border, #d8dee8));
    border-radius: 18px;
    background: linear-gradient(145deg,
        color-mix(in srgb, var(--theme-card, #fff) 97%, var(--theme-primary, var(--brand)) 3%),
        color-mix(in srgb, var(--theme-card, #fff) 94%, #10b981 6%));
    box-shadow: 0 12px 30px color-mix(in srgb, var(--theme-text, #172033) 7%, transparent);
}
.customer-address-review-heading {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 12px;
    align-items: center;
    margin-bottom: 15px;
}
.customer-address-review-icon {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    border: 1px solid color-mix(in srgb, #10b981 40%, var(--theme-border, #d8dee8));
    border-radius: 12px;
    background: color-mix(in srgb, #10b981 10%, var(--theme-card, #fff));
    color: #047857;
    font-size: 1.15rem;
}
.customer-address-review-kicker {
    display: block;
    color: var(--theme-primary, var(--brand));
    font-size: .68rem;
    font-weight: 850;
    letter-spacing: .1em;
    text-transform: uppercase;
}
.customer-address-review-heading h2 {
    margin: 2px 0 2px;
    color: var(--theme-text, #172033);
    font-size: 1.2rem;
    font-weight: 850;
}
.customer-address-review-heading p {
    margin: 0;
    color: var(--theme-muted, #667085);
    font-size: .8rem;
}
.customer-address-review-count {
    padding: 5px 10px;
    border: 1px solid var(--theme-border, #d8dee8);
    border-radius: 999px;
    background: var(--theme-card, #fff);
    color: var(--theme-muted, #667085);
    font-size: .72rem;
    font-weight: 700;
    white-space: nowrap;
}
.customer-address-review-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(270px, 1fr));
    gap: 13px;
}
.customer-address-review-card {
    display: grid;
    align-content: start;
    gap: 9px;
    min-width: 0;
    padding: 14px;
    border: 1px solid var(--theme-border, #d8dee8);
    border-left: 4px solid color-mix(in srgb, var(--theme-primary, var(--brand)) 55%, var(--theme-border, #d8dee8));
    border-radius: 13px;
    background: var(--theme-card, #fff);
    box-shadow: 0 6px 18px color-mix(in srgb, var(--theme-text, #172033) 5%, transparent);
}
.customer-address-review-card.is-default {
    border-left-color: #10b981;
    background: color-mix(in srgb, #10b981 4%, var(--theme-card, #fff));
}
.customer-address-review-card-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}
.customer-address-review-card-head h3 {
    margin: 2px 0 0;
    color: var(--theme-text, #172033);
    font-size: .95rem;
    font-weight: 800;
    overflow-wrap: anywhere;
}
.customer-address-review-type {
    color: var(--theme-primary, var(--brand));
    font-size: .67rem;
    font-weight: 800;
    letter-spacing: .07em;
    text-transform: uppercase;
}
.customer-address-review-default {
    flex: 0 0 auto;
    padding: 4px 8px;
    border: 1px solid #a7d7b5;
    border-radius: 999px;
    background: #effaf2;
    color: #166534;
    font-size: .68rem;
    font-weight: 750;
}
.customer-address-review-recipient {
    color: var(--theme-text, #172033);
    font-size: .8rem;
    font-weight: 750;
}
.customer-address-review-address,
.customer-address-review-phone {
    color: var(--theme-muted, #667085);
    font-size: .78rem;
    line-height: 1.45;
    overflow-wrap: anywhere;
}
.customer-address-review-phone { margin-top: 5px; }
.customer-address-review-missing { font-style: italic; }
.customer-address-review-geo {
    display: grid;
    gap: 4px;
    padding: 10px;
    border: 1px solid color-mix(in srgb, #f59e0b 40%, var(--theme-border, #d8dee8));
    border-left: 3px solid #f59e0b;
    border-radius: 10px;
    background: color-mix(in srgb, #f59e0b 7%, var(--theme-card, #fff));
    color: var(--theme-muted, #667085);
    font-size: .75rem;
    font-variant-numeric: tabular-nums;
}
.customer-address-review-geo.has-location {
    border-color: color-mix(in srgb, #10b981 38%, var(--theme-border, #d8dee8));
    border-left-color: #10b981;
    background: color-mix(in srgb, #10b981 6%, var(--theme-card, #fff));
    color: var(--theme-text, #172033);
}
.customer-address-review-geo-title {
    color: var(--theme-text, #172033);
    font-size: .72rem;
    font-weight: 850;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.customer-address-review-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 2px;
}
.customer-address-review-action { min-height: 34px; padding: 7px 10px !important; font-size: .75rem; }
.customer-address-review-empty {
    padding: 16px;
    border: 1px dashed var(--theme-border, #d8dee8);
    border-radius: 11px;
    color: var(--theme-muted, #667085);
    text-align: center;
    font-size: .8rem;
}

@media (max-width: 900px) {
    .customer-geolocation-layout { grid-template-columns: 1fr; }
    .customer-geolocation-preview,
    .customer-geolocation-preview .leaflet-container,
    .customer-geolocation-preview.leaflet-container { min-height: 210px; height: 210px; }
    .customer-map-modal { width: calc(100vw - 12px); height: calc(100dvh - 12px); }
    .customer-map-coordinate-bar { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; }
    .customer-map-coordinate-bar .customer-map-display-name { grid-column: 1 / -1; }
}
@media (max-width: 640px) {
    .customer-geolocation-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .customer-geolocation-actions .customer-geo-btn { width: 100% !important; white-space: normal; }
    .customer-geolocation-saved-summary { grid-template-columns: 1fr auto; }
    .customer-geolocation-saved-details { grid-column: 1 / -1; gap: 5px 14px; }
    .customer-geolocation-refresh-link { grid-column: 2; grid-row: 1; }
    .customer-map-modal-backdrop { padding: 0; }
    .customer-map-modal {
        width: 100vw;
        height: 100dvh;
        border: 0;
        border-radius: 0;
        grid-template-rows: auto auto auto minmax(150px, 1fr) auto auto;
    }
    .customer-map-modal-header { padding: 10px 12px 8px; }
    .customer-map-modal-header p { font-size: .74rem; }
    .customer-map-import-panel { grid-template-columns: minmax(0, 1fr) auto; padding: 8px 12px; }
    .customer-map-import-panel p { display: none; }
    .customer-map-primary-action { min-height: 38px; padding-inline: 10px !important; }
    .customer-map-toolbar { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); padding: 7px 12px; }
    .customer-map-toolbar .customer-geo-btn { width: 100% !important; padding-inline: 7px !important; white-space: normal; font-size: .7rem; }
    .customer-map-status { grid-column: 1 / -1; min-width: 0; font-size: .72rem; }
    .customer-map-coordinate-bar { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; padding: 7px 12px; }
    .customer-map-coordinate-bar label { font-size: .66rem; }
    .customer-map-coordinate-bar .odoo-input { min-height: 34px; }
    .customer-map-apply-coordinates { padding-inline: 8px !important; font-size: .7rem; }
    .customer-map-modal-actions { padding: 8px 12px; }
    .customer-map-stage-hint { left: 8px; bottom: 8px; max-width: calc(100% - 16px); font-size: .68rem; }
    .customer-address-review-section { padding: 13px; }
    .customer-address-review-heading { grid-template-columns: auto minmax(0, 1fr); }
    .customer-address-review-count { grid-column: 2; justify-self: start; }
    .customer-address-review-grid { grid-template-columns: 1fr; }
}
@media (max-width: 420px) {
    .customer-map-import-panel { grid-template-columns: 1fr; }
    .customer-map-primary-action { width: 100% !important; }
    .customer-map-toolbar { grid-template-columns: 1fr 1fr; }
    .customer-map-toolbar .customer-map-action:last-of-type { grid-column: 1 / -1; }
    .customer-map-coordinate-bar { grid-template-columns: 1fr 1fr; }
    .customer-map-apply-coordinates { grid-column: 1 / -1; width: 100% !important; }
    .customer-geolocation-actions { grid-template-columns: 1fr; }
}
.customer-map-modal .erp-lookup-close {
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    border: 1px solid var(--theme-border, #d8dee8);
    border-radius: 10px;
    background: var(--theme-card, #fff) !important;
    color: var(--theme-text, #172033) !important;
    font-size: 1.25rem;
    box-shadow: 0 4px 12px color-mix(in srgb, var(--theme-text, #172033) 8%, transparent);
}
@media (max-height: 700px) and (min-width: 641px) {
    .customer-map-modal {
        grid-template-rows: auto auto auto minmax(100px, 1fr) auto auto;
    }
    .customer-map-modal-header { padding-block: 8px; }
    .customer-map-modal-header p,
    .customer-map-import-panel p { display: none; }
    .customer-map-import-panel,
    .customer-map-toolbar,
    .customer-map-coordinate-bar,
    .customer-map-modal-actions { padding-block: 6px; }
    .customer-geo-btn { min-height: 34px; padding-block: 6px !important; }
}

/* Website Content save feedback, required-field guidance and stable account dropdown. */
.website-content-alert {
    display: grid;
    grid-template-columns: 30px minmax(0, 1fr) 32px;
    align-items: center;
    gap: 10px;
    min-height: 54px;
    padding: 10px 12px !important;
    font-weight: 650 !important;
    box-shadow: 0 9px 24px color-mix(in srgb, var(--text, #1f2937) 7%, transparent);
}
.website-content-alert > div { min-width: 0; }
.website-content-alert strong,
.website-content-alert span { display: block; }
.website-content-alert strong { margin-bottom: 3px; color: inherit; font-size: .8rem; }
.website-content-alert > div > span { color: inherit; font-size: .73rem; font-weight: 600; overflow-wrap: anywhere; }
.website-content-alert.success { border-color: color-mix(in srgb, #15803d 36%, var(--border, #d8e1ec)); background: color-mix(in srgb, #22c55e 10%, var(--surface, #fff)); color: #166534; }
.website-content-alert.warning { border-color: color-mix(in srgb, #d97706 40%, var(--border, #d8e1ec)); background: color-mix(in srgb, #f59e0b 12%, var(--surface, #fff)); color: #92400e; }
.website-content-alert.error { border-color: color-mix(in srgb, #dc2626 38%, var(--border, #d8e1ec)); background: color-mix(in srgb, #ef4444 9%, var(--surface, #fff)); color: #991b1b; }
.website-content-alert-icon { width: 28px; height: 28px; display: grid !important; place-items: center; border-radius: 50%; background: color-mix(in srgb, currentColor 12%, transparent); font-size: .8rem; font-weight: 900; }
.website-content-alert-close { width: 30px; height: 30px; display: grid; place-items: center; border: 1px solid color-mix(in srgb, currentColor 22%, transparent); border-radius: 9px; background: transparent; color: inherit; font: inherit; font-size: 1.05rem; cursor: pointer; }
.website-content-alert-close:hover,
.website-content-alert-close:focus-visible { background: color-mix(in srgb, currentColor 8%, transparent); outline: none; }
.website-content-required { color: #b42318; font-size: .82em; }
.website-content-field-error { min-height: 15px; color: #b42318 !important; font-size: .64rem; font-weight: 750; line-height: 1.35; }
.website-content-field-error:empty { display: none; }
.website-content-form-message { display: grid; gap: 4px; padding: 10px 12px; border: 1px solid color-mix(in srgb, #dc2626 34%, var(--border, #d8e1ec)); border-radius: 9px; background: color-mix(in srgb, #ef4444 8%, var(--surface, #fff)); color: #991b1b; font-size: .7rem; font-weight: 700; line-height: 1.45; }
.website-content-form-message[hidden] { display: none !important; }
.website-content-form-message strong { font-size: .75rem; }
.website-content-form .input-validation-error,
.website-content-form [aria-invalid="true"],
.website-storefront-address [aria-invalid="true"] { border-color: #dc2626 !important; background: color-mix(in srgb, #ef4444 4%, var(--input-bg, var(--surface, #fff))) !important; box-shadow: 0 0 0 3px color-mix(in srgb, #ef4444 10%, transparent) !important; }
.website-storefront-address { position: relative; }
.website-storefront-address .website-content-form-message { grid-column: 1 / -1; width: 100%; }
.website-content-btn.is-saving { pointer-events: none; opacity: .72; }

/* Keep Theme and account anchored to its button while the page or a nested panel scrolls. */
body .account-menu:not(.is-open) .account-dropdown { display: none !important; }
body .account-menu.is-open { z-index: 10050; }
body .account-menu.is-open .account-dropdown {
    position: fixed !important;
    right: auto !important;
    display: block !important;
    width: min(286px, calc(100vw - 20px));
    min-width: min(260px, calc(100vw - 20px));
    max-height: min(430px, calc(100dvh - 20px));
    overflow-y: auto;
    overscroll-behavior: contain;
    z-index: 10051;
    margin: 0 !important;
    transform: none !important;
    animation: none !important;
}
body .account-menu.is-open .account-menu-button { position: relative; z-index: 10052; }
@media (max-width: 760px) {
    body .account-menu.is-open .account-dropdown {
        width: min(320px, calc(100vw - 16px));
        min-width: 0;
    }
}

/* Customer Create / Alter action toolbar: advanced theme-aware control pack. */
.customer-editor-form .customer-editor-statusbar {
    min-height: 62px;
    padding: 10px 14px;
    border: 1px solid color-mix(in srgb, var(--theme-primary, var(--brand)) 15%, var(--theme-border, var(--border)));
    border-radius: 13px;
    background:
        linear-gradient(135deg,
            color-mix(in srgb, var(--theme-primary, var(--brand)) 5%, var(--theme-card, var(--card))) 0%,
            color-mix(in srgb, var(--theme-card, var(--card)) 96%, transparent) 62%,
            color-mix(in srgb, var(--theme-primary, var(--brand)) 3%, var(--theme-card, var(--card))) 100%);
    box-shadow:
        0 10px 26px color-mix(in srgb, var(--theme-text, var(--text)) 7%, transparent),
        inset 0 1px 0 color-mix(in srgb, #fff 32%, transparent);
}

.customer-editor-form .customer-editor-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 9px;
}

.customer-editor-form .customer-editor-action {
    position: relative;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-width: 92px;
    min-height: 40px;
    margin: 0;
    padding: 8px 15px !important;
    border: 1px solid color-mix(in srgb, var(--theme-primary, var(--brand)) 30%, var(--theme-border, var(--border))) !important;
    border-radius: 10px !important;
    background: color-mix(in srgb, var(--theme-card, var(--card)) 95%, var(--theme-primary, var(--brand)) 5%) !important;
    color: var(--theme-text, var(--text)) !important;
    font: inherit;
    font-size: .78rem !important;
    font-weight: 760 !important;
    line-height: 1 !important;
    letter-spacing: .005em;
    text-decoration: none !important;
    white-space: nowrap;
    box-shadow:
        0 5px 13px color-mix(in srgb, var(--theme-text, var(--text)) 8%, transparent),
        inset 0 1px 0 color-mix(in srgb, #fff 35%, transparent);
    cursor: pointer;
    overflow: hidden;
    isolation: isolate;
    transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease,
                background .16s ease, color .16s ease;
}

.customer-editor-form .customer-editor-action::before {
    display: inline-grid;
    place-items: center;
    width: 22px;
    height: 22px;
    flex: 0 0 22px;
    border-radius: 7px;
    background: color-mix(in srgb, currentColor 10%, transparent);
    color: inherit;
    font-size: .76rem;
    font-weight: 900;
    line-height: 1;
}

.customer-editor-form .customer-editor-action::after {
    content: "";
    position: absolute;
    inset: auto 12px 0;
    height: 2px;
    border-radius: 999px;
    background: currentColor;
    opacity: 0;
    transform: scaleX(.35);
    transition: opacity .16s ease, transform .16s ease;
}

.customer-editor-form .customer-editor-action:hover,
.customer-editor-form .customer-editor-action:focus-visible {
    border-color: currentColor !important;
    background: color-mix(in srgb, currentColor 9%, var(--theme-card, var(--card))) !important;
    box-shadow:
        0 9px 20px color-mix(in srgb, currentColor 13%, transparent),
        inset 0 0 0 1px color-mix(in srgb, currentColor 9%, transparent);
    transform: translateY(-1px);
    outline: none;
}

.customer-editor-form .customer-editor-action:hover::after,
.customer-editor-form .customer-editor-action:focus-visible::after {
    opacity: .9;
    transform: scaleX(1);
}

.customer-editor-form .customer-editor-action:active {
    transform: translateY(0);
    box-shadow: inset 0 1px 4px color-mix(in srgb, var(--theme-text, var(--text)) 12%, transparent);
}

.customer-editor-form .customer-editor-action-primary {
    border-color: color-mix(in srgb, var(--theme-primary, var(--brand)) 52%, var(--theme-border, var(--border))) !important;
    background: color-mix(in srgb, var(--theme-primary, var(--brand)) 10%, var(--theme-card, var(--card))) !important;
    color: var(--theme-primary, var(--brand)) !important;
}
.customer-editor-form .customer-editor-action-primary::before { content: "✓"; }

.customer-editor-form .customer-editor-action-secondary {
    color: var(--theme-muted, var(--muted)) !important;
}
.customer-editor-form .customer-editor-action-secondary::before { content: "←"; }

.customer-editor-form .customer-editor-action-addresses {
    min-width: 158px;
    color: var(--theme-primary, var(--brand)) !important;
    border-color: color-mix(in srgb, var(--theme-primary, var(--brand)) 42%, var(--theme-border, var(--border))) !important;
    background: color-mix(in srgb, var(--theme-primary, var(--brand)) 7%, var(--theme-card, var(--card))) !important;
}
.customer-editor-form .customer-editor-action-addresses::before { content: "⌂"; }
.customer-editor-form .customer-editor-action-addresses span {
    min-width: 21px;
    height: 21px;
    padding: 0 6px;
    border: 1px solid color-mix(in srgb, var(--theme-primary, var(--brand)) 28%, transparent);
    background: color-mix(in srgb, var(--theme-primary, var(--brand)) 12%, var(--theme-card, var(--card)));
    color: var(--theme-primary, var(--brand));
    font-size: .68rem;
    font-weight: 800;
}

.customer-editor-form .customer-editor-action-danger {
    color: var(--danger, #dc3545) !important;
    border-color: color-mix(in srgb, var(--danger, #dc3545) 42%, var(--theme-border, var(--border))) !important;
    background: color-mix(in srgb, var(--danger, #dc3545) 7%, var(--theme-card, var(--card))) !important;
}
.customer-editor-form .customer-editor-action-danger::before { content: "×"; }

.customer-editor-form .customer-editor-statusbar .odoo-status-steps {
    padding: 4px;
    border: 1px solid color-mix(in srgb, var(--theme-primary, var(--brand)) 13%, var(--theme-border, var(--border)));
    border-radius: 10px;
    background: color-mix(in srgb, var(--theme-card, var(--card)) 92%, transparent);
}

@media (max-width: 900px) {
    .customer-editor-form .customer-editor-statusbar {
        align-items: stretch;
        flex-direction: column;
    }
    .customer-editor-form .customer-editor-actions {
        width: 100%;
    }
    .customer-editor-form .customer-editor-statusbar .odoo-status-steps {
        align-self: flex-start;
    }
}

@media (max-width: 620px) {
    .customer-editor-form .customer-editor-actions {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .customer-editor-form .customer-editor-action,
    .customer-editor-form .customer-editor-action-addresses {
        width: 100%;
        min-width: 0;
    }
    .customer-editor-form .customer-editor-action-addresses {
        grid-column: 1 / -1;
    }
    .customer-editor-form .customer-editor-action-danger:last-child:nth-child(4) {
        grid-column: auto;
    }
}

/* POS (Sales): show only the current Sales Status and Payment Status.
   The hidden legacy status nodes remain in the DOM only to preserve existing
   delivery/invoice conditions and button behaviour. */
.sales-entry-page .sales-statusbar[hidden],
.sales-entry-page .sales-statusbar-compat {
    display: none !important;
}

.sales-entry-page .sales-current-statuses {
    display: grid;
    grid-template-columns: minmax(118px, 1fr) minmax(128px, 1fr) auto;
    align-items: stretch;
    gap: 8px;
    min-width: min(100%, 390px);
    margin-left: auto;
}

.sales-entry-page .sales-current-status-card,
.sales-entry-page .sales-current-document-type {
    min-width: 0;
    min-height: 38px;
    border: 1px solid color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 20%, var(--border, #d6d9dd));
    border-radius: 8px;
    background: color-mix(in srgb, var(--card, #fff) 94%, var(--theme-primary-soft, #f5f1f4));
    color: var(--text, #111827);
    box-shadow: 0 2px 7px rgba(15, 23, 42, .07);
}

.sales-entry-page .sales-current-status-card {
    display: grid;
    align-content: center;
    gap: 2px;
    padding: 5px 10px;
}

.sales-entry-page .sales-current-status-card > span,
.sales-entry-page .sales-current-document-type > span {
    color: var(--muted, #64748b);
    font-size: 9px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: .055em;
    text-transform: uppercase;
    white-space: nowrap;
}

.sales-entry-page .sales-current-status-value {
    display: block;
    min-width: 0;
    overflow: hidden;
    color: var(--text, #111827);
    font-size: 13px;
    font-weight: 700;
    line-height: 1.18;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sales-entry-page .sales-current-document-type {
    display: grid;
    place-items: center;
    align-content: center;
    gap: 2px;
    min-width: 70px;
    padding: 5px 9px;
    border-color: color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 42%, var(--border, #d6d9dd));
    background: var(--theme-primary-soft, color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 10%, var(--card, #fff)));
}

.sales-entry-page .sales-current-document-type strong {
    color: var(--theme-primary, var(--brand, #714b67));
    font-size: 14px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: .06em;
    white-space: nowrap;
}

.sales-entry-page .sales-current-status-value.draft {
    color: var(--muted, #64748b);
}

.sales-entry-page .sales-current-status-value.saved {
    color: var(--theme-primary, var(--brand, #714b67));
}

.sales-entry-page .sales-current-status-value.delivered,
.sales-entry-page .sales-current-status-value.invoiced,
.sales-entry-page .sales-current-status-value.paid {
    color: var(--success, #15803d);
}

.sales-entry-page .sales-current-status-value.partial-paid {
    color: #a16207;
}

.sales-entry-page .sales-current-status-value.unpaid {
    color: #b45309;
}

.sales-entry-page .sales-current-status-value.cancelled {
    color: var(--danger, #b91c1c);
}

body.theme-dark .sales-entry-page .sales-current-status-card,
body.theme-midnight .sales-entry-page .sales-current-status-card,
body.theme-carbon .sales-entry-page .sales-current-status-card,
body.theme-dark .sales-entry-page .sales-current-document-type,
body.theme-midnight .sales-entry-page .sales-current-document-type,
body.theme-carbon .sales-entry-page .sales-current-document-type {
    background: color-mix(in srgb, var(--card, #111827) 92%, var(--theme-primary, var(--brand, #714b67)) 8%);
    box-shadow: 0 2px 8px rgba(0, 0, 0, .22);
}

@media (max-width: 1120px) {
    .sales-entry-page .sales-odoo-actionbar {
        flex-wrap: wrap;
    }

    .sales-entry-page .sales-current-statuses {
        width: 100%;
        max-width: 480px;
        margin-left: 0;
    }
}

@media (max-width: 760px) {
    .sales-entry-page .sales-current-statuses {
        width: 100%;
        max-width: none;
        min-width: 0;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 72px;
    }
}

@media (max-width: 430px) {
    .sales-entry-page .sales-current-statuses {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    }

    .sales-entry-page .sales-current-document-type {
        grid-column: 1 / -1;
        grid-template-columns: auto auto;
        justify-content: center;
        min-height: 32px;
    }
}

/* POS Sales: verified read-only Driver App / vehicle mapping by ERP TransCode + QutoNo. */
.sales-page .sales-driver-link-card {
    grid-column: 1 / -1;
    display: grid;
    gap: 8px;
    margin-top: 2px;
    padding: 10px 12px;
    border: 1px solid color-mix(in srgb, var(--theme-primary, #714b67) 30%, var(--border-color, #d7d9df));
    border-radius: 10px;
    background: color-mix(in srgb, var(--theme-primary, #714b67) 5%, var(--surface, #fff));
    box-shadow: 0 4px 14px rgba(20, 24, 36, .06);
}

.sales-page .sales-driver-link-card[hidden] {
    display: none !important;
}

.sales-page .sales-driver-link-card.is-delivered {
    border-color: color-mix(in srgb, #198754 45%, var(--border-color, #d7d9df));
    background: color-mix(in srgb, #198754 7%, var(--surface, #fff));
}

.sales-page .sales-driver-link-card.is-warning {
    border-color: color-mix(in srgb, #b42318 42%, var(--border-color, #d7d9df));
    background: color-mix(in srgb, #b42318 6%, var(--surface, #fff));
}

.sales-page .sales-driver-link-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.sales-page .sales-driver-link-head > span {
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .035em;
    text-transform: uppercase;
    color: var(--text-muted, #667085);
}

.sales-page .sales-driver-link-head > strong {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    padding: 3px 9px;
    border-radius: 999px;
    border: 1px solid color-mix(in srgb, var(--theme-primary, #714b67) 35%, transparent);
    background: color-mix(in srgb, var(--theme-primary, #714b67) 10%, transparent);
    color: var(--theme-primary, #714b67);
    font-size: 11px;
    font-weight: 800;
    white-space: nowrap;
}

.sales-page .sales-driver-link-card.is-delivered .sales-driver-link-head > strong {
    border-color: color-mix(in srgb, #198754 50%, transparent);
    background: color-mix(in srgb, #198754 12%, transparent);
    color: #147044;
}

.sales-page .sales-driver-link-card.is-warning .sales-driver-link-head > strong {
    border-color: color-mix(in srgb, #b42318 45%, transparent);
    background: color-mix(in srgb, #b42318 10%, transparent);
    color: #9f1c13;
}

.sales-page .sales-driver-link-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px 12px;
}

.sales-page .sales-driver-link-grid > div {
    min-width: 0;
    display: grid;
    gap: 1px;
}

.sales-page .sales-driver-link-grid small {
    color: var(--text-muted, #667085);
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .025em;
}

.sales-page .sales-driver-link-grid b {
    overflow: hidden;
    color: var(--text-color, #20242c);
    font-size: 12px;
    font-weight: 750;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sales-page .sales-driver-link-mapping {
    padding-top: 6px;
    border-top: 1px dashed color-mix(in srgb, var(--border-color, #d7d9df) 80%, transparent);
    color: var(--text-muted, #667085);
    font-size: 10px;
    line-height: 1.35;
}

@media (max-width: 720px) {
    .sales-page .sales-driver-link-grid {
        grid-template-columns: 1fr;
    }

    .sales-page .sales-driver-link-grid b {
        white-space: normal;
    }
}

/* Stock Items archived status, readable weights, and POS-style create/alter action bar */
.stock-items-page .odoo-product-list tbody td,
.stock-items-page .odoo-product-list tbody td *,
.stock-items-page .stock-kanban-card,
.stock-items-page .stock-kanban-card * {
    font-weight: 400;
}
.stock-items-page .odoo-product-list .stock-name-cell,
.stock-items-page .odoo-product-list .stock-name-cell *,
.stock-items-page .stock-kanban-card .kanban-title,
.stock-items-page .stock-kanban-card .kanban-title *,
.stock-items-page .stock-kanban-card .kanban-product-name {
    color: var(--text);
    font-size: 17px;
    line-height: 1.25;
    font-weight: 500;
}
.stock-items-page .stock-status,
.stock-items-page .stock-status * {
    font-weight: 400;
}
.stock-items-page .kanban-archive-row {
    margin-top: 8px;
}
.stock-items-page .stock-kanban-card.deactivated {
    opacity: .78;
}
.stock-items-page .stock-kanban-card.deactivated .kanban-product-name {
    text-decoration: none;
}

.stock-item-edit-page .stock-item-pos-actionbar {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin: 0 0 12px;
    padding: 10px 12px;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: color-mix(in srgb, var(--card) 94%, var(--soft));
}
.stock-item-edit-page .stock-item-pos-actionbar .sales-action {
    min-width: 92px;
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    font-weight: 500;
}
.stock-item-edit-page .vb-stock-form label,
.stock-item-edit-page .vb-stock-form label > span,
.stock-item-edit-page .vb-stock-form input,
.stock-item-edit-page .vb-stock-form select,
.stock-item-edit-page .vb-stock-form textarea,
.stock-item-edit-page .vb-stock-form .vb-price-matrix-row > span,
.stock-item-edit-page .vb-stock-form .vb-price-matrix-head strong,
.stock-item-edit-page .vb-stock-form .vb-unit-table b {
    font-weight: 400 !important;
}
.stock-item-edit-page .vb-stock-form input::placeholder,
.stock-item-edit-page .vb-stock-form textarea::placeholder {
    font-weight: 400 !important;
}
.stock-item-edit-page .vb-status-label input {
    font-weight: 400 !important;
}
.stock-item-edit-page .vb-status-label.active input {
    color: #15803d !important;
}
.stock-item-edit-page .vb-status-label.archived input {
    color: #b91c1c !important;
}
@media (max-width: 700px) {
    .stock-item-edit-page .stock-item-pos-actionbar {
        align-items: stretch;
    }
    .stock-item-edit-page .stock-item-pos-actionbar .sales-action {
        flex: 1 1 105px;
    }
}

/* Stock Items: fixed advanced MVC headers and always-visible action bars.
   Scoped to the Stock Items list and Create/Alter pages only. */
.stock-items-sticky-header,
.stock-item-sticky-header {
    position: sticky;
    top: 0;
    z-index: 1350;
    display: grid;
    align-items: stretch;
    gap: 0;
    width: 100%;
    max-width: 100%;
    margin: 0 0 12px;
    padding: 0;
    box-sizing: border-box;
    overflow: visible;
    border: 1px solid color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 20%, var(--border, #dbe4ef));
    border-radius: 14px;
    background: color-mix(in srgb, var(--card, #fff) 95%, var(--theme-primary-soft, var(--soft, #f7f4f7)));
    box-shadow: 0 10px 28px rgba(15, 23, 42, .10), 0 1px 0 rgba(255, 255, 255, .55) inset;
    backdrop-filter: blur(14px);
}
.stock-items-header-main,
.stock-item-header-main {
    display: grid;
    align-items: center;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 14px;
    min-width: 0;
    padding: 11px 14px 9px;
}
.stock-item-header-main {
    grid-template-columns: minmax(260px, 1fr) auto;
}
.stock-items-title-block,
.stock-edit-titleline {
    min-width: 0;
}
.stock-items-title-block > div,
.stock-edit-titleline > div {
    min-width: 0;
}
.stock-items-sticky-header .odoo-product-title h1,
.stock-item-sticky-header .odoo-product-title h1 {
    margin: 0;
    color: var(--text, #152238);
    font-size: clamp(1.08rem, 1.6vw, 1.35rem);
    font-weight: 650;
    letter-spacing: -.015em;
}
.stock-items-sticky-header .stock-path,
.stock-item-sticky-header .stock-path {
    display: block;
    margin: 5px 0 0;
    color: var(--muted, #64748b);
    font-size: .76rem;
    font-weight: 500;
    line-height: 1.35;
}
.stock-items-sticky-header .stock-header-back {
    min-height: 36px;
    display: inline-flex;
    align-items: center;
    padding: 0 12px;
    border: 1px solid var(--border, #dbe4ef);
    border-radius: 9px;
    background: var(--card, #fff);
    color: var(--text, #152238);
    text-decoration: none;
    font-size: .82rem;
    font-weight: 500;
}
.stock-items-header-user,
.stock-item-header-user {
    min-width: 0;
}
.stock-items-header-user {
    padding-right: 54px;
}
.stock-item-header-user {
    flex: 0 0 auto;
    padding-right: 0;
}
.stock-item-header-right {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 14px;
    min-width: 0;
    margin-left: auto;
}
.stock-header-actionbar,
.stock-item-header-actionbar {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    min-width: 0;
    margin: 0;
    padding: 9px 14px 11px;
    border-top: 1px solid color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 14%, var(--border, #dbe4ef));
    border-radius: 0 0 14px 14px;
    background: color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 5%, var(--card, #fff));
}
.stock-header-action {
    appearance: none;
    min-height: 39px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 0 14px;
    border: 1px solid color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 24%, var(--border, #dbe4ef));
    border-radius: 9px;
    background: color-mix(in srgb, var(--card, #fff) 92%, var(--theme-primary-soft, var(--soft, #f7f4f7)));
    color: var(--text, #152238);
    box-shadow: 0 3px 10px rgba(15, 23, 42, .07);
    text-decoration: none;
    font: inherit;
    font-size: .84rem;
    font-weight: 600;
    line-height: 1;
    white-space: nowrap;
    cursor: pointer;
    transition: transform .14s ease, border-color .14s ease, background .14s ease, box-shadow .14s ease;
}
.stock-header-action:hover,
.stock-header-action:focus-visible {
    transform: translateY(-1px);
    border-color: var(--theme-primary, var(--brand, #714b67));
    background: color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 10%, var(--card, #fff));
    color: var(--theme-secondary, var(--brand-dark, #52364b));
    box-shadow: 0 7px 18px rgba(15, 23, 42, .11);
    outline: none;
}
.stock-header-action.primary {
    border-color: var(--theme-primary, var(--brand, #714b67));
    background: linear-gradient(135deg, var(--theme-primary, var(--brand, #714b67)), color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 78%, #111827));
    color: #fff;
    box-shadow: 0 7px 18px color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 24%, transparent);
}
.stock-header-action.primary:hover,
.stock-header-action.primary:focus-visible {
    color: #fff;
    background: linear-gradient(135deg, color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 90%, #fff), var(--theme-primary, var(--brand, #714b67)));
}
.stock-header-action.state {
    border-color: color-mix(in srgb, #d97706 36%, var(--border, #dbe4ef));
}
.stock-action-icon {
    width: 22px;
    height: 22px;
    display: inline-grid;
    place-items: center;
    flex: 0 0 22px;
    border-radius: 7px;
    background: color-mix(in srgb, currentColor 9%, transparent);
    font-size: .92rem;
    font-weight: 600;
}
.stock-header-action.primary .stock-action-icon {
    background: rgba(255, 255, 255, .16);
}
.stock-item-sticky-header .stock-edit-smart-buttons {
    align-self: stretch;
}
.stock-item-sticky-header .smart-button {
    min-width: 94px;
    background: color-mix(in srgb, var(--card, #fff) 90%, var(--theme-primary-soft, var(--soft, #f7f4f7)));
}
.stock-item-sticky-header .smart-button strong {
    font-weight: 600;
}
.stock-item-sticky-header .smart-button span {
    font-weight: 400;
}
.stock-item-sticky-header .stock-breadcrumb-link {
    font-weight: 600;
}
.stock-item-edit-page {
    padding-top: 0;
}
.main-area:has(.stock-items-sticky-header) > .erp-notification-slot,
.main-area:has(.stock-item-sticky-header) > .erp-notification-slot {
    top: 12px !important;
    right: 12px !important;
    z-index: 1900 !important;
}
@media (max-width: 1050px) {
    .stock-item-header-main {
        grid-template-columns: minmax(0, 1fr) auto;
    }
    .stock-item-header-right {
        flex-wrap: wrap;
        justify-content: flex-end;
    }
    .stock-item-sticky-header .stock-edit-smart-buttons {
        max-width: min(100%, 520px);
        overflow-x: auto;
    }
}
@media (max-width: 760px) {
    .stock-items-sticky-header,
    .stock-item-sticky-header {
        top: 0;
        border-radius: 11px;
    }
    .stock-items-header-main,
    .stock-item-header-main {
        grid-template-columns: minmax(0, 1fr);
        gap: 9px;
        padding: 10px;
    }
    .stock-items-header-user {
        grid-column: 1;
        grid-row: auto;
        justify-content: flex-start;
        padding-right: 44px;
    }
    .stock-item-header-right {
        width: 100%;
        margin-left: 0;
        justify-content: space-between;
        gap: 10px;
    }
    .stock-item-header-user {
        justify-content: flex-end;
        padding-right: 0;
    }
    .stock-items-sticky-header .stock-header-back {
        display: none;
    }
    .stock-header-actionbar,
    .stock-item-header-actionbar {
        padding: 8px 10px 10px;
        gap: 7px;
    }
    .stock-header-action {
        flex: 1 1 112px;
        min-width: 0;
        padding-inline: 10px;
    }
    .stock-item-sticky-header .stock-edit-smart-buttons {
        flex: 1 1 340px;
        min-width: 0;
    }
}
@media print {
    .stock-items-sticky-header,
    .stock-item-sticky-header {
        position: static !important;
        box-shadow: none !important;
    }
    .stock-header-actionbar,
    .stock-item-header-actionbar,
    .stock-items-sticky-header .user-panel,
    .stock-item-sticky-header .user-panel {
        display: none !important;
    }
}


/* Stock Items header right-edge alignment correction.
   The global notification rail reserves right padding for ordinary topbars. These
   two sticky Stock Item headers own their complete title/control layout, so keep
   the metrics plus Theme/account control as one non-wrapping group at the real
   right edge, matching the approved Stock Item header screenshot. */
.main-area:has(> .erp-notification-slot) .stock-items-sticky-header:has(.account-menu),
.main-area:has(> .erp-notification-slot) .stock-item-sticky-header:has(.account-menu) {
    padding-right: 0 !important;
}
.stock-items-sticky-header,
.stock-item-sticky-header {
    position: sticky !important;
    top: 0 !important;
}
.stock-items-header-main,
.stock-item-header-main {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 14px;
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
}
.stock-items-title-block,
.stock-edit-titleline {
    flex: 1 1 auto;
    min-width: 0;
}
.stock-item-header-right,
.stock-items-header-user {
    flex: 0 0 auto;
    width: max-content;
    max-width: 100%;
    margin-left: auto;
    justify-content: flex-end;
}
.stock-item-header-right {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    gap: 14px;
}
.stock-item-sticky-header .stock-edit-smart-buttons {
    flex: 0 0 auto;
    width: max-content;
    max-width: none;
    margin-left: 0;
    overflow: visible;
}
.stock-item-header-user,
.stock-items-header-user,
.stock-item-header-user .account-menu,
.stock-items-header-user .account-menu,
.stock-item-header-user .account-menu-button,
.stock-items-header-user .account-menu-button {
    flex: 0 0 auto;
    width: auto !important;
    min-width: 0;
    max-width: none;
}
.stock-item-header-user,
.stock-items-header-user {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding-right: 0;
}
.stock-item-header-user .account-dropdown,
.stock-items-header-user .account-dropdown {
    right: 0;
    left: auto;
}
@media (max-width: 980px) {
    .stock-item-header-main {
        align-items: flex-start;
        flex-wrap: wrap;
    }
    .stock-item-header-right {
        flex: 1 1 100%;
        width: 100%;
        margin-left: 0;
        justify-content: flex-end;
    }
}
@media (max-width: 760px) {
    .stock-items-header-main,
    .stock-item-header-main {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
    }
    .stock-item-header-right,
    .stock-items-header-user {
        width: 100%;
        margin-left: 0;
    }
    .stock-item-header-right {
        flex-wrap: wrap;
        justify-content: space-between;
    }
    .stock-item-sticky-header .stock-edit-smart-buttons {
        flex: 1 1 100%;
        width: 100%;
        max-width: 100%;
        overflow-x: auto;
    }
}


/* Stock Items exact fixed-header layout.
   Matches the approved screenshot: title/breadcrumb on the left, compact metrics
   and account/theme control at the true right edge, with actions on the row below. */
.stock-item-sticky-header {
    position: sticky !important;
    top: 0 !important;
    z-index: 1350 !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    overflow: visible !important;
}
.stock-item-sticky-header .stock-item-header-main {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) max-content !important;
    align-items: center !important;
    gap: 16px !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 87px;
    padding: 9px 16px 8px !important;
    box-sizing: border-box !important;
}
.stock-item-sticky-header .stock-edit-titleline {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 8px !important;
    min-width: 0 !important;
    width: auto !important;
}
.stock-item-sticky-header .stock-edit-titleline > div {
    flex: 0 1 auto !important;
    min-width: 0 !important;
}
.stock-item-sticky-header .stock-edit-gear {
    flex: 0 0 auto;
    margin-left: 0;
}
.stock-item-sticky-header .stock-item-header-right {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    justify-self: end !important;
    flex-wrap: nowrap !important;
    gap: 14px !important;
    width: max-content !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 0 !important;
    white-space: nowrap;
}
.stock-item-sticky-header .stock-edit-smart-buttons {
    display: grid !important;
    grid-template-columns: repeat(4, 103px) !important;
    align-items: stretch !important;
    flex: 0 0 412px !important;
    width: 412px !important;
    min-width: 412px !important;
    max-width: 412px !important;
    margin: 0 !important;
    overflow: hidden !important;
    border-radius: 9px !important;
}
.stock-item-sticky-header .stock-edit-smart-buttons .smart-button {
    width: 103px !important;
    min-width: 103px !important;
    max-width: 103px !important;
    min-height: 68px;
    padding: 7px 8px !important;
    box-sizing: border-box !important;
}
.stock-item-sticky-header .stock-item-header-user {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}
.stock-item-sticky-header .stock-item-header-user .account-menu,
.stock-item-sticky-header .stock-item-header-user .account-menu-button {
    flex: 0 0 auto !important;
    width: auto !important;
    max-width: none !important;
}
.stock-item-sticky-header .stock-item-header-user .account-menu-button {
    min-height: 49px;
    padding: 7px 12px 7px 7px;
    box-sizing: border-box;
}
.stock-item-sticky-header .stock-item-header-actionbar {
    min-height: 66px;
    padding: 11px 14px 12px !important;
    box-sizing: border-box;
}
.stock-item-sticky-header .stock-item-header-actionbar .stock-header-action {
    min-height: 43px;
}
@media (max-width: 1180px) {
    .stock-item-sticky-header .stock-item-header-main {
        grid-template-columns: minmax(0, 1fr) auto !important;
        gap: 10px !important;
    }
    .stock-item-sticky-header .stock-edit-smart-buttons {
        grid-template-columns: repeat(4, 88px) !important;
        flex-basis: 352px !important;
        width: 352px !important;
        min-width: 352px !important;
        max-width: 352px !important;
    }
    .stock-item-sticky-header .stock-edit-smart-buttons .smart-button {
        width: 88px !important;
        min-width: 88px !important;
        max-width: 88px !important;
    }
}
@media (max-width: 980px) {
    .stock-item-sticky-header .stock-item-header-main {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        align-items: stretch !important;
        min-height: 0;
    }
    .stock-item-sticky-header .stock-item-header-right {
        width: 100% !important;
        max-width: 100% !important;
        justify-self: stretch !important;
        justify-content: space-between !important;
        flex-wrap: wrap !important;
    }
    .stock-item-sticky-header .stock-edit-smart-buttons {
        flex: 1 1 412px !important;
        width: min(412px, 100%) !important;
        min-width: min(412px, 100%) !important;
        max-width: 100% !important;
        grid-template-columns: repeat(4, minmax(82px, 1fr)) !important;
    }
    .stock-item-sticky-header .stock-edit-smart-buttons .smart-button {
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
    }
}
@media (max-width: 560px) {
    .stock-item-sticky-header .stock-edit-smart-buttons {
        flex-basis: 100% !important;
        width: 100% !important;
        min-width: 100% !important;
        overflow-x: auto !important;
        grid-template-columns: repeat(4, minmax(82px, 1fr)) !important;
    }
    .stock-item-sticky-header .stock-item-header-user {
        margin-left: auto !important;
    }
}

/* Stock Item fixed-header controls: anchor the complete metric/account group at
   the true desktop right edge. This is intentionally limited to Create/Alter
   Stock Item and does not change mobile/tablet wrapping or business behavior. */
@media (min-width: 981px) {
    .stock-item-sticky-header .stock-item-header-main {
        position: relative !important;
        grid-template-columns: minmax(0, 1fr) !important;
        padding-right: clamp(560px, 40vw, 720px) !important;
    }

    .stock-item-sticky-header .stock-item-header-right {
        position: absolute !important;
        top: 9px !important;
        right: 16px !important;
        bottom: auto !important;
        left: auto !important;
        justify-self: auto !important;
        margin: 0 !important;
    }
}

/* Stock Items list header: keep the Inventory Masters link and the account/theme
   menu at the true desktop top-right edge. The earlier right-edge rule covered only
   Create/Alter Stock Item; this adds the same deterministic placement to the list. */
.stock-items-sticky-header {
    grid-template-columns: minmax(0, 1fr) !important;
    justify-content: stretch !important;
}

.stock-items-sticky-header > .stock-items-header-main,
.stock-items-sticky-header > .stock-header-actionbar {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
}

@media (min-width: 981px) {
    .stock-items-sticky-header .stock-items-header-main {
        position: relative !important;
        display: block !important;
        min-height: 68px !important;
        padding: 11px clamp(380px, 32vw, 540px) 9px 14px !important;
        box-sizing: border-box !important;
    }

    .stock-items-sticky-header .stock-items-title-block {
        display: block !important;
        width: 100% !important;
        min-width: 0 !important;
    }

    .stock-items-sticky-header .stock-items-header-user {
        position: absolute !important;
        top: 9px !important;
        right: 16px !important;
        bottom: auto !important;
        left: auto !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        flex-wrap: nowrap !important;
        gap: 12px !important;
        width: max-content !important;
        max-width: min(520px, calc(100% - 32px)) !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        white-space: nowrap !important;
    }

    .stock-items-sticky-header .stock-items-header-user .account-menu,
    .stock-items-sticky-header .stock-items-header-user .account-menu-button {
        flex: 0 0 auto !important;
        width: auto !important;
        max-width: none !important;
    }

    .stock-items-sticky-header .stock-items-header-user .account-menu:not(.is-open) .account-dropdown {
        right: 0 !important;
        left: auto !important;
    }
}

/* POS (Sales) Invoice Lines: use the same compact dimensions and visual rhythm
   as Direct Purchase Invoice .purchase-row-actions. The purchase-row-actions class
   is also present in the Razor markup, so the row remains correct even when an old
   browser stylesheet is still cached. */
.sales-entry-page [data-sales-tab-panel="invoice"] > .sales-line-links.sales-line-commandbar {
    position: sticky;
    bottom: 0;
    z-index: 56;
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    gap: 8px;
    width: 100%;
    min-height: 44px;
    margin: 0;
    padding: 10px 0 2px;
    border: 0;
    background: var(--card, #fff);
    box-shadow: none;
    box-sizing: border-box;
}

.sales-entry-page [data-sales-tab-panel="invoice"] > .sales-line-commandbar > button {
    appearance: none;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    min-height: 32px !important;
    height: 32px !important;
    margin: 0 !important;
    padding: 7px 10px !important;
    border: 1px solid var(--border, #d7e5df) !important;
    border-radius: 5px !important;
    background: var(--card, #fff) !important;
    color: var(--erp-primary, var(--theme-primary, var(--brand, #008c6a))) !important;
    box-shadow: none !important;
    font-family: inherit !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    line-height: 16px !important;
    letter-spacing: 0 !important;
    white-space: nowrap !important;
    text-decoration: none !important;
    cursor: pointer;
    transform: none !important;
}

.sales-entry-page [data-sales-tab-panel="invoice"] > .sales-line-commandbar > button:hover:not(:disabled),
.sales-entry-page [data-sales-tab-panel="invoice"] > .sales-line-commandbar > button:focus-visible:not(:disabled) {
    border-color: var(--erp-primary, var(--theme-primary, var(--brand, #008c6a))) !important;
    background: var(--soft, #f8fafc) !important;
    color: var(--erp-primary, var(--theme-primary, var(--brand, #008c6a))) !important;
    box-shadow: none !important;
    outline: none !important;
    transform: none !important;
}

.sales-entry-page [data-sales-tab-panel="invoice"] > .sales-line-commandbar > button:active:not(:disabled) {
    background: color-mix(in srgb, var(--soft, #f8fafc) 82%, var(--card, #fff)) !important;
    transform: none !important;
}

.sales-entry-page [data-sales-tab-panel="invoice"] > .sales-line-commandbar > button:disabled {
    opacity: .58;
    cursor: not-allowed;
    transform: none !important;
}

.sales-entry-page [data-sales-tab-panel="invoice"] > .sales-line-commandbar .sales-line-link-icon.catalog {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 14px !important;
    width: 14px !important;
    height: 14px !important;
    margin: 0 4px 0 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: inherit !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    line-height: 14px !important;
    overflow: hidden !important;
}

.sales-entry-page [data-sales-tab-panel="invoice"] > .sales-line-commandbar [data-product-count] {
    display: none !important;
}

.sales-entry-page [data-sales-tab-panel="invoice"] > .sales-line-commandbar .sales-line-commandbar-count {
    flex: 0 0 auto;
    margin: 0 0 0 auto !important;
    color: var(--erp-primary, var(--theme-primary, var(--brand, #008c6a)));
    font-family: inherit;
    font-size: 12px;
    font-weight: 700;
    line-height: 16px;
    white-space: nowrap;
}

.sales-entry-page [data-sales-tab-panel="invoice"] > .sales-line-commandbar > .sales-line-commandbar-remove:disabled {
    display: none !important;
}

.sales-entry-page [data-sales-tab-panel="invoice"] > .sales-line-commandbar > .sales-line-commandbar-clear {
    width: auto !important;
    min-width: 0 !important;
}

.sales-entry-page [data-sales-tab-panel="invoice"] > .sales-line-commandbar > .sales-line-commandbar-clear:disabled {
    display: inline-flex !important;
    opacity: .58;
}

@media (max-width: 900px) {
    .sales-entry-page [data-sales-tab-panel="invoice"] > .sales-line-links.sales-line-commandbar {
        position: static;
        flex-wrap: wrap;
        min-height: 0;
        padding: 8px 0 2px;
    }

    .sales-entry-page [data-sales-tab-panel="invoice"] > .sales-line-commandbar .sales-line-commandbar-count {
        flex-basis: auto;
        margin-left: auto !important;
    }
}

@media (max-width: 560px) {
    .sales-entry-page [data-sales-tab-panel="invoice"] > .sales-line-commandbar > button {
        flex: 1 1 calc(50% - 8px) !important;
        width: auto !important;
        min-width: 0 !important;
    }

    .sales-entry-page [data-sales-tab-panel="invoice"] > .sales-line-commandbar .sales-line-commandbar-count {
        flex: 1 0 100%;
        margin-left: 0 !important;
        text-align: right;
    }
}

/* Stock Items header utilities and breadcrumb correction.
   The global breadcrumb is now enabled by the Stock Items views. Notifications are
   placed in the same header utility row as Inventory Masters / metrics and the
   Theme/account menu, so alert icons cannot cover the user name. */
.stock-items-sticky-header,
.stock-item-sticky-header {
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
}

.stock-header-notification-host {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 88px;
    min-width: 88px;
    max-width: 88px;
    min-height: 40px;
}

.stock-header-notification-host > .erp-notification-slot,
.stock-header-notification-slot {
    position: static !important;
    inset: auto !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-wrap: nowrap !important;
    gap: 8px !important;
    width: 88px !important;
    min-width: 88px !important;
    max-width: 88px !important;
    height: 40px !important;
    min-height: 40px !important;
    margin: 0 !important;
    padding: 0 !important;
    z-index: auto !important;
    isolation: auto !important;
}

.stock-items-sticky-header .stock-items-header-user .account-menu,
.stock-item-sticky-header .stock-item-header-user .account-menu {
    width: 160px !important;
    min-width: 160px !important;
    max-width: 160px !important;
}

.stock-items-sticky-header .stock-items-header-user .account-menu-button,
.stock-item-sticky-header .stock-item-header-user .account-menu-button {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    justify-content: flex-start !important;
}

.stock-items-sticky-header .stock-items-header-user .account-name,
.stock-item-sticky-header .stock-item-header-user .account-name {
    flex: 1 1 auto;
    min-width: 0;
    max-width: none;
    overflow: hidden;
    text-overflow: ellipsis;
}

.stock-items-sticky-header .stock-items-header-user .account-caret,
.stock-item-sticky-header .stock-item-header-user .account-caret {
    margin-left: auto;
}

/* Progressive fallback: before the deferred account-menu script moves the alert
   rail into its host, keep the fixed rail in the exact 88px space before account. */
.main-area:has(.stock-items-sticky-header) > .erp-notification-slot,
.main-area:has(.stock-item-sticky-header) > .erp-notification-slot {
    top: 18px !important;
    right: 188px !important;
    width: 88px !important;
    max-width: 88px !important;
}

@media (min-width: 981px) {
    .stock-items-sticky-header .stock-items-header-main {
        padding-right: clamp(500px, 38vw, 700px) !important;
    }

    .stock-items-sticky-header .stock-items-header-user {
        max-width: min(700px, calc(100% - 32px)) !important;
    }

    .stock-item-sticky-header .stock-item-header-main {
        padding-right: clamp(650px, 48vw, 780px) !important;
    }

    .stock-item-sticky-header .stock-item-header-right {
        gap: 12px !important;
    }
}

@media (max-width: 980px) {
    .stock-header-notification-host {
        width: 88px;
        min-width: 88px;
        max-width: 88px;
    }

    .stock-items-sticky-header .stock-items-header-user .account-menu,
    .stock-item-sticky-header .stock-item-header-user .account-menu {
        width: min(180px, calc(100vw - 130px)) !important;
        min-width: 0 !important;
        max-width: 180px !important;
    }
}

@media (max-width: 560px) {
    .stock-header-notification-host {
        order: 2;
        width: 80px;
        min-width: 80px;
        max-width: 80px;
    }

    .stock-header-notification-host > .erp-notification-slot,
    .stock-header-notification-slot {
        gap: 6px !important;
        width: 80px !important;
        min-width: 80px !important;
        max-width: 80px !important;
    }

    .stock-header-notification-host .erp-notification-bell {
        width: 36px !important;
        min-width: 36px !important;
        max-width: 36px !important;
        height: 36px !important;
    }
}

/* Create / Alter Stock Item header must use the full sticky-header track.
   .topbar leaves justify-content:space-between behind after display becomes grid;
   without an explicit track the grid shrinks to content and the account controls
   stop well before the real page edge. */
.stock-item-sticky-header {
    grid-template-columns: minmax(0, 1fr) !important;
    justify-content: stretch !important;
}

.stock-item-sticky-header > .stock-item-header-main,
.stock-item-sticky-header > .stock-item-header-actionbar {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
}

/* Stock Groups - VB.NET StockGroups/CreateStockGroups/StockGroupImportExport conversion */
.stock-groups-topbar {
    align-items: flex-start;
}

.stock-groups-shell {
    margin: 14px 4px 24px;
    overflow: hidden;
}

.stock-groups-toolbar {
    gap: 14px;
    flex-wrap: wrap;
}

.stock-group-main-actions {
    flex: 1 1 auto;
    flex-wrap: wrap;
}

.stock-group-main-actions .odoo-save,
.stock-group-main-actions .odoo-discard {
    width: auto;
    min-width: 76px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 0 13px;
    white-space: nowrap;
}

.stock-group-main-actions button:disabled {
    opacity: .48;
    cursor: not-allowed;
}

.stock-group-main-actions .danger-action:not(:disabled) {
    color: var(--danger, #b42318);
}

.stock-group-mode-toggle {
    margin-left: auto;
    display: flex;
    align-items: center;
}

.stock-group-tree-check {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 34px;
    font-weight: 700;
    color: var(--text, #16324a);
    cursor: pointer;
}

.stock-group-tree-check input {
    width: 17px;
    height: 17px;
    accent-color: var(--primary, #7c3f69);
}

.stock-group-search-row {
    display: flex;
    padding: 12px 16px;
    border-bottom: 1px solid var(--border, #d7e3ee);
    background: var(--surface, #fff);
}

.stock-group-search-row .list-search-form {
    position: relative;
    width: min(740px, 100%);
    margin: 0;
}

.stock-group-search-row .odoo-input {
    width: 100%;
    min-height: 42px;
    padding-left: 42px;
    padding-right: 42px;
}

.stock-group-search-icon,
.stock-group-search-clear {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 2;
}

.stock-group-search-icon {
    left: 14px;
    font-size: 22px;
    color: var(--muted, #64748b);
}

.stock-group-search-clear {
    right: 9px;
    width: 28px;
    height: 28px;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--muted, #64748b);
    font-size: 23px;
    line-height: 1;
    cursor: pointer;
}

.stock-group-pager {
    margin: 0;
    padding: 8px 14px;
    border-bottom: 1px solid var(--border, #d7e3ee);
}

.stock-group-table-card {
    border: 0;
    border-radius: 0;
    box-shadow: none;
    overflow-x: auto;
}

.stock-group-table {
    min-width: 980px;
}

.stock-group-table .stock-group-col-no {
    width: 45px;
}

.stock-group-table .stock-group-col-name,
.stock-group-table .stock-group-col-under {
    width: 350px;
}

.stock-group-table .stock-group-col-actions {
    width: 92px;
}

.stock-group-table .number-cell {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.stock-group-table tbody tr[data-stock-group-select] {
    cursor: pointer;
}

.stock-group-table tbody tr[data-stock-group-select].selected,
.stock-group-tree-row.selected {
    background: color-mix(in srgb, var(--primary, #7c3f69) 12%, var(--surface, #fff));
    box-shadow: inset 3px 0 0 var(--primary, #7c3f69);
}

#stockGroupResults.is-loading {
    opacity: .58;
    pointer-events: none;
}

.stock-group-tree-panel {
    min-height: 260px;
    padding: 14px 18px 24px;
    background: var(--surface, #fff);
}

.stock-group-tree-root,
.stock-group-tree-root ul {
    margin: 0;
    padding-left: 24px;
    list-style: none;
}

.stock-group-tree-root {
    padding-left: 0;
}

.stock-group-tree-item {
    position: relative;
}

.stock-group-tree-item > ul {
    border-left: 1px dashed var(--border-strong, #a9bfd1);
    margin-left: 10px;
}

.stock-group-tree-row {
    min-height: 42px;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 5px 8px;
    border-radius: 7px;
    cursor: pointer;
}

.stock-group-tree-row:hover {
    background: var(--surface-muted, #f4f7fa);
}

.stock-group-tree-glyph {
    width: 20px;
    text-align: center;
    color: var(--primary, #7c3f69);
}

.stock-group-tree-name {
    font-weight: 750;
}

.stock-group-tree-under {
    color: var(--muted, #64748b);
    font-size: .86rem;
}

.stock-group-tree-actions {
    margin-left: auto;
}

.stock-group-edit-form {
    margin: 14px 4px 24px;
}

.stock-group-editor-shell {
    max-width: 980px;
    margin-inline: auto;
}

.stock-group-editor-heading {
    border-bottom: 1px solid var(--border, #d7e3ee);
}

.stock-group-fields-grid {
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(180px, 1fr);
    gap: 18px;
    padding: 22px;
}

.stock-group-fields-grid .odoo-row {
    align-items: start;
}

.stock-group-fields-grid .odoo-input {
    width: 100%;
}

.stock-group-form-note,
.stock-group-import-guidance {
    margin: 0 22px 22px;
    padding: 12px 14px;
    border: 1px solid var(--border, #d7e3ee);
    border-radius: 8px;
    background: var(--surface-muted, #f7fafc);
    color: var(--muted, #52657a);
}

.stock-group-status-blue {
    color: #1769aa !important;
}

.stock-group-import-shell {
    margin: 14px 4px 26px;
}

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

.stock-group-import-card,
.stock-group-import-results-card {
    margin: 0;
    overflow: hidden;
}

.stock-group-import-results-card {
    margin-top: 16px;
}

.stock-group-import-card-head {
    min-height: 74px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
    padding: 16px 18px;
    border-bottom: 1px solid var(--border, #d7e3ee);
}

.stock-group-import-card-head h2 {
    margin: 0 0 4px;
    font-size: 1.12rem;
}

.stock-group-import-card-head p {
    margin: 0;
}

.stock-group-export-actions,
.stock-group-upload-form,
.stock-group-import-submit-row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    padding: 14px 18px;
}

.stock-group-export-actions .odoo-save,
.stock-group-export-actions .odoo-discard,
.stock-group-upload-form .odoo-save,
.stock-group-import-submit-row .odoo-save {
    width: auto;
    min-height: 36px;
}

.stock-group-export-actions .stock-group-tree-check {
    margin-right: auto;
}

.stock-group-upload-form .odoo-input {
    flex: 1 1 260px;
}

.stock-group-import-preview {
    max-height: 330px;
    overflow: auto;
    border: 0;
    border-top: 1px solid var(--border, #d7e3ee);
    border-radius: 0;
    box-shadow: none;
}

.stock-group-import-table-card {
    overflow-x: auto;
    border-radius: 0;
    border-inline: 0;
}

.stock-group-import-table {
    min-width: 790px;
}

.stock-group-import-preview th,
.stock-group-import-preview td,
.stock-group-import-table th:nth-child(2),
.stock-group-import-table td:nth-child(2),
.stock-group-import-table th:nth-child(3),
.stock-group-import-table td:nth-child(3) {
    width: 220px;
}

.stock-group-import-table .odoo-input[readonly] {
    border-color: transparent;
    background: transparent;
    padding-inline: 0;
}

.stock-group-import-success > td {
    background: color-mix(in srgb, #22c55e 16%, var(--surface, #fff));
}

.stock-group-import-failed > td {
    background: color-mix(in srgb, #dc2626 14%, var(--surface, #fff));
}

.stock-group-import-counts {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

@media (max-width: 980px) {
    .stock-group-import-grid {
        grid-template-columns: 1fr;
    }

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

@media (max-width: 720px) {
    .stock-groups-toolbar,
    .stock-group-main-actions,
    .stock-group-export-actions,
    .stock-group-upload-form {
        align-items: stretch;
    }

    .stock-group-main-actions .odoo-save,
    .stock-group-main-actions .odoo-discard {
        flex: 1 1 135px;
    }

    .stock-group-mode-toggle {
        width: 100%;
        margin-left: 0;
    }

    .stock-group-fields-grid {
        padding: 16px;
    }

    .stock-group-form-note,
    .stock-group-import-guidance {
        margin-inline: 16px;
    }

    .stock-group-tree-under {
        display: none;
    }
}

/* Stock Groups Create/Alter: five-record parent shortlist plus full searchable lookup. */
.stock-group-under-row {
    align-items: flex-start;
}

.stock-group-under-picker {
    position: relative;
    width: 100%;
    overflow: visible;
}

.stock-group-edit-form .stock-group-under-shortlist.open {
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    left: 0;
    display: block;
    margin-top: 0;
    max-height: none;
    overflow: hidden;
    z-index: 1400;
}

.stock-group-under-option.is-selected,
.stock-group-under-lookup-item.is-selected {
    background: color-mix(in srgb, var(--theme-primary, var(--brand)) 14%, var(--surface, #fff));
    color: var(--theme-primary, var(--brand));
}

.stock-group-under-lookup-modal {
    width: min(680px, 100%);
}

.stock-group-under-lookup-modal .erp-lookup-results {
    max-height: min(56vh, 520px);
    overflow-y: auto;
}

.stock-group-under-show-more strong {
    font-size: 1rem;
}

@media (max-width: 720px) {
    .stock-group-under-lookup-backdrop {
        padding: 12px;
    }

    .stock-group-under-lookup-modal {
        max-height: 92vh;
        border-radius: 16px;
    }
}

/* Stock Items database-backed custom column view, Rack No and Store Name. */
.stock-three-line-icon {
    width: 18px;
    height: 16px;
    display: inline-flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: stretch;
    vertical-align: middle;
}
.stock-three-line-icon i {
    display: block;
    height: 2px;
    border-radius: 999px;
    background: currentColor;
}
.stock-custom-view-trigger {
    display: inline-grid;
    place-items: center;
}
.stock-grid-custom-view-head,
.stock-grid-custom-view-cell {
    width: 42px;
    min-width: 42px;
    max-width: 42px;
    padding: 0 !important;
    position: sticky !important;
    right: 0;
    z-index: 4 !important;
    text-align: center;
    background: color-mix(in srgb, var(--soft) 45%, var(--card)) !important;
    box-shadow: -1px 0 0 var(--border);
}
.stock-grid-custom-view-cell {
    z-index: 1 !important;
    background: var(--card) !important;
}
.stock-grid-custom-view-button {
    width: 40px;
    height: 40px;
    display: inline-grid;
    place-items: center;
    border: 0;
    background: transparent;
    color: var(--brand-dark);
    cursor: pointer;
}
.stock-grid-custom-view-button:hover,
.stock-grid-custom-view-button:focus-visible {
    outline: none;
    background: color-mix(in srgb, var(--brand) 12%, var(--card));
}
.stock-column-modal[hidden] { display: none !important; }
.stock-column-modal {
    position: fixed;
    inset: 0;
    z-index: 1200;
    display: flex;
    justify-content: flex-end;
    align-items: flex-start;
    padding: max(72px, 7vh) 18px 18px;
    background: rgba(15, 23, 42, .28);
    backdrop-filter: blur(2px);
}
.stock-column-dialog {
    width: min(370px, calc(100vw - 24px));
    max-height: min(720px, calc(100vh - 90px));
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: var(--card);
    color: var(--text);
    box-shadow: 0 24px 70px rgba(15, 23, 42, .28);
}
.stock-column-dialog-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 14px 16px;
    border-bottom: 1px solid var(--border);
}
.stock-column-dialog-head strong {
    display: block;
    font-size: 1.05rem;
    font-weight: 950;
}
.stock-column-dialog-head span {
    display: block;
    margin-top: 3px;
    color: var(--muted);
    font-size: .82rem;
    line-height: 1.3;
}
.stock-column-dialog-head button {
    flex: 0 0 34px;
    width: 34px;
    height: 34px;
    border: 1px solid var(--border);
    border-radius: 7px;
    background: color-mix(in srgb, var(--card) 88%, var(--bg));
    color: var(--text);
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
}
.stock-column-list {
    min-height: 0;
    overflow: auto;
    padding: 4px 0;
}
.stock-column-list label {
    min-height: 34px;
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 4px 14px;
    border-bottom: 1px solid color-mix(in srgb, var(--border) 65%, transparent);
    font-size: .91rem;
    font-weight: 700;
    cursor: pointer;
}
.stock-column-list label:hover {
    background: color-mix(in srgb, var(--brand) 9%, var(--card));
}
.stock-column-list input {
    width: 16px;
    height: 16px;
    margin: 0;
    accent-color: var(--brand);
}
.stock-column-dialog-foot {
    min-height: 52px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 9px 12px 9px 16px;
    border-top: 1px solid var(--border);
    background: color-mix(in srgb, var(--soft) 24%, var(--card));
}
.stock-column-dialog-foot span {
    color: var(--muted);
    font-size: .78rem;
    line-height: 1.25;
}
.stock-column-dialog-foot span.error { color: #b91c1c; }
.stock-column-dialog-foot .btn-secondary {
    min-width: 72px;
    min-height: 34px;
    padding: 6px 14px;
}
body.theme-dark .stock-column-dialog,
body.theme-midnight .stock-column-dialog,
body.theme-carbon .stock-column-dialog,
body.theme-dark .stock-grid-custom-view-cell,
body.theme-midnight .stock-grid-custom-view-cell,
body.theme-carbon .stock-grid-custom-view-cell {
    background: color-mix(in srgb, var(--card) 94%, #000) !important;
    color: var(--text);
}
@media (max-width: 640px) {
    .stock-column-modal {
        align-items: stretch;
        padding: 58px 8px 8px;
    }
    .stock-column-dialog {
        width: 100%;
        max-height: calc(100vh - 66px);
    }
}

/* Stock Groups command bar: advanced theme-aware action buttons. */
.stock-groups-commandbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    min-height: 68px;
    padding: 11px 14px;
    border: 1px solid color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 16%, var(--border, #d7e3ee));
    border-radius: 13px;
    background:
        linear-gradient(135deg,
            color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 5%, var(--card, #fff)) 0%,
            color-mix(in srgb, var(--card, #fff) 97%, transparent) 62%,
            color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 3%, var(--card, #fff)) 100%);
    box-shadow:
        0 9px 24px color-mix(in srgb, var(--text, #152238) 7%, transparent),
        inset 0 1px 0 color-mix(in srgb, #fff 42%, transparent);
}

.stock-groups-commandbar .stock-group-main-actions {
    display: flex;
    align-items: center;
    gap: 9px;
    min-width: 0;
    flex: 1 1 auto;
}

.stock-group-action {
    appearance: none;
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: auto;
    min-width: 88px;
    height: 40px;
    margin: 0;
    padding: 0 14px;
    border: 1px solid color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 25%, var(--border, #d7e3ee));
    border-radius: 10px;
    background: color-mix(in srgb, var(--card, #fff) 94%, var(--theme-primary, var(--brand, #714b67)) 6%);
    color: var(--text, #152238);
    box-shadow: 0 3px 10px color-mix(in srgb, var(--text, #152238) 7%, transparent);
    text-decoration: none;
    font: inherit;
    font-size: .82rem;
    font-weight: 750;
    line-height: 1;
    white-space: nowrap;
    cursor: pointer;
    transition: transform .14s ease, border-color .14s ease, background .14s ease, color .14s ease, box-shadow .14s ease;
}

.stock-group-action:hover,
.stock-group-action:focus-visible {
    transform: translateY(-1px);
    border-color: var(--theme-primary, var(--brand, #714b67));
    background: color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 10%, var(--card, #fff));
    color: var(--theme-secondary, var(--brand-dark, #52364b));
    box-shadow: 0 7px 18px color-mix(in srgb, var(--text, #152238) 11%, transparent);
    outline: none;
}

.stock-group-action:active {
    transform: translateY(0);
    box-shadow: 0 2px 7px color-mix(in srgb, var(--text, #152238) 8%, transparent);
}

.stock-group-action:disabled {
    transform: none;
    border-color: color-mix(in srgb, var(--border, #d7e3ee) 86%, transparent);
    background: color-mix(in srgb, var(--muted, #64748b) 6%, var(--card, #fff));
    color: color-mix(in srgb, var(--muted, #64748b) 68%, transparent);
    box-shadow: none;
    cursor: not-allowed;
    opacity: 1;
}

.stock-group-action-primary {
    border-color: var(--theme-primary, var(--brand, #714b67));
    background: linear-gradient(135deg,
        var(--theme-primary, var(--brand, #714b67)),
        color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 76%, #111827));
    color: #fff;
    box-shadow: 0 7px 18px color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 25%, transparent);
}

.stock-group-action-primary:hover,
.stock-group-action-primary:focus-visible {
    color: #fff;
    background: linear-gradient(135deg,
        color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 88%, #fff),
        var(--theme-primary, var(--brand, #714b67)));
}

.stock-group-action-danger:not(:disabled) {
    border-color: color-mix(in srgb, #dc2626 34%, var(--border, #d7e3ee));
    background: color-mix(in srgb, #dc2626 5%, var(--card, #fff));
    color: #b42318;
}

.stock-group-action-danger:not(:disabled):hover,
.stock-group-action-danger:not(:disabled):focus-visible {
    border-color: #dc2626;
    background: color-mix(in srgb, #dc2626 11%, var(--card, #fff));
    color: #991b1b;
}

.stock-group-action-close {
    min-width: 82px;
    border-color: transparent;
    background: transparent;
    box-shadow: none;
    color: var(--muted, #64748b);
}

.stock-group-action-close:hover,
.stock-group-action-close:focus-visible {
    border-color: color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 18%, var(--border, #d7e3ee));
    background: color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 7%, var(--card, #fff));
    color: var(--text, #152238);
}

.stock-group-action-icon {
    display: inline-grid;
    place-items: center;
    flex: 0 0 24px;
    width: 24px;
    height: 24px;
    border-radius: 7px;
    background: color-mix(in srgb, currentColor 9%, transparent);
}

.stock-group-action-icon svg {
    width: 15px;
    height: 15px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.9;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.stock-group-action-primary .stock-group-action-icon {
    background: rgba(255, 255, 255, .16);
}

.stock-group-action-separator {
    flex: 0 0 1px;
    width: 1px;
    height: 28px;
    margin: 0 2px;
    background: color-mix(in srgb, var(--border, #d7e3ee) 88%, transparent);
}

.stock-groups-commandbar .stock-group-mode-toggle {
    flex: 0 0 auto;
    margin-left: auto;
}

.stock-groups-commandbar .stock-group-tree-check {
    position: relative;
    min-height: 40px;
    padding: 0 12px 0 10px;
    border: 1px solid color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 20%, var(--border, #d7e3ee));
    border-radius: 10px;
    background: color-mix(in srgb, var(--card, #fff) 96%, var(--theme-primary, var(--brand, #714b67)) 4%);
    box-shadow: 0 3px 10px color-mix(in srgb, var(--text, #152238) 5%, transparent);
    font-size: .78rem;
    font-weight: 750;
    user-select: none;
}

.stock-groups-commandbar .stock-group-tree-check input {
    position: absolute;
    inline-size: 1px;
    block-size: 1px;
    opacity: 0;
    pointer-events: none;
}

.stock-group-tree-switch {
    position: relative;
    flex: 0 0 34px;
    width: 34px;
    height: 20px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--muted, #64748b) 32%, var(--card, #fff));
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--muted, #64748b) 24%, transparent);
    transition: background .16s ease, box-shadow .16s ease;
}

.stock-group-tree-switch::after {
    content: "";
    position: absolute;
    top: 3px;
    left: 3px;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 2px 5px rgba(15, 23, 42, .22);
    transition: transform .16s ease;
}

.stock-group-tree-check input:checked + .stock-group-tree-switch {
    background: var(--theme-primary, var(--brand, #714b67));
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 72%, #111827);
}

.stock-group-tree-check input:checked + .stock-group-tree-switch::after {
    transform: translateX(14px);
}

.stock-group-tree-check:focus-within {
    border-color: var(--theme-primary, var(--brand, #714b67));
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 13%, transparent);
}

@media (max-width: 980px) {
    .stock-groups-commandbar {
        align-items: stretch;
        flex-direction: column;
    }

    .stock-groups-commandbar .stock-group-main-actions {
        flex-wrap: wrap;
    }

    .stock-groups-commandbar .stock-group-mode-toggle {
        width: 100%;
        margin-left: 0;
    }
}

@media (max-width: 720px) {
    .stock-groups-commandbar {
        padding: 10px;
    }

    .stock-groups-commandbar .stock-group-main-actions {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
    }

    .stock-group-action {
        width: 100%;
        min-width: 0;
    }

    .stock-group-action-separator {
        display: none;
    }

    .stock-groups-commandbar .stock-group-tree-check {
        width: 100%;
        justify-content: flex-start;
    }
}

@media (max-width: 430px) {
    .stock-groups-commandbar .stock-group-main-actions {
        grid-template-columns: 1fr;
    }
}

/* Stock Items / Create Stock Item / Alter Stock Item: apply the signed-in user's
   selected ERP theme to every page-owned button and button-like action. */
.stock-items-sticky-header,
.stock-items-page,
.stock-item-sticky-header,
.stock-item-edit-page,
.stock-lookup-modal {
    --stock-btn-primary: var(--theme-primary, var(--brand, #714b67));
    --stock-btn-secondary: var(--theme-secondary, var(--brand-dark, #52364b));
    --stock-btn-surface: color-mix(in srgb, var(--stock-btn-primary) 8%, var(--card, #fff));
    --stock-btn-surface-hover: color-mix(in srgb, var(--stock-btn-primary) 15%, var(--card, #fff));
    --stock-btn-border: color-mix(in srgb, var(--stock-btn-primary) 36%, var(--border, #dbe4ef));
    --stock-btn-shadow: 0 6px 16px color-mix(in srgb, var(--stock-btn-primary) 16%, transparent);
    --stock-btn-on-primary: var(--stock-theme-on-primary, #fff);
}
body.theme-mint,
body.theme-sunset,
body.theme-glass,
body.theme-carbon {
    --stock-theme-on-primary: #111827;
}

/* Stock Items list header and action row. */
.stock-items-sticky-header .stock-header-back,
.stock-items-sticky-header .stock-header-action,
.stock-item-sticky-header .stock-header-action {
    border-color: var(--stock-btn-border) !important;
    background: var(--stock-btn-surface) !important;
    color: var(--stock-btn-secondary) !important;
    box-shadow: 0 3px 10px color-mix(in srgb, var(--stock-btn-primary) 10%, transparent) !important;
}
.stock-items-sticky-header .stock-header-back:hover,
.stock-items-sticky-header .stock-header-back:focus-visible,
.stock-items-sticky-header .stock-header-action:hover,
.stock-items-sticky-header .stock-header-action:focus-visible,
.stock-item-sticky-header .stock-header-action:hover,
.stock-item-sticky-header .stock-header-action:focus-visible {
    border-color: var(--stock-btn-primary) !important;
    background: var(--stock-btn-surface-hover) !important;
    color: var(--stock-btn-secondary) !important;
    box-shadow: var(--stock-btn-shadow) !important;
}
.stock-items-sticky-header .stock-header-action.primary,
.stock-item-sticky-header .stock-header-action.primary {
    border-color: var(--stock-btn-primary) !important;
    background: linear-gradient(135deg, var(--stock-btn-primary), color-mix(in srgb, var(--stock-btn-primary) 74%, var(--stock-btn-secondary))) !important;
    color: var(--stock-btn-on-primary) !important;
    box-shadow: var(--stock-btn-shadow) !important;
}
.stock-items-sticky-header .stock-header-action.primary:hover,
.stock-items-sticky-header .stock-header-action.primary:focus-visible,
.stock-item-sticky-header .stock-header-action.primary:hover,
.stock-item-sticky-header .stock-header-action.primary:focus-visible {
    background: linear-gradient(135deg, color-mix(in srgb, var(--stock-btn-primary) 88%, #fff), var(--stock-btn-primary)) !important;
    color: var(--stock-btn-on-primary) !important;
}
.stock-items-sticky-header .stock-header-action.state {
    border-color: var(--stock-btn-border) !important;
}
.stock-items-sticky-header .stock-action-icon,
.stock-item-sticky-header .stock-action-icon {
    background: color-mix(in srgb, currentColor 11%, transparent) !important;
}
.stock-items-sticky-header .stock-header-action.primary .stock-action-icon,
.stock-item-sticky-header .stock-header-action.primary .stock-action-icon {
    background: color-mix(in srgb, var(--stock-btn-on-primary) 18%, transparent) !important;
}

/* Stock Items search, paging, view, reload and custom-column controls. */
.stock-items-page :is(.search-clear, .search-dropdown-btn, .odoo-tool-btn, .odoo-page-btn, .odoo-view-btn, .stock-grid-custom-view-button, .stock-column-dialog-head button),
.stock-items-page .stock-column-dialog-foot .btn-secondary {
    border-color: var(--stock-btn-border) !important;
    background: var(--stock-btn-surface) !important;
    color: var(--stock-btn-secondary) !important;
    box-shadow: none !important;
}
.stock-items-page :is(.search-clear, .search-dropdown-btn, .odoo-tool-btn, .odoo-page-btn, .odoo-view-btn, .stock-grid-custom-view-button, .stock-column-dialog-head button):hover,
.stock-items-page :is(.search-clear, .search-dropdown-btn, .odoo-tool-btn, .odoo-page-btn, .odoo-view-btn, .stock-grid-custom-view-button, .stock-column-dialog-head button):focus-visible,
.stock-items-page .stock-column-dialog-foot .btn-secondary:hover,
.stock-items-page .stock-column-dialog-foot .btn-secondary:focus-visible {
    border-color: var(--stock-btn-primary) !important;
    background: var(--stock-btn-surface-hover) !important;
    color: var(--stock-btn-primary) !important;
    box-shadow: 0 4px 12px color-mix(in srgb, var(--stock-btn-primary) 14%, transparent) !important;
    outline: none !important;
}
.stock-items-page .odoo-view-btn.active,
.stock-items-page .odoo-view-btn[aria-pressed="true"] {
    border-color: var(--stock-btn-primary) !important;
    background: var(--stock-btn-primary) !important;
    color: var(--stock-btn-on-primary) !important;
    box-shadow: var(--stock-btn-shadow) !important;
}
.stock-items-page :is(.odoo-page-btn, .odoo-tool-btn, .odoo-view-btn, .stock-grid-custom-view-button):disabled {
    border-color: color-mix(in srgb, var(--stock-btn-primary) 18%, var(--border, #dbe4ef)) !important;
    background: color-mix(in srgb, var(--stock-btn-primary) 4%, var(--card, #fff)) !important;
    color: var(--muted, #64748b) !important;
    opacity: .52 !important;
    box-shadow: none !important;
}
.stock-items-page .btn-primary,
.stock-items-page [data-stock-reload],
.stock-items-page .stock-column-dialog-foot .btn-secondary {
    margin-top: 0 !important;
    border: 1px solid var(--stock-btn-primary) !important;
    background: linear-gradient(135deg, var(--stock-btn-primary), color-mix(in srgb, var(--stock-btn-primary) 74%, var(--stock-btn-secondary))) !important;
    color: var(--stock-btn-on-primary) !important;
    box-shadow: var(--stock-btn-shadow) !important;
}
.stock-items-page .btn-primary:hover,
.stock-items-page .btn-primary:focus-visible,
.stock-items-page [data-stock-reload]:hover,
.stock-items-page [data-stock-reload]:focus-visible,
.stock-items-page .stock-column-dialog-foot .btn-secondary:hover,
.stock-items-page .stock-column-dialog-foot .btn-secondary:focus-visible {
    background: linear-gradient(135deg, color-mix(in srgb, var(--stock-btn-primary) 88%, #fff), var(--stock-btn-primary)) !important;
    color: var(--stock-btn-on-primary) !important;
    outline: none !important;
}
.stock-items-page .odoo-product-search-menu button {
    color: var(--text, #152238) !important;
}
.stock-items-page .odoo-product-search-menu button:hover,
.stock-items-page .odoo-product-search-menu button:focus-visible {
    background: var(--stock-btn-surface-hover) !important;
    color: var(--stock-btn-secondary) !important;
    outline: none !important;
}
.stock-items-page .stock-column-list input,
.stock-items-page input[type="checkbox"] {
    accent-color: var(--stock-btn-primary) !important;
}

/* Create / Alter Stock Item navigation, tabs, utility and image buttons. */
.stock-item-edit-page .vb-nav-btn,
.stock-item-edit-page .vb-auto-btn,
.stock-item-edit-page .vb-photo-btn,
.stock-item-edit-page .vb-close-btn,
.stock-item-edit-page .stock-edit-tabs button,
.stock-lookup-modal :is(.erp-lookup-close, .stock-lookup-option, .stock-lookup-more, .erp-lookup-result-item) {
    border-color: var(--stock-btn-border) !important;
    background: var(--stock-btn-surface) !important;
    color: var(--stock-btn-secondary) !important;
    box-shadow: none !important;
}
.stock-item-edit-page .vb-nav-btn,
.stock-item-edit-page .vb-auto-btn {
    background: linear-gradient(135deg, var(--stock-btn-primary), color-mix(in srgb, var(--stock-btn-primary) 74%, var(--stock-btn-secondary))) !important;
    color: var(--stock-btn-on-primary) !important;
    box-shadow: var(--stock-btn-shadow) !important;
}
.stock-item-edit-page .vb-nav-btn:hover,
.stock-item-edit-page .vb-nav-btn:focus-visible,
.stock-item-edit-page .vb-auto-btn:hover,
.stock-item-edit-page .vb-auto-btn:focus-visible,
.stock-item-edit-page .vb-photo-btn:hover,
.stock-item-edit-page .vb-photo-btn:focus-visible,
.stock-item-edit-page .vb-close-btn:hover,
.stock-item-edit-page .vb-close-btn:focus-visible,
.stock-lookup-modal :is(.erp-lookup-close, .stock-lookup-option, .stock-lookup-more, .erp-lookup-result-item):hover,
.stock-lookup-modal :is(.erp-lookup-close, .stock-lookup-option, .stock-lookup-more, .erp-lookup-result-item):focus-visible {
    border-color: var(--stock-btn-primary) !important;
    background: var(--stock-btn-surface-hover) !important;
    color: var(--stock-btn-primary) !important;
    box-shadow: 0 4px 12px color-mix(in srgb, var(--stock-btn-primary) 14%, transparent) !important;
    outline: none !important;
}
.stock-item-edit-page .stock-edit-tabs button {
    border-color: color-mix(in srgb, var(--stock-btn-primary) 20%, var(--border, #dbe4ef)) !important;
    background: color-mix(in srgb, var(--stock-btn-primary) 3%, var(--card, #fff)) !important;
    color: var(--text, #152238) !important;
}
.stock-item-edit-page .stock-edit-tabs button:hover,
.stock-item-edit-page .stock-edit-tabs button:focus-visible {
    background: var(--stock-btn-surface-hover) !important;
    color: var(--stock-btn-secondary) !important;
    outline: none !important;
}
.stock-item-edit-page .stock-edit-tabs button.active {
    border-color: var(--stock-btn-primary) !important;
    background: var(--stock-btn-surface-hover) !important;
    color: var(--stock-btn-secondary) !important;
    box-shadow: inset 0 3px 0 var(--stock-btn-primary) !important;
}
.stock-item-edit-page .vb-link-btn {
    border: 0 !important;
    background: transparent !important;
    color: var(--stock-btn-primary) !important;
    box-shadow: none !important;
}
.stock-item-edit-page .vb-link-btn:hover,
.stock-item-edit-page .vb-link-btn:focus-visible {
    background: color-mix(in srgb, var(--stock-btn-primary) 9%, transparent) !important;
    color: var(--stock-btn-secondary) !important;
    outline: none !important;
}
.stock-item-edit-page .vb-photo-upload,
.stock-item-edit-page .vb-photo-secondary,
.stock-item-edit-page .vb-photo-danger {
    border-color: var(--stock-btn-border) !important;
    background: var(--stock-btn-surface) !important;
    color: var(--stock-btn-secondary) !important;
}
.stock-item-edit-page .vb-photo-upload:hover,
.stock-item-edit-page .vb-photo-upload:focus-within,
.stock-item-edit-page .vb-photo-secondary:hover,
.stock-item-edit-page .vb-photo-secondary:focus-visible,
.stock-item-edit-page .vb-photo-danger:hover,
.stock-item-edit-page .vb-photo-danger:focus-visible {
    border-color: var(--stock-btn-primary) !important;
    background: var(--stock-btn-primary) !important;
    color: var(--stock-btn-on-primary) !important;
}
.stock-item-edit-page .vb-save-btn,
.stock-lookup-modal .stock-lookup-create-btn {
    border: 1px solid var(--stock-btn-primary) !important;
    background: linear-gradient(135deg, var(--stock-btn-primary), color-mix(in srgb, var(--stock-btn-primary) 74%, var(--stock-btn-secondary))) !important;
    color: var(--stock-btn-on-primary) !important;
    box-shadow: var(--stock-btn-shadow) !important;
}
.stock-item-edit-page .vb-save-btn:hover,
.stock-item-edit-page .vb-save-btn:focus-visible,
.stock-lookup-modal .stock-lookup-create-btn:hover,
.stock-lookup-modal .stock-lookup-create-btn:focus-visible {
    background: linear-gradient(135deg, color-mix(in srgb, var(--stock-btn-primary) 88%, #fff), var(--stock-btn-primary)) !important;
    color: var(--stock-btn-on-primary) !important;
    outline: none !important;
}
.stock-item-edit-page :is(button, .vb-nav-btn, .vb-photo-btn):disabled,
.stock-item-edit-page :is(button, .vb-nav-btn, .vb-photo-btn).disabled,
.stock-lookup-modal button:disabled {
    border-color: color-mix(in srgb, var(--stock-btn-primary) 18%, var(--border, #dbe4ef)) !important;
    background: color-mix(in srgb, var(--stock-btn-primary) 4%, var(--card, #fff)) !important;
    color: var(--muted, #64748b) !important;
    opacity: .52 !important;
    box-shadow: none !important;
    cursor: not-allowed !important;
}
.stock-item-edit-page input[type="checkbox"],
.stock-item-edit-page input[type="radio"] {
    accent-color: var(--stock-btn-primary) !important;
}

/* POS (Sales) selected-product setup: embedded Stock Item form only.
   The application sidebar, breadcrumbs and notification rail are already removed by
   embedded=true; keep only the selected product form and its Close / Alter controls. */
.stock-item-edit-page.stock-item-embedded-dialog {
    min-height: 100vh;
    padding: 8px !important;
    margin: 0 !important;
    background: var(--bg, #f7f8fb);
}
.stock-item-embedded-dialog .vb-stock-window {
    width: 100%;
    min-height: calc(100vh - 16px);
    margin: 0;
}
.stock-item-embedded-dialog .vb-stock-navrow.vb-stock-navrow-embedded {
    grid-template-columns: minmax(280px, 1fr) minmax(280px, 1fr) !important;
}
.stock-item-embedded-dialog .vb-stock-footer-actions {
    position: sticky;
    bottom: 0;
    z-index: 30;
}
@media (max-width: 720px) {
    .stock-item-embedded-dialog .vb-stock-navrow.vb-stock-navrow-embedded {
        grid-template-columns: 1fr !important;
    }
}

/* 2026-08-04: project-wide selected-theme control normalization.
   This final compatibility layer prevents legacy Classic Purple/Odoo component rules
   from overriding the signed-in user's current theme. Page CSS owns geometry only;
   shared theme tokens own interactive colors and states. */
body[class*="theme-"] {
    --erp-control-primary: var(--brand);
    --erp-control-primary-dark: var(--brand-dark);
    --erp-control-on-primary: var(--on-brand);
    --erp-control-surface: var(--card);
    --erp-control-soft: color-mix(in srgb, var(--brand) 9%, var(--card));
    --erp-control-soft-hover: color-mix(in srgb, var(--brand) 16%, var(--card));
    --erp-control-border: color-mix(in srgb, var(--brand) 34%, var(--border));
    --erp-control-focus: 0 0 0 3px color-mix(in srgb, var(--brand) 20%, transparent);
    --erp-control-shadow: 0 7px 18px color-mix(in srgb, var(--brand) 20%, transparent);
}

/* Form controls and native selectors always track the active theme. */
body[class*="theme-"] :where(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]), select, textarea) {
    background-color: var(--card);
    color: var(--text);
    border-color: var(--border);
}
body[class*="theme-"] :where(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]), select, textarea):focus {
    border-color: var(--brand) !important;
    outline: none !important;
    box-shadow: var(--erp-control-focus) !important;
}
body[class*="theme-"] :where(input[type="checkbox"], input[type="radio"], progress) {
    accent-color: var(--brand) !important;
}

/* Standard primary actions used across the old VB conversions and newer MVC pages. */
body[class*="theme-"] :where(
    .btn-primary,
    .odoo-save,
    .odoo-new,
    .save-btn,
    .create-btn,
    .update-btn,
    .alter-btn,
    .erp-primary-btn,
    .erp-btn.primary,
    .primary-action,
    .action-primary,
    [data-theme-role="primary"]
):not(:disabled):not(.disabled) {
    background: linear-gradient(135deg, var(--brand), color-mix(in srgb, var(--brand) 76%, var(--brand-dark))) !important;
    border-color: var(--brand) !important;
    color: var(--on-brand) !important;
    box-shadow: var(--erp-control-shadow) !important;
}
body[class*="theme-"] :where(
    .btn-primary,
    .odoo-save,
    .odoo-new,
    .save-btn,
    .create-btn,
    .update-btn,
    .alter-btn,
    .erp-primary-btn,
    .erp-btn.primary,
    .primary-action,
    .action-primary,
    [data-theme-role="primary"]
):not(:disabled):not(.disabled):hover,
body[class*="theme-"] :where(
    .btn-primary,
    .odoo-save,
    .odoo-new,
    .save-btn,
    .create-btn,
    .update-btn,
    .alter-btn,
    .erp-primary-btn,
    .erp-btn.primary,
    .primary-action,
    .action-primary,
    [data-theme-role="primary"]
):not(:disabled):not(.disabled):focus-visible {
    background: linear-gradient(135deg, color-mix(in srgb, var(--brand) 88%, #fff), var(--brand)) !important;
    border-color: var(--brand) !important;
    color: var(--on-brand) !important;
    outline: none !important;
    box-shadow: var(--erp-control-focus), var(--erp-control-shadow) !important;
}

/* Secondary, outline, navigation and ordinary toolbar controls use a theme-tinted surface. */
body[class*="theme-"] :where(
    .btn-secondary,
    .btn-secondary-soft,
    .odoo-discard,
    .back-btn,
    .erp-btn.secondary,
    .action-secondary,
    .secondary-action,
    .toolbar-button,
    .tool-button,
    [data-theme-role="secondary"]
):not(:disabled):not(.disabled) {
    background: var(--erp-control-soft) !important;
    border-color: var(--erp-control-border) !important;
    color: var(--brand-dark) !important;
}
body[class*="theme-"] :where(
    .btn-secondary,
    .btn-secondary-soft,
    .odoo-discard,
    .back-btn,
    .erp-btn.secondary,
    .action-secondary,
    .secondary-action,
    .toolbar-button,
    .tool-button,
    [data-theme-role="secondary"]
):not(:disabled):not(.disabled):hover,
body[class*="theme-"] :where(
    .btn-secondary,
    .btn-secondary-soft,
    .odoo-discard,
    .back-btn,
    .erp-btn.secondary,
    .action-secondary,
    .secondary-action,
    .toolbar-button,
    .tool-button,
    [data-theme-role="secondary"]
):not(:disabled):not(.disabled):focus-visible {
    background: var(--erp-control-soft-hover) !important;
    border-color: var(--brand) !important;
    color: var(--brand-dark) !important;
    outline: none !important;
    box-shadow: var(--erp-control-focus) !important;
}

/* Selected tabs, view switches and pressed controls use the active theme. */
body[class*="theme-"] :where(
    .view-switch-btn.active,
    .odoo-view-btn.active,
    .odoo-view-btn[aria-pressed="true"],
    .erp-view-btn.active,
    .tab-button.active,
    [role="tab"][aria-selected="true"],
    button[aria-pressed="true"]
):not(.danger):not(.delete):not(.destructive) {
    background: var(--brand) !important;
    border-color: var(--brand) !important;
    color: var(--on-brand) !important;
}

/* Disabled states remain readable in every light and dark theme. */
body[class*="theme-"] :where(button, .btn, [role="button"]):disabled,
body[class*="theme-"] :where(button, .btn, [role="button"]).disabled,
body[class*="theme-"] :where(button, .btn, [role="button"])[aria-disabled="true"] {
    background: color-mix(in srgb, var(--brand) 4%, var(--card)) !important;
    border-color: color-mix(in srgb, var(--brand) 16%, var(--border)) !important;
    color: var(--muted) !important;
    box-shadow: none !important;
    opacity: .58 !important;
}

/* Icons inherit the theme-aware control text instead of retaining fixed purple fills. */
body[class*="theme-"] :where(button, .btn, [role="button"]) svg:not([data-preserve-color]) {
    color: inherit;
}
body[class*="theme-"] :where(button, .btn, [role="button"]) svg:not([data-preserve-color]) :where(path, circle, rect, line, polyline, polygon, ellipse) {
    vector-effect: non-scaling-stroke;
}
body[class*="theme-"] :where(button, .btn, [role="button"]):focus-visible {
    outline: none;
    box-shadow: var(--erp-control-focus);
}

/* Keep destructive and status semantics distinct from the chosen decorative theme. */
body[class*="theme-"] :where(.btn-danger, .danger, .delete, .destructive, [data-theme-role="danger"]):not(:disabled):not(.disabled) {
    --danger-control: #dc2626;
    border-color: color-mix(in srgb, var(--danger-control) 42%, var(--border)) !important;
}


/* Support Help Desk bootstrap page inside the normal ERP administrator shell */
.support-setup-erp{display:grid;gap:18px;max-width:980px;margin:0 auto;padding:8px 0 32px}.support-setup-erp>header{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;padding:22px;border:1px solid var(--erp-control-border,var(--theme-border,#dbe3ef));border-radius:18px;background:var(--erp-control-bg,var(--theme-surface,#fff));box-shadow:0 12px 30px rgba(15,23,42,.06)}.support-setup-erp>header span{color:var(--erp-primary,var(--theme-primary,#4f46e5));font-weight:800}.support-setup-erp>header h1{margin:4px 0 6px}.support-setup-erp>header p{margin:0;color:var(--erp-muted,#64748b);max-width:680px}.support-setup-erp>header a,.support-setup-form button[type=submit],.support-setup-login-link{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:0 16px;border:1px solid var(--erp-primary,var(--theme-primary,#4f46e5));border-radius:11px;background:var(--erp-primary,var(--theme-primary,#4f46e5));color:var(--erp-on-primary,#fff);font-weight:800;text-decoration:none;white-space:nowrap}.support-setup-erp>header a:hover,.support-setup-form button[type=submit]:hover,.support-setup-login-link:hover{background:var(--erp-primary-hover,var(--theme-primary-hover,var(--erp-primary,#4338ca)));border-color:var(--erp-primary-hover,var(--theme-primary-hover,var(--erp-primary,#4338ca)));color:var(--erp-on-primary,#fff)}.support-setup-form,.support-setup-ready,.support-setup-success{padding:22px;border:1px solid var(--erp-control-border,var(--theme-border,#dbe3ef));border-radius:18px;background:var(--erp-control-bg,var(--theme-surface,#fff))}.support-setup-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.support-setup-form label{display:grid;align-content:start;gap:7px;font-weight:800}.support-setup-form label>span:first-child{display:flex;align-items:center;gap:5px}.support-setup-form label em{color:var(--erp-danger,#dc2626);font-style:normal}.support-setup-form label small{color:var(--erp-muted,#64748b);font-size:.78rem;font-weight:600}.support-setup-form input{width:100%;min-height:42px;border:1px solid var(--erp-control-border,var(--theme-border,#cbd5e1));border-radius:10px;padding:0 12px;background:var(--erp-input-bg,#fff);color:var(--erp-control-text,#0f172a);outline:none}.support-setup-form input:focus{border-color:var(--erp-primary,var(--theme-primary,#4f46e5));box-shadow:0 0 0 3px var(--erp-focus-ring,rgba(79,70,229,.18))}.support-setup-form label.has-validation-error input,.support-setup-form.was-validated input:invalid{border-color:var(--erp-danger,#dc2626);box-shadow:0 0 0 3px color-mix(in srgb,var(--erp-danger,#dc2626) 16%,transparent)}.support-setup-form .field-validation-message,.support-setup-form .field-validation-error{min-height:18px;color:var(--erp-danger,#b91c1c);font-size:.78rem;font-weight:800}.support-setup-form .field-validation-valid{visibility:hidden}.support-setup-validation{display:none;grid-column:1/-1;margin:0;padding:12px 14px;border:1px solid color-mix(in srgb,var(--erp-danger,#dc2626) 35%,var(--erp-control-border,#e2e8f0));border-radius:12px;background:color-mix(in srgb,var(--erp-danger,#dc2626) 9%,var(--erp-control-bg,#fff));color:var(--erp-danger,#b91c1c);font-weight:800}.support-setup-validation.validation-summary-errors{display:block}.support-setup-validation ul{margin:0;padding-left:20px}.support-setup-status{grid-column:1/-1;padding:11px 13px;border-radius:10px;font-weight:800}.support-setup-status-error{border:1px solid color-mix(in srgb,var(--erp-danger,#dc2626) 32%,var(--erp-control-border,#e2e8f0));background:color-mix(in srgb,var(--erp-danger,#dc2626) 8%,var(--erp-control-bg,#fff));color:var(--erp-danger,#b91c1c)}.support-password-control{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px}.support-password-toggle{min-width:58px;min-height:38px!important;padding:0 10px!important;border:1px solid var(--erp-control-border,var(--theme-border,#cbd5e1))!important;border-radius:9px!important;background:var(--erp-control-bg,var(--theme-surface,#fff))!important;color:var(--erp-primary,var(--theme-primary,#4f46e5))!important;font-weight:800!important}.support-password-toggle:hover{border-color:var(--erp-primary,var(--theme-primary,#4f46e5))!important;background:var(--erp-control-hover-bg,var(--theme-hover,#f8fafc))!important}.support-setup-submit-row{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:18px;padding-top:4px}.support-setup-submit-row p{margin:0;color:var(--erp-muted,#64748b);font-size:.82rem}.support-setup-form button[type=submit]{grid-column:auto;min-width:246px}.support-setup-form button[type=submit][disabled]{cursor:wait;opacity:.72}.support-setup-success{display:grid;gap:8px;border-color:#86efac;background:#f0fdf4;color:#166534}.support-setup-success strong{font-size:1.05rem}.support-setup-success p{margin:0}.support-setup-login-link{justify-self:start;margin-top:4px}.support-setup-ready strong{font-size:1.05rem}.support-setup-ready p{color:var(--erp-muted,#64748b)}
@media(max-width:720px){.support-setup-erp>header{display:grid}.support-setup-erp>header a{width:100%}.support-setup-form{grid-template-columns:1fr}.support-setup-form label{grid-column:1}.support-setup-submit-row{display:grid}.support-setup-form button[type=submit]{width:100%;min-width:0}.support-setup-login-link{width:100%}}

/* Stock Locations/Branches - VB.NET Locations/CreateStockLocations conversion */
.stock-locations-shell {
    overflow: visible;
}

.stock-location-search-row .list-search-form {
    width: min(920px, 100%);
}

#stockLocationResults.is-loading {
    opacity: .58;
    pointer-events: none;
}

.stock-location-table-card {
    overflow: visible;
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

.stock-location-table {
    width: 100%;
    min-width: 0;
    table-layout: fixed;
}

.stock-location-table col.stock-location-col-no { width: 5%; }
.stock-location-table col.stock-location-col-name { width: 18%; }
.stock-location-table col.stock-location-col-address { width: 22%; }
.stock-location-table col.stock-location-col-city { width: 12%; }
.stock-location-table col.stock-location-col-person { width: 15%; }
.stock-location-table col.stock-location-col-phone { width: 12%; }
.stock-location-table col.stock-location-col-email { width: 16%; }

.stock-location-table th,
.stock-location-table td {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.stock-location-table tbody tr[data-stock-location-select] {
    cursor: pointer;
}

.stock-location-table tbody tr[data-stock-location-select].selected {
    background: color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 12%, var(--card, #fff));
    box-shadow: inset 3px 0 0 var(--theme-primary, var(--brand, #714b67));
}

.stock-location-primary-row > td:first-child {
    box-shadow: inset 3px 0 0 color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 78%, #f59e0b);
}

.stock-location-primary-badge {
    display: inline-flex;
    align-items: center;
    margin-left: 7px;
    padding: 2px 7px;
    border: 1px solid color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 25%, var(--border, #d7e3ee));
    border-radius: 999px;
    background: color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 8%, var(--card, #fff));
    color: var(--text, #152238);
    font-size: .68rem;
    font-weight: 800;
    line-height: 1.2;
    vertical-align: middle;
}

.stock-location-editor-shell {
    max-width: 1040px;
    margin-inline: auto;
}

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

.stock-location-fields-grid .odoo-row {
    align-items: start;
}

.stock-location-fields-grid .odoo-input {
    width: 100%;
    min-width: 0;
}

.stock-location-address-row,
.stock-location-email-row {
    grid-column: 1 / -1;
}

.stock-location-address-row textarea.odoo-input {
    min-height: 88px;
    resize: vertical;
}

.stock-location-primary-note {
    display: block;
    margin-top: 6px;
}

.stock-location-editor-heading .odoo-company-name-input[readonly] {
    cursor: not-allowed;
    opacity: .78;
}

@media (max-width: 980px) {
    .stock-location-table col.stock-location-col-no { width: 7%; }
    .stock-location-table col.stock-location-col-name { width: 21%; }
    .stock-location-table col.stock-location-col-address { width: 25%; }
    .stock-location-table col.stock-location-col-city { width: 14%; }
    .stock-location-table col.stock-location-col-person { width: 17%; }
    .stock-location-table col.stock-location-col-phone { width: 16%; }
    .stock-location-table col.stock-location-col-email { width: 0; }
    .stock-location-table th:nth-child(7),
    .stock-location-table td:nth-child(7) { display: none; }
}

@media (max-width: 760px) {
    .stock-location-fields-grid {
        grid-template-columns: 1fr;
        padding: 16px;
    }

    .stock-location-address-row,
    .stock-location-email-row {
        grid-column: auto;
    }

    .stock-location-table,
    .stock-location-table thead,
    .stock-location-table tbody,
    .stock-location-table tr,
    .stock-location-table th,
    .stock-location-table td {
        display: block;
        width: 100%;
    }

    .stock-location-table colgroup,
    .stock-location-table thead {
        display: none;
    }

    .stock-location-table tbody {
        padding: 10px;
    }

    .stock-location-table tbody tr[data-stock-location-select] {
        margin: 0 0 10px;
        padding: 8px 10px;
        border: 1px solid var(--border, #d7e3ee);
        border-radius: 10px;
        background: var(--card, #fff);
    }

    .stock-location-table tbody tr[data-stock-location-select].selected {
        box-shadow: inset 3px 0 0 var(--theme-primary, var(--brand, #714b67));
    }

    .stock-location-table td,
    .stock-location-table td:nth-child(7) {
        display: grid;
        grid-template-columns: minmax(118px, 34%) minmax(0, 1fr);
        gap: 10px;
        padding: 6px 4px;
        border: 0;
        overflow: visible;
        text-overflow: clip;
        white-space: normal;
    }

    .stock-location-table td::before {
        content: attr(data-label);
        color: var(--muted, #64748b);
        font-size: .72rem;
        font-weight: 800;
        text-transform: uppercase;
        letter-spacing: .02em;
    }

    .stock-location-primary-row > td:first-child {
        box-shadow: none;
    }
}

/* Price List - VB.NET PriceList/CreateNewPriceList conversion */
.price-list-shell {
    --price-list-accent: var(--theme-primary, var(--brand, #714b67));
    display: grid;
    gap: 0;
    overflow: visible;
}
.price-list-commandbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    flex-wrap: wrap;
}
.price-list-main-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}
.price-list-action {
    appearance: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 38px;
    padding: 7px 13px;
    border: 1px solid color-mix(in srgb, var(--price-list-accent) 28%, var(--border, #d7e3ee));
    border-radius: 8px;
    background: color-mix(in srgb, var(--price-list-accent) 5%, var(--card, #fff));
    color: var(--text, #172033);
    font: inherit;
    font-weight: 750;
    text-decoration: none;
    cursor: pointer;
    transition: background .16s ease, border-color .16s ease, transform .16s ease, box-shadow .16s ease;
}
.price-list-action:hover:not(:disabled) {
    border-color: var(--price-list-accent);
    background: color-mix(in srgb, var(--price-list-accent) 10%, var(--card, #fff));
    box-shadow: 0 5px 14px color-mix(in srgb, var(--price-list-accent) 12%, transparent);
}
.price-list-action:active:not(:disabled) { transform: translateY(1px); }
.price-list-action:disabled { opacity: .48; cursor: not-allowed; box-shadow: none; }
.price-list-action-primary {
    background: var(--price-list-accent);
    border-color: var(--price-list-accent);
    color: var(--on-brand, #fff);
}
.price-list-action-primary:hover:not(:disabled) {
    background: color-mix(in srgb, var(--price-list-accent) 88%, #fff);
    color: var(--on-brand, #fff);
}
.price-list-action-close { margin-left: 3px; }
.price-list-field-indicator {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    min-height: 36px;
    padding: 6px 11px;
    border: 1px solid var(--border, #d7e3ee);
    border-radius: 999px;
    background: var(--card, #fff);
    color: var(--muted, #64748b);
    font-size: .76rem;
}
.price-list-field-indicator strong {
    color: var(--text, #172033);
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: .74rem;
}
.price-list-filter-panel {
    display: grid;
    grid-template-columns: minmax(170px, .8fr) minmax(180px, 1fr) minmax(180px, 1fr) minmax(260px, 1.35fr);
    gap: 12px 14px;
    padding: 16px;
    border-bottom: 1px solid var(--border, #d7e3ee);
    background: color-mix(in srgb, var(--card, #fff) 94%, var(--price-list-accent));
}
.price-list-filter-field {
    display: grid;
    gap: 6px;
    min-width: 0;
}
.price-list-filter-field > span:first-child,
.price-list-inline-action label > span,
.price-list-recalc-form > label > span,
.price-list-modal-card label > span {
    color: var(--muted, #64748b);
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .025em;
    text-transform: uppercase;
}
.price-list-filter-panel .odoo-input { width: 100%; min-width: 0; min-height: 38px; }
.price-list-search-wrap {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    min-height: 38px;
    border: 1px solid var(--border, #d7e3ee);
    border-radius: 7px;
    background: var(--card, #fff);
    overflow: hidden;
}
.price-list-search-wrap:focus-within {
    border-color: var(--price-list-accent);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--price-list-accent) 14%, transparent);
}
.price-list-search-wrap > span { padding-left: 10px; color: var(--muted, #64748b); }
.price-list-search-wrap .odoo-input { border: 0 !important; box-shadow: none !important; background: transparent !important; }
.price-list-search-wrap button {
    width: 34px;
    height: 34px;
    border: 0;
    background: transparent;
    color: var(--muted, #64748b);
    font-size: 1.2rem;
    cursor: pointer;
}
.price-list-toggle-grid {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    gap: 9px 18px;
    flex-wrap: wrap;
    padding-top: 2px;
}
.price-list-switch {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 30px;
    color: var(--text, #172033);
    font-size: .8rem;
    font-weight: 700;
    cursor: pointer;
}
.price-list-switch input[type="checkbox"] { width: 16px; height: 16px; accent-color: var(--price-list-accent); }
#priceListResults { min-width: 0; }
#priceListResults.is-loading { opacity: .55; pointer-events: none; }
.price-list-pager { border-bottom: 1px solid var(--border, #d7e3ee); }
.price-list-page-number { min-width: 90px; text-align: center; color: var(--muted, #64748b); font-size: .75rem; font-weight: 700; }
.price-list-table-card {
    width: 100%;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scrollbar-width: thin;
    border-bottom: 1px solid var(--border, #d7e3ee);
}
.price-list-table {
    width: 100%;
    min-width: 1120px;
    table-layout: fixed;
}
.price-list-table.show-unit-prices { min-width: 1370px; }
.price-list-table th,
.price-list-table td { vertical-align: middle; }
.price-list-table .price-list-col-code { width: 126px; }
.price-list-table .price-list-col-name { width: 245px; }
.price-list-table .price-list-col-size { width: 112px; }
.price-list-table .price-list-number { width: 112px; text-align: right; font-variant-numeric: tabular-nums; }
.price-list-table .price-list-col-price { width: 134px; }
.price-list-table .price-list-unit-column { width: 102px; }
.price-list-table td:nth-child(2) { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.price-list-table tbody tr[data-price-list-row] { cursor: pointer; }
.price-list-table tbody tr[data-price-list-row].selected {
    background: color-mix(in srgb, var(--price-list-accent) 10%, var(--card, #fff));
    box-shadow: inset 3px 0 0 var(--price-list-accent);
}
.price-list-negative { color: #b91c1c; font-weight: 800; }
.price-list-price-cell input {
    width: 112px;
    min-height: 32px;
    padding: 4px 8px;
    border: 1px solid color-mix(in srgb, var(--price-list-accent) 34%, var(--border, #cbd5e1));
    border-radius: 6px;
    background: var(--card, #fff);
    color: var(--text, #172033);
    text-align: right;
    font: inherit;
    font-variant-numeric: tabular-nums;
    font-weight: 800;
}
.price-list-price-cell input:focus {
    outline: none;
    border-color: var(--price-list-accent);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--price-list-accent) 15%, transparent);
}
.price-list-price-cell input.is-saving { opacity: .55; }
.price-list-tools {
    display: grid;
    grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
    gap: 14px;
    padding: 16px;
    background: color-mix(in srgb, var(--bg, #f6f8fb) 96%, var(--price-list-accent));
}
.price-list-tool-card {
    min-width: 0;
    padding: 16px;
    border: 1px solid var(--border, #d7e3ee);
    border-radius: 12px;
    background: var(--card, #fff);
    box-shadow: 0 7px 20px rgba(15, 23, 42, .045);
}
.price-list-tool-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}
.price-list-tool-kicker {
    display: block;
    margin-bottom: 2px;
    color: var(--price-list-accent);
    font-size: .68rem;
    font-weight: 850;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.price-list-tool-card h2,
.price-list-modal-card h2 { margin: 0; color: var(--text, #172033); font-size: 1rem; }
.price-list-tool-card > p,
.price-list-modal-card form > p { margin: 8px 0 14px; color: var(--muted, #64748b); font-size: .78rem; line-height: 1.5; }
.price-list-selection-badge,
.price-list-scope-badge {
    display: inline-flex;
    align-items: center;
    max-width: 210px;
    min-height: 27px;
    padding: 4px 9px;
    border: 1px solid color-mix(in srgb, var(--price-list-accent) 24%, var(--border, #d7e3ee));
    border-radius: 999px;
    background: color-mix(in srgb, var(--price-list-accent) 7%, var(--card, #fff));
    color: var(--text, #172033);
    font-size: .68rem;
    font-weight: 800;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.price-list-inline-action {
    display: grid;
    grid-template-columns: minmax(150px, 1fr) auto;
    align-items: end;
    gap: 10px;
}
.price-list-inline-action label,
.price-list-recalc-form > label,
.price-list-modal-card label { display: grid; gap: 6px; }
.price-list-inline-action .odoo-input { min-height: 38px; }
.price-list-recalc-form {
    display: grid;
    grid-template-columns: minmax(130px, .6fr) minmax(210px, 1fr) auto;
    gap: 10px;
    align-items: end;
}
.price-list-recalc-form fieldset {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
    min-height: 38px;
    margin: 0;
    padding: 5px 10px;
    border: 1px solid var(--border, #d7e3ee);
    border-radius: 7px;
}
.price-list-recalc-form legend {
    padding: 0 4px;
    color: var(--muted, #64748b);
    font-size: .66rem;
    font-weight: 800;
    text-transform: uppercase;
}
.price-list-recalc-form fieldset label { display: inline-flex; align-items: center; gap: 5px; font-size: .75rem; font-weight: 700; }
.price-list-live-message {
    position: fixed;
    right: 18px;
    bottom: 18px;
    z-index: 10000;
    max-width: min(420px, calc(100vw - 36px));
    padding: 11px 14px;
    border: 1px solid var(--border, #d7e3ee);
    border-radius: 10px;
    background: var(--card, #fff);
    color: var(--text, #172033);
    box-shadow: 0 14px 34px rgba(15, 23, 42, .18);
    font-size: .8rem;
    font-weight: 750;
}
.price-list-live-message.error { border-color: #ef4444; }
.price-list-live-message.success { border-color: #22c55e; }
body.price-list-modal-open { overflow: hidden; }
.price-list-modal[hidden] { display: none !important; }
.price-list-modal { position: fixed; inset: 0; z-index: 10050; display: grid; place-items: center; padding: 18px; }
.price-list-modal-backdrop { position: absolute; inset: 0; background: rgba(15, 23, 42, .54); backdrop-filter: blur(2px); }
.price-list-modal-card {
    position: relative;
    width: min(500px, 100%);
    border: 1px solid color-mix(in srgb, var(--price-list-accent) 25%, var(--border, #d7e3ee));
    border-radius: 14px;
    background: var(--card, #fff);
    color: var(--text, #172033);
    box-shadow: 0 26px 70px rgba(15, 23, 42, .34);
    overflow: hidden;
}
.price-list-modal-card > header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
    padding: 16px 18px;
    border-bottom: 1px solid var(--border, #d7e3ee);
}
.price-list-modal-card > header > button {
    width: 34px;
    height: 34px;
    border: 1px solid var(--border, #d7e3ee);
    border-radius: 8px;
    background: var(--card, #fff);
    color: var(--text, #172033);
    font-size: 1.25rem;
    cursor: pointer;
}
.price-list-modal-card form { padding: 18px; }
.price-list-modal-card form footer { display: flex; justify-content: flex-end; gap: 8px; margin-top: 18px; }

@media (max-width: 1120px) {
    .price-list-filter-panel { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .price-list-tools { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
    .price-list-commandbar { align-items: stretch; }
    .price-list-main-actions, .price-list-field-indicator { width: 100%; }
    .price-list-main-actions .price-list-action { flex: 1 1 auto; }
    .price-list-field-indicator { justify-content: space-between; border-radius: 8px; }
    .price-list-filter-panel { grid-template-columns: 1fr; padding: 12px; }
    .price-list-toggle-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 7px 10px; }
    .price-list-table-card { overflow: visible; }
    .price-list-table,
    .price-list-table.show-unit-prices,
    .price-list-table thead,
    .price-list-table tbody,
    .price-list-table tr,
    .price-list-table th,
    .price-list-table td { display: block; width: 100%; min-width: 0; }
    .price-list-table thead { display: none; }
    .price-list-table tbody { padding: 10px; }
    .price-list-table tbody tr[data-price-list-row] {
        margin-bottom: 10px;
        padding: 8px 10px;
        border: 1px solid var(--border, #d7e3ee);
        border-radius: 10px;
        background: var(--card, #fff);
    }
    .price-list-table td,
    .price-list-table .price-list-number {
        display: grid;
        grid-template-columns: minmax(110px, 36%) minmax(0, 1fr);
        align-items: center;
        gap: 8px;
        padding: 5px 3px;
        border: 0;
        text-align: right;
        white-space: normal;
        overflow: visible;
    }
    .price-list-table td::before {
        content: attr(data-label);
        color: var(--muted, #64748b);
        font-size: .68rem;
        font-weight: 800;
        text-align: left;
        text-transform: uppercase;
    }
    .price-list-table td:nth-child(2) { overflow: visible; text-overflow: clip; white-space: normal; }
    .price-list-price-cell input { width: min(150px, 100%); justify-self: end; }
    .price-list-tools { padding: 10px; }
    .price-list-tool-heading { display: grid; }
    .price-list-selection-badge, .price-list-scope-badge { max-width: 100%; }
    .price-list-inline-action, .price-list-recalc-form { grid-template-columns: 1fr; }
    .price-list-inline-action .price-list-action, .price-list-recalc-form .price-list-action { width: 100%; }
}
@media (max-width: 480px) {
    .price-list-toggle-grid { grid-template-columns: 1fr; }
    .price-list-recalc-form fieldset { flex-wrap: wrap; }
    .price-list-modal-card form footer { display: grid; grid-template-columns: 1fr 1fr; }
}

/* Account Summary - VB.NET LedgerBalanceSheetForm / MonthlyAccountBalanceSheet conversion */
.account-summary-page,.monthly-account-page{position:relative;overflow:visible!important}.account-summary-toolbar,.monthly-account-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:12px;padding:14px 16px;border-bottom:1px solid var(--erp-border,#d8dee8);background:var(--erp-card-bg,var(--erp-surface,#fff));color:var(--erp-text,#1f2937)}.account-summary-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.account-summary-pager-tools{margin-left:auto;display:flex;align-items:center;gap:7px;color:var(--erp-muted,#64748b);font-size:.86rem}.account-summary-pager-tools label{display:flex;align-items:center;gap:5px}.account-summary-pager-tools select{min-width:72px}.account-summary-filter-grid{width:100%;display:grid;grid-template-columns:repeat(5,minmax(150px,1fr));gap:10px 12px;padding-top:4px}.account-summary-filter-grid label,.monthly-account-toolbar label{display:flex;flex-direction:column;gap:5px;font-size:.82rem;font-weight:700;color:var(--erp-muted,#64748b)}.account-summary-filter-grid input,.account-summary-filter-grid select,.account-summary-pager-tools select{width:100%;min-height:38px;border:1px solid var(--erp-border,#d8dee8);border-radius:8px;padding:7px 9px;background:var(--erp-input-bg,var(--erp-surface,#fff));color:var(--erp-input-text,var(--erp-text,#1f2937));font:inherit}.account-summary-filter-grid input:focus,.account-summary-filter-grid select:focus{outline:2px solid color-mix(in srgb,var(--erp-primary,#15803d) 24%,transparent);border-color:var(--erp-primary,#15803d)}.account-summary-search-field{grid-column:span 2}.account-summary-options{width:100%;display:flex;flex-wrap:wrap;gap:8px 18px;padding-top:2px;color:var(--erp-text,#1f2937)}.account-summary-options label,.monthly-account-toolbar>label{display:inline-flex;flex-direction:row;align-items:center;gap:7px;font-weight:700}.account-summary-options input,.monthly-account-toolbar input[type=checkbox]{accent-color:var(--erp-primary,#15803d)}.account-summary-message{margin:14px 16px}.account-summary-report-head{display:flex;justify-content:space-between;gap:20px;align-items:flex-end;margin:16px;border:1px solid color-mix(in srgb,var(--erp-primary,#15803d) 20%,var(--erp-border,#d8dee8));border-radius:14px;padding:15px 16px;background:color-mix(in srgb,var(--erp-primary,#15803d) 5%,var(--erp-card-bg,var(--erp-surface,#fff)));color:var(--erp-text,#1f2937)}.account-summary-report-head h2{margin:0;font-size:1.05rem;letter-spacing:.02em}.account-summary-report-head p{margin:4px 0 0;color:var(--erp-muted,#64748b)}.account-summary-period-note{display:flex;flex-direction:column;text-align:right;gap:3px}.account-summary-period-note span{color:var(--erp-muted,#64748b);font-size:.82rem}.account-summary-total-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:0 16px 16px}.account-summary-total-cards article{border:1px solid var(--erp-border,#d8dee8);border-radius:12px;padding:12px 14px;background:var(--erp-card-bg,var(--erp-surface,#fff));color:var(--erp-text,#1f2937)}.account-summary-total-cards article.net{border-color:color-mix(in srgb,var(--erp-primary,#15803d) 42%,var(--erp-border,#d8dee8));background:color-mix(in srgb,var(--erp-primary,#15803d) 9%,var(--erp-card-bg,var(--erp-surface,#fff)))}.account-summary-total-cards span{display:block;color:var(--erp-muted,#64748b);font-size:.73rem;font-weight:800;text-transform:uppercase;letter-spacing:.05em}.account-summary-total-cards strong{display:block;margin-top:5px;text-align:right;font-size:1rem;font-variant-numeric:tabular-nums}.account-summary-card,.monthly-account-chart-card{margin:0 16px 16px;border:1px solid var(--erp-border,#d8dee8);border-radius:14px;overflow:hidden;background:var(--erp-card-bg,var(--erp-surface,#fff));color:var(--erp-text,#1f2937)}.account-summary-card-head{display:flex;justify-content:space-between;gap:16px;align-items:center;padding:13px 15px;border-bottom:1px solid var(--erp-border,#d8dee8);background:color-mix(in srgb,var(--erp-primary,#15803d) 5%,var(--erp-card-bg,var(--erp-surface,#fff)))}.account-summary-card-head h2{margin:0;font-size:1rem}.account-summary-card-head p{margin:3px 0 0;color:var(--erp-muted,#64748b);font-size:.82rem}.account-summary-card-head>span{font-size:.78rem;color:var(--erp-muted,#64748b);white-space:nowrap}.account-summary-table-wrap{width:100%;overflow-x:auto}.account-summary-table{width:100%;min-width:720px;border-collapse:collapse;table-layout:fixed}.account-summary-table th,.account-summary-table td{padding:9px 11px;border-bottom:1px solid var(--erp-border,#e5e7eb);vertical-align:middle}.account-summary-table th{background:color-mix(in srgb,var(--erp-primary,#15803d) 10%,var(--erp-card-bg,var(--erp-surface,#fff)));font-size:.78rem;text-transform:uppercase;letter-spacing:.035em;text-align:left;white-space:nowrap}.account-summary-table th:first-child{width:43%}.account-summary-table .num{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}.account-summary-table tbody tr:hover td{background:color-mix(in srgb,var(--erp-primary,#15803d) 5%,transparent)}.account-summary-table tfoot td{font-weight:900;background:color-mix(in srgb,var(--erp-primary,#15803d) 8%,var(--erp-card-bg,var(--erp-surface,#fff)));border-top:2px solid color-mix(in srgb,var(--erp-primary,#15803d) 35%,var(--erp-border,#d8dee8))}.account-summary-ledger-link{font-weight:800;color:var(--erp-primary,#15803d);text-decoration:none}.account-summary-ledger-link:hover{text-decoration:underline}.account-summary-currency{display:inline-flex;margin-left:7px;padding:2px 6px;border-radius:999px;background:color-mix(in srgb,var(--erp-primary,#15803d) 10%,transparent);color:var(--erp-muted,#64748b);font-size:.7rem;font-weight:800}.account-summary-empty{text-align:center!important;padding:28px!important;color:var(--erp-muted,#64748b)}.monthly-account-toolbar>div{display:flex;flex-direction:column;min-width:280px;flex:1}.monthly-account-toolbar>div span{font-size:.78rem;color:var(--erp-muted,#64748b);margin-top:2px}.monthly-account-chart{padding:12px 15px;display:grid;gap:9px}.monthly-chart-row{display:grid;grid-template-columns:90px minmax(0,1fr);gap:10px;align-items:center}.monthly-chart-row>.period{font-weight:800;color:var(--erp-text,#1f2937)}.monthly-chart-bars{display:grid;gap:4px}.bar-line{display:grid;grid-template-columns:24px minmax(0,1fr) 92px;gap:6px;align-items:center;font-size:.72rem;color:var(--erp-muted,#64748b)}.bar-line>i{display:block;height:8px;min-width:1px;border-radius:99px;background:var(--erp-primary,#15803d)}.bar-line>i.cr{background:color-mix(in srgb,var(--erp-primary,#15803d) 50%,#64748b)}.bar-line>b{text-align:right;font-variant-numeric:tabular-nums;color:var(--erp-text,#1f2937)}
@media(max-width:1100px){.account-summary-filter-grid{grid-template-columns:repeat(3,minmax(150px,1fr))}.account-summary-search-field{grid-column:span 1}}@media(max-width:720px){.account-summary-toolbar,.monthly-account-toolbar{align-items:stretch}.account-summary-actions{width:100%}.account-summary-pager-tools{width:100%;margin-left:0;justify-content:flex-end}.account-summary-filter-grid{grid-template-columns:1fr 1fr}.account-summary-report-head{align-items:flex-start;flex-direction:column}.account-summary-period-note{text-align:left}.account-summary-total-cards{grid-template-columns:1fr}.monthly-chart-row{grid-template-columns:1fr}.bar-line{grid-template-columns:24px minmax(0,1fr) 82px}}@media(max-width:480px){.account-summary-filter-grid{grid-template-columns:1fr}.account-summary-actions .odoo-save,.account-summary-actions .odoo-discard{flex:1;text-align:center}.account-summary-pager-tools{justify-content:flex-start;flex-wrap:wrap}.account-summary-table{min-width:640px}}

/* Customer Statement Report - frmCustomerStatement.vb conversion */
.customer-statement-page{position:relative;overflow:visible!important}.customer-statement-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:12px;padding:14px 16px;border-bottom:1px solid var(--erp-border,#d8dee8);background:var(--erp-card-bg,var(--erp-surface,#fff));color:var(--erp-text,#1f2937)}.customer-statement-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.customer-statement-pager-tools{margin-left:auto;display:flex;align-items:center;gap:7px;color:var(--erp-muted,#64748b);font-size:.86rem}.customer-statement-pager-tools label{display:flex;align-items:center;gap:5px}.customer-statement-pager-tools select{min-width:72px;min-height:38px;border:1px solid var(--erp-border,#d8dee8);border-radius:8px;padding:6px 8px;background:var(--erp-input-bg,var(--erp-surface,#fff));color:var(--erp-input-text,var(--erp-text,#1f2937))}.customer-statement-filter-grid{width:100%;display:grid;grid-template-columns:minmax(250px,1.8fr) minmax(220px,1.4fr) minmax(145px,.9fr) minmax(145px,.9fr) minmax(130px,.75fr);gap:10px 12px;align-items:end}.customer-statement-filter-grid label{display:flex;flex-direction:column;gap:5px;font-size:.82rem;font-weight:700;color:var(--erp-muted,#64748b)}.customer-statement-filter-grid input,.customer-statement-filter-grid select{width:100%;min-height:38px;border:1px solid var(--erp-border,#d8dee8);border-radius:8px;padding:7px 9px;background:var(--erp-input-bg,var(--erp-surface,#fff));color:var(--erp-input-text,var(--erp-text,#1f2937));font:inherit}.customer-statement-filter-grid input:focus,.customer-statement-filter-grid select:focus{outline:2px solid rgba(21,128,61,.18);border-color:var(--erp-primary,#15803d)}.customer-statement-datewise .customer-statement-check{min-height:38px;display:flex;align-items:center;gap:7px;padding:0 10px;border:1px solid var(--erp-border,#d8dee8);border-radius:8px;background:var(--erp-input-bg,var(--erp-surface,#fff));color:var(--erp-text,#1f2937);white-space:nowrap}.customer-statement-check input{width:auto;min-height:auto;accent-color:var(--erp-primary,#15803d)}.customer-statement-message{margin:14px 16px}.customer-statement-report-head{display:flex;justify-content:space-between;gap:20px;align-items:flex-end;margin:16px;border:1px solid var(--erp-border,#d8dee8);border-left:4px solid var(--erp-primary,#15803d);border-radius:12px;padding:14px 16px;background:var(--erp-card-bg,var(--erp-surface,#fff));color:var(--erp-text,#1f2937)}.customer-statement-report-head h2{margin:0;font-size:1.05rem;letter-spacing:.03em}.customer-statement-report-head p{margin:4px 0 0;color:var(--erp-muted,#64748b)}.customer-statement-report-meta{display:flex;flex-direction:column;text-align:right;gap:3px}.customer-statement-report-meta span{color:var(--erp-muted,#64748b);font-size:.8rem}.customer-statement-total-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:0 16px 16px}.customer-statement-total-cards article{border:1px solid var(--erp-border,#d8dee8);border-radius:12px;padding:11px 13px;background:var(--erp-card-bg,var(--erp-surface,#fff));color:var(--erp-text,#1f2937)}.customer-statement-total-cards article.net{border-left:4px solid var(--erp-primary,#15803d)}.customer-statement-total-cards span{display:block;color:var(--erp-muted,#64748b);font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em}.customer-statement-total-cards strong{display:block;margin-top:5px;text-align:right;font-size:.98rem;font-variant-numeric:tabular-nums;white-space:nowrap}.customer-statement-card{margin:0 16px 16px;border:1px solid var(--erp-border,#d8dee8);border-radius:14px;overflow:hidden;background:var(--erp-card-bg,var(--erp-surface,#fff));color:var(--erp-text,#1f2937)}.customer-statement-card-head{display:flex;justify-content:space-between;gap:16px;align-items:center;padding:12px 14px;border-bottom:1px solid var(--erp-border,#d8dee8);background:var(--erp-soft,#f8fafc)}.customer-statement-card-head h2{margin:0;font-size:1rem}.customer-statement-card-head p{margin:3px 0 0;color:var(--erp-muted,#64748b);font-size:.82rem}.customer-statement-card-head>span{font-size:.78rem;color:var(--erp-muted,#64748b);white-space:nowrap}.customer-statement-table-wrap{width:100%;overflow-x:auto}.customer-statement-table{width:100%;min-width:1280px;border-collapse:collapse;table-layout:fixed}.customer-statement-table th,.customer-statement-table td{padding:8px 9px;border-bottom:1px solid var(--erp-border,#e5e7eb);vertical-align:top}.customer-statement-table th{background:var(--erp-soft,#f1f5f9);font-size:.76rem;text-transform:uppercase;letter-spacing:.03em;text-align:left;white-space:nowrap}.customer-statement-table th:nth-child(1){width:8%}.customer-statement-table th:nth-child(2){width:16%}.customer-statement-table th:nth-child(3){width:11%}.customer-statement-table th:nth-child(4){width:22%}.customer-statement-table th:nth-child(5){width:10%}.customer-statement-table th:nth-child(n+6){width:8.25%}.customer-statement-table .num{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}.customer-statement-table td small{display:block;margin-top:2px;color:var(--erp-muted,#64748b);font-size:.72rem;line-height:1.25}.customer-statement-ref{font-weight:800;color:var(--erp-primary,#15803d)}.customer-statement-ref-link{text-decoration:none;border-bottom:1px dashed currentColor;cursor:pointer}.customer-statement-ref-link:hover,.customer-statement-ref-link:focus{text-decoration:none;border-bottom-style:solid;outline:none;filter:brightness(.9)}.customer-statement-source{display:inline-flex!important;width:max-content;padding:2px 6px;border-radius:999px;border:1px solid var(--erp-border,#d8dee8);background:var(--erp-soft,#f8fafc);font-weight:800}.customer-statement-table td.balance{font-weight:800}.customer-statement-table tfoot td{font-weight:900;background:var(--erp-soft,#f1f5f9);border-top:2px solid var(--erp-primary,#15803d)}.customer-statement-empty{text-align:center!important;padding:28px!important;color:var(--erp-muted,#64748b)}
@media(max-width:1080px){.customer-statement-filter-grid{grid-template-columns:repeat(2,minmax(180px,1fr))}.customer-statement-customer-field{grid-column:span 2}.customer-statement-total-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:720px){.customer-statement-toolbar{align-items:stretch}.customer-statement-actions,.customer-statement-pager-tools{width:100%}.customer-statement-pager-tools{margin-left:0;justify-content:flex-end}.customer-statement-filter-grid{grid-template-columns:1fr}.customer-statement-customer-field{grid-column:auto}.customer-statement-report-head{align-items:flex-start;flex-direction:column}.customer-statement-report-meta{text-align:left}.customer-statement-total-cards{grid-template-columns:1fr}}@media(max-width:480px){.customer-statement-actions .odoo-save,.customer-statement-actions .odoo-discard{flex:1;text-align:center}.customer-statement-pager-tools{justify-content:flex-start;flex-wrap:wrap}}

/* Customer Statement customer-account quick suggestions + full lookup */
.customer-statement-lookup-wrap{position:relative;width:100%}.customer-statement-lookup-suggestions{position:absolute;z-index:1080;left:0;right:0;top:calc(100% + 5px);max-height:360px;overflow:auto;border:1px solid var(--erp-border,#d8dee8);border-radius:10px;background:var(--erp-card-bg,var(--erp-surface,#fff));box-shadow:0 16px 36px rgba(15,23,42,.16);padding:5px}.customer-statement-lookup-suggestions[hidden]{display:none!important}.customer-statement-lookup-option{display:flex;width:100%;flex-direction:column;align-items:flex-start;gap:2px;border:0;border-radius:7px;padding:8px 10px;background:transparent;color:var(--erp-text,#1f2937);text-align:left;cursor:pointer}.customer-statement-lookup-option:hover,.customer-statement-lookup-option.active{background:var(--erp-soft,#f1f5f9)}.customer-statement-lookup-option strong{font-size:.86rem;line-height:1.2}.customer-statement-lookup-option span{font-size:.73rem;color:var(--erp-muted,#64748b)}.customer-statement-lookup-more{margin-top:4px;border-top:1px solid var(--erp-border,#d8dee8);border-radius:0 0 7px 7px}.customer-statement-lookup-more strong{color:var(--erp-primary,#15803d)}.customer-statement-lookup-empty{padding:14px;color:var(--erp-muted,#64748b);font-size:.82rem;text-align:center}.customer-statement-lookup-backdrop{position:fixed;z-index:2050;inset:0;display:flex;align-items:center;justify-content:center;padding:24px;background:rgba(15,23,42,.46)}.customer-statement-lookup-backdrop[hidden]{display:none!important}.customer-statement-lookup-modal{width:min(780px,96vw);max-height:min(760px,90vh);display:flex;flex-direction:column;overflow:hidden;border:1px solid var(--erp-border,#d8dee8);border-radius:14px;background:var(--erp-card-bg,var(--erp-surface,#fff));color:var(--erp-text,#1f2937);box-shadow:0 24px 70px rgba(15,23,42,.3)}.customer-statement-lookup-modal-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:15px 17px;border-bottom:1px solid var(--erp-border,#d8dee8);background:var(--erp-soft,#f8fafc)}.customer-statement-lookup-modal-head span{display:block;color:var(--erp-muted,#64748b);font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.05em}.customer-statement-lookup-modal-head h2{margin:3px 0 0;font-size:1.05rem}.customer-statement-lookup-close{width:36px;height:36px;border:1px solid var(--erp-border,#d8dee8);border-radius:8px;background:var(--erp-card-bg,var(--erp-surface,#fff));color:var(--erp-text,#1f2937);font-size:1.35rem;line-height:1;cursor:pointer}.customer-statement-lookup-modal-search{padding:12px 14px;border-bottom:1px solid var(--erp-border,#d8dee8)}.customer-statement-lookup-modal-search input{width:100%;min-height:40px;border:1px solid var(--erp-border,#d8dee8);border-radius:8px;padding:8px 10px;background:var(--erp-input-bg,var(--erp-surface,#fff));color:var(--erp-input-text,var(--erp-text,#1f2937));font:inherit}.customer-statement-lookup-modal-search input:focus{outline:2px solid rgba(21,128,61,.18);border-color:var(--erp-primary,#15803d)}.customer-statement-lookup-modal-results{min-height:220px;overflow:auto;flex:1}.customer-statement-lookup-modal-results table{width:100%;border-collapse:collapse}.customer-statement-lookup-modal-results th,.customer-statement-lookup-modal-results td{padding:9px 12px;border-bottom:1px solid var(--erp-border,#e5e7eb);text-align:left}.customer-statement-lookup-modal-results th{position:sticky;top:0;z-index:1;background:var(--erp-soft,#f1f5f9);font-size:.76rem;text-transform:uppercase;letter-spacing:.03em}.customer-statement-lookup-modal-results th:first-child,.customer-statement-lookup-modal-results td:first-child{width:32%}.customer-statement-modal-pick{border:0;padding:0;background:transparent;color:var(--erp-primary,#15803d);font:inherit;font-weight:800;text-align:left;cursor:pointer}.customer-statement-modal-pick:hover{text-decoration:underline}.customer-statement-lookup-modal-footer{display:flex;align-items:center;justify-content:flex-end;gap:8px;padding:10px 14px;border-top:1px solid var(--erp-border,#d8dee8);background:var(--erp-soft,#f8fafc);color:var(--erp-muted,#64748b);font-size:.8rem}.customer-statement-all-customers{margin-right:auto}.customer-statement-lookup-modal-footer .odoo-page-btn:disabled{opacity:.45;cursor:not-allowed}.customer-statement-lookup-empty.modal-empty{padding:34px 16px}
@media(max-width:720px){.customer-statement-lookup-backdrop{padding:10px}.customer-statement-lookup-modal{width:100%;max-height:92vh}.customer-statement-lookup-modal-results th:first-child,.customer-statement-lookup-modal-results td:first-child{width:38%}.customer-statement-lookup-modal-footer{flex-wrap:wrap}.customer-statement-all-customers{margin-right:0;width:100%}}

/* Reports / Account Reports / Customer Balance Report by Area Wise */
.customer-balance-area-page{display:flex;flex-direction:column;gap:14px}.customer-balance-area-toolbar{display:flex;align-items:flex-start;gap:12px;flex-wrap:wrap;padding:12px;border:1px solid var(--erp-border,#d8dee8);border-radius:12px;background:var(--erp-card-bg,var(--erp-surface,#fff))}.customer-balance-area-actions{display:flex;gap:8px;flex-wrap:wrap}.customer-balance-area-pager-tools{display:flex;align-items:center;gap:6px;margin-left:auto;color:var(--erp-muted,#64748b);font-size:.82rem}.customer-balance-area-pager-tools label{display:flex;align-items:center;gap:5px}.customer-balance-area-pager-tools select{min-height:34px;border:1px solid var(--erp-border,#d8dee8);border-radius:7px;background:var(--erp-input-bg,var(--erp-surface,#fff));color:var(--erp-input-text,var(--erp-text,#1f2937));padding:4px 8px}.customer-balance-area-filter-grid{width:100%;display:grid;grid-template-columns:repeat(4,minmax(160px,1fr));gap:10px 12px}.customer-balance-area-filter-grid label{display:flex;flex-direction:column;gap:5px;min-width:0}.customer-balance-area-filter-grid label>span:first-child{color:var(--erp-muted,#64748b);font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em}.customer-balance-area-filter-grid select,.customer-balance-area-filter-grid input{width:100%;min-height:38px;border:1px solid var(--erp-border,#d8dee8);border-radius:8px;background:var(--erp-input-bg,var(--erp-surface,#fff));color:var(--erp-input-text,var(--erp-text,#1f2937));padding:7px 9px;font:inherit}.customer-balance-area-filter-grid select:focus,.customer-balance-area-filter-grid input:focus{outline:2px solid rgba(21,128,61,.16);border-color:var(--erp-primary,#15803d)}.customer-balance-area-search-field{grid-column:span 2}.customer-balance-area-options{width:100%;display:flex;align-items:center;gap:14px;flex-wrap:wrap;border-top:1px solid var(--erp-border,#e5e7eb);padding-top:10px}.customer-balance-area-options label{display:flex;align-items:center;gap:7px;color:var(--erp-text,#1f2937);font-weight:700;font-size:.83rem}.customer-balance-area-options input[type=checkbox]{accent-color:var(--erp-primary,#15803d)}.customer-balance-area-message{margin:0}.customer-balance-area-report-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;padding:14px 16px;border:1px solid var(--erp-border,#d8dee8);border-radius:12px;background:linear-gradient(135deg,var(--erp-card-bg,var(--erp-surface,#fff)),var(--erp-soft,#f8fafc))}.customer-balance-area-report-head h2{margin:0;font-size:1.12rem;letter-spacing:.02em}.customer-balance-area-report-head p{margin:4px 0 0;color:var(--erp-muted,#64748b);font-size:.82rem}.customer-balance-area-report-meta{display:flex;flex-direction:column;align-items:flex-end;gap:3px;text-align:right;color:var(--erp-muted,#64748b);font-size:.77rem}.customer-balance-area-report-meta strong{color:var(--erp-text,#1f2937);font-size:.9rem}.customer-balance-area-total-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.customer-balance-area-total-cards article{min-width:0;border:1px solid var(--erp-border,#d8dee8);border-radius:11px;background:var(--erp-card-bg,var(--erp-surface,#fff));padding:12px 14px;box-shadow:0 4px 14px rgba(15,23,42,.04)}.customer-balance-area-total-cards article.net{border-color:color-mix(in srgb,var(--erp-primary,#15803d) 35%,var(--erp-border,#d8dee8))}.customer-balance-area-total-cards span{display:block;color:var(--erp-muted,#64748b);font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em}.customer-balance-area-total-cards strong{display:block;margin-top:5px;text-align:right;color:var(--erp-text,#1f2937);font-size:1.04rem;font-variant-numeric:tabular-nums}.customer-balance-area-card{border:1px solid var(--erp-border,#d8dee8);border-radius:12px;background:var(--erp-card-bg,var(--erp-surface,#fff));overflow:hidden}.customer-balance-area-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:12px 14px;border-bottom:1px solid var(--erp-border,#e5e7eb);background:var(--erp-soft,#f8fafc)}.customer-balance-area-card-head h2{margin:0;font-size:1rem}.customer-balance-area-card-head p{margin:3px 0 0;color:var(--erp-muted,#64748b);font-size:.78rem}.customer-balance-area-card-head>span{white-space:nowrap;color:var(--erp-muted,#64748b);font-size:.77rem;font-weight:800}.customer-balance-area-table-wrap{overflow:auto}.customer-balance-area-table{width:100%;min-width:720px;border-collapse:collapse}.customer-balance-area-table th,.customer-balance-area-table td{padding:9px 11px;border-bottom:1px solid var(--erp-border,#e5e7eb);text-align:left}.customer-balance-area-table th{background:var(--erp-soft,#f1f5f9);color:var(--erp-muted,#475569);font-size:.73rem;text-transform:uppercase;letter-spacing:.035em;white-space:nowrap}.customer-balance-area-table .num{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}.customer-balance-area-table tbody tr:hover{background:color-mix(in srgb,var(--erp-primary,#15803d) 5%,transparent)}.customer-balance-area-ledger-link{color:var(--erp-primary,#15803d);font-weight:800;text-decoration:none}.customer-balance-area-ledger-link:hover{text-decoration:underline}.customer-balance-area-table tfoot td{font-weight:900;background:var(--erp-soft,#f1f5f9);border-top:2px solid var(--erp-primary,#15803d)}.customer-balance-area-empty{text-align:center!important;padding:28px!important;color:var(--erp-muted,#64748b)}
@media(max-width:1080px){.customer-balance-area-filter-grid{grid-template-columns:repeat(2,minmax(180px,1fr))}.customer-balance-area-search-field{grid-column:span 2}}@media(max-width:720px){.customer-balance-area-toolbar{align-items:stretch}.customer-balance-area-actions,.customer-balance-area-pager-tools{width:100%}.customer-balance-area-pager-tools{margin-left:0;justify-content:flex-end}.customer-balance-area-filter-grid{grid-template-columns:1fr}.customer-balance-area-search-field{grid-column:auto}.customer-balance-area-report-head{flex-direction:column}.customer-balance-area-report-meta{align-items:flex-start;text-align:left}.customer-balance-area-total-cards{grid-template-columns:1fr}}@media(max-width:480px){.customer-balance-area-actions .odoo-save,.customer-balance-area-actions .odoo-discard{flex:1;text-align:center}.customer-balance-area-pager-tools{justify-content:flex-start;flex-wrap:wrap}}

/* Customer Balance Area Wise account search lookup */
.customer-balance-area-lookup-wrap{position:relative;width:100%}.customer-balance-area-lookup-suggestions{position:absolute;z-index:1080;left:0;right:0;top:calc(100% + 5px);max-height:360px;overflow:auto;border:1px solid var(--erp-border,#d8dee8);border-radius:10px;background:var(--erp-card-bg,var(--erp-surface,#fff));box-shadow:0 16px 36px rgba(15,23,42,.16);padding:5px}.customer-balance-area-lookup-suggestions[hidden]{display:none!important}.customer-balance-area-lookup-option{display:flex;width:100%;flex-direction:column;align-items:flex-start;gap:2px;border:0;border-radius:7px;padding:8px 10px;background:transparent;color:var(--erp-text,#1f2937);text-align:left;cursor:pointer}.customer-balance-area-lookup-option:hover,.customer-balance-area-lookup-option.active{background:var(--erp-soft,#f1f5f9)}.customer-balance-area-lookup-option strong{font-size:.86rem;line-height:1.2}.customer-balance-area-lookup-option span{font-size:.73rem;color:var(--erp-muted,#64748b)}.customer-balance-area-lookup-more{margin-top:4px;border-top:1px solid var(--erp-border,#d8dee8);border-radius:0 0 7px 7px}.customer-balance-area-lookup-more strong{color:var(--erp-primary,#15803d)}.customer-balance-area-lookup-empty{padding:14px;color:var(--erp-muted,#64748b);font-size:.82rem;text-align:center}.customer-balance-area-lookup-backdrop{position:fixed;z-index:2050;inset:0;display:flex;align-items:center;justify-content:center;padding:24px;background:rgba(15,23,42,.46)}.customer-balance-area-lookup-backdrop[hidden]{display:none!important}.customer-balance-area-lookup-modal{width:min(940px,96vw);max-height:min(760px,90vh);display:flex;flex-direction:column;overflow:hidden;border:1px solid var(--erp-border,#d8dee8);border-radius:14px;background:var(--erp-card-bg,var(--erp-surface,#fff));color:var(--erp-text,#1f2937);box-shadow:0 24px 70px rgba(15,23,42,.3)}.customer-balance-area-lookup-modal-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:15px 17px;border-bottom:1px solid var(--erp-border,#d8dee8);background:var(--erp-soft,#f8fafc)}.customer-balance-area-lookup-modal-head span{display:block;color:var(--erp-muted,#64748b);font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.05em}.customer-balance-area-lookup-modal-head h2{margin:3px 0 0;font-size:1.05rem}.customer-balance-area-lookup-close{width:36px;height:36px;border:1px solid var(--erp-border,#d8dee8);border-radius:8px;background:var(--erp-card-bg,var(--erp-surface,#fff));color:var(--erp-text,#1f2937);font-size:1.35rem;line-height:1;cursor:pointer}.customer-balance-area-lookup-modal-search{padding:12px 14px;border-bottom:1px solid var(--erp-border,#d8dee8)}.customer-balance-area-lookup-modal-search input{width:100%;min-height:40px;border:1px solid var(--erp-border,#d8dee8);border-radius:8px;padding:8px 10px;background:var(--erp-input-bg,var(--erp-surface,#fff));color:var(--erp-input-text,var(--erp-text,#1f2937));font:inherit}.customer-balance-area-lookup-modal-search input:focus{outline:2px solid rgba(21,128,61,.18);border-color:var(--erp-primary,#15803d)}.customer-balance-area-lookup-modal-results{min-height:220px;overflow:auto;flex:1}.customer-balance-area-lookup-modal-results table{width:100%;border-collapse:collapse}.customer-balance-area-lookup-modal-results th,.customer-balance-area-lookup-modal-results td{padding:9px 12px;border-bottom:1px solid var(--erp-border,#e5e7eb);text-align:left}.customer-balance-area-lookup-modal-results th{position:sticky;top:0;z-index:1;background:var(--erp-soft,#f1f5f9);font-size:.76rem;text-transform:uppercase;letter-spacing:.03em}.customer-balance-area-lookup-modal-results th:first-child,.customer-balance-area-lookup-modal-results td:first-child{width:18%}.customer-balance-area-lookup-modal-results th:nth-child(2),.customer-balance-area-lookup-modal-results td:nth-child(2){width:37%}.customer-balance-area-modal-pick{border:0;padding:0;background:transparent;color:var(--erp-primary,#15803d);font:inherit;font-weight:800;text-align:left;cursor:pointer}.customer-balance-area-modal-pick:hover{text-decoration:underline}.customer-balance-area-lookup-modal-footer{display:flex;align-items:center;justify-content:flex-end;gap:8px;padding:10px 14px;border-top:1px solid var(--erp-border,#d8dee8);background:var(--erp-soft,#f8fafc);color:var(--erp-muted,#64748b);font-size:.8rem}.customer-balance-area-all-accounts{margin-right:auto}.customer-balance-area-lookup-modal-footer .odoo-page-btn:disabled{opacity:.45;cursor:not-allowed}.customer-balance-area-lookup-empty.modal-empty{padding:34px 16px}
@media(max-width:720px){.customer-balance-area-lookup-backdrop{padding:10px}.customer-balance-area-lookup-modal{width:100%;max-height:92vh}.customer-balance-area-lookup-modal-results{overflow:auto}.customer-balance-area-lookup-modal-results table{min-width:720px}.customer-balance-area-lookup-modal-footer{flex-wrap:wrap}.customer-balance-area-all-accounts{margin-right:0;width:100%}}

/* Advanced Customer Statement of Account reconciliation */
.customer-statement-advanced-kpis{grid-template-columns:repeat(4,minmax(0,1fr))}
.customer-statement-invoice-table{min-width:1120px;table-layout:auto}
.customer-statement-invoice-table th:nth-child(n){width:auto}
.customer-statement-invoice-row td{vertical-align:middle}
.customer-statement-payment-detail td{padding:0 10px 9px;background:var(--erp-soft,#f8fafc)}
.customer-statement-payment-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:7px;padding:8px 0}
.customer-statement-payment-grid>div{display:grid;grid-template-columns:auto 1fr auto;gap:3px 8px;align-items:center;padding:8px 10px;border:1px solid var(--erp-border,#d8dee8);border-radius:9px;background:var(--erp-card-bg,var(--erp-surface,#fff))}
.customer-statement-payment-grid>div>span{font-size:.74rem;color:var(--erp-muted,#64748b)}
.customer-statement-payment-grid>div>strong{font-size:.82rem}.customer-statement-payment-grid>div>b{grid-column:3;grid-row:1/-1;font-variant-numeric:tabular-nums;white-space:nowrap}
.customer-statement-status{display:inline-flex;align-items:center;justify-content:center;min-width:86px;padding:4px 8px;border-radius:999px;font-size:.72rem;font-weight:900;border:1px solid var(--erp-border,#d8dee8);background:var(--erp-soft,#f8fafc)}
.customer-statement-status.paid{color:#15803d;border-color:#86c99d;background:#edf9f1}.customer-statement-status.partially-paid{color:#a15c00;border-color:#e8bb72;background:#fff8e8}.customer-statement-status.unpaid{color:#b42318;border-color:#e7a5a1;background:#fff1f0}
.customer-statement-two-column{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(320px,.75fr);gap:0 14px;margin:0 16px}.customer-statement-two-column>.customer-statement-card{margin-left:0;margin-right:0}
.customer-statement-credit-table{min-width:760px;table-layout:auto}.customer-statement-credit-table th:nth-child(n){width:auto}
.customer-statement-aging-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;padding:14px}.customer-statement-aging-grid>div{border:1px solid var(--erp-border,#d8dee8);border-radius:10px;padding:10px;background:var(--erp-soft,#f8fafc)}.customer-statement-aging-grid span{display:block;color:var(--erp-muted,#64748b);font-size:.7rem;font-weight:800;text-transform:uppercase}.customer-statement-aging-grid strong{display:block;margin-top:4px;text-align:right;font-size:.9rem;white-space:nowrap}
@media(max-width:1180px){.customer-statement-two-column{grid-template-columns:1fr}.customer-statement-aging-grid{grid-template-columns:repeat(5,minmax(120px,1fr));overflow-x:auto}.customer-statement-advanced-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:720px){.customer-statement-advanced-kpis{grid-template-columns:1fr}.customer-statement-two-column{margin-inline:10px}.customer-statement-payment-grid{grid-template-columns:1fr}.customer-statement-payment-grid>div{grid-template-columns:1fr auto}.customer-statement-payment-grid>div>b{grid-column:2;grid-row:1/-1}.customer-statement-aging-grid{grid-template-columns:repeat(2,minmax(0,1fr));overflow:visible}}
@media(max-width:440px){.customer-statement-aging-grid{grid-template-columns:1fr}}

/* POS Receipt settlement identity must remain readable inside the payment list. */
body .sales-payment-touch-modal.pos-payment-confirmation-view .sales-credit-settlement-inline,
body .pos-payment-touch-modal.pos-payment-confirmation-view .sales-credit-settlement-inline{display:flex;align-items:center;gap:6px;min-width:0;max-width:100%}
body .sales-payment-touch-modal.pos-payment-confirmation-view .sales-customer-credit-document,
body .pos-payment-touch-modal.pos-payment-confirmation-view .sales-customer-credit-document{width:auto!important;height:auto!important;min-width:0!important;max-width:100%!important;padding:2px 4px!important;border:0!important;background:transparent!important;box-shadow:none!important;color:var(--payment-text)!important;text-align:left!important;white-space:normal!important;overflow:visible!important;text-overflow:clip!important;line-height:1.2!important;font-weight:900!important}
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-line-row,
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-line-row{grid-template-columns:minmax(0,1fr) auto minmax(76px,auto)!important}
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-line-row>.pos-payment-change-note,
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-line-row>.pos-payment-change-note{white-space:normal;text-align:right;max-width:100px}

/* Receipt/Bill2Bill settlements: show the database reference clearly and keep amount on one line. */
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-line-row.pos-payment-line-receipt-settlement,
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-line-row.pos-payment-line-receipt-settlement{grid-template-columns:minmax(0,1fr) auto!important;align-items:center!important;gap:10px!important}
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-line-receipt-settlement>.sales-credit-settlement-inline,
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-line-receipt-settlement>.sales-credit-settlement-inline{min-width:0;overflow:visible}
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-line-receipt-settlement .sales-customer-credit-document,
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-line-receipt-settlement .sales-customer-credit-document{display:block!important;width:100%!important;max-width:none!important;white-space:normal!important;overflow:visible!important;text-overflow:clip!important;overflow-wrap:anywhere!important;line-height:1.22!important}
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-line-receipt-settlement>span:nth-child(2),
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-line-receipt-settlement>span:nth-child(2){min-width:max-content;white-space:nowrap!important;text-align:right!important;font-variant-numeric:tabular-nums}
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-line-receipt-settlement>span:nth-child(2) .pos-payment-change-note,
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-line-receipt-settlement>span:nth-child(2) .pos-payment-change-note{display:block;max-width:none!important;white-space:nowrap!important;text-align:right!important}


/* POS Sales payment-summary readability and weight-display refinement. */
.sales-entry-page [data-footer-amount-due] {
    font-size: 11px !important;
    font-weight: 900 !important;
    line-height: 1.2 !important;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}
.sales-entry-page .sales-paid-line > strong,
body .sales-payment-touch-modal.pos-payment-confirmation-view [data-payment-paid] {
    color: #0b5ed7 !important;
    font-weight: 900 !important;
    text-shadow: none !important;
}
body.theme-dark .sales-entry-page .sales-paid-line > strong,
body.theme-midnight .sales-entry-page .sales-paid-line > strong,
body.theme-carbon .sales-entry-page .sales-paid-line > strong,
body.theme-dark .sales-payment-touch-modal.pos-payment-confirmation-view [data-payment-paid],
body.theme-midnight .sales-payment-touch-modal.pos-payment-confirmation-view [data-payment-paid],
body.theme-carbon .sales-payment-touch-modal.pos-payment-confirmation-view [data-payment-paid] {
    color: #7dd3fc !important;
}
.sales-entry-page [data-total-products-weight] {
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}


/* POS Sales Received Payment: compact Receipt settlement rows and normal-weight payment text. */
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-line-row,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-line-row strong,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-line-row span,
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-line-row small,
body .sales-payment-touch-modal.pos-payment-confirmation-view .sales-customer-credit-document {
    font-weight: 400 !important;
}
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-line-receipt-settlement .sales-customer-credit-document {
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    overflow-wrap: normal !important;
    line-height: 1.2 !important;
}
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-line-receipt-settlement > span:nth-child(2) {
    font-weight: 400 !important;
    white-space: nowrap !important;
}

/* Global ERP black rollover tooltip. Native title text is surfaced through erp-tooltips.js so
   table overflow, themes and clipped cells do not hide the tooltip. */
.erp-global-tooltip {
    position: fixed;
    z-index: 25000;
    max-width: min(420px, calc(100vw - 20px));
    padding: 7px 10px;
    border: 1px solid rgba(255, 255, 255, .06);
    border-radius: 6px;
    background: linear-gradient(180deg, #111318 0%, #050608 100%);
    color: #ffffff;
    box-shadow: 0 8px 20px rgba(0, 0, 0, .36), 0 2px 5px rgba(0, 0, 0, .28);
    font-size: 11.5px;
    font-weight: 600;
    line-height: 1.25;
    white-space: normal;
    overflow-wrap: anywhere;
    pointer-events: none;
    opacity: 0;
    transform: translateY(2px);
    transition: opacity .08s ease, transform .08s ease;
}
.erp-global-tooltip::before {
    content: "";
    position: absolute;
    left: var(--erp-tooltip-arrow-left, 50%);
    width: 0;
    height: 0;
    transform: translateX(-50%);
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
}
.erp-global-tooltip.place-bottom::before {
    top: -6px;
    border-bottom: 6px solid #111318;
}
.erp-global-tooltip.place-top::before {
    bottom: -6px;
    border-top: 6px solid #050608;
}
.erp-global-tooltip.is-visible {
    opacity: 1;
    transform: translateY(0);
}
.erp-global-tooltip[hidden] { display: none !important; }

/* Shared exact-document reference affordance. The resolver opens only a unique database-backed
   destination; ambiguous/external references remain in place instead of guessing. */
.erp-document-reference-link,
.erp-document-reference-button,
.erp-auto-document-reference,
[data-erp-document-reference] {
    color: var(--theme-primary, var(--erp-primary, var(--brand, #0f766e)));
}
.erp-document-reference-link,
.erp-document-reference-button {
    font: inherit;
    font-weight: 700;
    text-decoration: none;
}
.erp-document-reference-button {
    border: 0;
    padding: 0;
    background: transparent;
    cursor: pointer;
    text-align: inherit;
}
.erp-auto-document-reference,
[data-erp-document-reference]:not(input):not(select):not(textarea) {
    cursor: pointer;
}
.erp-document-reference-link:hover,
.erp-document-reference-button:hover,
.erp-auto-document-reference:hover,
[data-erp-document-reference]:not(input):not(select):not(textarea):hover {
    text-decoration: underline;
}
.is-resolving-document { opacity: .62; cursor: progress !important; }

/* Reports / Account Reports / Voucher Reports */
.voucher-reports-page {
    --voucher-report-accent: var(--theme-primary, var(--erp-primary, var(--brand, #0f766e)));
    --voucher-report-card: var(--theme-card, var(--card, #fff));
    --voucher-report-text: var(--theme-text, var(--text, #0f172a));
    --voucher-report-muted: var(--theme-muted, var(--muted, #64748b));
    --voucher-report-border: color-mix(in srgb, var(--voucher-report-accent) 38%, var(--border, #d7dee8));
    color: var(--voucher-report-text);
}
.voucher-reports-toolbar {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 14px 18px;
    padding: 12px;
    border: 1px solid var(--voucher-report-border);
    border-radius: 14px;
    background: var(--voucher-report-card);
}
.voucher-reports-actions,
.voucher-reports-pager-tools,
.voucher-reports-options {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}
.voucher-reports-pager-tools { justify-content: flex-end; color: var(--voucher-report-muted); font-size: .82rem; }
.voucher-reports-pager-tools label { display: inline-flex; align-items: center; gap: 5px; }
.voucher-reports-pager-tools select { width: 62px; min-width: 62px; }
.voucher-reports-filter-grid {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: minmax(220px, 1.2fr) minmax(260px, 1.5fr) 150px 150px minmax(210px, 1fr);
    gap: 10px 12px;
    align-items: end;
}
.voucher-reports-filter-grid > label,
.voucher-reports-lookup-field {
    display: grid;
    gap: 5px;
    min-width: 0;
    color: var(--voucher-report-muted);
    font-size: .78rem;
    font-weight: 700;
}
.voucher-reports-filter-grid input,
.voucher-reports-filter-grid select,
.voucher-reports-pager-tools select,
.voucher-reports-modal-search input {
    width: 100%;
    min-width: 0;
    min-height: 34px;
    border: 1px solid var(--voucher-report-border);
    border-radius: 8px;
    background: var(--voucher-report-card);
    color: var(--voucher-report-text);
    padding: 6px 9px;
    font: inherit;
    font-weight: 500;
}
.voucher-reports-options { grid-column: 1 / -1; }
.voucher-reports-options label { display: inline-flex; align-items: center; gap: 6px; font-size: .82rem; font-weight: 700; }
.voucher-reports-lookup-wrap { position: relative; min-width: 0; }
.voucher-reports-suggestions {
    position: absolute;
    z-index: 1400;
    top: calc(100% + 5px);
    left: 0;
    right: 0;
    max-height: 310px;
    overflow: auto;
    padding: 5px;
    border: 1px solid var(--voucher-report-border);
    border-radius: 10px;
    background: var(--voucher-report-card);
    box-shadow: 0 16px 38px rgba(15, 23, 42, .18);
}
.voucher-reports-suggestions[hidden] { display: none !important; }
.voucher-reports-suggestion {
    width: 100%;
    display: grid;
    gap: 2px;
    padding: 8px 9px;
    border: 0;
    border-radius: 7px;
    background: transparent;
    color: var(--voucher-report-text);
    text-align: left;
    cursor: pointer;
    font: inherit;
}
.voucher-reports-suggestion strong { font-size: .82rem; font-weight: 700; }
.voucher-reports-suggestion span { color: var(--voucher-report-muted); font-size: .72rem; }
.voucher-reports-suggestion:hover,
.voucher-reports-suggestion.active { background: color-mix(in srgb, var(--voucher-report-accent) 12%, var(--voucher-report-card)); }
.voucher-reports-suggestion.more { border-top: 1px solid var(--voucher-report-border); margin-top: 4px; border-radius: 0 0 7px 7px; }
.voucher-reports-lookup-backdrop {
    position: fixed;
    inset: 0;
    z-index: 4300;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 18px;
    background: color-mix(in srgb, var(--text) 48%, transparent);
}
.voucher-reports-lookup-backdrop.open { display: flex; }
.voucher-reports-lookup-modal {
    width: min(880px, 96vw);
    max-height: min(760px, 92vh);
    display: grid;
    grid-template-rows: auto auto minmax(0, 1fr) auto;
    overflow: hidden;
    border: 1px solid var(--voucher-report-border);
    border-radius: 14px;
    background: var(--voucher-report-card);
    color: var(--voucher-report-text);
    box-shadow: 0 24px 70px rgba(15, 23, 42, .28);
}
.voucher-reports-lookup-modal > header,
.voucher-reports-lookup-modal > footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 12px 14px;
    border-bottom: 1px solid var(--voucher-report-border);
}
.voucher-reports-lookup-modal > footer { border-top: 1px solid var(--voucher-report-border); border-bottom: 0; justify-content: flex-end; }
.voucher-reports-lookup-modal > header span { color: var(--voucher-report-muted); font-size: .72rem; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; }
.voucher-reports-lookup-modal > header h2 { margin: 2px 0 0; font-size: 1.05rem; }
.voucher-reports-lookup-modal > header button { width: 34px; height: 34px; border: 1px solid var(--voucher-report-border); border-radius: 999px; background: var(--voucher-report-card); color: var(--voucher-report-text); font-size: 20px; cursor: pointer; }
.voucher-reports-modal-search { padding: 10px 14px; border-bottom: 1px solid var(--voucher-report-border); }
.voucher-reports-modal-results { min-height: 260px; overflow: auto; padding: 10px 14px; }
.voucher-reports-modal-results table { width: 100%; border-collapse: collapse; }
.voucher-reports-modal-results th,
.voucher-reports-modal-results td { padding: 7px 8px; border-bottom: 1px solid var(--voucher-report-border); text-align: left; }
.voucher-reports-modal-results th { color: var(--voucher-report-muted); font-size: .75rem; text-transform: uppercase; letter-spacing: .03em; }
.voucher-reports-modal-results td button,
.voucher-reports-type-list button { border: 0; background: transparent; color: var(--voucher-report-accent); font: inherit; font-weight: 700; cursor: pointer; text-align: left; }
.voucher-reports-type-list { display: grid; gap: 5px; }
.voucher-reports-type-list button { width: 100%; padding: 9px 10px; border-radius: 7px; color: var(--voucher-report-text); }
.voucher-reports-type-list button:hover { background: color-mix(in srgb, var(--voucher-report-accent) 12%, var(--voucher-report-card)); }
.voucher-reports-report-head {
    margin-top: 12px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
    padding: 12px 14px;
    border: 1px solid var(--voucher-report-border);
    border-radius: 12px;
    background: var(--voucher-report-card);
}
.voucher-reports-report-head h2 { margin: 0; font-size: 1.05rem; }
.voucher-reports-report-head p { margin: 4px 0 0; color: var(--voucher-report-muted); }
.voucher-reports-report-head > div:last-child { display: grid; gap: 3px; text-align: right; color: var(--voucher-report-muted); font-size: .78rem; }
.voucher-reports-summary-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; margin: 10px 0; }
.voucher-reports-summary-cards article { padding: 10px 12px; border: 1px solid var(--voucher-report-border); border-radius: 11px; background: var(--voucher-report-card); }
.voucher-reports-summary-cards span { display: block; color: var(--voucher-report-muted); font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; }
.voucher-reports-summary-cards strong { display: block; margin-top: 3px; font-size: 1rem; }
.voucher-reports-card { border: 1px solid var(--voucher-report-border); border-radius: 12px; background: var(--voucher-report-card); overflow: hidden; }
.voucher-reports-card-head { padding: 10px 12px; border-bottom: 1px solid var(--voucher-report-border); }
.voucher-reports-card-head h2 { margin: 0; font-size: 1rem; }
.voucher-reports-card-head p { margin: 3px 0 0; color: var(--voucher-report-muted); font-size: .78rem; }
.voucher-reports-table-wrap { overflow: auto; }
.voucher-reports-table { width: 100%; min-width: 930px; border-collapse: collapse; table-layout: fixed; }
.voucher-reports-table th,
.voucher-reports-table td { padding: 7px 8px; border-bottom: 1px solid var(--voucher-report-border); color: var(--voucher-report-text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.voucher-reports-table th { background: color-mix(in srgb, var(--voucher-report-accent) 9%, var(--voucher-report-card)); font-size: .76rem; text-transform: uppercase; letter-spacing: .03em; }
.voucher-reports-table th:nth-child(1), .voucher-reports-table td:nth-child(1) { width: 92px; }
.voucher-reports-table th:nth-child(2), .voucher-reports-table td:nth-child(2) { width: 108px; }
.voucher-reports-table th:nth-child(3), .voucher-reports-table td:nth-child(3) { width: 310px; }
.voucher-reports-table th:nth-child(4), .voucher-reports-table td:nth-child(4) { width: 170px; }
.voucher-reports-table th:nth-child(5), .voucher-reports-table td:nth-child(5) { width: 150px; }
.voucher-reports-table th:nth-child(6), .voucher-reports-table td:nth-child(6) { width: 150px; }
.voucher-reports-table th:nth-child(7), .voucher-reports-table td:nth-child(7) { width: 110px; }
.voucher-reports-table .num { text-align: right; font-variant-numeric: tabular-nums; }
.voucher-reports-table tfoot td { font-weight: 800; background: color-mix(in srgb, var(--voucher-report-accent) 7%, var(--voucher-report-card)); }
.voucher-reports-table tfoot td:first-child { text-align: right; }
.voucher-reports-particulars span { display: inline-block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: pre-line; vertical-align: bottom; }
.voucher-reports-message { margin: 10px 0; }

@media (max-width: 1180px) {
    .voucher-reports-filter-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
    .voucher-reports-toolbar { grid-template-columns: 1fr; }
    .voucher-reports-pager-tools { justify-content: flex-start; }
    .voucher-reports-filter-grid { grid-template-columns: 1fr; }
    .voucher-reports-report-head { flex-direction: column; }
    .voucher-reports-report-head > div:last-child { text-align: left; }
    .voucher-reports-summary-cards { grid-template-columns: 1fr; }
}

/* Customer business summary + POS linked-record customer editor (2026-08-16). */
.customer-summary-strip {
    width: min(100%, 1320px);
    margin: 12px auto 18px;
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 1px;
    border: 1px solid var(--border, #d8dee8);
    border-radius: 8px;
    overflow: hidden;
    background: var(--border, #d8dee8);
    box-shadow: 0 4px 14px rgba(15, 23, 42, .06);
}
.customer-summary-item {
    min-width: 0;
    min-height: 62px;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 16px;
    border: 0;
    background: var(--card, #fff);
    color: var(--text, #172033);
    text-decoration: none;
    text-align: left;
    font: inherit;
}
.customer-summary-item.is-link { cursor: pointer; }
.customer-summary-item.is-link:hover,
.customer-summary-item.is-link:focus-visible {
    background: color-mix(in srgb, var(--theme-primary, var(--erp-primary, #0f766e)) 8%, var(--card, #fff));
    outline: none;
}
.customer-summary-icon {
    flex: 0 0 30px;
    width: 30px;
    height: 30px;
    display: grid;
    place-items: center;
    border-radius: 7px;
    color: var(--theme-primary, var(--erp-primary, #0f766e));
    background: color-mix(in srgb, var(--theme-primary, var(--erp-primary, #0f766e)) 10%, transparent);
    font-size: 19px;
    font-weight: 800;
}
.customer-summary-copy { min-width: 0; display: grid; gap: 2px; }
.customer-summary-copy > span { font-size: 12px; color: var(--muted, #667085); }
.customer-summary-copy > strong { font-size: 14px; color: var(--text, #172033); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.customer-lookup-readonly-note { width: min(100%, 1320px); margin: 0 auto 12px; }

.customer-sales-invoice-modal-backdrop {
    position: fixed;
    inset: 0;
    z-index: 23500;
    display: none;
    place-items: center;
    padding: 18px;
    background: rgba(15, 23, 42, .46);
    backdrop-filter: blur(2px);
}
.customer-sales-invoice-modal-backdrop.open { display: grid; }
.customer-sales-invoice-modal {
    width: min(960px, 96vw);
    max-height: min(780px, 90vh);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid var(--border, #d8dee8);
    border-radius: 12px;
    background: var(--card, #fff);
    color: var(--text, #172033);
    box-shadow: 0 24px 70px rgba(15, 23, 42, .28);
}
.customer-sales-invoice-modal-header,
.customer-sales-invoice-modal-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 14px 18px;
    border-bottom: 1px solid var(--border, #d8dee8);
}
.customer-sales-invoice-modal-footer { border-top: 1px solid var(--border, #d8dee8); border-bottom: 0; }
.customer-sales-invoice-modal-header h3 { margin: 2px 0; font-size: 18px; }
.customer-sales-invoice-modal-header p { margin: 0; color: var(--muted, #667085); font-size: 12px; }
.customer-summary-modal-kicker { font-size: 11px; text-transform: uppercase; letter-spacing: .08em; color: var(--theme-primary, var(--erp-primary, #0f766e)); font-weight: 800; }
.customer-sales-invoice-toolbar { display: flex; align-items: end; justify-content: space-between; gap: 14px; padding: 12px 18px; }
.customer-sales-invoice-toolbar label { display: grid; gap: 4px; width: min(420px, 100%); font-size: 11px; color: var(--muted, #667085); }
.customer-sales-invoice-range { font-size: 12px; color: var(--muted, #667085); white-space: nowrap; }
.customer-sales-invoice-table-wrap { overflow: auto; min-height: 220px; max-height: 56vh; }
.customer-sales-invoice-table { margin: 0; width: 100%; }
.customer-sales-invoice-table th,
.customer-sales-invoice-table td { padding: 9px 12px; }
.customer-sales-invoice-table .numeric { text-align: right; font-variant-numeric: tabular-nums; }
.customer-sales-status { display: inline-flex; align-items: center; min-height: 22px; padding: 2px 8px; border-radius: 999px; background: color-mix(in srgb, var(--theme-primary, var(--erp-primary, #0f766e)) 10%, transparent); color: var(--text, #172033); font-size: 11px; font-weight: 700; }
.customer-sales-invoice-pager { display: inline-flex; align-items: center; gap: 10px; }
.customer-sales-document-row { cursor: pointer; }
.customer-sales-document-row td:first-child a { color: var(--theme-primary, var(--erp-primary, #0f766e)); text-decoration: none; }
.customer-sales-document-row td:first-child a:hover { text-decoration: underline; }
@media (max-width: 1180px) { .customer-summary-strip { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

.customer-lookup-document-shell {
    min-height: 100%;
    padding: 0;
    background: var(--bg, transparent);
    color: var(--text, inherit);
}
.customer-editor-lookup-mode { margin: 0; padding: 0 14px 20px; }
.customer-editor-lookup-mode .customer-editor-statusbar { position: sticky; top: 0; z-index: 35; background: var(--card, #fff); }

.sales-customer-lookup-field { position: relative; }
.sales-customer-lookup-field > .sales-input[data-customer] { padding-right: 38px !important; }
.sales-customer-linked-record {
    position: absolute;
    top: 50%;
    right: 2px;
    z-index: 3;
    width: 34px;
    height: 32px;
    transform: translateY(-50%);
    display: grid;
    place-items: center;
    border: 0;
    border-left: 1px solid color-mix(in srgb, var(--border, #d8dee8) 85%, transparent);
    border-radius: 0 5px 5px 0;
    background: color-mix(in srgb, var(--card, #fff) 92%, transparent);
    color: var(--theme-primary, var(--erp-primary, #0f766e));
    font-size: 18px;
    font-weight: 800;
    cursor: pointer;
}
.sales-customer-linked-record:hover:not(:disabled),
.sales-customer-linked-record:focus-visible:not(:disabled) {
    background: color-mix(in srgb, var(--theme-primary, var(--erp-primary, #0f766e)) 10%, var(--card, #fff));
    outline: 2px solid color-mix(in srgb, var(--theme-primary, var(--erp-primary, #0f766e)) 45%, transparent);
    outline-offset: -2px;
}
.sales-customer-linked-record:disabled { opacity: .35; cursor: default; }

.sales-customer-editor-backdrop {
    position: fixed;
    inset: 0;
    z-index: 22000;
    display: grid;
    place-items: center;
    padding: 16px;
    background: rgba(15, 23, 42, .58);
    backdrop-filter: blur(2px);
}
.sales-customer-editor-backdrop[hidden] { display: none !important; }
.sales-customer-editor-modal {
    width: min(1450px, 94vw);
    height: min(920px, 92vh);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid var(--border, #d8dee8);
    border-radius: 14px;
    background: var(--bg, #f7f9fc);
    color: var(--text, #172033);
    box-shadow: 0 30px 90px rgba(2, 6, 23, .38);
}
.sales-customer-editor-head {
    flex: 0 0 auto;
    min-height: 58px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 9px 15px;
    border-bottom: 1px solid var(--border, #d8dee8);
    background: var(--card, #fff);
}
.sales-customer-editor-head span { display: block; color: var(--muted, #667085); font-size: 10px; text-transform: uppercase; letter-spacing: .08em; font-weight: 800; }
.sales-customer-editor-head h2 { margin: 1px 0 0; font-size: 18px; }
.sales-customer-editor-status { flex: 0 0 auto; padding: 8px 14px; border-bottom: 1px solid var(--border, #d8dee8); font-size: 12px; font-weight: 700; }
.sales-customer-editor-status.is-error { background: #fff1f2; color: #b42318; }
.sales-customer-editor-status.is-success { background: #ecfdf3; color: #067647; }
.sales-customer-editor-body { flex: 1 1 auto; min-height: 0; overflow: auto; overscroll-behavior: contain; padding: 10px; }
.sales-customer-editor-loading,
.sales-customer-editor-error { min-height: 260px; display: flex; align-items: center; justify-content: center; gap: 10px; color: var(--muted, #667085); font-weight: 700; }
.sales-customer-editor-error { color: #b42318; }
.sales-customer-editor-spinner { width: 18px; height: 18px; border-radius: 50%; border: 2px solid var(--border, #d8dee8); border-top-color: var(--theme-primary, var(--erp-primary, #0f766e)); animation: salesCustomerEditorSpin .75s linear infinite; }
@keyframes salesCustomerEditorSpin { to { transform: rotate(360deg); } }
body.sales-customer-editor-open { overflow: hidden; }

@media (max-width: 760px) {
    .customer-summary-strip { grid-template-columns: 1fr; width: 100%; }
    .customer-summary-item { border-right: 0; border-bottom: 1px solid var(--border, #d8dee8); }
    .customer-summary-item:last-child { border-bottom: 0; }
    .customer-sales-invoice-modal-backdrop { padding: 6px; }
    .customer-sales-invoice-modal { width: 100%; max-height: 96vh; }
    .customer-sales-invoice-toolbar { align-items: stretch; flex-direction: column; }
    .sales-customer-editor-backdrop { padding: 4px; }
    .sales-customer-editor-modal { width: 100vw; height: 98vh; border-radius: 8px; }
    .sales-customer-editor-body { padding: 4px; }
    .customer-editor-lookup-mode { padding-inline: 4px; }
}

/* DayBreak LedgerReport - VB.NET LedgerDayBreakReport conversion */
.daybreak-page{display:flex;flex-direction:column;gap:14px}.daybreak-toolbar{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px 20px;align-items:start;padding:14px 16px;border:1px solid var(--theme-border,var(--border));border-radius:12px;background:var(--theme-surface,var(--card));box-shadow:0 5px 18px rgba(15,23,42,.05)}.daybreak-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.daybreak-pager{display:flex;align-items:center;justify-content:flex-end;gap:7px;white-space:nowrap}.daybreak-pager label{display:flex;align-items:center;gap:6px}.daybreak-pager select{min-width:72px}.daybreak-filter-grid{grid-column:1/-1;display:grid;grid-template-columns:minmax(280px,2fr) minmax(160px,1fr) minmax(160px,1fr);gap:12px}.daybreak-filter-grid label>span{display:block;font-size:12px;font-weight:700;margin:0 0 5px;color:var(--theme-muted,var(--muted))}.daybreak-filter-grid input,.daybreak-filter-grid select{width:100%;min-height:39px;border:1px solid var(--theme-border,var(--border));border-radius:8px;background:var(--theme-input-bg,var(--input-bg,var(--card)));color:var(--theme-text,var(--text));padding:8px 10px}.daybreak-lookup-wrap{position:relative}.daybreak-suggestions{position:absolute;top:calc(100% + 4px);left:0;right:0;z-index:5500;min-width:100%;max-width:min(620px,calc(100vw - 24px));max-height:340px;overflow:auto;border:1px solid var(--theme-border,var(--border));border-radius:10px;background:var(--theme-surface,var(--card));box-shadow:0 18px 40px rgba(15,23,42,.2);padding:5px}.daybreak-suggestions button{width:100%;display:grid;grid-template-columns:minmax(0,1fr);gap:2px;text-align:left;border:0;border-radius:7px;background:transparent;color:inherit;padding:8px 10px;cursor:pointer}.daybreak-suggestions button:hover,.daybreak-suggestions button:focus{background:color-mix(in srgb,var(--brand) 10%,var(--card))}.daybreak-suggestions button span{font-size:11px;color:var(--theme-muted,var(--muted));white-space:normal}.daybreak-suggestions .show-more{border-top:1px solid var(--theme-border,var(--border));border-radius:0 0 7px 7px;margin-top:3px;color:var(--brand)}.daybreak-report-head{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;padding:15px 17px;border:1px solid var(--theme-border,var(--border));border-radius:12px;background:var(--theme-surface,var(--card))}.daybreak-report-head h2{margin:0 0 4px;font-size:18px}.daybreak-report-head p{margin:0;color:var(--theme-muted,var(--muted))}.daybreak-report-head>div:last-child{display:grid;gap:4px;text-align:right;font-size:12px}.daybreak-summary-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.daybreak-summary-cards article{padding:12px 14px;border:1px solid var(--theme-border,var(--border));border-radius:10px;background:var(--theme-surface,var(--card))}.daybreak-summary-cards span{display:block;font-size:11px;color:var(--theme-muted,var(--muted));margin-bottom:4px}.daybreak-summary-cards strong{font-size:18px}.daybreak-card{border:1px solid var(--theme-border,var(--border));border-radius:12px;background:var(--theme-surface,var(--card));overflow:hidden}.daybreak-card-head{display:flex;justify-content:space-between;align-items:center;padding:13px 15px;border-bottom:1px solid var(--theme-border,var(--border))}.daybreak-card-head h2{margin:0;font-size:16px}.daybreak-card-head p{margin:3px 0 0;color:var(--theme-muted,var(--muted));font-size:12px}.daybreak-table-wrap{overflow-x:auto;overflow-y:visible}.daybreak-table{width:100%;border-collapse:collapse;min-width:780px}.daybreak-table th,.daybreak-table td{padding:9px 11px;border-bottom:1px solid var(--theme-border,var(--border));text-align:left;vertical-align:top}.daybreak-table th{font-size:11px;text-transform:uppercase;letter-spacing:.03em;background:color-mix(in srgb,var(--brand) 6%,var(--card));white-space:nowrap}.daybreak-table td.num,.daybreak-table th.num{text-align:right;white-space:nowrap}.daybreak-table td.closing{font-weight:700}.daybreak-table tfoot td{font-weight:700;background:color-mix(in srgb,var(--brand) 5%,var(--card))}.daybreak-empty{text-align:center!important;color:var(--theme-muted,var(--muted));padding:25px!important}.daybreak-message{display:flex;justify-content:space-between;gap:12px;align-items:center;border:1px solid var(--theme-border,var(--border));border-radius:9px;padding:10px 12px}.daybreak-message.success{background:var(--theme-success-bg,#ecfdf3);color:var(--theme-success-text,#027a48)}.daybreak-message.error{background:var(--theme-danger-bg,#fef3f2);color:var(--theme-danger-text,#b42318)}.daybreak-message.warning{background:var(--theme-warning-bg,#fffaeb);color:var(--theme-warning-text,#b54708)}.daybreak-lookup-backdrop{position:fixed;inset:0;z-index:5600;background:rgba(15,23,42,.46);display:grid;place-items:center;padding:18px}.daybreak-lookup-backdrop[hidden]{display:none}.daybreak-lookup-modal{width:min(900px,96vw);max-height:min(760px,92vh);display:grid;grid-template-rows:auto auto minmax(0,1fr) auto;background:var(--theme-surface,var(--card));color:var(--theme-text,var(--text));border:1px solid var(--theme-border,var(--border));border-radius:14px;box-shadow:0 24px 70px rgba(15,23,42,.35);overflow:hidden}.daybreak-lookup-modal>header{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:1px solid var(--theme-border,var(--border))}.daybreak-lookup-modal>header span{font-size:11px;color:var(--theme-muted,var(--muted));text-transform:uppercase}.daybreak-lookup-modal>header h2{margin:2px 0 0;font-size:18px}.daybreak-lookup-modal>header button{border:0;background:transparent;color:inherit;font-size:25px;cursor:pointer}.daybreak-modal-search{padding:12px 14px;border-bottom:1px solid var(--theme-border,var(--border))}.daybreak-modal-search input{width:100%;min-height:40px;border:1px solid var(--theme-border,var(--border));border-radius:8px;padding:8px 10px;background:var(--theme-input-bg,var(--card));color:inherit}.daybreak-modal-results{overflow:auto;padding:6px}.daybreak-modal-results button{width:100%;display:grid;grid-template-columns:minmax(0,1.5fr) minmax(100px,.6fr) minmax(120px,1fr);gap:10px;text-align:left;border:0;border-radius:8px;background:transparent;color:inherit;padding:10px;cursor:pointer}.daybreak-modal-results button:hover{background:color-mix(in srgb,var(--brand) 10%,var(--card))}.daybreak-modal-results button span{font-size:12px;color:var(--theme-muted,var(--muted))}.daybreak-modal-empty{padding:30px;text-align:center;color:var(--theme-muted,var(--muted))}.daybreak-lookup-modal>footer{display:flex;justify-content:flex-end;align-items:center;gap:8px;padding:10px 14px;border-top:1px solid var(--theme-border,var(--border))}.daybreak-modal-open{overflow:hidden}@media(max-width:900px){.daybreak-toolbar{grid-template-columns:1fr}.daybreak-pager{justify-content:flex-start}.daybreak-filter-grid{grid-template-columns:1fr 1fr}.daybreak-ledger-field{grid-column:1/-1}.daybreak-summary-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.daybreak-report-head{flex-direction:column}.daybreak-report-head>div:last-child{text-align:left}.daybreak-modal-results button{grid-template-columns:1fr}.daybreak-modal-results button span{white-space:normal}}@media(max-width:560px){.daybreak-filter-grid,.daybreak-summary-cards{grid-template-columns:1fr}.daybreak-ledger-field{grid-column:auto}.daybreak-actions{gap:6px}.daybreak-pager{flex-wrap:wrap}.daybreak-summary-cards strong{font-size:16px}}


/* Ledger Day Wise Balance report */
.ledger-daywise-filter-grid{grid-template-columns:minmax(280px,2fr) minmax(145px,.8fr) minmax(145px,.8fr) minmax(135px,.7fr) minmax(155px,.8fr)}
.ledger-daywise-scope{display:block;margin-top:4px;color:var(--theme-muted,var(--muted));font-size:10px}
.ledger-daywise-toggle{display:grid;grid-template-columns:auto 1fr;align-content:center;column-gap:8px;min-height:64px;padding:7px 10px;border:1px solid var(--theme-border,var(--border));border-radius:8px;background:color-mix(in srgb,var(--brand) 3%,var(--card))}
.ledger-daywise-toggle>span{grid-column:1/-1!important;margin-bottom:3px!important}.ledger-daywise-toggle input[type=checkbox]{width:18px!important;min-height:18px!important;margin:1px 0}.ledger-daywise-toggle small{color:var(--theme-muted,var(--muted));line-height:1.25}
.ledger-daywise-summary-cards{grid-template-columns:repeat(5,minmax(0,1fr))}.ledger-daywise-table{min-width:1020px}.ledger-daywise-table td:nth-child(2){min-width:250px}.ledger-daywise-table td:nth-child(3){min-width:110px}.ledger-daywise-table td:nth-child(4){min-width:135px}.ledger-daywise-opening td{font-weight:700;background:color-mix(in srgb,var(--brand) 7%,var(--card))}.ledger-daywise-document-link{color:var(--brand);font-weight:700;text-decoration:none}.ledger-daywise-document-link:hover{text-decoration:underline}
@media(max-width:1100px){.ledger-daywise-filter-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.ledger-daywise-filter-grid .daybreak-ledger-field{grid-column:1/-1}.ledger-daywise-summary-cards{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:560px){.ledger-daywise-filter-grid,.ledger-daywise-summary-cards{grid-template-columns:1fr}.ledger-daywise-filter-grid .daybreak-ledger-field{grid-column:auto}}


/* Website Promotion Popup Campaign - Step 6 */
.promotion-edit-page .promo-popup-master-switch{display:grid;grid-template-columns:auto auto 1fr;align-items:center;gap:12px;padding:14px 16px;border:1px solid color-mix(in srgb,var(--primary,#2563eb) 26%,var(--border,#d8e1ec));border-radius:14px;background:linear-gradient(135deg,color-mix(in srgb,var(--primary,#2563eb) 8%,var(--surface,#fff)),var(--surface,#fff));cursor:pointer}
.promotion-edit-page .promo-popup-master-switch>input{position:absolute;opacity:0;pointer-events:none}.promotion-edit-page .promo-popup-switch-visual{width:42px;height:24px;position:relative;border-radius:999px;background:color-mix(in srgb,var(--muted,#64748b) 35%,var(--surface,#fff));transition:.18s}.promotion-edit-page .promo-popup-switch-visual:after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 2px 7px #0002;transition:.18s}.promotion-edit-page .promo-popup-master-switch>input:checked+.promo-popup-switch-visual{background:var(--primary,#2563eb)}.promotion-edit-page .promo-popup-master-switch>input:checked+.promo-popup-switch-visual:after{transform:translateX(18px)}.promotion-edit-page .promo-popup-master-switch>span:last-child{display:grid;gap:3px}.promotion-edit-page .promo-popup-master-switch strong{font-size:.8rem}.promotion-edit-page .promo-popup-master-switch small{color:var(--muted,#64748b);font-size:.67rem;line-height:1.4}
.promotion-edit-page .promo-popup-workspace{display:grid;gap:15px;transition:opacity .18s}.promotion-edit-page .promo-popup-workspace.is-disabled{opacity:.48}.promotion-edit-page .promo-popup-guide{display:flex;align-items:center;gap:11px;padding:11px 13px;border:1px solid color-mix(in srgb,#059669 25%,var(--border,#d8e1ec));border-radius:12px;background:color-mix(in srgb,#059669 7%,var(--surface,#fff))}.promotion-edit-page .promo-popup-guide>span{width:34px;height:34px;display:grid;place-items:center;flex:0 0 auto;border-radius:10px;background:color-mix(in srgb,#059669 13%,var(--surface,#fff));color:#047857;font-size:1.05rem}.promotion-edit-page .promo-popup-guide>div{display:grid;gap:2px}.promotion-edit-page .promo-popup-guide strong{font-size:.76rem}.promotion-edit-page .promo-popup-guide small{color:var(--muted,#64748b);font-size:.65rem;line-height:1.4}
.promotion-edit-page .promo-input-suffix{display:grid;grid-template-columns:1fr auto;align-items:center;overflow:hidden;border:1px solid var(--border,#cbd5e1);border-radius:9px;background:var(--input-bg,var(--surface,#fff))}.promotion-edit-page .promo-input-suffix input{border:0!important;border-radius:0!important}.promotion-edit-page .promo-input-suffix b{padding:0 10px;color:var(--muted,#64748b);font-size:.66rem}.promotion-edit-page .promo-popup-custom-url>label{display:grid;gap:6px}.promotion-edit-page .promo-popup-custom-url>label>span{font-size:.72rem;font-weight:800}.promotion-edit-page .promo-popup-custom-url input{width:100%;min-height:40px;padding:8px 10px;border:1px solid var(--border,#cbd5e1);border-radius:9px;background:var(--input-bg,var(--surface,#fff));color:var(--text,#1f2937)}.promotion-edit-page .promo-popup-custom-url small{color:var(--muted,#64748b);font-size:.65rem}
.promotion-edit-page .promo-popup-schedule-grid{display:grid;grid-template-columns:minmax(280px,.7fr) minmax(0,1.3fr);gap:13px;align-items:end}.promotion-edit-page .promo-popup-inheritance{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.promotion-edit-page .promo-popup-inheritance>div{display:grid;gap:3px;padding:11px 12px;border:1px solid var(--border,#d8e1ec);border-radius:11px;background:color-mix(in srgb,var(--surface,#fff) 97%,var(--primary,#2563eb))}.promotion-edit-page .promo-popup-inheritance span{color:var(--muted,#64748b);font-size:.62rem;font-weight:850;text-transform:uppercase;letter-spacing:.05em}.promotion-edit-page .promo-popup-inheritance strong{font-size:.7rem}.promotion-edit-page .promo-popup-preview-row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 13px;border:1px dashed color-mix(in srgb,var(--primary,#2563eb) 34%,var(--border,#d8e1ec));border-radius:12px}.promotion-edit-page .promo-popup-preview-row>div{display:grid;gap:2px}.promotion-edit-page .promo-popup-preview-row strong{font-size:.75rem}.promotion-edit-page .promo-popup-preview-row span{color:var(--muted,#64748b);font-size:.65rem}
.promo-popup-preview-open{overflow:hidden}.promo-popup-preview-layer{position:fixed;inset:0;z-index:100500;display:grid;place-items:center;padding:24px}.promo-popup-preview-layer[hidden]{display:none!important}.promo-popup-preview-backdrop{position:absolute;inset:0;background:rgba(15,23,42,.64);backdrop-filter:blur(6px)}.promo-popup-preview-modal{position:relative;width:min(900px,94vw);max-height:min(82vh,720px);display:grid;grid-template-columns:minmax(0,1.12fr) minmax(320px,.88fr);overflow:hidden;border:1px solid rgba(255,255,255,.28);border-radius:24px;background:var(--surface,#fff);color:var(--text,#1f2937);box-shadow:0 30px 90px #0006}.promo-popup-preview-close{position:absolute;top:13px;right:13px;z-index:2;width:38px;height:38px;border:1px solid #ffffff55;border-radius:50%;background:#111827d9;color:#fff;font-size:1.35rem;cursor:pointer}.promo-popup-preview-media{min-height:360px;display:grid;place-items:center;background:color-mix(in srgb,var(--primary,#2563eb) 7%,#f8fafc);color:var(--muted,#64748b)}.promo-popup-preview-media img{width:100%;height:100%;max-height:600px;object-fit:contain}.promo-popup-preview-copy{display:grid;align-content:center;gap:13px;padding:42px 34px}.promo-popup-preview-ribbon{width:max-content;max-width:100%;padding:6px 10px;border-radius:999px;background:color-mix(in srgb,var(--primary,#2563eb) 10%,var(--surface,#fff));color:var(--primary,#2563eb);font-size:.69rem;font-weight:900;text-transform:uppercase}.promo-popup-preview-copy h3{margin:0;font-size:clamp(1.5rem,3vw,2.35rem);line-height:1.05}.promo-popup-preview-copy p{margin:0;color:var(--muted,#64748b);line-height:1.55}.promo-popup-preview-cta{width:max-content;min-height:42px;padding:9px 16px;border:0;border-radius:11px;background:var(--primary,#2563eb);color:#fff;font-weight:850}.promo-popup-preview-copy>small{color:var(--muted,#64748b)}
@media(max-width:900px){.promotion-edit-page .promo-popup-schedule-grid{grid-template-columns:1fr}.promotion-edit-page .promo-popup-inheritance{grid-template-columns:1fr}.promo-popup-preview-modal{grid-template-columns:1fr;max-height:90vh;overflow:auto}.promo-popup-preview-media{min-height:220px;max-height:40vh}.promo-popup-preview-copy{padding:25px 22px 28px}}
@media(max-width:640px){.promotion-edit-page .promo-popup-preview-row{align-items:stretch;flex-direction:column}.promotion-edit-page .promo-popup-preview-row .promo-btn{width:100%}.promo-popup-preview-layer{padding:10px}.promo-popup-preview-modal{width:100%;border-radius:18px}.promo-popup-preview-close{top:9px;right:9px}}

/* Weighing Machine Settings / WMSettings */
.wm-settings-page {
    max-width: none;
}

.wm-settings-actionbar {
    position: sticky;
    top: 0;
    z-index: 30;
    gap: 14px;
}

.wm-settings-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.wm-settings-form {
    margin-top: 12px;
}

.wm-settings-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 14px;
    align-items: start;
}

.wm-settings-card {
    min-width: 0;
    padding: 18px;
}

.wm-settings-card-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 16px;
    padding-bottom: 14px;
    margin-bottom: 14px;
    border-bottom: 1px solid var(--border);
}

.wm-settings-card-header h1,
.wm-settings-card-header h2 {
    margin: 3px 0 4px;
    color: var(--text);
    font-size: 20px;
    line-height: 1.2;
}

.wm-settings-card-header p {
    margin: 0;
    color: var(--muted);
    font-size: 12px;
}

.wm-settings-kicker {
    display: block;
    color: var(--brand);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .11em;
}

.wm-settings-status-pill {
    flex: 0 0 auto;
    border: 1px solid var(--border);
    background: var(--soft);
    color: var(--brand-dark);
    border-radius: 999px;
    padding: 6px 10px;
    font-size: 11px;
    font-weight: 800;
}

.wm-settings-fields {
    gap: 12px 16px;
}

.wm-settings-fields .form-field {
    min-width: 0;
}

.wm-settings-info {
    margin-top: 16px;
    padding: 11px 12px;
    border: 1px solid var(--border);
    background: var(--soft);
    border-radius: 8px;
    display: grid;
    gap: 3px;
    color: var(--text);
    font-size: 11px;
}

.wm-settings-info span {
    color: var(--muted);
    line-height: 1.45;
}

.wm-settings-fieldset {
    border: 0;
    padding: 0;
    margin: 0;
    min-width: 0;
}

.wm-settings-fieldset:disabled {
    opacity: .6;
}

.wm-setting-check {
    align-self: center;
    min-height: 38px;
    display: flex;
    align-items: center;
}

.wm-test-dialog {
    width: min(620px, calc(100vw - 28px));
    max-width: 620px;
    padding: 0;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: var(--card);
    color: var(--text);
    box-shadow: 0 22px 60px color-mix(in srgb, var(--text) 24%, transparent);
}

.wm-test-dialog::backdrop {
    background: color-mix(in srgb, var(--text) 48%, transparent);
}

.wm-test-shell {
    padding: 18px;
}

.wm-test-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--border);
}

.wm-test-header h2 {
    margin: 3px 0 0;
    font-size: 21px;
}

.wm-test-close {
    border: 1px solid var(--border);
    background: var(--card);
    color: var(--text);
    width: 34px;
    height: 34px;
    border-radius: 8px;
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
}

.wm-test-meta {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    margin-top: 12px;
    font-size: 11px;
    color: var(--muted);
}

.wm-test-state {
    font-weight: 800;
}

.wm-test-state[data-state="connected"] { color: var(--theme-success-text); }
.wm-test-state[data-state="error"] { color: var(--theme-danger-text); }
.wm-test-state[data-state="reading"] { color: var(--brand); }

.wm-test-reading-wrap {
    display: grid;
    gap: 7px;
    margin-top: 18px;
    text-align: center;
}

.wm-test-reading-wrap > label {
    color: var(--muted);
    font-size: 11px;
    font-weight: 700;
}

.wm-test-reading {
    width: 100%;
    min-height: 118px;
    padding: 10px;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: var(--card);
    color: var(--text);
    text-align: center;
    font-weight: 800;
    line-height: 1;
}

.wm-test-reading:focus {
    outline: 2px solid var(--brand);
    outline-offset: 1px;
}

.wm-test-stability {
    font-size: 11px;
    font-weight: 800;
    color: var(--muted);
}

.wm-test-stability[data-state="stable"] { color: var(--theme-success-text); }
.wm-test-stability[data-state="reading"] { color: var(--theme-danger-text); }

.wm-test-total {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    margin-top: 14px;
    padding: 10px 12px;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--soft);
}

.wm-test-total span {
    font-size: 11px;
    color: var(--muted);
}

.wm-test-total strong {
    font-size: 18px;
}

.wm-test-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 14px;
}

.wm-test-help {
    margin: 12px 0 0;
    color: var(--muted);
    font-size: 11px;
    line-height: 1.45;
}

@media (max-width: 980px) {
    .wm-settings-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    .wm-settings-card {
        padding: 13px;
    }

    .wm-settings-card-header,
    .wm-test-meta {
        flex-direction: column;
    }

    .wm-settings-fields.form-grid.two-column {
        grid-template-columns: 1fr;
    }

    .wm-test-actions .btn {
        flex: 1 1 100%;
    }
}

/* Advanced weighing machine / weighted POS */
.wm-settings-card-wide{grid-column:1/-1}.stock-weight-sale-box{display:grid;gap:7px;padding:10px;border:1px solid var(--border);border-radius:10px;background:var(--surface-soft)}.stock-weight-sale-box small{color:var(--muted)}
.pos-weighted-pill{position:absolute;left:8px;top:8px;border-radius:999px;padding:3px 7px;font-size:10px;font-weight:800;background:var(--theme-primary);color:var(--theme-on-primary,var(--card))}
.erp-weight-modal{position:fixed;inset:0;z-index:30050;display:grid;place-items:center;background:color-mix(in srgb,var(--text) 52%,transparent);padding:18px}.erp-weight-dialog{width:min(540px,96vw);background:var(--card);color:var(--text);border:1px solid var(--border);border-radius:16px;box-shadow:0 24px 70px color-mix(in srgb,var(--text) 28%,transparent);padding:18px;display:grid;gap:14px}.erp-weight-head{display:flex;justify-content:space-between;align-items:flex-start}.erp-weight-head small{font-weight:800;color:var(--muted)}.erp-weight-head h2{margin:2px 0 0}.erp-weight-head button{border:0;background:transparent;color:var(--text);font-size:28px;cursor:pointer}.erp-weight-price,.erp-weight-total{display:flex;justify-content:space-between;gap:12px}.erp-weight-reading{border:1px solid var(--border);border-radius:14px;padding:18px;text-align:center;background:var(--surface-soft)}.erp-weight-reading strong{display:block;font-size:clamp(36px,8vw,68px);line-height:1.1;font-variant-numeric:tabular-nums}.erp-weight-reading small{display:block;min-height:18px;color:var(--muted);word-break:break-all}.erp-weight-manual{display:flex;gap:8px;align-items:end}.erp-weight-manual label{flex:1}.erp-weight-manual input{width:100%;min-height:40px;border:1px solid var(--border);border-radius:8px;background:var(--input-bg);color:var(--text)}.erp-weight-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.customer-display-weighing-card{display:grid;gap:8px;border:2px solid var(--theme-primary);border-radius:18px;padding:20px;text-align:center;background:var(--card)}.customer-display-weighing-card>span{font-weight:900;color:var(--theme-primary);letter-spacing:.08em}.customer-display-weighing-card>strong{font-size:clamp(22px,3vw,38px)}.customer-display-weighing-value{font-size:clamp(42px,8vw,92px);font-weight:900;font-variant-numeric:tabular-nums}.customer-display-weighing-meta{display:flex;justify-content:space-between;gap:14px;font-size:clamp(18px,2.6vw,32px)}.customer-display-weighing-meta b{color:var(--theme-primary)}.customer-display-has-weighing #cdLines{opacity:.45}
@media(max-width:720px){.erp-weight-actions>*{flex:1 1 100%}.erp-weight-manual{align-items:stretch;flex-direction:column}}

/* Advanced WMSettings layout + weighted Customer Display visibility fix */
.wm-settings-page{
    width:100%;
    max-width:1600px;
    margin:0 auto;
}
.wm-settings-page .wm-settings-actionbar{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:16px!important;
    padding:11px 14px!important;
    border:1px solid var(--border)!important;
    border-radius:12px!important;
    background:var(--card)!important;
    box-shadow:0 4px 16px color-mix(in srgb,var(--text) 7%,transparent)!important;
}
.wm-settings-title-block{display:flex;align-items:center;gap:12px;min-width:0}.wm-settings-title-block>div{min-width:0}.wm-settings-title-block h1{margin:0;color:var(--text);font-size:18px;line-height:1.2}.wm-settings-title-block p{margin:3px 0 0;color:var(--muted);font-size:11px;line-height:1.35}.wm-settings-title-block>.wm-settings-kicker{flex:0 0 auto;padding:5px 8px;border:1px solid color-mix(in srgb,var(--brand) 25%,var(--border));border-radius:999px;background:color-mix(in srgb,var(--brand) 7%,var(--card));white-space:nowrap}
.wm-settings-page .wm-settings-actions{display:flex!important;align-items:center!important;justify-content:flex-end!important;gap:8px!important;flex:0 0 auto!important;flex-wrap:wrap!important}.wm-settings-page .wm-settings-actions .btn{display:inline-flex!important;width:auto!important;min-width:112px!important;min-height:36px!important;flex:0 0 auto!important;align-items:center!important;justify-content:center!important;padding:7px 13px!important;border-radius:8px!important;font-weight:700!important;white-space:nowrap!important}
.wm-settings-form{margin-top:12px}.wm-settings-overview{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin:0 0 12px}.wm-settings-overview>div{display:grid;gap:3px;min-width:0;padding:10px 12px;border:1px solid var(--border);border-radius:10px;background:var(--card)}.wm-settings-overview span{color:var(--muted);font-size:9px;font-weight:800;letter-spacing:.055em;text-transform:uppercase}.wm-settings-overview strong{overflow:hidden;color:var(--text);font-size:12px;text-overflow:ellipsis;white-space:nowrap}
.wm-settings-page .wm-settings-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.wm-settings-page .wm-settings-card{padding:16px;border:1px solid var(--border);border-radius:12px;background:var(--card);box-shadow:0 4px 15px color-mix(in srgb,var(--text) 5%,transparent)}.wm-settings-page .wm-settings-card-wide{grid-column:1/-1}.wm-settings-page .wm-settings-card-header{margin:0 0 13px;padding:0 0 11px;border-bottom:1px solid var(--border)}.wm-settings-page .wm-settings-card-header h2{font-size:17px}.wm-settings-page .wm-settings-card-header p{max-width:780px;line-height:1.4}
.wm-control-grid{display:grid;gap:10px 12px}.wm-control-grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}.wm-control{display:grid;align-content:start;gap:5px;min-width:0}.wm-control-wide{grid-column:1/-1}.wm-control label{color:var(--text);font-size:10px;font-weight:750;line-height:1.2}.wm-control small{color:var(--muted);font-size:9px;line-height:1.35}.wm-settings-page .wm-control .form-control,.wm-settings-page .wm-input-suffix .form-control{width:100%!important;max-width:none!important;min-width:0!important;min-height:38px!important;margin:0!important;padding:7px 9px!important;border:1px solid var(--border)!important;border-radius:8px!important;background:var(--input-bg,var(--card))!important;color:var(--text)!important;font-size:11px!important;line-height:1.25!important;box-shadow:none!important}.wm-settings-page .wm-control select.form-control{padding-right:28px!important}.wm-settings-page .wm-control .form-control:focus,.wm-settings-page .wm-input-suffix .form-control:focus{border-color:var(--brand)!important;outline:2px solid color-mix(in srgb,var(--brand) 16%,transparent)!important;outline-offset:1px!important}.wm-settings-page .wm-control .form-control[readonly]{background:var(--soft)!important;color:var(--muted)!important}
.wm-input-suffix{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:stretch}.wm-input-suffix .form-control{border-radius:8px 0 0 8px!important}.wm-input-suffix>span{display:grid;place-items:center;min-width:44px;padding:0 8px;border:1px solid var(--border);border-left:0;border-radius:0 8px 8px 0;background:var(--soft);color:var(--muted);font-size:10px;font-weight:800}
.wm-toggle-stack{display:grid;gap:8px}.wm-toggle-stack-compact{margin-bottom:10px}.wm-toggle-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-bottom:10px}.wm-toggle-card{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:start;gap:9px;min-width:0;padding:9px 10px;border:1px solid var(--border);border-radius:9px;background:var(--soft);cursor:pointer}.wm-toggle-card>input{width:17px;height:17px;margin:1px 0 0;accent-color:var(--brand)}.wm-toggle-card>span{display:grid;gap:2px;min-width:0}.wm-toggle-card strong{color:var(--text);font-size:10px;line-height:1.3}.wm-toggle-card small{color:var(--muted);font-size:9px;line-height:1.35}.wm-controls-after-toggles{margin-top:10px}
.wm-settings-subgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.wm-settings-panel{min-width:0;padding:12px;border:1px solid var(--border);border-radius:10px;background:var(--soft)}.wm-settings-panel>header{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin-bottom:10px;padding-bottom:8px;border-bottom:1px solid var(--border)}.wm-settings-panel>header span{color:var(--text);font-size:11px;font-weight:800}.wm-settings-panel>header small{color:var(--muted);font-size:9px}.wm-protocol-example{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:8px;margin-top:10px;padding:8px 9px;border:1px dashed var(--border);border-radius:8px;background:var(--card);font-size:9px}.wm-protocol-example span{color:var(--muted);font-weight:800;text-transform:uppercase}.wm-protocol-example code{overflow:hidden;color:var(--text);text-overflow:ellipsis;white-space:nowrap}.wm-protocol-example strong{color:var(--brand);white-space:nowrap}
.wm-settings-page .wm-settings-info{margin-top:11px;padding:9px 10px;border-radius:9px}.wm-settings-page .wm-settings-info strong{font-size:10px}.wm-settings-page .wm-settings-info span{font-size:9px}.wm-barcode-rule{display:grid;gap:2px;margin-top:10px;padding:9px 10px;border:1px solid var(--border);border-radius:8px;background:var(--soft)}.wm-barcode-rule strong{color:var(--text);font-size:10px}.wm-barcode-rule span{color:var(--muted);font-size:9px;line-height:1.35}.wm-settings-page .alert{margin:0 0 10px}
.customer-display-weighing-card[hidden]{display:none!important}.customer-display-page:not(.customer-display-has-weighing) #cdLines{opacity:1!important}
@media(max-width:1180px){.wm-settings-overview{grid-template-columns:repeat(3,minmax(0,1fr))}.wm-settings-page .wm-settings-grid{grid-template-columns:1fr}.wm-settings-page .wm-settings-card-wide{grid-column:auto}.wm-settings-subgrid{grid-template-columns:1fr}}
@media(max-width:760px){.wm-settings-page .wm-settings-actionbar{align-items:stretch!important;flex-direction:column!important}.wm-settings-title-block{align-items:flex-start}.wm-settings-page .wm-settings-actions{justify-content:flex-start!important}.wm-settings-overview{grid-template-columns:repeat(2,minmax(0,1fr))}.wm-control-grid-2,.wm-toggle-row{grid-template-columns:1fr}.wm-control-wide{grid-column:auto}}
@media(max-width:480px){.wm-settings-page .wm-settings-actions .btn{flex:1 1 100%!important;width:100%!important}.wm-settings-overview{grid-template-columns:1fr}.wm-settings-page .wm-settings-card{padding:12px}.wm-settings-title-block>.wm-settings-kicker{display:none}}

/* WMSettings thermal weight-label designer / scanner preview */
.wm-label-designer{display:grid;grid-template-columns:minmax(0,1fr) minmax(360px,.82fr);gap:14px;align-items:start}.wm-label-config{min-width:0}.wm-label-print-sample{flex:0 0 auto;white-space:nowrap}.wm-label-sample-controls{margin-top:10px}.wm-label-preview-panel{min-width:0;padding:12px;border:1px solid var(--border);border-radius:11px;background:var(--soft);display:grid;gap:10px}.wm-label-preview-head{display:flex;align-items:center;justify-content:space-between;gap:10px}.wm-label-preview-head>div{display:grid;gap:2px}.wm-label-preview-head span{color:var(--muted);font-size:9px;font-weight:800;letter-spacing:.08em}.wm-label-preview-head strong{color:var(--text);font-size:12px}.wm-label-scanner-badge{display:inline-flex;align-items:center;justify-content:center;min-height:25px;padding:4px 8px;border:1px solid color-mix(in srgb,var(--brand) 28%,var(--border));border-radius:999px;background:var(--card);color:var(--brand)!important;white-space:nowrap}.wm-label-preview-stage{min-height:300px;padding:18px;display:grid;place-items:center;border:1px dashed var(--border);border-radius:10px;background:var(--card);overflow:auto}.wm-label-preview-paper{width:min(100%,560px);aspect-ratio:58/40;overflow:hidden;border:1px solid color-mix(in srgb,var(--text) 24%,var(--border));border-radius:3px;background:#fff;box-shadow:0 8px 24px color-mix(in srgb,var(--text) 14%,transparent)}.wm-label-preview-canvas{width:100%;height:100%;background:#fff;color:#000}.wm-label-preview-canvas .erp-weight-label-sheet{width:100%;height:100%;overflow:hidden;padding:3.2% 3.4% 2.4%;display:flex;flex-direction:column;gap:2.1%;background:#fff;color:#000;font-family:Arial,Helvetica,sans-serif;line-height:1.08}.wm-label-preview-canvas .erp-weight-label-name{overflow:hidden;color:#000;font-size:clamp(12px,1.35vw,20px);font-weight:800;line-height:1.05;text-overflow:ellipsis;white-space:nowrap}.wm-label-preview-canvas .erp-weight-label-facts{display:flex;justify-content:space-between;gap:8px;color:#000}.wm-label-preview-canvas .erp-weight-label-facts span{display:grid;gap:1px}.wm-label-preview-canvas .erp-weight-label-facts span:last-child{text-align:right}.wm-label-preview-canvas .erp-weight-label-facts small{color:#000;font-size:clamp(7px,.68vw,10px);font-weight:700}.wm-label-preview-canvas .erp-weight-label-facts strong{color:#000;font-size:clamp(9px,.85vw,13px)}.wm-label-preview-canvas .erp-weight-label-total{display:flex;justify-content:space-between;align-items:baseline;padding-top:1.5%;border-top:1px solid #000;color:#000;font-size:clamp(9px,.85vw,13px)}.wm-label-preview-canvas .erp-weight-label-total strong{font-size:clamp(12px,1.15vw,17px)}.wm-label-preview-canvas .erp-weight-label-barcode{width:100%;min-height:38%;margin-top:auto;background:#fff}.wm-label-preview-canvas .erp-weight-label-barcode-svg{display:block;width:100%;height:100%;background:#fff}.wm-label-preview-canvas .erp-weight-label-digits{color:#000;text-align:center;font:700 clamp(9px,.85vw,13px)/1.05 'Courier New',monospace;letter-spacing:.12em;white-space:nowrap}.wm-label-preview-meta{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 9px;border:1px solid var(--border);border-radius:8px;background:var(--card)}.wm-label-preview-meta span{color:var(--muted);font-size:9px;font-weight:800;text-transform:uppercase}.wm-label-preview-meta strong{overflow-wrap:anywhere;color:var(--text);font:800 12px/1.2 'Courier New',monospace;letter-spacing:.08em;text-align:right}.wm-label-preview-message{margin:0;color:var(--muted);font-size:9px;line-height:1.4}.wm-label-preview-message[data-state="ready"]{color:var(--text)}.wm-label-preview-message[data-state="warning"]{color:var(--warning-text,var(--text))}.wm-label-preview-message[data-state="error"]{color:var(--danger,var(--text))}.wm-label-preview-empty{width:100%;height:100%;min-height:180px;padding:18px;display:grid;place-content:center;gap:6px;text-align:center;background:#fff;color:#000}.wm-label-preview-empty strong{font-size:14px}.wm-label-preview-empty span{max-width:360px;font-size:11px;line-height:1.4}
@media(max-width:1100px){.wm-label-designer{grid-template-columns:1fr}.wm-label-preview-panel{order:2}.wm-label-preview-stage{min-height:260px}}
@media(max-width:620px){.wm-label-preview-stage{min-height:220px;padding:10px}.wm-label-preview-head{align-items:flex-start;flex-direction:column}.wm-label-print-sample{width:100%!important}.wm-label-preview-meta{align-items:flex-start;flex-direction:column}.wm-label-preview-meta strong{text-align:left}}

/* WMSettings thermal label header layout fix */
.wm-settings-page .wm-settings-card-header > div{
    flex:1 1 auto!important;
    min-width:0!important;
}
.wm-settings-page .wm-settings-card-header .wm-label-print-sample{
    display:inline-flex!important;
    width:auto!important;
    min-width:160px!important;
    max-width:240px!important;
    flex:0 0 auto!important;
    align-items:center!important;
    justify-content:center!important;
    align-self:flex-start!important;
    margin:0!important;
    padding:8px 14px!important;
    white-space:nowrap!important;
}
.wm-settings-page .wm-settings-card-header .wm-settings-kicker,
.wm-settings-page .wm-settings-card-header h2,
.wm-settings-page .wm-settings-card-header p{
    word-break:normal!important;
    overflow-wrap:normal!important;
}
@media(max-width:640px){
    .wm-settings-page .wm-settings-card-header .wm-label-print-sample{
        width:100%!important;
        min-width:0!important;
        max-width:none!important;
        align-self:stretch!important;
    }
}

/* v2026.08.20 Weighing touch panel + WMSettings guided fields */
.wm-guided-control .wm-control-label-row{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:6px}.wm-guided-control .wm-control-label-row label{margin:0}.wm-field-badge{display:inline-flex;align-items:center;min-height:24px;padding:3px 9px;border-radius:999px;border:1px solid color-mix(in srgb,var(--theme-primary,var(--brand)) 24%,var(--border));background:color-mix(in srgb,var(--theme-primary,var(--brand)) 7%,var(--card));color:var(--theme-primary,var(--brand));font-size:.72rem;font-weight:800;white-space:nowrap}.wm-field-badge[data-state="required"]{border-color:color-mix(in srgb,var(--danger,#dc3545) 35%,var(--border));background:color-mix(in srgb,var(--danger,#dc3545) 7%,var(--card));color:var(--danger,#dc3545)}.wm-field-badge-default{color:var(--muted);background:var(--surface-soft,var(--soft));border-color:var(--border)}.wm-guided-control small{display:block;margin-top:6px;line-height:1.45;color:var(--muted)}.wm-guided-control small code{font:700 .78rem/1.2 ui-monospace,SFMono-Regular,Consolas,monospace;color:var(--text);background:color-mix(in srgb,var(--theme-primary,var(--brand)) 7%,var(--card));border:1px solid var(--border);border-radius:5px;padding:1px 5px}.wm-guided-control .text-danger{display:block;margin-top:5px;font-size:.8rem}

.erp-weight-modal{position:fixed;inset:0;z-index:30050;background:color-mix(in srgb,var(--text) 48%,transparent);padding:0;display:block;overflow:hidden}.erp-weight-dialog{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);width:min(540px,calc(100vw - 24px));max-height:calc(100vh - 20px);overflow:auto;background:var(--card);color:var(--text);border:1px solid var(--border);border-radius:18px;box-shadow:0 24px 70px color-mix(in srgb,var(--text) 30%,transparent);padding:0;transition:width .18s ease}.erp-weight-dialog.erp-weight-keypad-open{width:min(920px,calc(100vw - 24px))}.erp-weight-dialog.erp-weight-dragging{transition:none;user-select:none}.erp-weight-layout{display:grid;grid-template-columns:minmax(0,1fr);min-width:0}.erp-weight-dialog.erp-weight-keypad-open .erp-weight-layout{grid-template-columns:minmax(0,540px) minmax(300px,1fr)}.erp-weight-main{padding:18px;display:grid;gap:14px;min-width:0}.erp-weight-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;cursor:move;touch-action:none}.erp-weight-head>div{min-width:0}.erp-weight-head small{display:block;color:var(--theme-primary,var(--brand));font-weight:900;letter-spacing:.08em}.erp-weight-head h2{margin:3px 0 0;font-size:1.5rem;line-height:1.15;overflow-wrap:anywhere}.erp-weight-head button,.erp-weight-keypad-head button{width:42px!important;height:42px;min-width:42px;padding:0!important;margin:0!important;border-radius:50%;border:1px solid var(--border);background:var(--card);color:var(--text);font-size:28px;line-height:1;display:grid;place-items:center;cursor:pointer}.erp-weight-price{display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:10px;font-size:1rem}.erp-weight-price strong[data-w-price]{justify-self:start;font-size:1.05rem}.erp-weight-price strong[data-w-price-unit]{justify-self:end}.erp-weight-reading{border:1px solid color-mix(in srgb,var(--theme-primary,var(--brand)) 34%,var(--border));border-radius:15px;padding:14px 18px 12px;text-align:center;background:color-mix(in srgb,var(--theme-primary,var(--brand)) 3%,var(--card));min-height:146px;display:grid;align-content:center}.erp-weight-reading>[data-w-status]{display:block;color:var(--theme-primary,var(--brand));font-weight:700;margin-bottom:3px}.erp-weight-reading>[data-w-status][data-state="stable"]{color:var(--theme-success-text,#18864b)}.erp-weight-reading>[data-w-status][data-state="error"]{color:var(--danger,#dc3545)}.erp-weight-reading strong{display:block;font-size:clamp(48px,9vw,72px);line-height:1;font-variant-numeric:tabular-nums;letter-spacing:.01em}.erp-weight-reading small{display:block;min-height:18px;margin-top:7px;color:var(--theme-primary,var(--brand));font-size:.88rem;word-break:normal}.erp-weight-total{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:1rem}.erp-weight-total strong{font-size:1.1rem;color:var(--theme-success-text,#18864b)}.erp-weight-manual{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:end}.erp-weight-manual-field{min-width:0}.erp-weight-manual-field label{margin:0 0 6px;color:var(--theme-primary,var(--brand));font-size:.88rem;font-weight:800}.erp-weight-manual-input-wrap{position:relative}.erp-weight-manual input{width:100%;height:48px;padding:0 42px 0 13px;border:1px solid color-mix(in srgb,var(--theme-primary,var(--brand)) 38%,var(--border));border-radius:10px;background:var(--input-bg,var(--card));color:var(--text);font-size:1rem;font-weight:700}.erp-weight-input-clear{position:absolute;right:8px;top:50%;transform:translateY(-50%);width:28px!important;height:28px;padding:0!important;margin:0!important;border:0!important;border-radius:50%;background:color-mix(in srgb,var(--muted) 16%,transparent)!important;color:var(--muted)!important;font-size:18px!important;line-height:1;display:grid!important;place-items:center}.erp-weight-manual-buttons{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.erp-weight-touch-btn{width:auto!important;min-width:104px;height:48px;margin:0!important;padding:0 14px!important;border:1px solid var(--border)!important;border-radius:9px!important;background:var(--card)!important;color:var(--text)!important;font-weight:800!important;white-space:nowrap}.erp-weight-keypad-btn{border-color:color-mix(in srgb,var(--theme-primary,var(--brand)) 45%,var(--border))!important;color:var(--theme-primary,var(--brand))!important;background:color-mix(in srgb,var(--theme-primary,var(--brand)) 7%,var(--card))!important}.erp-weight-tare-btn{border-color:color-mix(in srgb,var(--theme-warning-text,#a05a00) 38%,var(--border))!important;color:var(--theme-warning-text,#a05a00)!important;background:color-mix(in srgb,var(--theme-warning-text,#a05a00) 6%,var(--card))!important}.erp-weight-manual-use-btn{border-color:color-mix(in srgb,var(--theme-success-text,#18864b) 38%,var(--border))!important;color:var(--theme-success-text,#18864b)!important;background:color-mix(in srgb,var(--theme-success-text,#18864b) 6%,var(--card))!important}.erp-weight-actions{display:flex;align-items:stretch;justify-content:flex-start;gap:10px;flex-wrap:wrap}.erp-weight-action-btn{width:auto!important;min-height:58px;margin:0!important;padding:10px 16px!important;border-radius:10px!important;border:1px solid var(--border)!important;font-weight:800!important;line-height:1.15;white-space:normal}.erp-weight-action-connect{min-width:164px;background:color-mix(in srgb,var(--muted) 7%,var(--card))!important;color:var(--text)!important}.erp-weight-action-print{min-width:190px;background:color-mix(in srgb,var(--theme-success-text,#18864b) 7%,var(--card))!important;color:var(--theme-success-text,#18864b)!important;border-color:color-mix(in srgb,var(--theme-success-text,#18864b) 30%,var(--border))!important}.erp-weight-action-use{min-width:142px;background:color-mix(in srgb,var(--theme-primary,var(--brand)) 8%,var(--card))!important;color:var(--theme-primary,var(--brand))!important;border-color:color-mix(in srgb,var(--theme-primary,var(--brand)) 32%,var(--border))!important}.erp-weight-action-btn:disabled,.erp-weight-touch-btn:disabled{opacity:.45;cursor:not-allowed;filter:saturate(.3)}.erp-weight-keypad{border-left:1px solid var(--border);background:color-mix(in srgb,var(--theme-primary,var(--brand)) 3%,var(--card));padding:16px;min-width:0}.erp-weight-keypad-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:12px}.erp-weight-keypad-head small{display:block;color:var(--theme-primary,var(--brand));font-size:.72rem;font-weight:900;letter-spacing:.08em}.erp-weight-keypad-head strong{display:block;margin-top:2px;font-size:1rem}.erp-weight-keypad-value{height:58px;border:1px solid color-mix(in srgb,var(--theme-primary,var(--brand)) 34%,var(--border));border-radius:10px;background:var(--card);display:flex;align-items:center;justify-content:flex-end;padding:0 14px;margin-bottom:12px;font-size:1.65rem;font-weight:800;font-variant-numeric:tabular-nums;overflow:hidden}.erp-weight-keypad-grid{display:grid;grid-template-columns:repeat(4,minmax(54px,1fr));gap:8px}.erp-weight-keypad-grid button{width:100%!important;height:58px;margin:0!important;padding:0!important;border:1px solid var(--border)!important;border-radius:10px!important;background:var(--card)!important;color:var(--text)!important;font-size:1.12rem!important;font-weight:800!important;touch-action:manipulation}.erp-weight-keypad-grid button:active{transform:translateY(1px);background:color-mix(in srgb,var(--theme-primary,var(--brand)) 9%,var(--card))!important}.erp-weight-keypad-grid .erp-weight-key-clear{grid-column:span 1;color:var(--danger,#dc3545)!important}.erp-weight-keypad-grid .erp-weight-key-use{grid-column:span 2;background:color-mix(in srgb,var(--theme-success-text,#18864b) 10%,var(--card))!important;color:var(--theme-success-text,#18864b)!important;border-color:color-mix(in srgb,var(--theme-success-text,#18864b) 30%,var(--border))!important}.erp-weight-keypad-help{display:block;margin-top:10px;color:var(--muted);line-height:1.4}

@media(max-width:880px){.erp-weight-dialog.erp-weight-keypad-open{width:min(700px,calc(100vw - 18px))}.erp-weight-dialog.erp-weight-keypad-open .erp-weight-layout{grid-template-columns:minmax(0,1fr)}.erp-weight-keypad{border-left:0;border-top:1px solid var(--border)}.erp-weight-manual{grid-template-columns:1fr}.erp-weight-manual-buttons{justify-content:flex-start}}
@media(max-width:620px){.erp-weight-dialog{width:calc(100vw - 12px);max-height:calc(100vh - 12px);border-radius:14px}.erp-weight-main{padding:14px;gap:12px}.erp-weight-reading{min-height:128px;padding:12px}.erp-weight-reading strong{font-size:clamp(44px,15vw,64px)}.erp-weight-manual-buttons,.erp-weight-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%}.erp-weight-touch-btn,.erp-weight-action-btn{width:100%!important;min-width:0!important}.erp-weight-action-print{grid-column:span 2}.erp-weight-keypad-grid button{height:54px}.erp-weight-head{cursor:default}}

/* v2026.08.20.2 - Weight label preview/thermal print auto-fit */
.wm-label-preview-canvas .erp-weight-label-sheet{min-height:0}
.wm-label-preview-canvas .erp-weight-label-name,
.wm-label-preview-canvas .erp-weight-label-facts,
.wm-label-preview-canvas .erp-weight-label-total,
.wm-label-preview-canvas .erp-weight-label-digits{flex:0 0 auto;min-height:0}
.wm-label-preview-canvas .erp-weight-label-facts:empty{display:none}
.wm-label-preview-canvas .erp-weight-label-barcode{flex:0 1 auto;min-height:0;overflow:hidden}
.wm-label-preview-canvas .erp-weight-label-compact{padding:2.2% 2.6% 1.5%;gap:1.0%}
.wm-label-preview-canvas .erp-weight-label-compact .erp-weight-label-name{font-size:clamp(9px,1.05vw,15px);line-height:1.02}
.wm-label-preview-canvas .erp-weight-label-compact .erp-weight-label-facts{gap:5px}
.wm-label-preview-canvas .erp-weight-label-compact .erp-weight-label-facts span{gap:0}
.wm-label-preview-canvas .erp-weight-label-compact .erp-weight-label-facts small{font-size:clamp(6px,.56vw,8px);line-height:1}
.wm-label-preview-canvas .erp-weight-label-compact .erp-weight-label-facts strong{font-size:clamp(7px,.68vw,10px);line-height:1}
.wm-label-preview-canvas .erp-weight-label-compact .erp-weight-label-total{padding-top:.7%;font-size:clamp(7px,.66vw,10px);line-height:1}
.wm-label-preview-canvas .erp-weight-label-compact .erp-weight-label-total strong{font-size:clamp(9px,.88vw,13px);line-height:1}
.wm-label-preview-canvas .erp-weight-label-compact .erp-weight-label-barcode{height:auto;min-height:28%;max-height:32%;margin-top:auto}
.wm-label-preview-canvas .erp-weight-label-compact .erp-weight-label-digits{font-size:clamp(7px,.64vw,9px);line-height:1;letter-spacing:.09em}
.wm-label-preview-canvas .erp-weight-label-micro{padding:1.6% 2.1% 1.1%;gap:.6%}
.wm-label-preview-canvas .erp-weight-label-micro .erp-weight-label-name{font-size:clamp(7px,.84vw,11px);line-height:1}
.wm-label-preview-canvas .erp-weight-label-micro .erp-weight-label-facts{gap:4px}
.wm-label-preview-canvas .erp-weight-label-micro .erp-weight-label-facts span{gap:0}
.wm-label-preview-canvas .erp-weight-label-micro .erp-weight-label-facts small{font-size:clamp(5px,.46vw,7px);line-height:1}
.wm-label-preview-canvas .erp-weight-label-micro .erp-weight-label-facts strong{font-size:clamp(6px,.55vw,8px);line-height:1}
.wm-label-preview-canvas .erp-weight-label-micro .erp-weight-label-total{padding-top:.4%;font-size:clamp(6px,.52vw,8px);line-height:1}
.wm-label-preview-canvas .erp-weight-label-micro .erp-weight-label-total strong{font-size:clamp(7px,.68vw,10px);line-height:1}
.wm-label-preview-canvas .erp-weight-label-micro .erp-weight-label-barcode{height:auto;min-height:24%;max-height:28%;margin-top:auto}
.wm-label-preview-canvas .erp-weight-label-micro .erp-weight-label-digits{font-size:clamp(6px,.52vw,8px);line-height:1;letter-spacing:.06em}
.wm-label-preview-canvas .erp-weight-label-standard .erp-weight-label-barcode{height:auto;min-height:31%;max-height:35%;margin-top:auto}
.wm-label-preview-canvas .erp-weight-label-large .erp-weight-label-barcode{height:auto;min-height:34%;max-height:39%;margin-top:auto}
.wm-label-preview-canvas .erp-weight-label-narrow .erp-weight-label-name{font-size:clamp(8px,.95vw,13px)}
.wm-label-preview-canvas .erp-weight-label-narrow .erp-weight-label-digits{letter-spacing:.055em}

/* v2026.08.20.3 - Weighing manual-entry layout + POS grid integration UX */
.erp-weight-manual-block{display:grid;gap:9px;min-width:0}
.erp-weight-manual-label{display:block;margin:0;color:var(--theme-primary,var(--brand));font-size:.9rem;font-weight:800;line-height:1.2;white-space:nowrap;word-break:normal;overflow-wrap:normal}
.erp-weight-manual-primary{display:grid;grid-template-columns:minmax(210px,1fr) auto auto;gap:8px;align-items:center;min-width:0}
.erp-weight-manual-primary[data-can-manual="false"],.erp-weight-manual-block[data-can-manual="false"] .erp-weight-manual-primary{grid-template-columns:auto;justify-content:start}
.erp-weight-manual-input-wrap{position:relative;width:100%;min-width:0}
.erp-weight-manual-input-wrap input{display:block;width:100%;min-width:0;height:54px;padding:0 46px 0 14px;border:1px solid color-mix(in srgb,var(--theme-primary,var(--brand)) 38%,var(--border));border-radius:10px;background:var(--input-bg,var(--card));color:var(--text);font-size:1.08rem;font-weight:700;font-variant-numeric:tabular-nums;box-sizing:border-box}
.erp-weight-manual-input-wrap input::placeholder{font-weight:500;color:var(--muted);opacity:.9}
.erp-weight-manual-input-wrap .erp-weight-input-clear{right:9px;width:30px!important;height:30px!important}
.erp-weight-manual-primary .erp-weight-action-use{width:auto!important;min-width:126px!important;height:54px!important;min-height:54px!important;padding:0 16px!important;white-space:nowrap!important}
.erp-weight-manual-primary .erp-weight-keypad-btn{width:auto!important;min-width:112px!important;height:54px!important;min-height:54px!important;padding:0 15px!important;white-space:nowrap!important}
.erp-weight-manual-secondary{display:flex;align-items:center;gap:10px;flex-wrap:wrap;min-width:0}
.erp-weight-manual-secondary .erp-weight-touch-btn{height:54px!important;min-height:54px!important;width:auto!important;padding:0 16px!important;white-space:nowrap!important}
.erp-weight-manual-secondary .erp-weight-manual-use-btn{min-width:142px!important}
.erp-weight-manual-secondary .erp-weight-tare-btn{min-width:96px!important}
.erp-weight-manual-workflow{display:flex;align-items:stretch;justify-content:flex-start;gap:10px;flex-wrap:wrap;min-width:0}
.erp-weight-manual-workflow .erp-weight-action-btn{width:auto!important;height:56px!important;min-height:56px!important;padding:0 17px!important;white-space:nowrap!important}
.erp-weight-manual-workflow .erp-weight-action-print{min-width:210px!important}
.erp-weight-manual-workflow .erp-weight-action-connect{min-width:170px!important}
@media(max-width:480px){
    .erp-weight-manual-primary{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
    .erp-weight-manual-primary .erp-weight-manual-input-wrap{grid-column:1/-1}
    .erp-weight-manual-primary .erp-weight-action-use,.erp-weight-manual-primary .erp-weight-keypad-btn{width:100%!important;min-width:0!important}
    .erp-weight-manual-secondary{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%;gap:9px}
    .erp-weight-manual-secondary .erp-weight-touch-btn{width:100%!important;min-width:0!important}
    .erp-weight-manual-workflow{display:grid;grid-template-columns:1fr;width:100%;gap:9px}
    .erp-weight-manual-workflow .erp-weight-action-btn{width:100%!important;min-width:0!important}
}

/* v2026.08.20.4 - Pre-Pack Labels / Packing Worker workspace */
.prepack-page,.packing-workers-page{padding:18px;max-width:1480px;margin:0 auto;box-sizing:border-box}.packing-worker-body{margin:0;min-height:100vh;background:var(--page-bg,#f7f8fb);color:var(--text-color,#1f2937)}.packing-worker-topbar{min-height:72px;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:10px 22px;background:var(--card-bg,#fff);border-bottom:1px solid var(--border-color,#d9dee8);position:sticky;top:0;z-index:40}.packing-worker-brand,.packing-worker-account{display:flex;align-items:center;gap:12px}.packing-worker-brand-mark{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:var(--primary-color,#2563eb);color:#fff;font-weight:800}.packing-worker-brand small,.prepack-kicker,.prepack-section-head small,.prepack-status-card small,.prepack-selected-product small,.prepack-pack-summary small,.prepack-lookup-head small{display:block;font-size:.72rem;letter-spacing:.08em;font-weight:800;color:var(--primary-color,#2563eb)}.packing-worker-brand strong{display:block;font-size:1.05rem}.packing-worker-account span{font-weight:700}.packing-worker-account form{margin:0}.packing-worker-logout{min-height:42px;padding:0 16px;border:1px solid var(--border-color,#d9dee8);border-radius:10px;background:var(--card-bg,#fff);color:inherit;font-weight:700;cursor:pointer}.packing-worker-main{min-height:calc(100vh - 72px)}.prepack-hero{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;padding:22px;border:1px solid var(--border-color,#d9dee8);border-radius:18px;background:var(--card-bg,#fff);box-shadow:var(--card-shadow,0 4px 18px rgba(15,23,42,.05))}.prepack-hero h1{margin:3px 0 8px;font-size:clamp(1.55rem,2.4vw,2.15rem)}.prepack-hero p{margin:0;max-width:880px;line-height:1.55;color:var(--muted-text,#667085)}.prepack-hero-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}.prepack-status-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:14px 0}.prepack-status-card{padding:15px 16px;border:1px solid var(--border-color,#d9dee8);border-radius:14px;background:var(--card-bg,#fff)}.prepack-status-card strong{display:block;margin:3px 0;font-size:1.08rem}.prepack-status-card span{font-size:.82rem;color:var(--muted-text,#667085)}.prepack-status-card.is-ready{border-color:color-mix(in srgb,var(--success-color,#16a34a) 38%,var(--border-color,#d9dee8))}.prepack-status-card.is-warning{border-color:color-mix(in srgb,var(--warning-color,#d97706) 45%,var(--border-color,#d9dee8))}.prepack-config-warning{display:grid;gap:4px;margin:0 0 14px;padding:13px 15px;border-radius:12px;border:1px solid color-mix(in srgb,var(--warning-color,#d97706) 40%,var(--border-color,#d9dee8));background:color-mix(in srgb,var(--warning-color,#d97706) 8%,var(--card-bg,#fff))}.prepack-workspace{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(360px,.9fr);gap:14px}.prepack-product-panel,.prepack-action-panel,.packing-worker-assign-card,.packing-worker-list-card{border:1px solid var(--border-color,#d9dee8);border-radius:18px;background:var(--card-bg,#fff);padding:18px}.prepack-section-head{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:16px}.prepack-section-head h2{margin:3px 0 0;font-size:1.2rem}.prepack-empty-product{min-height:240px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:7px;border:1px dashed var(--border-color,#d9dee8);border-radius:14px;padding:24px;color:var(--muted-text,#667085)}.prepack-empty-product strong{font-size:1.12rem;color:var(--text-color,#1f2937)}.prepack-empty-icon{font-size:2rem}.prepack-product-title-row{display:flex;justify-content:space-between;gap:15px;align-items:flex-start;padding-bottom:15px;border-bottom:1px solid var(--border-color,#d9dee8)}.prepack-product-title-row h3{font-size:1.45rem;margin:2px 0 4px}.prepack-product-title-row span{color:var(--muted-text,#667085)}.prepack-product-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;padding-top:14px}.prepack-product-facts>div{padding:13px;border-radius:12px;background:var(--soft-bg,#f7f9fc);border:1px solid var(--border-color,#d9dee8)}.prepack-product-facts strong{display:block;font-size:1.18rem;margin:3px 0}.prepack-product-facts>div>span{font-size:.8rem;color:var(--muted-text,#667085)}.prepack-readonly-badge{display:inline-block;padding:2px 7px;border-radius:999px;background:color-mix(in srgb,var(--primary-color,#2563eb) 10%,transparent);color:var(--primary-color,#2563eb)!important;font-weight:700}.prepack-pack-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:14px}.prepack-pack-summary>div{padding:14px;border:1px solid var(--border-color,#d9dee8);border-radius:12px;background:var(--soft-bg,#f7f9fc)}.prepack-pack-summary strong{display:block;margin-top:4px;font-size:1.15rem}.prepack-primary-actions{display:grid;grid-template-columns:1fr 1fr;gap:12px}.prepack-big-action{min-height:88px;border-radius:14px;border:1px solid var(--border-color,#d9dee8);padding:14px 16px;text-align:left;cursor:pointer;background:var(--card-bg,#fff);color:inherit}.prepack-big-action span,.prepack-big-action small{display:block}.prepack-big-action span{font-size:1.04rem;font-weight:800}.prepack-big-action small{margin-top:4px;color:var(--muted-text,#667085)}.prepack-big-action:disabled{opacity:.45;cursor:not-allowed}.prepack-weigh-action:not(:disabled){border-color:color-mix(in srgb,var(--primary-color,#2563eb) 55%,var(--border-color,#d9dee8));background:color-mix(in srgb,var(--primary-color,#2563eb) 7%,var(--card-bg,#fff))}.prepack-print-action:not(:disabled){border-color:color-mix(in srgb,var(--success-color,#16a34a) 55%,var(--border-color,#d9dee8));background:color-mix(in srgb,var(--success-color,#16a34a) 7%,var(--card-bg,#fff))}.prepack-help{font-size:.84rem;line-height:1.45;color:var(--muted-text,#667085);margin:14px 0 0}.prepack-message{margin-top:12px;padding:11px 13px;border-radius:10px;background:var(--soft-bg,#f7f9fc);border:1px solid var(--border-color,#d9dee8);font-weight:650}.prepack-message[data-type="success"]{border-color:color-mix(in srgb,var(--success-color,#16a34a) 50%,var(--border-color,#d9dee8));color:var(--success-color,#15803d)}.prepack-message[data-type="error"]{border-color:color-mix(in srgb,var(--danger-color,#dc2626) 45%,var(--border-color,#d9dee8));color:var(--danger-color,#b91c1c)}.prepack-product-lookup{position:fixed;inset:0;z-index:5000;display:grid;place-items:center;padding:18px;background:rgba(15,23,42,.46)}.prepack-product-lookup[hidden]{display:none!important}.prepack-product-lookup-card{width:min(880px,96vw);max-height:min(760px,90vh);overflow:hidden;display:flex;flex-direction:column;border-radius:18px;background:var(--card-bg,#fff);border:1px solid var(--border-color,#d9dee8);box-shadow:0 24px 80px rgba(15,23,42,.28)}.prepack-lookup-head{display:flex;justify-content:space-between;align-items:center;padding:16px 18px;border-bottom:1px solid var(--border-color,#d9dee8)}.prepack-lookup-head h2{margin:2px 0 0}.prepack-lookup-close{width:44px;height:44px;border-radius:50%;border:1px solid var(--border-color,#d9dee8);background:var(--card-bg,#fff);font-size:1.45rem;cursor:pointer}.prepack-lookup-search{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;padding:14px 18px}.prepack-lookup-search input{min-height:48px;width:100%;border:1px solid var(--border-color,#d9dee8);border-radius:10px;padding:0 13px;background:var(--input-bg,var(--card-bg,#fff));color:inherit;font:inherit}.prepack-product-results{overflow:auto;padding:0 18px 16px;display:grid;gap:8px}.prepack-result-card{width:100%;display:flex;align-items:center;justify-content:space-between;gap:16px;text-align:left;padding:13px 14px;border:1px solid var(--border-color,#d9dee8);border-radius:12px;background:var(--card-bg,#fff);color:inherit;cursor:pointer}.prepack-result-card:hover,.prepack-result-card:focus{border-color:var(--primary-color,#2563eb);outline:none}.prepack-result-card strong,.prepack-result-card span,.prepack-result-card small{display:block}.prepack-result-card span,.prepack-result-card small{color:var(--muted-text,#667085);margin-top:3px}.prepack-result-price{text-align:right}.prepack-lookup-note,.prepack-loading{padding:10px 18px 16px;color:var(--muted-text,#667085);font-size:.84rem}.prepack-loading.is-error{color:var(--danger-color,#b91c1c)}.packing-worker-admin-grid{display:grid;grid-template-columns:minmax(320px,.72fr) minmax(0,1.28fr);gap:14px;margin-top:14px}.packing-worker-assign-card label{display:block;font-weight:750;margin:8px 0}.packing-user-picker{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px}.packing-user-selected{min-height:60px;border:1px solid var(--border-color,#d9dee8);border-radius:12px;padding:9px 12px;background:var(--soft-bg,#f7f9fc)}.packing-user-selected strong,.packing-user-selected span{display:block}.packing-user-selected span{font-size:.82rem;color:var(--muted-text,#667085);margin-top:3px}.packing-worker-policy{display:grid;gap:4px;margin:14px 0;padding:12px;border-radius:12px;background:color-mix(in srgb,var(--primary-color,#2563eb) 7%,var(--card-bg,#fff));border:1px solid color-mix(in srgb,var(--primary-color,#2563eb) 25%,var(--border-color,#d9dee8))}.packing-worker-policy span{font-size:.84rem;color:var(--muted-text,#667085)}.packing-worker-save{min-height:48px}.packing-worker-count{display:grid;place-items:center;min-width:34px;height:34px;border-radius:999px;background:var(--soft-bg,#f7f9fc);font-weight:800}.packing-worker-list{display:grid;gap:8px}.packing-worker-row{display:grid;grid-template-columns:44px minmax(0,1fr) auto auto;align-items:center;gap:12px;padding:11px;border:1px solid var(--border-color,#d9dee8);border-radius:12px}.packing-worker-row.is-inactive{opacity:.68}.packing-worker-avatar{width:42px;height:42px;display:grid;place-items:center;border-radius:50%;background:color-mix(in srgb,var(--primary-color,#2563eb) 12%,var(--card-bg,#fff));font-weight:850;color:var(--primary-color,#2563eb)}.packing-worker-info strong,.packing-worker-info span,.packing-worker-info small{display:block}.packing-worker-info span,.packing-worker-info small{color:var(--muted-text,#667085);font-size:.8rem;margin-top:2px}.packing-worker-state{font-size:.78rem;font-weight:800;padding:5px 9px;border-radius:999px;background:var(--soft-bg,#f7f9fc)}.packing-worker-row.is-active .packing-worker-state{color:var(--success-color,#15803d);background:color-mix(in srgb,var(--success-color,#16a34a) 10%,var(--card-bg,#fff))}.packing-worker-empty{padding:26px;text-align:center;color:var(--muted-text,#667085)}
@media (max-width:980px){.prepack-status-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.prepack-workspace,.packing-worker-admin-grid{grid-template-columns:1fr}.prepack-hero{flex-direction:column}.prepack-hero-actions{justify-content:flex-start}.prepack-product-facts{grid-template-columns:1fr 1fr 1fr}}
@media (max-width:680px){.prepack-page,.packing-workers-page{padding:10px}.packing-worker-topbar{padding:9px 12px}.packing-worker-account span{display:none}.prepack-status-grid,.prepack-product-facts,.prepack-pack-summary,.prepack-primary-actions{grid-template-columns:1fr}.prepack-result-card{align-items:flex-start}.prepack-result-price{text-align:left}.packing-worker-row{grid-template-columns:42px minmax(0,1fr);}.packing-worker-state,.packing-worker-row form{grid-column:2}.prepack-lookup-search,.packing-user-picker{grid-template-columns:1fr}.prepack-select-product{min-height:48px}}

/* v2026.08.20.7 Pre-Pack compact product selection + recent product kanban */
.prepack-page .prepack-section-head{flex-wrap:nowrap;min-width:0}
.prepack-page .prepack-section-head>div{min-width:0;flex:1 1 auto}
.prepack-page .prepack-section-head h2,.prepack-page .prepack-section-head small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.prepack-page .prepack-section-head .btn,.prepack-page .prepack-hero-actions .btn{width:auto!important;max-width:none!important;flex:0 0 auto;white-space:nowrap;padding-left:18px;padding-right:18px}
.prepack-page .prepack-select-product{min-width:150px!important}
.prepack-page .prepack-change-product{min-width:92px!important}
.prepack-empty-product[hidden],.prepack-selected-product[hidden]{display:none!important}
.prepack-product-title-row{display:grid;grid-template-columns:86px minmax(0,1fr) auto;align-items:center;gap:14px}
.prepack-selected-image{width:86px;height:86px;border:1px solid var(--border-color,#d9dee8);border-radius:14px;background:var(--soft-bg,#f7f9fc);display:grid;place-items:center;overflow:hidden}
.prepack-selected-image img{width:100%;height:100%;object-fit:contain;background:var(--card-bg,#fff)}
.prepack-selected-image span{font-size:1.7rem;font-weight:850;color:var(--primary-color,#2563eb)}
.prepack-selected-copy{min-width:0}
.prepack-selected-copy small,.prepack-selected-copy h3,.prepack-selected-copy>span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.prepack-selected-copy h3{margin:2px 0 4px!important}
.prepack-product-facts small,.prepack-product-facts strong,.prepack-product-facts>div>span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.prepack-product-facts .prepack-readonly-badge{max-width:100%}
.prepack-result-card{display:grid;grid-template-columns:54px minmax(0,1fr) auto;align-items:center;min-width:0}
.prepack-result-image{width:54px;height:54px;border:1px solid var(--border-color,#d9dee8);border-radius:10px;background:var(--soft-bg,#f7f9fc);display:grid;place-items:center;overflow:hidden}
.prepack-result-image img{width:100%;height:100%;object-fit:contain;background:var(--card-bg,#fff)}
.prepack-result-image span{font-weight:850;color:var(--primary-color,#2563eb)}
.prepack-result-copy{min-width:0}
.prepack-result-copy strong,.prepack-result-copy span,.prepack-result-price strong,.prepack-result-price small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.prepack-result-price{min-width:150px}
.prepack-recent-section{margin-top:14px;border:1px solid var(--border-color,#d9dee8);border-radius:18px;background:var(--card-bg,#fff);padding:18px}
.prepack-recent-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:14px;min-width:0}
.prepack-recent-head>div{min-width:0}
.prepack-recent-head h2{margin:3px 0 0;font-size:1.2rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.prepack-recent-head small,.prepack-recent-head>span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.prepack-recent-head>span{max-width:44%;font-size:.82rem;color:var(--muted-text,#667085);text-align:right}
.prepack-recent-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}
.prepack-recent-card{min-width:0;width:100%;padding:10px;border:1px solid var(--border-color,#d9dee8);border-radius:14px;background:var(--card-bg,#fff);color:inherit;text-align:left;cursor:pointer;transition:border-color .14s ease,box-shadow .14s ease,transform .14s ease}
.prepack-recent-card:hover,.prepack-recent-card:focus{outline:none;border-color:var(--primary-color,#2563eb);box-shadow:0 7px 20px rgba(15,23,42,.08);transform:translateY(-1px)}
.prepack-recent-card:disabled{opacity:.65;cursor:wait;transform:none}
.prepack-recent-image{height:112px;border-radius:10px;border:1px solid var(--border-color,#d9dee8);background:var(--soft-bg,#f7f9fc);display:grid;place-items:center;overflow:hidden;margin-bottom:9px}
.prepack-recent-image img{width:100%;height:100%;object-fit:contain;background:var(--card-bg,#fff)}
.prepack-recent-image span{font-size:1.7rem;font-weight:850;color:var(--primary-color,#2563eb)}
.prepack-recent-copy{min-width:0}
.prepack-recent-copy strong,.prepack-recent-copy span,.prepack-recent-copy small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.prepack-recent-copy strong{font-size:.94rem}
.prepack-recent-copy span{margin-top:3px;font-size:.78rem;color:var(--muted-text,#667085)}
.prepack-recent-copy small{margin-top:5px;font-size:.72rem;color:var(--muted-text,#667085)}
.prepack-recent-empty{grid-column:1/-1;padding:24px;border:1px dashed var(--border-color,#d9dee8);border-radius:12px;color:var(--muted-text,#667085);text-align:center}
.prepack-recent-empty.is-error{color:var(--danger-color,#b91c1c)}
@media (max-width:680px){
  .prepack-page .prepack-section-head{align-items:flex-start}
  .prepack-page .prepack-section-head .btn{min-height:44px!important}
  .prepack-product-title-row{grid-template-columns:72px minmax(0,1fr) auto;gap:10px}
  .prepack-selected-image{width:72px;height:72px}
  .prepack-result-card{grid-template-columns:48px minmax(0,1fr);gap:10px}
  .prepack-result-image{width:48px;height:48px}
  .prepack-result-price{grid-column:2;min-width:0;text-align:left}
  .prepack-recent-head>span{display:none}
  .prepack-recent-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:480px){
  .prepack-page .prepack-section-head{flex-direction:column;gap:9px}
  .prepack-page .prepack-section-head .btn{align-self:flex-start}
  .prepack-product-title-row{grid-template-columns:68px minmax(0,1fr)}
  .prepack-selected-image{width:68px;height:68px}
  .prepack-change-product{grid-column:2;justify-self:start}
  .prepack-recent-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
  .prepack-recent-image{height:96px}
}

/* Cash Flow report - CashFlowFrm.vb conversion */
.cash-flow-toolbar{grid-template-columns:1fr}.cash-flow-filter-grid{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,minmax(190px,1fr));gap:12px}.cash-flow-filter-grid label>span{display:block;font-size:12px;font-weight:700;margin:0 0 5px;color:var(--theme-muted,var(--muted))}.cash-flow-filter-grid select{width:100%;min-height:39px;border:1px solid var(--theme-border,var(--border));border-radius:8px;background:var(--theme-input-bg,var(--input-bg,var(--card)));color:var(--theme-text,var(--text));padding:8px 10px}.cash-flow-filter-grid small{display:block;margin-top:5px;color:var(--theme-muted,var(--muted));font-size:11px;line-height:1.35}.cash-flow-toggle{min-height:72px;padding:9px 11px;border:1px solid var(--theme-border,var(--border));border-radius:9px;background:color-mix(in srgb,var(--brand) 3%,var(--card))}.cash-flow-toggle input[type=checkbox]{width:18px;height:18px;margin:2px 0 0;accent-color:var(--brand)}.cash-flow-summary-cards{grid-template-columns:repeat(4,minmax(0,1fr))}.cash-flow-chart-card{overflow:visible}.cash-flow-chart-mode{display:inline-flex;align-items:center;min-height:28px;padding:4px 9px;border:1px solid var(--theme-border,var(--border));border-radius:999px;color:var(--theme-muted,var(--muted));font-size:11px;font-weight:700;white-space:nowrap}.cash-flow-chart-wrap{padding:12px 14px 8px;overflow-x:auto}.cash-flow-chart{display:block;width:100%;min-width:760px;height:340px;border-radius:8px;background:color-mix(in srgb,var(--theme-surface,var(--card)) 96%,var(--brand) 4%)}.cash-flow-grid-line{stroke:color-mix(in srgb,var(--theme-border,var(--border)) 70%,transparent);stroke-width:1;vector-effect:non-scaling-stroke}.cash-flow-axis{stroke:var(--theme-muted,var(--muted));stroke-width:1.2;vector-effect:non-scaling-stroke}.cash-flow-axis-label,.cash-flow-period-label{fill:var(--theme-muted,var(--muted));font-size:11px;font-family:Arial,sans-serif}.cash-flow-period-label{font-size:10px}.cash-flow-bar{vector-effect:non-scaling-stroke}.cash-flow-inflow{fill:color-mix(in srgb,var(--brand) 78%,#16a34a 22%)}.cash-flow-outflow{fill:color-mix(in srgb,var(--brand) 55%,#dc2626 45%)}.cash-flow-net-positive{fill:var(--brand)}.cash-flow-net-negative{fill:color-mix(in srgb,var(--brand) 35%,#dc2626 65%)}.cash-flow-line{fill:none;stroke:var(--brand);stroke-width:3;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}.cash-flow-area{fill:color-mix(in srgb,var(--brand) 18%,transparent)}.cash-flow-dot{fill:var(--brand);stroke:var(--theme-surface,var(--card));stroke-width:2;vector-effect:non-scaling-stroke}.cash-flow-chart-legend{display:flex;justify-content:center;gap:18px;align-items:center;min-height:28px;color:var(--theme-muted,var(--muted));font-size:11px}.cash-flow-chart-legend span{display:inline-flex;align-items:center;gap:6px}.cash-flow-chart-legend i{width:11px;height:11px;border-radius:3px;display:inline-block}.cash-flow-chart-legend i.inflow{background:color-mix(in srgb,var(--brand) 78%,#16a34a 22%)}.cash-flow-chart-legend i.outflow{background:color-mix(in srgb,var(--brand) 55%,#dc2626 45%)}.cash-flow-chart-legend i.net{background:var(--brand)}.cash-flow-table{min-width:620px}.cash-flow-table th:first-child,.cash-flow-table td:first-child{width:38%}@media(max-width:820px){.cash-flow-filter-grid{grid-template-columns:1fr 1fr}.cash-flow-filter-grid label:last-child{grid-column:1/-1}.cash-flow-summary-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:560px){.cash-flow-filter-grid,.cash-flow-summary-cards{grid-template-columns:1fr}.cash-flow-filter-grid label:last-child{grid-column:auto}.cash-flow-chart-wrap{padding-left:8px;padding-right:8px}}

/* Employee Attendance Kiosk: camera is private/off until an attendance action starts. */
.efa-standalone-kiosk .efa-camera-privacy-note{display:inline-flex;align-items:center;justify-content:center;max-width:280px;padding:7px 10px;border:1px solid #cbd5e1;border-radius:999px;background:#f8fafc;color:#475569;font-size:clamp(11px,.85vw,14px);font-weight:750;text-align:center;line-height:1.25}
.efa-standalone-kiosk .efa-video-box.efa-camera-idle video{opacity:0;visibility:hidden}
.efa-standalone-kiosk .efa-video-box.efa-camera-idle .efa-face-guide,.efa-standalone-kiosk .efa-video-box.efa-camera-idle .efa-scan-line{display:none}
.efa-standalone-kiosk .efa-video-box.efa-camera-idle::before{content:'CAMERA OFF';position:absolute;inset:0 0 clamp(48px,5.5dvh,84px);display:grid;place-items:center;color:#64748b;font-size:clamp(22px,2.6vw,44px);font-weight:900;letter-spacing:.08em;background:#e8eef5}
.efa-standalone-kiosk .efa-video-box.camera-active::before{display:none}
@media(max-width:680px){.efa-standalone-kiosk .efa-camera-privacy-note{max-width:none;width:100%;box-sizing:border-box}}


/* Global ERP report From/To date validation. */
[data-erp-report-date-range] input.erp-report-date-invalid,
[data-erp-report-date-range] input[aria-invalid="true"].erp-report-date-invalid {
    border-color: var(--erp-danger, #dc2626) !important;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--erp-danger, #dc2626) 14%, transparent) !important;
}


/* Customer transaction document center (2026-08-21). */
.customer-documents-topbar .customer-documents-breadcrumb{display:flex;align-items:center;gap:7px;margin-bottom:3px;font-size:11px;color:var(--theme-muted,var(--muted))}.customer-documents-breadcrumb a{color:var(--theme-primary,var(--brand));text-decoration:none}.customer-documents-page{margin:0 0 24px;border:1px solid var(--theme-border,var(--border));border-radius:12px;overflow:hidden;background:var(--theme-surface,var(--card));color:var(--theme-text,var(--text));box-shadow:0 6px 22px rgba(15,23,42,.06);transition:opacity .15s ease}.customer-documents-page.is-ajax-loading{opacity:.58;pointer-events:none}
.customer-documents-toolbar{min-height:58px;display:grid;grid-template-columns:minmax(280px,680px) 1fr;gap:18px;align-items:center;padding:9px 14px;border-bottom:1px solid var(--theme-border,var(--border));background:var(--theme-surface,var(--card))}.customer-documents-search{height:38px;display:grid;grid-template-columns:34px 1fr auto;align-items:center;border:1px solid color-mix(in srgb,var(--theme-primary,var(--brand)) 42%,var(--theme-border,var(--border)));border-radius:7px;overflow:hidden;background:var(--theme-input-bg,var(--card))}.customer-documents-search>span{display:grid;place-items:center;font-size:20px;color:var(--theme-muted,var(--muted))}.customer-documents-search input{height:100%;min-width:0;border:0;outline:0;background:transparent;color:inherit;padding:0 8px}.customer-documents-search button{height:100%;border:0;border-left:1px solid var(--theme-border,var(--border));padding:0 14px;background:color-mix(in srgb,var(--theme-primary,var(--brand)) 8%,var(--theme-surface,var(--card)));color:var(--theme-text,var(--text));cursor:pointer;font-weight:700}.customer-documents-toolbar-right{display:flex;justify-content:flex-end;align-items:center;gap:7px;font-size:12px;white-space:nowrap}.customer-documents-nav,.customer-documents-view{width:36px;height:34px;display:grid;place-items:center;border:1px solid var(--theme-border,var(--border));border-radius:6px;background:var(--theme-surface,var(--card));color:var(--theme-text,var(--text));text-decoration:none;font-size:20px}.customer-documents-view.active{border-color:var(--theme-primary,var(--brand));background:color-mix(in srgb,var(--theme-primary,var(--brand)) 10%,var(--theme-surface,var(--card)));color:var(--theme-primary,var(--brand))}.customer-documents-nav.disabled{opacity:.4;pointer-events:none}
.customer-documents-layout{display:grid;grid-template-columns:215px minmax(0,1fr);min-height:600px}.customer-documents-sidebar{padding:10px;border-right:1px solid var(--theme-border,var(--border));background:color-mix(in srgb,var(--theme-surface,var(--card)) 96%,var(--theme-primary,var(--brand)) 4%)}.customer-documents-sidebar a{min-height:38px;display:flex;align-items:center;gap:9px;padding:7px 10px;border-radius:6px;color:var(--theme-text,var(--text));text-decoration:none;font-size:13px}.customer-documents-sidebar a:hover,.customer-documents-sidebar a.active{background:color-mix(in srgb,var(--theme-primary,var(--brand)) 10%,var(--theme-surface,var(--card)));color:var(--theme-primary,var(--brand));font-weight:700}.customer-documents-content{min-width:0;padding:14px;background:color-mix(in srgb,var(--theme-bg,var(--bg)) 62%,var(--theme-surface,var(--card)) 38%)}
.customer-documents-kanban{display:grid;grid-template-columns:repeat(4,minmax(210px,1fr));gap:14px}.customer-document-card{min-width:0;border:1px solid var(--theme-border,var(--border));border-radius:8px;overflow:hidden;background:var(--theme-surface,var(--card));color:var(--theme-text,var(--text));text-decoration:none;box-shadow:0 2px 8px rgba(15,23,42,.04);transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease}.customer-document-card:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--theme-primary,var(--brand)) 45%,var(--theme-border,var(--border)));box-shadow:0 10px 24px rgba(15,23,42,.10)}.customer-document-preview{height:192px;position:relative;overflow:hidden;border-bottom:1px solid var(--theme-border,var(--border));background:#f8fafc}.customer-document-preview iframe{width:100%;height:100%;border:0;pointer-events:none;background:#fff}.customer-document-preview-shield{position:absolute;inset:0}.customer-document-meta{display:grid;gap:5px;padding:9px 10px}.customer-document-title{display:flex;align-items:center;justify-content:space-between;gap:8px}.customer-document-title strong{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:13px}.customer-document-title span{color:var(--theme-primary,var(--brand))}.customer-document-sub{min-height:18px;color:var(--theme-muted,var(--muted));font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.customer-document-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:11px}.customer-document-status{display:inline-flex;align-items:center;min-height:21px;padding:2px 7px;border-radius:999px;background:color-mix(in srgb,var(--theme-primary,var(--brand)) 10%,transparent);font-size:10px;font-weight:700}.customer-document-foot strong{white-space:nowrap;font-variant-numeric:tabular-nums}.customer-documents-list-wrap{overflow:auto;border:1px solid var(--theme-border,var(--border));border-radius:8px;background:var(--theme-surface,var(--card))}.customer-documents-list{width:100%;min-width:880px;margin:0}.customer-documents-list th,.customer-documents-list td{padding:9px 10px}.customer-documents-list .numeric{text-align:right}.customer-documents-list td a{color:var(--theme-primary,var(--brand));text-decoration:none}.customer-documents-empty{min-height:360px;display:grid;place-items:center;color:var(--theme-muted,var(--muted));font-size:14px}
@media(max-width:1450px){.customer-documents-kanban{grid-template-columns:repeat(3,minmax(210px,1fr))}}@media(max-width:1050px){.customer-documents-kanban{grid-template-columns:repeat(2,minmax(210px,1fr))}.customer-documents-layout{grid-template-columns:170px minmax(0,1fr)}}@media(max-width:760px){.customer-documents-toolbar{grid-template-columns:1fr}.customer-documents-toolbar-right{justify-content:flex-start;flex-wrap:wrap}.customer-documents-layout{grid-template-columns:1fr}.customer-documents-sidebar{display:flex;gap:5px;overflow:auto;border-right:0;border-bottom:1px solid var(--theme-border,var(--border))}.customer-documents-sidebar a{flex:0 0 auto}.customer-documents-kanban{grid-template-columns:1fr}.customer-document-preview{height:230px}}

/* Customer Documents: medium A4 document thumbnails without embedded PDF viewer chrome. */
.customer-documents-kanban{grid-template-columns:repeat(3,minmax(270px,1fr));gap:16px;align-items:start}
.customer-document-preview{height:auto;aspect-ratio:210/297;min-height:0;background:#e9eef5;isolation:isolate}
.customer-document-preview iframe{position:absolute;inset:0;width:100%;height:100%;display:block;border:0;background:#eef2f7;pointer-events:none}
.customer-document-preview-shield{z-index:2;cursor:pointer}
.customer-document-file-badge{position:absolute;right:8px;bottom:8px;z-index:3;display:inline-flex;align-items:center;min-height:23px;padding:3px 7px;border:1px solid rgba(255,255,255,.72);border-radius:999px;background:rgba(15,23,42,.76);color:#fff;font-size:9px;font-weight:800;letter-spacing:.35px;box-shadow:0 2px 7px rgba(15,23,42,.16);pointer-events:none}
.customer-document-card:hover .customer-document-file-badge{background:color-mix(in srgb,var(--theme-primary,var(--brand)) 86%,#111827 14%)}
@media(max-width:1450px){.customer-documents-kanban{grid-template-columns:repeat(3,minmax(240px,1fr))}}
@media(max-width:1180px){.customer-documents-kanban{grid-template-columns:repeat(2,minmax(250px,1fr))}}
@media(max-width:760px){.customer-documents-kanban{grid-template-columns:1fr}.customer-document-preview{height:auto;aspect-ratio:210/297}}

/* Customer Documents compact thumbnail + A4 open behavior (2026-08-22). */
.customer-documents-kanban{grid-template-columns:repeat(auto-fill,minmax(235px,1fr));gap:14px;align-items:start}
.customer-document-card{max-width:340px;width:100%}
.customer-document-preview{height:158px;aspect-ratio:auto;min-height:0;overflow:hidden;background:#eef2f7;border-bottom:1px solid var(--theme-border,var(--border))}
.customer-document-preview iframe{position:absolute;inset:0;width:100%;height:100%;display:block;border:0;background:#eef2f7;pointer-events:none}
.customer-document-preview-shield{position:absolute;inset:0;z-index:2;cursor:pointer}
.customer-document-file-badge{right:7px;bottom:7px;min-height:21px;padding:2px 6px;font-size:8px}
.customer-document-meta{padding:8px 9px;gap:4px}
.customer-document-title strong{font-size:12px}.customer-document-sub,.customer-document-foot{font-size:10px}
.customer-document-list-action{width:54px;text-align:center!important}
.customer-document-pdf-icon{display:inline-grid!important;place-items:center;width:34px;height:30px;border:1px solid color-mix(in srgb,#dc2626 30%,var(--theme-border,var(--border)));border-radius:7px;background:color-mix(in srgb,#dc2626 8%,var(--theme-surface,var(--card)));color:#b91c1c!important;text-decoration:none!important;box-shadow:0 1px 2px rgba(15,23,42,.04);transition:transform .12s ease,border-color .12s ease,background .12s ease}
.customer-document-pdf-icon:hover{transform:translateY(-1px);border-color:#dc2626;background:color-mix(in srgb,#dc2626 14%,var(--theme-surface,var(--card)))}
.customer-document-pdf-icon span{font-size:8px;font-weight:900;letter-spacing:.25px;line-height:1}
.customer-summary-item[data-customer-delivery-orders-open]{font:inherit;text-align:left;cursor:pointer}
@media(max-width:760px){.customer-documents-kanban{grid-template-columns:repeat(auto-fill,minmax(210px,1fr))}.customer-document-card{max-width:none}.customer-document-preview{height:150px;aspect-ratio:auto}}
.customer-document-pdf-icon span{position:relative;display:grid;place-items:end center;width:20px;height:23px;padding-bottom:3px;border:1.5px solid currentColor;border-radius:2px;background:var(--theme-surface,var(--card));font-size:6px;font-weight:900;letter-spacing:.1px;line-height:1}
.customer-document-pdf-icon span::before{content:'';position:absolute;right:-1.5px;top:-1.5px;width:7px;height:7px;background:linear-gradient(225deg,transparent 48%,currentColor 49% 56%,var(--theme-surface,var(--card)) 57%);border-top-right-radius:2px}

/* ========================================================================== 
   Semantic dashboard + sidebar navigation redesign (v2026.08.22.3)
   Icon + caption cards, locally-rendered SVG navigation icons, accordion menu.
   ========================================================================== */
.erp-semantic-icon {
    --erp-icon-accent: var(--brand);
    width: 100%;
    height: 100%;
    display: inline-grid;
    place-items: center;
    color: var(--erp-icon-accent);
    line-height: 1;
}
.erp-semantic-icon .erp-icon-fallback { font-size: inherit; line-height: 1; }
.erp-semantic-icon.is-vector .erp-icon-fallback { display: none; }
.erp-nav-svg { width: 72%; height: 72%; display: block; overflow: visible; }

/* Main navigation is intentionally light/surface based so every semantic icon
   stays recognizable across all ERP themes. */
.app-shell > .erp-sidebar {
    background: color-mix(in srgb, var(--card) 96%, var(--brand) 4%);
    color: var(--text);
    border-right: 1px solid color-mix(in srgb, var(--border) 85%, var(--brand) 15%);
    box-shadow: 8px 0 26px rgba(15, 23, 42, .045);
}
.erp-sidebar .sidebar-head {
    border-bottom: 1px solid var(--border);
    padding-bottom: 14px;
    margin-bottom: 12px;
}
.erp-sidebar .sidebar-logo {
    background: var(--brand);
    color: var(--on-brand);
    box-shadow: 0 8px 22px color-mix(in srgb, var(--brand) 24%, transparent);
}
.erp-sidebar .sidebar-pin-toggle,
.erp-sidebar .mobile-sidebar-toggle {
    color: var(--text);
    background: var(--soft);
    border-color: var(--border);
}
.erp-sidebar .sidebar-pin-toggle:hover { background: color-mix(in srgb, var(--brand) 10%, var(--card)); color: var(--text); }
.erp-sidebar .menu-home,
.erp-sidebar .menu-link {
    color: var(--text);
    border: 1px solid transparent;
    border-radius: 11px;
    transition: background .14s ease, color .14s ease, border-color .14s ease, transform .14s ease;
}
.erp-sidebar .menu-home:hover,
.erp-sidebar .menu-home:focus,
.erp-sidebar .menu-link:hover,
.erp-sidebar .menu-link:focus {
    color: var(--text);
    background: color-mix(in srgb, var(--brand) 8%, var(--card));
    border-color: color-mix(in srgb, var(--brand) 15%, var(--border));
    transform: translateX(1px);
}
.erp-sidebar .menu-home.active,
.erp-sidebar .menu-link.active {
    color: var(--text);
    background: color-mix(in srgb, var(--brand) 12%, var(--card));
    border-color: color-mix(in srgb, var(--brand) 26%, var(--border));
    box-shadow: inset 3px 0 0 var(--brand);
    font-weight: 800;
}
.erp-sidebar .menu-icon {
    width: 34px;
    height: 34px;
    flex-basis: 34px;
    border-radius: 10px;
    background: color-mix(in srgb, var(--erp-icon-accent, var(--brand)) 11%, var(--card));
    color: var(--erp-icon-accent, var(--brand));
    font-size: 18px;
}
.erp-sidebar .menu-icon .erp-semantic-icon {
    background: color-mix(in srgb, var(--erp-icon-accent) 11%, var(--card));
    border-radius: inherit;
}
.erp-sidebar .menu-toggle {
    color: var(--muted);
    background: transparent;
    font-size: 22px;
    font-weight: 700;
    transform: rotate(0deg);
}
.erp-sidebar .menu-toggle:hover { color: var(--brand); background: var(--soft); }
.erp-sidebar .menu-toggle.open { transform: rotate(90deg); color: var(--brand); }
.erp-sidebar .menu-children {
    border-left: 1px solid color-mix(in srgb, var(--brand) 24%, var(--border));
    margin-left: 17px;
    padding-left: 9px;
}
.erp-sidebar .menu-children .menu-icon {
    width: 30px;
    height: 30px;
    flex-basis: 30px;
    font-size: 15px;
    background: transparent;
}
.erp-sidebar .menu-children .menu-icon .erp-semantic-icon { background: transparent; }
.erp-sidebar .menu-children .menu-link { min-height: 39px; }

/* Dashboard cards: only icon + caption. */
.main-only-grid,
.one-level-dashboard,
.quick-access-grid {
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    gap: 16px;
    align-items: stretch;
}
.semantic-dashboard-card-shell { min-width: 0; }
.semantic-dashboard-card,
.app-card.semantic-dashboard-card,
.dash-menu-card-link.semantic-dashboard-card,
.quick-access-card.semantic-dashboard-card {
    min-height: 154px;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 13px;
    padding: 18px 12px;
    border: 1px solid var(--border);
    border-radius: 16px;
    background: var(--card);
    color: var(--text);
    text-align: center;
    text-decoration: none;
    box-shadow: 0 7px 22px rgba(15, 23, 42, .055);
    transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease, background .15s ease;
}
.semantic-dashboard-card:hover,
.semantic-dashboard-card:focus {
    transform: translateY(-3px);
    box-shadow: 0 14px 32px rgba(15, 23, 42, .11);
    border-color: color-mix(in srgb, var(--brand) 38%, var(--border));
    background: color-mix(in srgb, var(--card) 96%, var(--brand) 4%);
    color: var(--text);
    outline: none;
}
.semantic-dashboard-icon,
.app-icon.semantic-dashboard-icon,
.dash-menu-card-icon.semantic-dashboard-icon,
.quick-access-icon.semantic-dashboard-icon {
    width: 66px;
    height: 66px;
    flex: 0 0 66px;
    display: grid;
    place-items: center;
    margin: 0;
    border-radius: 16px;
    background: color-mix(in srgb, var(--erp-icon-accent, var(--brand)) 10%, var(--card));
    color: var(--erp-icon-accent, var(--brand));
    font-size: 32px;
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--erp-icon-accent, var(--brand)) 13%, transparent);
}
.semantic-dashboard-icon .erp-semantic-icon {
    background: color-mix(in srgb, var(--erp-icon-accent) 10%, var(--card));
    border-radius: inherit;
}
.semantic-dashboard-title,
.semantic-dashboard-caption h3,
.app-card.semantic-dashboard-card h3,
.quick-access-card.semantic-dashboard-card h3,
.dash-menu-card-link.semantic-dashboard-card h3 {
    margin: 0;
    color: var(--text);
    font-size: 14px;
    font-weight: 500;
    line-height: 1.25;
    text-align: center;
    overflow-wrap: anywhere;
}
.semantic-dashboard-caption { width: 100%; min-width: 0; }
.semantic-dashboard-card .module-area,
.semantic-dashboard-card p,
.semantic-dashboard-card .quick-access-path,
.semantic-dashboard-card .quick-access-arrow,
.semantic-dashboard-card .dash-menu-card-arrow { display: none !important; }

.module-big-icon {
    width: 62px;
    height: 62px;
    display: grid;
    place-items: center;
    border-radius: 17px;
    background: color-mix(in srgb, var(--brand) 9%, var(--card));
    font-size: 30px;
}

/* Keep icon-only collapsed sidebar useful and readable. */
.sidebar-collapsed .erp-sidebar .menu-icon {
    width: 40px;
    height: 40px;
    flex-basis: 40px;
    border-radius: 12px;
}
.sidebar-collapsed .erp-sidebar .menu-home,
.sidebar-collapsed .erp-sidebar .menu-link { border-radius: 12px; }

@media (max-width: 1250px) {
    .main-only-grid,
    .one-level-dashboard,
    .quick-access-grid { grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); }
}
@media (max-width: 720px) {
    .main-only-grid,
    .one-level-dashboard,
    .quick-access-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
    .semantic-dashboard-card,
    .app-card.semantic-dashboard-card,
    .dash-menu-card-link.semantic-dashboard-card,
    .quick-access-card.semantic-dashboard-card { min-height: 132px; padding: 14px 8px; }
    .semantic-dashboard-icon,
    .app-icon.semantic-dashboard-icon,
    .dash-menu-card-icon.semantic-dashboard-icon,
    .quick-access-icon.semantic-dashboard-icon { width: 56px; height: 56px; flex-basis: 56px; }
}

/* Per-user dashboard icon ordering (v2026.08.23.1). */
.dashboard-order-token{display:none!important}
.erp-sortable-dashboard>[data-dashboard-key]{cursor:grab;user-select:none;-webkit-user-select:none;transition:transform .16s ease,box-shadow .16s ease,opacity .16s ease}
.erp-sortable-dashboard>[data-dashboard-key]:active{cursor:grabbing}
.erp-sortable-dashboard.dashboard-is-reordering>[data-dashboard-key]{transition:transform .1s ease,box-shadow .1s ease}
.erp-sortable-dashboard>[data-dashboard-key].dashboard-card-dragging{z-index:30;cursor:grabbing;transform:scale(1.035);box-shadow:0 18px 42px rgba(15,23,42,.22);opacity:.94;outline:2px solid color-mix(in srgb,var(--brand) 58%,transparent);outline-offset:3px}
.erp-sortable-dashboard.dashboard-order-saving{opacity:.92}
.erp-sortable-dashboard.dashboard-order-saved::after{content:"Layout saved";position:fixed;right:22px;bottom:22px;z-index:1500;padding:8px 12px;border-radius:999px;background:var(--brand);color:#fff;font-size:11px;font-weight:700;box-shadow:0 8px 24px rgba(15,23,42,.22)}
@media (pointer:coarse){.erp-sortable-dashboard>[data-dashboard-key]{touch-action:pan-y}.erp-sortable-dashboard.dashboard-is-reordering>[data-dashboard-key]{touch-action:none}}

/* ============================================================
   Main Dashboard quick-access-first six-column launcher
   v2026.08.23.6-dashboard-quick-access-first-six-column-ui-fix
   Presentation-only: routes, rights, Quick Access data and ordering stay intact.
   ============================================================ */
body:has(.erp-launcher-dashboard) {
    overflow-x: hidden;
}

body:has(.erp-launcher-dashboard) .app-shell.pos-sidebar-hidden {
    min-height: 100vh;
    background:
        radial-gradient(circle at 50% 0%, color-mix(in srgb, var(--brand) 10%, transparent) 0, transparent 38%),
        linear-gradient(135deg,
            color-mix(in srgb, var(--bg) 94%, var(--brand) 6%) 0%,
            var(--bg) 50%,
            color-mix(in srgb, var(--bg) 96%, var(--brand) 4%) 100%);
}

body:has(.erp-launcher-dashboard) .main-area {
    min-height: 100vh;
    padding: 0 24px 30px !important;
    overflow-x: hidden;
    background: transparent;
}

.erp-launcher-dashboard {
    width: 100%;
    min-height: calc(100vh - 24px);
    margin: 0;
    padding: 16px 0 28px;
    color: var(--text);
}

.erp-launcher-header.dashboard-header,
.erp-launcher-header.topbar {
    position: relative;
    z-index: 20;
    width: 100%;
    min-height: 66px;
    margin: 0 0 28px !important;
    padding: 0 !important;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    background: transparent;
    border: 0;
    box-shadow: none;
}

.erp-launcher-branch {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    max-width: 260px;
    min-height: 50px;
    padding: 8px 14px 8px 9px;
    border: 1px solid color-mix(in srgb, var(--border) 80%, var(--brand) 20%);
    border-radius: 15px;
    background: color-mix(in srgb, var(--card) 96%, transparent);
    box-shadow: 0 7px 22px rgba(15, 23, 42, .07);
    backdrop-filter: blur(10px);
}

.erp-launcher-branch-mark {
    flex: 0 0 34px;
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    border-radius: 10px;
    color: var(--brand);
    background: color-mix(in srgb, var(--brand) 10%, var(--card));
}

.erp-launcher-branch-mark svg {
    width: 21px;
    height: 21px;
}

.erp-launcher-branch-copy {
    min-width: 0;
}

.erp-launcher-branch-copy strong {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: var(--text);
    font-size: 13px;
    font-weight: 760;
    line-height: 1.2;
}

.erp-launcher-user-panel {
    width: auto !important;
    min-width: 0;
    margin-left: auto;
    transition: margin-right .15s ease;
}

.main-area:has(> .erp-notification-slot) .erp-launcher-user-panel {
    margin-right: 56px;
}

.main-area:has(> .erp-notification-slot > .erp-notification-bell:nth-child(2)) .erp-launcher-user-panel {
    margin-right: 109px;
}

.erp-launcher-user-panel .account-menu,
.erp-launcher-user-panel .account-menu-button {
    width: auto !important;
}

.erp-launcher-user-panel .account-menu-button {
    min-height: 48px;
    padding: 7px 12px 7px 7px;
    border-radius: 15px;
    border-color: color-mix(in srgb, var(--border) 80%, var(--brand) 20%);
    background: color-mix(in srgb, var(--card) 96%, transparent);
    box-shadow: 0 7px 22px rgba(15, 23, 42, .07);
    backdrop-filter: blur(10px);
}

.erp-launcher-user-panel .account-avatar {
    width: 34px;
    height: 34px;
}

body:has(.erp-launcher-dashboard) .main-area > .erp-notification-slot {
    top: 17px;
    right: 24px;
    gap: 7px !important;
}

body:has(.erp-launcher-dashboard) .main-area > .erp-notification-slot > .erp-notification-bell {
    width: 46px !important;
    min-width: 46px !important;
    max-width: 46px !important;
    flex-basis: 46px !important;
    height: 46px !important;
    border-radius: 15px;
    border-color: color-mix(in srgb, var(--border) 80%, var(--brand) 20%);
    background: color-mix(in srgb, var(--card) 96%, transparent);
    box-shadow: 0 7px 22px rgba(15, 23, 42, .07);
    backdrop-filter: blur(10px);
}

.main-area:has(> .erp-notification-slot) .erp-launcher-header.topbar:has(.account-menu) {
    padding-right: 0 !important;
}

.erp-launcher-alert {
    width: min(100%, 760px);
    margin: -10px auto 24px;
}

.erp-launcher-content {
    width: 100%;
    display: grid;
    align-content: start;
    justify-items: center;
    gap: 42px;
}

.erp-launcher-section {
    width: 100%;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.erp-launcher-section-heading {
    width: min(100%, 760px);
    margin: 0 auto 26px;
    display: grid;
    grid-template-columns: minmax(70px, 1fr) auto minmax(70px, 1fr);
    align-items: center;
    gap: 18px;
    text-align: center;
}

.erp-launcher-heading-line {
    height: 1px;
    background: linear-gradient(90deg,
        transparent 0%,
        color-mix(in srgb, var(--brand) 38%, var(--border)) 32%,
        color-mix(in srgb, var(--brand) 58%, var(--border)) 100%);
}

.erp-launcher-section-heading .erp-launcher-heading-line:last-child {
    background: linear-gradient(90deg,
        color-mix(in srgb, var(--brand) 58%, var(--border)) 0%,
        color-mix(in srgb, var(--brand) 38%, var(--border)) 68%,
        transparent 100%);
}

.erp-launcher-heading-copy {
    min-width: 0;
}

.erp-launcher-heading-copy h1,
.erp-launcher-heading-copy h2 {
    margin: 0;
    color: color-mix(in srgb, var(--text) 82%, var(--brand) 18%);
    font-size: 15px;
    font-weight: 820;
    line-height: 1.2;
    letter-spacing: .13em;
    text-transform: uppercase;
}

.erp-launcher-heading-copy p {
    margin: 5px 0 0;
    color: color-mix(in srgb, var(--muted) 90%, var(--brand) 10%);
    font-size: 11.5px;
    font-weight: 500;
    line-height: 1.3;
}

/* Desktop: six fixed columns, whole grid centered; each row fills left-to-right. */
.erp-launcher-grid,
.erp-launcher-dashboard .app-grid,
.erp-launcher-dashboard .main-only-grid,
.erp-launcher-dashboard .quick-access-grid,
.erp-launcher-dashboard .erp-launcher-quick-grid.quick-access-grid {
    width: min(100%, 812px);
    max-width: 812px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(6, 112px);
    justify-content: start;
    align-items: start;
    gap: 30px 28px;
}

.erp-launcher-item,
.erp-launcher-dashboard .semantic-dashboard-card-shell,
.erp-launcher-quick-item {
    position: relative;
    width: 112px;
    min-width: 0;
}

.erp-launcher-dashboard .semantic-dashboard-card,
.erp-launcher-dashboard .app-card.semantic-dashboard-card,
.erp-launcher-dashboard .quick-access-card.semantic-dashboard-card,
.erp-launcher-link {
    min-height: 0;
    height: auto;
    width: 112px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: 9px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: var(--text);
    box-shadow: none;
    text-align: center;
    text-decoration: none;
    transform: none;
    overflow: visible;
}

.erp-launcher-dashboard .semantic-dashboard-card:hover,
.erp-launcher-dashboard .semantic-dashboard-card:focus,
.erp-launcher-dashboard .app-card.semantic-dashboard-card:hover,
.erp-launcher-dashboard .app-card.semantic-dashboard-card:focus,
.erp-launcher-dashboard .quick-access-card.semantic-dashboard-card:hover,
.erp-launcher-dashboard .quick-access-card.semantic-dashboard-card:focus {
    transform: none;
    border: 0;
    background: transparent;
    box-shadow: none;
    color: var(--text);
    outline: none;
}

.erp-launcher-dashboard .semantic-dashboard-icon,
.erp-launcher-dashboard .app-icon.semantic-dashboard-icon,
.erp-launcher-dashboard .quick-access-icon.semantic-dashboard-icon,
.erp-launcher-tile,
.erp-launcher-dashboard .erp-launcher-quick-tile {
    width: 94px;
    height: 94px;
    flex: 0 0 94px;
    margin: 0;
    display: grid;
    place-items: center;
    border: 1px solid color-mix(in srgb, var(--border) 76%, var(--brand) 24%);
    border-radius: 16px;
    background: color-mix(in srgb, var(--card) 98%, #ffffff 2%);
    color: var(--brand);
    box-shadow:
        0 7px 18px rgba(15, 23, 42, .075),
        inset 0 1px 0 rgba(255, 255, 255, .62);
    transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease, background .16s ease;
}

.erp-launcher-link:hover .erp-launcher-tile,
.erp-launcher-link:focus-visible .erp-launcher-tile {
    transform: translateY(-4px);
    border-color: color-mix(in srgb, var(--brand) 42%, var(--border));
    background: var(--card);
    box-shadow:
        0 14px 28px rgba(15, 23, 42, .12),
        inset 0 1px 0 rgba(255, 255, 255, .72);
}

.erp-launcher-link:focus-visible {
    outline: none;
}

.erp-launcher-link:focus-visible .erp-launcher-tile {
    outline: 3px solid color-mix(in srgb, var(--brand) 22%, transparent);
    outline-offset: 3px;
}

.erp-launcher-dashboard .semantic-dashboard-icon .erp-semantic-icon,
.erp-launcher-tile .erp-semantic-icon,
.erp-launcher-dashboard .erp-launcher-quick-tile .erp-semantic-icon {
    width: 62px;
    height: 62px;
    border-radius: 0;
    background: transparent;
}

.erp-launcher-dashboard .semantic-dashboard-icon .erp-nav-svg,
.erp-launcher-tile .erp-nav-svg {
    width: 70%;
    height: 70%;
    stroke-width: 1.85;
}

.erp-launcher-dashboard .erp-launcher-tile > img {
    width: 68%;
    height: 68%;
    object-fit: contain;
    border-radius: 10px;
}

.erp-launcher-caption,
.erp-launcher-dashboard .semantic-dashboard-title,
.erp-launcher-dashboard .semantic-dashboard-caption h3,
.erp-launcher-dashboard .app-card.semantic-dashboard-card h3,
.erp-launcher-dashboard .quick-access-card.semantic-dashboard-card h3 {
    width: 112px;
    margin: 0;
    color: color-mix(in srgb, var(--text) 94%, var(--brand) 6%);
    font-size: 12.5px;
    font-weight: 520;
    line-height: 1.25;
    text-align: center;
    overflow-wrap: normal;
    word-break: normal;
    hyphens: none;
}

.erp-launcher-quick-item .erp-launcher-quick-badge {
    position: absolute;
    z-index: 4;
    top: 8px;
    left: 50%;
    transform: translateX(-50%);
    min-width: 72px;
    max-width: 86px;
    padding: 3px 7px;
    border: 1px solid color-mix(in srgb, var(--brand) 46%, var(--border));
    border-radius: 999px;
    background: color-mix(in srgb, var(--card) 92%, var(--brand) 8%);
    color: color-mix(in srgb, var(--brand) 84%, var(--text) 16%);
    font-size: 8.5px;
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: .01em;
    text-transform: none;
    white-space: nowrap;
    pointer-events: none;
}

.erp-launcher-quick-item .erp-launcher-tile {
    padding-top: 15px;
}

/* Preserve existing Quick View editing controls without adding permanent dashboard clutter. */
.erp-launcher-item .quickview-corner-form {
    top: -7px;
    right: -1px;
    z-index: 7;
}

.erp-launcher-item .quickview-corner-toggle {
    width: 23px;
    height: 23px;
    min-width: 23px;
    font-size: 13px;
    box-shadow: 0 4px 12px rgba(15, 23, 42, .10);
}

/* Dashboard cards use the dedicated mockup labels; suppress older generic dashboard decorations. */
.erp-launcher-dashboard .module-launcher::after,
.erp-launcher-dashboard .quick-access-card-shell::before,
.erp-launcher-main-section .erp-launcher-item.is-quickview::before {
    display: none !important;
    content: none !important;
}

.erp-launcher-dashboard .erp-sortable-dashboard > [data-dashboard-key].dashboard-card-dragging {
    border-radius: 18px;
    background: color-mix(in srgb, var(--card) 74%, transparent);
}

body.theme-dark:has(.erp-launcher-dashboard) .app-shell.pos-sidebar-hidden,
body.theme-midnight:has(.erp-launcher-dashboard) .app-shell.pos-sidebar-hidden,
body.theme-carbon:has(.erp-launcher-dashboard) .app-shell.pos-sidebar-hidden {
    background:
        radial-gradient(circle at 50% 0, color-mix(in srgb, var(--brand) 18%, transparent) 0, transparent 40%),
        var(--bg);
}

body.theme-dark .erp-launcher-branch,
body.theme-midnight .erp-launcher-branch,
body.theme-carbon .erp-launcher-branch,
body.theme-dark .erp-launcher-user-panel .account-menu-button,
body.theme-midnight .erp-launcher-user-panel .account-menu-button,
body.theme-carbon .erp-launcher-user-panel .account-menu-button,
body.theme-dark:has(.erp-launcher-dashboard) .main-area > .erp-notification-slot > .erp-notification-bell,
body.theme-midnight:has(.erp-launcher-dashboard) .main-area > .erp-notification-slot > .erp-notification-bell,
body.theme-carbon:has(.erp-launcher-dashboard) .main-area > .erp-notification-slot > .erp-notification-bell,
body.theme-dark .erp-launcher-tile,
body.theme-midnight .erp-launcher-tile,
body.theme-carbon .erp-launcher-tile {
    backdrop-filter: none;
}

@media (max-width: 980px) {
    .erp-launcher-grid,
    .erp-launcher-dashboard .app-grid,
    .erp-launcher-dashboard .main-only-grid,
    .erp-launcher-dashboard .quick-access-grid,
    .erp-launcher-dashboard .erp-launcher-quick-grid.quick-access-grid {
        width: min(100%, 532px);
        max-width: 532px;
        grid-template-columns: repeat(4, 112px);
        gap: 28px 28px;
    }
}

@media (max-width: 720px) {
    body:has(.erp-launcher-dashboard) .main-area {
        padding-inline: 12px !important;
    }

   .erp-launcher-dashboard {
        padding-top: 12px;
    }

    .erp-launcher-header.dashboard-header,
    .erp-launcher-header.topbar {
        min-height: 58px;
        margin-bottom: 28px !important;
        gap: 10px;
    }

    .erp-launcher-branch {
        max-width: 48vw;
        min-height: 44px;
        padding: 6px 9px 6px 7px;
    }

    .erp-launcher-branch-mark {
        width: 30px;
        height: 30px;
        flex-basis: 30px;
    }

    .erp-launcher-branch-copy strong {
        font-size: 11.5px;
    }

    .erp-launcher-user-panel .account-name,
    .erp-launcher-user-panel .account-caret {
        display: none;
    }

    .erp-launcher-user-panel .account-menu-button {
        min-height: 40px;
        padding: 3px;
        border-radius: 13px;
    }

    .erp-launcher-user-panel .account-avatar {
        width: 34px;
        height: 34px;
    }

    .main-area:has(> .erp-notification-slot) .erp-launcher-user-panel {
        margin-right: 48px;
    }

    .main-area:has(> .erp-notification-slot > .erp-notification-bell:nth-child(2)) .erp-launcher-user-panel {
        margin-right: 94px;
    }

    body:has(.erp-launcher-dashboard) .main-area > .erp-notification-slot {
        top: 14px;
        right: 12px;
        gap: 5px !important;
    }

    body:has(.erp-launcher-dashboard) .main-area > .erp-notification-slot > .erp-notification-bell {
        width: 40px !important;
        min-width: 40px !important;
        max-width: 40px !important;
        flex-basis: 40px !important;
        height: 40px !important;
        border-radius: 13px;
    }

    .erp-launcher-section-heading {
        width: min(100%, 520px);
        grid-template-columns: minmax(30px, 1fr) auto minmax(30px, 1fr);
        gap: 12px;
        margin-bottom: 22px;
    }

    .erp-launcher-heading-copy h1,
    .erp-launcher-heading-copy h2 {
        font-size: 13px;
    }

    .erp-launcher-heading-copy p {
        font-size: 10.5px;
    }

    .erp-launcher-grid,
    .erp-launcher-dashboard .app-grid,
    .erp-launcher-dashboard .main-only-grid,
    .erp-launcher-dashboard .quick-access-grid,
    .erp-launcher-dashboard .erp-launcher-quick-grid.quick-access-grid {
        width: min(100%, 392px);
        max-width: 392px;
        grid-template-columns: repeat(3, 112px);
        gap: 26px 28px;
    }

    .erp-launcher-content {
        gap: 36px;
    }
}

@media (max-width: 460px) {
    body:has(.erp-launcher-dashboard) .main-area {
        padding-inline: 8px !important;
    }

    .erp-launcher-branch {
        max-width: 42vw;
    }

    .erp-launcher-section-heading {
        width: min(100%, 310px);
    }

    .erp-launcher-heading-copy p {
        max-width: 190px;
    }

    .erp-launcher-grid,
    .erp-launcher-dashboard .app-grid,
    .erp-launcher-dashboard .main-only-grid,
    .erp-launcher-dashboard .quick-access-grid,
    .erp-launcher-dashboard .erp-launcher-quick-grid.quick-access-grid {
        width: min(100%, 252px);
        max-width: 252px;
        grid-template-columns: repeat(2, 112px);
        gap: 24px 28px;
    }

}

/* ============================================================
   Dashboard fixed identity/user/notification header refinement
   v2026.08.23.7-dashboard-fixed-header-company-user-notification-responsive-fix
   Presentation-only: dashboard data, rights, routes and notifications stay intact.
   ============================================================ */
body:has(.erp-launcher-dashboard) .main-area {
    padding-top: 0 !important;
}

.erp-launcher-dashboard {
    padding-top: 90px;
}

.erp-launcher-header.dashboard-header,
.erp-launcher-header.topbar {
    position: fixed !important;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1750;
    box-sizing: border-box;
    width: 100%;
    min-height: 66px;
    margin: 0 !important;
    padding: 8px 24px !important;
    align-items: center;
    background: color-mix(in srgb, var(--bg) 91%, var(--card) 9%);
    border-bottom: 1px solid color-mix(in srgb, var(--border) 80%, var(--brand) 20%);
    box-shadow: 0 6px 18px rgba(15, 23, 42, .045);
    backdrop-filter: blur(14px);
}

.erp-launcher-branch {
    min-height: 50px;
    max-width: min(320px, 38vw);
    padding: 7px 13px 7px 8px;
}

.erp-launcher-branch-copy {
    display: grid;
    gap: 2px;
    min-width: 0;
    text-align: left;
}

.erp-launcher-branch-copy strong {
    font-size: 11.5px;
    font-weight: 650;
    line-height: 1.2;
}

.erp-launcher-branch-copy > span {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: var(--muted);
    font-size: 10.5px;
    font-weight: 500;
    line-height: 1.2;
}

/* Keep the logged-in user immediately before the existing website/customer notification rail. */
.erp-launcher-user-panel {
    position: absolute;
    top: 9px;
    right: 24px;
    width: auto !important;
    margin: 0 !important;
    z-index: 1900;
}

.main-area:has(> .erp-notification-slot) .erp-launcher-user-panel {
    right: 78px;
    margin: 0 !important;
}

.main-area:has(> .erp-notification-slot > .erp-notification-bell:nth-child(2)) .erp-launcher-user-panel {
    right: 131px;
    margin: 0 !important;
}

.erp-launcher-user-panel .account-menu {
    z-index: 1901;
}

.erp-launcher-user-panel .account-menu-button {
    min-height: 46px;
    gap: 7px;
    padding: 6px 10px 6px 6px;
}

.erp-launcher-user-panel .account-avatar {
    width: 32px;
    height: 32px;
    font-size: 12px;
    font-weight: 600;
}

/* Dashboard account typography requested at normal 11px / 500 weight. */
.erp-launcher-user-panel .account-name,
.erp-launcher-user-panel .account-caret,
.erp-launcher-user-panel .account-dropdown,
.erp-launcher-user-panel .account-dropdown-header strong,
.erp-launcher-user-panel .account-dropdown-header span,
.erp-launcher-user-panel .account-theme-form label,
.erp-launcher-user-panel .account-theme-form select,
.erp-launcher-user-panel .account-dropdown-link,
.erp-launcher-user-panel .account-logout {
    font-size: 11px !important;
    font-weight: 500 !important;
}

.erp-launcher-user-panel .account-name {
    display: inline-block !important;
    max-width: 150px;
}

.erp-launcher-user-panel .account-caret {
    display: inline-block !important;
    line-height: 1;
}

.erp-launcher-user-panel .account-dropdown {
    top: calc(100% + 8px);
    right: 0;
    left: auto;
}

body:has(.erp-launcher-dashboard) .main-area > .erp-notification-slot {
    top: 10px !important;
    right: 24px !important;
    z-index: 1800 !important;
}

body:has(.erp-launcher-dashboard) .main-area > .erp-notification-slot > .erp-notification-bell {
    width: 46px !important;
    min-width: 46px !important;
    max-width: 46px !important;
    flex-basis: 46px !important;
    height: 46px !important;
}

@media (max-width: 720px) {
    .erp-launcher-dashboard {
        padding-top: 72px;
    }

    .erp-launcher-header.dashboard-header,
    .erp-launcher-header.topbar {
        min-height: 58px;
        padding: 6px 8px !important;
        gap: 6px;
    }

    .erp-launcher-branch {
        min-height: 44px;
        max-width: 126px;
        padding: 5px 7px 5px 5px;
        gap: 6px;
        border-radius: 12px;
    }

    .erp-launcher-branch-mark {
        width: 28px;
        height: 28px;
        flex-basis: 28px;
        border-radius: 8px;
    }

    .erp-launcher-branch-mark svg {
        width: 18px;
        height: 18px;
    }

    .erp-launcher-branch-copy strong {
        font-size: 10.5px;
        font-weight: 600;
    }

    .erp-launcher-branch-copy > span {
        font-size: 9.5px;
        font-weight: 500;
    }

    .erp-launcher-user-panel {
        top: 8px;
        right: 8px;
    }

    .main-area:has(> .erp-notification-slot) .erp-launcher-user-panel {
        right: 54px;
    }

    .main-area:has(> .erp-notification-slot > .erp-notification-bell:nth-child(2)) .erp-launcher-user-panel {
        right: 99px;
    }

    .erp-launcher-user-panel .account-menu,
    .erp-launcher-user-panel .account-menu-button {
        width: auto !important;
        max-width: none !important;
    }

    .erp-launcher-user-panel .account-menu-button {
        min-height: 40px;
        justify-content: flex-start;
        gap: 5px;
        padding: 4px 7px 4px 4px;
        border-radius: 12px;
    }

    .erp-launcher-user-panel .account-avatar {
        width: 30px;
        height: 30px;
        flex: 0 0 30px;
        font-size: 11px;
    }

    .erp-launcher-user-panel .account-name {
        display: inline-block !important;
        max-width: 76px !important;
        font-size: 11px !important;
        font-weight: 500 !important;
    }

    .erp-launcher-user-panel .account-caret {
        display: inline-block !important;
        font-size: 11px !important;
        font-weight: 500 !important;
    }

    .erp-launcher-user-panel .account-dropdown {
        width: min(252px, calc(100vw - 16px));
        min-width: 0;
        right: 0;
        left: auto;
    }

    body:has(.erp-launcher-dashboard) .main-area > .erp-notification-slot {
        top: 8px !important;
        right: 8px !important;
        gap: 5px !important;
    }

    body:has(.erp-launcher-dashboard) .main-area > .erp-notification-slot > .erp-notification-bell {
        width: 40px !important;
        min-width: 40px !important;
        max-width: 40px !important;
        flex-basis: 40px !important;
        height: 40px !important;
        border-radius: 12px;
    }
}

@media (max-width: 380px) {
    .erp-launcher-branch {
        max-width: 112px;
    }

    .erp-launcher-user-panel .account-name {
        max-width: 52px !important;
    }

    .erp-launcher-user-panel .account-menu-button {
        gap: 4px;
        padding-right: 5px;
    }
}


/* ============================================================
   Main Dashboard Quick Access Odoo-style drag/drop
   v2026.08.23.8-dashboard-quick-access-odoo-drag-drop-fix
   Reordering is intentionally limited to Quick Access only.
   ============================================================ */
.erp-launcher-quick-grid.erp-sortable-dashboard > [data-dashboard-key] {
    cursor: grab;
    user-select: none;
    -webkit-user-select: none;
    -webkit-user-drag: none;
}

.erp-launcher-quick-grid.erp-sortable-dashboard > [data-dashboard-key] a,
.erp-launcher-quick-grid.erp-sortable-dashboard > [data-dashboard-key] img,
.erp-launcher-quick-grid.erp-sortable-dashboard > [data-dashboard-key] svg {
    -webkit-user-drag: none;
}

.erp-launcher-quick-grid.dashboard-is-reordering > [data-dashboard-key] {
    transition: transform .14s ease, opacity .14s ease, box-shadow .14s ease;
}

.erp-launcher-quick-grid > [data-dashboard-key].dashboard-card-dragging.dashboard-drag-placeholder {
    opacity: .22 !important;
    transform: none !important;
    box-shadow: none !important;
    outline: 1px dashed color-mix(in srgb, var(--brand) 55%, transparent) !important;
    outline-offset: 2px;
    background: color-mix(in srgb, var(--brand-soft) 35%, transparent) !important;
}

.dashboard-drag-ghost {
    position: fixed !important;
    z-index: 5000 !important;
    pointer-events: none !important;
    margin: 0 !important;
    opacity: .97 !important;
    transform: scale(1.055) rotate(-1deg) !important;
    transform-origin: center !important;
    border-radius: 18px !important;
    background: var(--card) !important;
    box-shadow: 0 22px 48px rgba(15, 23, 42, .25) !important;
    outline: 2px solid color-mix(in srgb, var(--brand) 60%, transparent) !important;
    outline-offset: 2px !important;
    transition: none !important;
    will-change: left, top, transform;
}

.dashboard-drag-ghost .quickview-corner-form,
.dashboard-drag-ghost .quickview-corner-toggle {
    display: none !important;
}

/* Normal Application Menu is deliberately fixed/non-sortable. */
.erp-launcher-main-section .app-grid > [data-dashboard-key] {
    cursor: default;
    user-select: auto;
    -webkit-user-select: auto;
}

.erp-launcher-main-section .app-grid > [data-dashboard-key] > a {
    cursor: pointer;
}

@media (pointer: coarse) {
    .erp-launcher-quick-grid.erp-sortable-dashboard > [data-dashboard-key] {
        touch-action: pan-y;
    }
    .erp-launcher-quick-grid.erp-sortable-dashboard.dashboard-is-reordering > [data-dashboard-key] {
        touch-action: none;
    }
}

/* ============================================================
   Dashboard mobile-only fixed header + centered sub-dashboard launcher
   v2026.08.23.9-dashboard-header-subdashboard-responsive-fix
   Main dashboard desktop header remains in normal document flow.
   Sub-dashboard keeps the standard left ERP navigation visible.
   ============================================================ */

/* Desktop/tablet main dashboard: normal in-flow identity row, no fixed divider. */
@media (min-width: 721px) {
    body:has(.erp-launcher-dashboard) .main-area {
        padding-top: 0 !important;
    }

    .erp-launcher-dashboard {
        padding-top: 16px;
    }

    .erp-launcher-header.dashboard-header,
    .erp-launcher-header.topbar {
        position: relative !important;
        inset: auto !important;
        width: 100% !important;
        min-height: 66px;
        margin: 0 0 28px !important;
        padding: 0 !important;
        display: flex !important;
        flex-direction: row !important;
        align-items: flex-start !important;
        justify-content: flex-start !important;
        gap: 18px !important;
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
        backdrop-filter: none !important;
    }

    .erp-launcher-branch {
        position: static !important;
        margin: 0 auto 0 0 !important;
        max-width: min(320px, 42vw);
    }

    .erp-launcher-user-panel {
        position: absolute !important;
        top: 0 !important;
        right: 0 !important;
        margin: 0 !important;
    }

    .main-area:has(> .erp-notification-slot) .erp-launcher-user-panel {
        right: 78px !important;
        margin: 0 !important;
    }

    .main-area:has(> .erp-notification-slot > .erp-notification-bell:nth-child(2)) .erp-launcher-user-panel {
        right: 131px !important;
        margin: 0 !important;
    }

    body:has(.erp-launcher-dashboard) .main-area > .erp-notification-slot {
        top: 10px !important;
        right: 24px !important;
    }
}

/* Mobile main dashboard: one fixed header row.
   Left = company/branch, right = user, website notification, customer request. */
@media (max-width: 720px) {
    body:has(.erp-launcher-dashboard) .main-area {
        padding-top: 0 !important;
    }

    .erp-launcher-dashboard {
        padding-top: 70px !important;
    }

    .erp-launcher-header.dashboard-header,
    .erp-launcher-header.topbar {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        bottom: auto !important;
        z-index: 1750 !important;
        width: 100% !important;
        height: 58px !important;
        min-height: 58px !important;
        margin: 0 !important;
        padding: 0 !important;
        display: block !important;
        background: color-mix(in srgb, var(--bg) 92%, var(--card) 8%) !important;
        border: 0 !important;
        border-bottom: 1px solid color-mix(in srgb, var(--border) 76%, var(--brand) 24%) !important;
        box-shadow: 0 4px 14px rgba(15, 23, 42, .055) !important;
        backdrop-filter: blur(12px) !important;
    }

    .erp-launcher-branch {
        position: absolute !important;
        top: 6px !important;
        left: 8px !important;
        right: auto !important;
        margin: 0 !important;
        width: auto !important;
        max-width: 132px !important;
        min-height: 46px !important;
        padding: 5px 7px 5px 5px !important;
        gap: 6px !important;
        border-radius: 12px !important;
    }

    .erp-launcher-branch-mark {
        width: 28px !important;
        height: 28px !important;
        flex: 0 0 28px !important;
        border-radius: 8px !important;
    }

    .erp-launcher-branch-mark svg {
        width: 18px !important;
        height: 18px !important;
    }

    .erp-launcher-branch-copy {
        min-width: 0 !important;
        max-width: 88px !important;
    }

    .erp-launcher-branch-copy strong,
    .erp-launcher-branch-copy > span {
        display: block !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }

    .erp-launcher-branch-copy strong {
        font-size: 10.5px !important;
        font-weight: 600 !important;
        line-height: 1.15 !important;
    }

    .erp-launcher-branch-copy > span {
        font-size: 9px !important;
        font-weight: 500 !important;
        line-height: 1.15 !important;
    }

    .erp-launcher-user-panel {
        position: absolute !important;
        top: 8px !important;
        right: 8px !important;
        width: auto !important;
        max-width: 116px !important;
        margin: 0 !important;
        z-index: 1900 !important;
    }

    .main-area:has(> .erp-notification-slot) .erp-launcher-user-panel {
        right: 54px !important;
        margin: 0 !important;
    }

    .main-area:has(> .erp-notification-slot > .erp-notification-bell:nth-child(2)) .erp-launcher-user-panel {
        right: 99px !important;
        margin: 0 !important;
    }

    .erp-launcher-user-panel .account-menu,
    .erp-launcher-user-panel .account-menu-button {
        width: auto !important;
        max-width: 116px !important;
    }

    .erp-launcher-user-panel .account-menu-button {
        min-height: 40px !important;
        gap: 5px !important;
        padding: 4px 7px 4px 4px !important;
        border-radius: 12px !important;
    }

    .erp-launcher-user-panel .account-avatar {
        width: 30px !important;
        height: 30px !important;
        flex: 0 0 30px !important;
        font-size: 11px !important;
        font-weight: 600 !important;
    }

    .erp-launcher-user-panel .account-name {
        display: inline-block !important;
        max-width: 58px !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
        font-size: 11px !important;
        font-weight: 500 !important;
    }

    .erp-launcher-user-panel .account-caret {
        display: inline-block !important;
        flex: 0 0 auto !important;
        font-size: 11px !important;
        font-weight: 500 !important;
    }

    .erp-launcher-user-panel .account-dropdown {
        top: calc(100% + 7px) !important;
        right: 0 !important;
        left: auto !important;
        width: min(252px, calc(100vw - 16px)) !important;
        min-width: 0 !important;
    }

    body:has(.erp-launcher-dashboard) .main-area > .erp-notification-slot {
        position: fixed !important;
        top: 8px !important;
        right: 8px !important;
        z-index: 1800 !important;
        gap: 5px !important;
    }

    body:has(.erp-launcher-dashboard) .main-area > .erp-notification-slot > .erp-notification-bell {
        width: 40px !important;
        min-width: 40px !important;
        max-width: 40px !important;
        flex: 0 0 40px !important;
        height: 40px !important;
        border-radius: 12px !important;
    }
}

@media (max-width: 420px) {
    .erp-launcher-branch {
        max-width: 110px !important;
    }

    .erp-launcher-branch-copy {
        max-width: 68px !important;
    }

    .erp-launcher-user-panel {
        max-width: 96px !important;
    }

    .erp-launcher-user-panel .account-menu,
    .erp-launcher-user-panel .account-menu-button {
        max-width: 96px !important;
    }

    .erp-launcher-user-panel .account-name {
        max-width: 40px !important;
    }
}

/* Sub-dashboard launcher: keep the normal left ERP sidebar, but make the
   current menu level use the same centered 94px tiles / 112px columns as Home. */
.erp-subdashboard-section {
    width: 100%;
    min-width: 0;
}

.erp-subdashboard-grid.one-level-dashboard,
.erp-subdashboard-grid.multi-level-dashboard {
    width: min(100%, 812px) !important;
    max-width: 812px !important;
    margin: 0 auto !important;
    display: grid !important;
    grid-template-columns: repeat(6, 112px) !important;
    justify-content: start !important;
    align-items: start !important;
    gap: 30px 28px !important;
}

.erp-subdashboard-grid > .dash-menu-card-shell {
    position: relative;
    width: 112px !important;
    min-width: 0 !important;
}

.erp-subdashboard-grid .dash-menu-card-link.semantic-dashboard-card {
    width: 112px !important;
    min-height: 0 !important;
    height: auto !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 9px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: var(--text) !important;
    text-align: center !important;
    text-decoration: none !important;
    overflow: visible !important;
}

.erp-subdashboard-grid .dash-menu-card-icon.semantic-dashboard-icon {
    width: 94px !important;
    height: 94px !important;
    flex: 0 0 94px !important;
    margin: 0 !important;
    display: grid !important;
    place-items: center !important;
    border: 1px solid color-mix(in srgb, var(--border) 76%, var(--brand) 24%) !important;
    border-radius: 16px !important;
    background: color-mix(in srgb, var(--card) 98%, #ffffff 2%) !important;
    color: var(--brand) !important;
    box-shadow: 0 7px 18px rgba(15, 23, 42, .075), inset 0 1px 0 rgba(255, 255, 255, .62) !important;
    transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease, background .16s ease !important;
}

.erp-subdashboard-grid .dash-menu-card-link:hover .dash-menu-card-icon,
.erp-subdashboard-grid .dash-menu-card-link:focus-visible .dash-menu-card-icon {
    transform: translateY(-4px) !important;
    border-color: color-mix(in srgb, var(--brand) 42%, var(--border)) !important;
    background: var(--card) !important;
    box-shadow: 0 14px 28px rgba(15, 23, 42, .12), inset 0 1px 0 rgba(255, 255, 255, .72) !important;
}

.erp-subdashboard-grid .dash-menu-card-link:focus-visible {
    outline: none !important;
}

.erp-subdashboard-grid .dash-menu-card-link:focus-visible .dash-menu-card-icon {
    outline: 3px solid color-mix(in srgb, var(--brand) 22%, transparent) !important;
    outline-offset: 3px !important;
}

.erp-subdashboard-grid .dash-menu-card-icon .erp-semantic-icon {
    width: 62px !important;
    height: 62px !important;
    border-radius: 0 !important;
    background: transparent !important;
}

.erp-subdashboard-grid .dash-menu-card-icon .erp-nav-svg {
    width: 70% !important;
    height: 70% !important;
    stroke-width: 1.85 !important;
}

.erp-subdashboard-grid .dash-menu-card-body,
.erp-subdashboard-grid .semantic-dashboard-caption {
    width: 112px !important;
    min-width: 0 !important;
}

.erp-subdashboard-grid .dash-menu-card-body h3,
.erp-subdashboard-grid .dash-menu-card-link.semantic-dashboard-card h3 {
    width: 112px !important;
    margin: 0 !important;
    color: color-mix(in srgb, var(--text) 94%, var(--brand) 6%) !important;
    font-size: 12.5px !important;
    font-weight: 520 !important;
    line-height: 1.25 !important;
    text-align: center !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
    hyphens: none !important;
}

/* The normal sub-dashboard is a fixed menu launcher; Quick Access management
   remains available through its corner control, but the tiles are not sortable. */
.erp-subdashboard-grid > [data-dashboard-key] {
    cursor: default !important;
    user-select: auto !important;
    -webkit-user-select: auto !important;
}

.erp-subdashboard-grid > [data-dashboard-key] > a {
    cursor: pointer !important;
}

@media (max-width: 1280px) {
    .erp-subdashboard-grid.one-level-dashboard,
    .erp-subdashboard-grid.multi-level-dashboard {
        width: min(100%, 532px) !important;
        max-width: 532px !important;
        grid-template-columns: repeat(4, 112px) !important;
    }
}

@media (max-width: 820px) {
    .erp-subdashboard-grid.one-level-dashboard,
    .erp-subdashboard-grid.multi-level-dashboard {
        width: min(100%, 392px) !important;
        max-width: 392px !important;
        grid-template-columns: repeat(3, 112px) !important;
        gap: 26px 28px !important;
    }
}

@media (max-width: 520px) {
    .erp-subdashboard-grid.one-level-dashboard,
    .erp-subdashboard-grid.multi-level-dashboard {
        width: min(100%, 252px) !important;
        max-width: 252px !important;
        grid-template-columns: repeat(2, 112px) !important;
        gap: 24px 28px !important;
    }
}

/* ============================================================
   Dashboard fluid mobile 3-column launcher
   v2026.08.23.10-dashboard-mobile-three-column-responsive-grid-fix
   Normal phone widths keep three centered columns; only extremely
   narrow legacy viewports fall back to two. Applies to Main Dashboard
   Quick Access/Application Menu and Home/Module sub-dashboard launchers.
   ============================================================ */
@media (max-width: 720px) {
    .erp-launcher-grid,
    .erp-launcher-dashboard .app-grid,
    .erp-launcher-dashboard .main-only-grid,
    .erp-launcher-dashboard .quick-access-grid,
    .erp-launcher-dashboard .erp-launcher-quick-grid.quick-access-grid,
    .erp-subdashboard-grid.one-level-dashboard,
    .erp-subdashboard-grid.multi-level-dashboard {
        --erp-phone-launcher-col: clamp(88px, 24vw, 96px);
        --erp-phone-launcher-gap: clamp(8px, 3vw, 16px);
        width: max-content !important;
        max-width: 100% !important;
        grid-template-columns: repeat(3, var(--erp-phone-launcher-col)) !important;
        column-gap: var(--erp-phone-launcher-gap) !important;
        row-gap: 24px !important;
        justify-content: start !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    .erp-launcher-item,
    .erp-launcher-dashboard .semantic-dashboard-card-shell,
    .erp-launcher-quick-item,
    .erp-subdashboard-grid > .dash-menu-card-shell {
        width: var(--erp-phone-launcher-col, clamp(88px, 24vw, 96px)) !important;
    }

    .erp-launcher-dashboard .semantic-dashboard-card,
    .erp-launcher-dashboard .app-card.semantic-dashboard-card,
    .erp-launcher-dashboard .quick-access-card.semantic-dashboard-card,
    .erp-launcher-link,
    .erp-subdashboard-grid .dash-menu-card-link.semantic-dashboard-card {
        width: var(--erp-phone-launcher-col, clamp(88px, 24vw, 96px)) !important;
    }

    .erp-launcher-dashboard .semantic-dashboard-icon,
    .erp-launcher-dashboard .app-icon.semantic-dashboard-icon,
    .erp-launcher-dashboard .quick-access-icon.semantic-dashboard-icon,
    .erp-launcher-tile,
    .erp-launcher-dashboard .erp-launcher-quick-tile,
    .erp-subdashboard-grid .dash-menu-card-icon.semantic-dashboard-icon {
        --erp-phone-launcher-tile: clamp(78px, 22vw, 86px);
        width: var(--erp-phone-launcher-tile) !important;
        height: var(--erp-phone-launcher-tile) !important;
        flex: 0 0 var(--erp-phone-launcher-tile) !important;
        border-radius: 14px !important;
    }

    .erp-launcher-dashboard .semantic-dashboard-icon .erp-semantic-icon,
    .erp-launcher-tile .erp-semantic-icon,
    .erp-launcher-dashboard .erp-launcher-quick-tile .erp-semantic-icon,
    .erp-subdashboard-grid .dash-menu-card-icon .erp-semantic-icon {
        width: clamp(50px, 14vw, 58px) !important;
        height: clamp(50px, 14vw, 58px) !important;
    }

    .erp-launcher-caption,
    .erp-launcher-dashboard .semantic-dashboard-title,
    .erp-launcher-dashboard .semantic-dashboard-caption h3,
    .erp-launcher-dashboard .app-card.semantic-dashboard-card h3,
    .erp-launcher-dashboard .quick-access-card.semantic-dashboard-card h3,
    .erp-subdashboard-grid .dash-menu-card-body,
    .erp-subdashboard-grid .semantic-dashboard-caption,
    .erp-subdashboard-grid .dash-menu-card-body h3,
    .erp-subdashboard-grid .dash-menu-card-link.semantic-dashboard-card h3 {
        width: var(--erp-phone-launcher-col, clamp(88px, 24vw, 96px)) !important;
        font-size: 11px !important;
        line-height: 1.2 !important;
    }

    .erp-launcher-quick-item .erp-launcher-quick-badge {
        top: 6px;
        min-width: 62px;
        max-width: 72px;
        padding: 3px 5px;
        font-size: 7.5px;
    }

    .erp-launcher-quick-item .erp-launcher-tile {
        padding-top: 12px;
    }
}

/* Only viewports narrower than normal supported phone widths fall back to two. */
@media (max-width: 290px) {
    .erp-launcher-grid,
    .erp-launcher-dashboard .app-grid,
    .erp-launcher-dashboard .main-only-grid,
    .erp-launcher-dashboard .quick-access-grid,
    .erp-launcher-dashboard .erp-launcher-quick-grid.quick-access-grid,
    .erp-subdashboard-grid.one-level-dashboard,
    .erp-subdashboard-grid.multi-level-dashboard {
        grid-template-columns: repeat(2, 112px) !important;
        width: 240px !important;
        column-gap: 16px !important;
    }
}

/* ============================================================
   Dashboard surface + application icon background unification
   v2026.08.23.14-web-customer-contact-request-dashboard-background-fix
   All semantic dashboard launchers use the same neutral icon tile surface
   as the Main Dashboard; icon accent colors remain only on the glyphs.
   ============================================================ */
.semantic-dashboard-card .semantic-dashboard-icon,
.app-card.semantic-dashboard-card .semantic-dashboard-icon,
.dash-menu-card-link.semantic-dashboard-card .semantic-dashboard-icon,
.quick-access-card.semantic-dashboard-card .semantic-dashboard-icon {
    background: color-mix(in srgb, var(--card) 98%, #ffffff 2%) !important;
    border: 1px solid color-mix(in srgb, var(--border) 76%, var(--brand) 24%) !important;
    box-shadow: 0 7px 18px rgba(15, 23, 42, .075), inset 0 1px 0 rgba(255, 255, 255, .62) !important;
}

.semantic-dashboard-card .semantic-dashboard-icon .erp-semantic-icon,
.app-card.semantic-dashboard-card .semantic-dashboard-icon .erp-semantic-icon,
.dash-menu-card-link.semantic-dashboard-card .semantic-dashboard-icon .erp-semantic-icon,
.quick-access-card.semantic-dashboard-card .semantic-dashboard-icon .erp-semantic-icon {
    background: transparent !important;
}

/* Home/Module dashboards keep their left ERP navigation, but the page and
   application-menu section now use the same dashboard background treatment
   as the Main Dashboard instead of a separate white panel. */
body:has(.erp-subdashboard-section) .app-shell {
    min-height: 100vh;
    background:
        radial-gradient(circle at 50% 0%, color-mix(in srgb, var(--brand) 10%, transparent) 0, transparent 38%),
        linear-gradient(135deg,
            color-mix(in srgb, var(--bg) 94%, var(--brand) 6%) 0%,
            var(--bg) 50%,
            color-mix(in srgb, var(--bg) 96%, var(--brand) 4%) 100%);
}

body:has(.erp-subdashboard-section) .main-area {
    background: transparent !important;
}

.erp-subdashboard-section.odoo-section {
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
}

body.theme-dark:has(.erp-subdashboard-section) .app-shell,
body.theme-midnight:has(.erp-subdashboard-section) .app-shell,
body.theme-carbon:has(.erp-subdashboard-section) .app-shell {
    background:
        radial-gradient(circle at 50% 0, color-mix(in srgb, var(--brand) 18%, transparent) 0, transparent 40%),
        var(--bg);
}

/* v2026.08.24.3 - real VAT/Peppol validation on Customer/Supplier detail */
.peppol-validation-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .55rem;
    margin-top: .65rem;
}

.peppol-validation-status {
    min-width: 0;
    font-size: .82rem;
    line-height: 1.35;
}

.peppol-validation-status.peppol-valid {
    color: var(--erp-success-text, #176b35);
    font-weight: 600;
}

.peppol-validation-status.peppol-error {
    color: var(--erp-danger-text, #a4262c);
    font-weight: 600;
}

.peppol-validation-details {
    margin-top: .7rem;
    border: 1px solid var(--erp-border, rgba(127,127,127,.28));
    border-radius: .5rem;
    background: color-mix(in srgb, var(--erp-surface, #fff) 94%, var(--erp-accent, #6b4eff) 6%);
    overflow: hidden;
}

.peppol-detail-row {
    display: grid;
    grid-template-columns: minmax(8.5rem, 28%) minmax(0, 1fr);
    gap: .6rem;
    padding: .42rem .6rem;
    border-bottom: 1px solid var(--erp-border, rgba(127,127,127,.18));
    font-size: .8rem;
}

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

.peppol-detail-label {
    font-weight: 600;
    color: var(--erp-muted-text, inherit);
}

.peppol-detail-value {
    min-width: 0;
    overflow-wrap: anywhere;
}

@media (max-width: 760px) {
    .peppol-detail-row {
        grid-template-columns: 1fr;
        gap: .18rem;
    }
}

/* v2026.08.24.5 - verified company information enrichment + company Peppol verification */
.peppol-detail-heading {
    padding: .52rem .6rem;
    border-bottom: 1px solid var(--erp-border, rgba(127,127,127,.18));
    background: color-mix(in srgb, var(--erp-accent, #6b4eff) 9%, transparent);
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .015em;
}

.peppol-detail-value-with-action {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: .55rem;
    white-space: pre-wrap;
}

.peppol-detail-value-with-action > span,
.peppol-detail-value-with-action > a {
    min-width: 0;
    overflow-wrap: anywhere;
}

.peppol-detail-value-with-action > a {
    color: var(--erp-link, var(--brand));
    text-decoration: underline;
    text-underline-offset: 2px;
}

.peppol-use-verified-btn {
    flex: 0 0 auto;
    border: 1px solid var(--erp-border, rgba(127,127,127,.32));
    border-radius: .38rem;
    padding: .23rem .48rem;
    background: var(--erp-surface, #fff);
    color: inherit;
    font: inherit;
    font-size: .72rem;
    font-weight: 600;
    cursor: pointer;
}

.peppol-use-verified-btn:hover,
.peppol-use-verified-btn:focus-visible {
    border-color: var(--brand);
    outline: none;
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--brand) 18%, transparent);
}


@media (max-width: 760px) {
    .peppol-detail-value-with-action {
        flex-direction: column;
    }
}


/* v2026.08.24.6 - duplicate VAT guard + Company Peppol Access Point settings */
.duplicate-vat-alert {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    flex-wrap: wrap;
    margin: .65rem .75rem;
    padding: .72rem .82rem;
    border: 1px solid color-mix(in srgb, var(--erp-danger-text, #a4262c) 42%, var(--erp-border, transparent));
    border-radius: .55rem;
    background: color-mix(in srgb, var(--erp-danger-text, #a4262c) 7%, var(--erp-surface, #fff));
}

.duplicate-vat-alert > div {
    min-width: 0;
    line-height: 1.4;
}

.company-peppol-ap-settings {
    margin-top: .8rem;
    padding: .8rem .85rem;
    border: 1px solid var(--erp-border, rgba(127,127,127,.28));
    border-radius: .6rem;
    background: color-mix(in srgb, var(--erp-surface, #fff) 96%, var(--erp-accent, #6b4eff) 4%);
}

.company-peppol-settings-title {
    margin-bottom: .2rem;
    font-weight: 700;
    letter-spacing: .01em;
}

.company-peppol-enabled-row {
    align-items: center;
}

.company-peppol-checkbox {
    width: 1.05rem;
    height: 1.05rem;
    accent-color: var(--brand);
}

.company-peppol-settings-actions {
    margin-top: .7rem;
}

@media (max-width: 760px) {
    .duplicate-vat-alert {
        align-items: stretch;
    }
    .duplicate-vat-alert .odoo-save {
        width: 100%;
        justify-content: center;
    }
}

/* v2026.08.27.3 - POS Sales Load modal: keep the lookup above the sticky Sales header,
   use the desktop width efficiently, and keep invoice/header data on one line. */
.sales-entry-page .sales-old-invoices-backdrop {
    z-index: 4200 !important;
    padding: 12px !important;
}
.sales-entry-page .sales-old-invoices-modal {
    width: min(1540px, calc(100vw - 24px)) !important;
    max-width: calc(100vw - 24px) !important;
    max-height: calc(100vh - 24px) !important;
}
.sales-entry-page .sales-old-invoices-modal .pos-orders-grid-wrap {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    overflow-y: auto !important;
}
.main-area .sales-entry-page .sales-old-invoices-grid {
    width: 100% !important;
    min-width: 1180px !important;
    max-width: none !important;
    table-layout: auto !important;
}
.main-area .sales-entry-page .sales-old-invoices-grid th,
.main-area .sales-entry-page .sales-old-invoices-grid td {
    width: auto !important;
    min-width: max-content !important;
    white-space: nowrap !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
}
.main-area .sales-entry-page .sales-old-invoices-grid th:nth-child(1),
.main-area .sales-entry-page .sales-old-invoices-grid td:nth-child(1) { min-width: 150px !important; }
.main-area .sales-entry-page .sales-old-invoices-grid th:nth-child(2),
.main-area .sales-entry-page .sales-old-invoices-grid td:nth-child(2) { min-width: 170px !important; }
.main-area .sales-entry-page .sales-old-invoices-grid th:nth-child(3),
.main-area .sales-entry-page .sales-old-invoices-grid td:nth-child(3) { min-width: 220px !important; }
.main-area .sales-entry-page .sales-old-invoices-grid th:nth-child(4),
.main-area .sales-entry-page .sales-old-invoices-grid td:nth-child(4) { min-width: 115px !important; }
.main-area .sales-entry-page .sales-old-invoices-grid th:nth-child(5),
.main-area .sales-entry-page .sales-old-invoices-grid td:nth-child(5) { min-width: 110px !important; }
.main-area .sales-entry-page .sales-old-invoices-grid th:nth-child(6),
.main-area .sales-entry-page .sales-old-invoices-grid td:nth-child(6) { min-width: 150px !important; }
.main-area .sales-entry-page .sales-old-invoices-grid th:nth-child(7),
.main-area .sales-entry-page .sales-old-invoices-grid td:nth-child(7) { min-width: 135px !important; }
@media (max-width: 720px) {
    .sales-entry-page .sales-old-invoices-backdrop { padding: 6px !important; }
    .sales-entry-page .sales-old-invoices-modal {
        width: calc(100vw - 12px) !important;
        max-width: calc(100vw - 12px) !important;
        max-height: calc(100vh - 12px) !important;
    }
}

/* v2026.08.27.3 - Daily Sales Summary user Custom View. */
.daily-summary-table th[data-daily-col],
.daily-summary-table td[data-daily-col] {
    white-space: nowrap;
}
.daily-summary-table [data-daily-col][hidden] {
    display: none !important;
}
.daily-custom-view-col {
    width: 44px;
    min-width: 44px;
    max-width: 44px;
    text-align: center !important;
    white-space: nowrap !important;
}
.daily-summary-table thead .daily-custom-view-col {
    position: sticky;
    right: 0;
    z-index: 8;
    background: var(--card, #fff);
    box-shadow: -1px 0 0 var(--border, #dbe4ef);
}
.daily-custom-view-trigger {
    width: 30px;
    height: 30px;
    display: inline-grid;
    place-items: center;
    border: 1px solid var(--border, #dbe4ef);
    border-radius: 7px;
    background: var(--soft, #f8fafc);
    color: var(--text, #0f172a);
    font-size: 17px;
    font-weight: 900;
    line-height: 1;
    cursor: pointer;
}
.daily-custom-view-trigger:hover,
.daily-custom-view-trigger:focus-visible {
    border-color: var(--brand, #2563eb);
    color: var(--brand, #2563eb);
    outline: none;
}
.daily-column-picker {
    position: fixed;
    z-index: 5200;
    width: min(330px, calc(100vw - 20px));
    max-height: min(620px, calc(100vh - 20px));
    overflow: hidden;
    border: 1px solid var(--border, #dbe4ef);
    border-radius: 12px;
    background: var(--card, #fff);
    color: var(--text, #0f172a);
    box-shadow: 0 18px 50px rgba(15,23,42,.22);
}
.daily-column-picker[hidden] { display: none !important; }
.daily-column-picker > header,
.daily-column-picker > footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 11px 12px;
    border-bottom: 1px solid var(--border, #dbe4ef);
}
.daily-column-picker > footer {
    border-top: 1px solid var(--border, #dbe4ef);
    border-bottom: 0;
    justify-content: flex-end;
}
.daily-column-picker > header > div { display: grid; gap: 2px; }
.daily-column-picker > header small { color: var(--muted, #64748b); font-size: 11px; }
.daily-column-picker > header button {
    border: 0;
    background: transparent;
    color: var(--muted, #64748b);
    font-size: 22px;
    cursor: pointer;
}
.daily-column-options {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1px;
    padding: 7px;
    max-height: 460px;
    overflow-y: auto;
}
.daily-column-options label {
    display: flex;
    align-items: center;
    gap: 9px;
    min-height: 34px;
    padding: 6px 8px;
    border-radius: 7px;
    cursor: pointer;
}
.daily-column-options label:hover { background: var(--soft, #f8fafc); }
.daily-column-options input { accent-color: var(--brand, #2563eb); }

/* v2026.08.31.1 - Shared document Activity search, followers and internal task notifications */
.erp-document-activity-tools{margin-left:auto;display:flex;align-items:center;gap:7px;flex:0 0 auto;position:relative}
.erp-document-activity-tool{position:relative;width:36px;height:34px;display:grid;place-items:center;padding:0;border:1px solid var(--border,var(--erp-border,#cbd5e1));border-radius:8px;background:var(--card,var(--erp-card-bg,#fff));color:var(--text,var(--erp-text,#102033));font-size:1.02rem;font-weight:900;cursor:pointer;transition:.15s ease}
.erp-document-activity-tool:hover:not(:disabled){border-color:var(--brand,var(--erp-primary,#714b67));background:color-mix(in srgb,var(--brand,var(--erp-primary,#714b67)) 8%,var(--card,#fff));color:var(--brand,var(--erp-primary,#714b67))}
.erp-document-activity-tool:disabled{opacity:.42;cursor:not-allowed}
.erp-document-followers-button span{font-size:.96rem;filter:saturate(.65)}
.erp-document-followers-button sup{position:absolute;right:-4px;top:-6px;display:grid;place-items:center;min-width:18px;height:18px;padding:0 4px;border:2px solid var(--card,#fff);border-radius:999px;background:var(--brand,var(--erp-primary,#714b67));color:#fff;font-size:.62rem;line-height:1;font-weight:900}
.erp-document-activity-search-shell{position:relative;display:flex;align-items:center;gap:7px;min-width:0;flex:1 1 560px}
.erp-document-activity-search-shell[hidden]{display:none!important}
.erp-document-activity-actions[hidden]{display:none!important}
.erp-document-activity-search-shell input{width:100%;min-width:160px;height:36px;padding:7px 42px 7px 12px;border:1px solid color-mix(in srgb,var(--brand,var(--erp-primary,#714b67)) 42%,var(--border,#cbd5e1));border-radius:8px;background:var(--card,#fff);color:var(--text,#102033);outline:none}
.erp-document-activity-search-shell input:focus{border-color:var(--brand,var(--erp-primary,#714b67));box-shadow:0 0 0 3px color-mix(in srgb,var(--brand,var(--erp-primary,#714b67)) 12%,transparent)}
.erp-document-activity-search-glyph{position:absolute;right:92px;top:50%;transform:translateY(-50%);font-weight:900;color:var(--muted,#64748b);pointer-events:none}
.erp-document-activity-search-summary{padding:7px 12px;text-align:center;border-bottom:1px solid var(--border,#dbe4ee);background:color-mix(in srgb,var(--brand,#714b67) 3%,var(--card,#fff));color:var(--muted,#64748b);font-size:.72rem;font-weight:900;letter-spacing:.035em}
.erp-document-activity-search-summary[hidden]{display:none!important}
.erp-document-activity-card mark[data-activity-search-highlight]{padding:0 2px;border-radius:2px;background:#ffc83d;color:#203040;box-decoration-break:clone;-webkit-box-decoration-break:clone}
.erp-document-activity-filter-menu{position:absolute;right:42px;top:42px;z-index:110;display:grid;min-width:160px;padding:6px;border:1px solid var(--border,#dbe4ee);border-radius:10px;background:var(--card,#fff);box-shadow:0 14px 32px rgba(15,23,42,.16)}
.erp-document-activity-filter-menu button{padding:9px 10px;border:0;border-radius:7px;background:transparent;color:var(--text,#102033);text-align:left;font-weight:700;cursor:pointer}
.erp-document-activity-filter-menu button:hover,.erp-document-activity-filter-menu button.active{background:color-mix(in srgb,var(--brand,#714b67) 10%,var(--card,#fff));color:var(--brand,#714b67)}
.sales-entry-page .sales-unified-activity-toolbar,.sales-entry-page .sales-return-activity-toolbar{gap:8px!important}
.sales-entry-page .sales-unified-activity-toolbar .erp-document-activity-search-shell,.sales-entry-page .sales-return-activity-toolbar .erp-document-activity-search-shell{flex:1 1 620px}

.erp-document-followers-popover{position:fixed;z-index:5200;max-height:min(430px,70vh);overflow:auto;border:1px solid var(--border,#dbe4ee);border-radius:12px;background:var(--card,#fff);color:var(--text,#102033);box-shadow:0 18px 46px rgba(15,23,42,.22)}
.erp-followers-pop-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 13px;border-bottom:1px solid var(--border,#e3e8ef)}
.erp-followers-pop-head span{display:grid;place-items:center;min-width:23px;height:23px;padding:0 6px;border-radius:999px;background:color-mix(in srgb,var(--brand,#714b67) 12%,var(--card,#fff));color:var(--brand,#714b67);font-weight:900;font-size:.72rem}
.erp-followers-pop-actions{display:grid;gap:3px;padding:7px;border-bottom:1px solid var(--border,#e3e8ef)}
.erp-followers-pop-actions button{padding:9px 10px;border:0;border-radius:8px;background:transparent;color:var(--text,#102033);text-align:left;font-weight:800;cursor:pointer}
.erp-followers-pop-actions button:hover{background:color-mix(in srgb,var(--brand,#714b67) 8%,var(--card,#fff));color:var(--brand,#714b67)}
.erp-followers-pop-actions button.danger{color:#c0392b}
.erp-followers-pop-list{display:grid;padding:6px}
.erp-followers-pop-user{display:grid;grid-template-columns:34px minmax(0,1fr) 30px;gap:8px;align-items:center;padding:7px;border-radius:9px}
.erp-followers-pop-user:hover{background:var(--soft,#f7f9fc)}
.erp-followers-avatar{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:color-mix(in srgb,var(--brand,#714b67) 12%,var(--card,#fff));color:var(--brand,#714b67);font-weight:900}
.erp-followers-pop-user div{min-width:0}.erp-followers-pop-user strong,.erp-followers-pop-user small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.erp-followers-pop-user small{margin-top:2px;color:var(--muted,#64748b);font-size:.7rem}
.erp-followers-pop-user button{width:28px;height:28px;border:0;border-radius:7px;background:transparent;color:var(--muted,#64748b);font-size:1.1rem;cursor:pointer}.erp-followers-pop-user button:hover{background:#fee2e2;color:#b91c1c}
.erp-followers-empty{margin:0;padding:18px 10px;text-align:center;color:var(--muted,#64748b)}

.erp-collab-modal-backdrop{position:fixed;inset:0;z-index:6500;display:grid;place-items:center;padding:20px;background:rgba(15,23,42,.52);backdrop-filter:blur(2px)}
.erp-collab-modal-backdrop[hidden]{display:none!important}
.erp-collab-modal{width:min(680px,96vw);max-height:min(760px,94vh);display:flex;flex-direction:column;overflow:hidden;border:1px solid var(--border,#dbe4ee);border-radius:14px;background:var(--card,#fff);color:var(--text,#102033);box-shadow:0 30px 80px rgba(15,23,42,.3)}
.erp-collab-modal>header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:17px 19px;border-bottom:1px solid var(--border,#dbe4ee)}
.erp-collab-modal h2{margin:2px 0 0;font-size:1.2rem}.erp-collab-kicker{color:var(--brand,#714b67);font-size:.65rem;font-weight:900;letter-spacing:.09em}
.erp-collab-modal>header>button{width:32px;height:32px;border:0;background:transparent;color:var(--muted,#64748b);font-size:1.55rem;cursor:pointer}
.erp-collab-modal-body{padding:18px;overflow:auto;display:grid;gap:15px}
.erp-collab-modal>footer{display:flex;gap:8px;padding:14px 18px;border-top:1px solid var(--border,#dbe4ee);background:var(--soft,#f7f9fc)}
.erp-collab-modal>footer button,.erp-collab-modal>footer a{display:inline-flex;align-items:center;justify-content:center;min-height:38px;padding:8px 13px;border:1px solid var(--border,#cbd5e1);border-radius:8px;background:var(--card,#fff);color:var(--text,#102033);text-decoration:none;font-weight:850;cursor:pointer}
.erp-collab-modal>footer .erp-collab-primary{border-color:var(--brand,#714b67);background:var(--brand,#714b67);color:var(--brand-contrast,#fff)}
.erp-collab-field,.erp-collab-task-fields label{display:grid;gap:7px;font-weight:800}.erp-collab-field>span,.erp-collab-task-fields label>span{font-size:.8rem}
.erp-collab-user-picker{min-height:42px;display:flex;align-items:center;flex-wrap:wrap;gap:6px;padding:5px 8px;border:1px solid var(--border,#cbd5e1);border-radius:9px;background:var(--card,#fff)}
.erp-collab-user-picker:focus-within{border-color:var(--brand,#714b67);box-shadow:0 0 0 3px color-mix(in srgb,var(--brand,#714b67) 11%,transparent)}
.erp-collab-user-picker input{flex:1 1 220px;min-width:150px;height:30px;border:0!important;outline:0!important;background:transparent!important;color:var(--text,#102033);box-shadow:none!important}
.erp-collab-chips{display:flex;flex-wrap:wrap;gap:5px}.erp-collab-chip{display:inline-flex;align-items:center;gap:5px;padding:5px 8px;border-radius:999px;background:color-mix(in srgb,var(--brand,#714b67) 12%,var(--card,#fff));font-size:.74rem;font-weight:850}.erp-collab-chip button{border:0;background:transparent;padding:0;color:inherit;font-weight:900;cursor:pointer}
.erp-collab-user-suggestions{max-height:240px;overflow:auto;margin-top:-8px;padding:5px;border:1px solid var(--border,#dbe4ee);border-radius:9px;background:var(--card,#fff);box-shadow:0 12px 26px rgba(15,23,42,.15)}
.erp-collab-user-suggestions button{width:100%;display:grid;gap:2px;padding:8px 10px;border:0;border-radius:7px;background:transparent;color:var(--text,#102033);text-align:left;cursor:pointer}.erp-collab-user-suggestions button:hover{background:color-mix(in srgb,var(--brand,#714b67) 8%,var(--card,#fff))}.erp-collab-user-suggestions span{font-weight:850}.erp-collab-user-suggestions small{color:var(--muted,#64748b)}.erp-collab-no-users{padding:14px;text-align:center;color:var(--muted,#64748b)}
.erp-collab-toggle-row{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:12px 0}.erp-collab-toggle-row>div{display:grid;gap:3px}.erp-collab-toggle-row small{color:var(--muted,#64748b);font-size:.74rem}
.erp-switch{position:relative;display:inline-flex!important;width:42px;height:24px;flex:0 0 42px}.erp-switch input{position:absolute;opacity:0;pointer-events:none}.erp-switch>span{position:absolute;inset:0;border-radius:999px;background:#cbd5e1;transition:.16s}.erp-switch>span:after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 1px 4px rgba(0,0,0,.2);transition:.16s}.erp-switch input:checked+span{background:#22b455}.erp-switch input:checked+span:after{transform:translateX(18px)}.erp-switch.compact{width:36px;height:20px;flex-basis:36px}.erp-switch.compact>span:after{width:14px;height:14px}.erp-switch.compact input:checked+span:after{transform:translateX(16px)}
.erp-collab-task-fields{display:grid;gap:12px;padding-top:5px}.erp-collab-task-fields[hidden]{display:none!important}.erp-collab-task-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.erp-collab-task-fields input,.erp-collab-task-fields select,.erp-collab-task-fields textarea{width:100%;padding:9px 10px;border:1px solid var(--border,#cbd5e1);border-radius:8px;background:var(--card,#fff);color:var(--text,#102033)}.erp-collab-task-fields textarea{resize:vertical}.erp-collab-hint{margin:0;color:var(--muted,#64748b);font-size:.75rem;line-height:1.45}.erp-collab-modal-status{padding:10px 12px;border-radius:8px;background:#fff2f0;color:#a61b13;font-weight:800}.erp-collab-modal-status[hidden]{display:none!important}

.erp-document-task-notification.has-unread{border-color:color-mix(in srgb,var(--brand,#714b67) 55%,var(--border,#dbe4ee))!important;background:color-mix(in srgb,var(--brand,#714b67) 10%,var(--card,#fff))!important}
.erp-document-notification-panel{position:fixed;z-index:4800;top:58px;right:12px;width:min(430px,calc(100vw - 24px));max-height:min(620px,calc(100vh - 76px));overflow:hidden;display:flex;flex-direction:column;border:1px solid var(--border,#dbe4ee);border-radius:14px;background:var(--card,#fff);color:var(--text,#102033);box-shadow:0 22px 60px rgba(15,23,42,.24)}
.erp-document-notification-panel[hidden]{display:none!important}
.erp-document-notification-panel>header{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:13px 14px;border-bottom:1px solid var(--border,#dbe4ee)}.erp-document-notification-panel>header>div{display:grid;gap:2px}.erp-document-notification-panel>header small{color:var(--muted,#64748b);font-size:.7rem}.erp-document-notification-panel>header button{border:0;background:transparent;color:var(--brand,#714b67);font-size:.72rem;font-weight:850;cursor:pointer}
.erp-task-preferences{display:flex;gap:12px;padding:10px 14px;border-bottom:1px solid var(--border,#e5e7eb);background:var(--soft,#f7f9fc)}.erp-task-preferences label{display:flex;align-items:center;gap:7px;font-size:.72rem;font-weight:800}
.erp-document-notification-list{overflow:auto;min-height:90px}.erp-task-empty{padding:28px 14px;text-align:center;color:var(--muted,#64748b)}
.erp-task-row{width:100%;display:grid;grid-template-columns:32px minmax(0,1fr) auto;gap:9px;align-items:start;padding:11px 12px;border:0;border-bottom:1px solid var(--border,#e5e7eb);background:var(--card,#fff);color:var(--text,#102033);text-align:left;cursor:pointer}.erp-task-row:hover{background:color-mix(in srgb,var(--brand,#714b67) 5%,var(--card,#fff))}.erp-task-row.unread{background:color-mix(in srgb,var(--brand,#714b67) 8%,var(--card,#fff))}.erp-task-row.done{opacity:.68}.erp-task-row-icon{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:color-mix(in srgb,var(--brand,#714b67) 12%,var(--card,#fff));color:var(--brand,#714b67);font-weight:900}.erp-task-row-main{display:grid;gap:2px;min-width:0}.erp-task-row-main strong,.erp-task-row-main small,.erp-task-row-main>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.erp-task-row-main small,.erp-task-row time{color:var(--muted,#64748b);font-size:.67rem}.erp-task-row-main>span{font-size:.75rem}.erp-task-row time{white-space:nowrap}
.erp-task-toast{position:relative;display:grid!important;grid-template-columns:30px minmax(0,1fr) 24px;gap:9px;width:min(390px,calc(100vw - 28px));padding:12px;border:1px solid var(--border,#dbe4ee);border-left:4px solid #238636;border-radius:10px;background:var(--card,#fff);color:var(--text,#102033);box-shadow:0 18px 50px rgba(15,23,42,.24);text-align:left;cursor:pointer;opacity:0;transform:translateX(18px);transition:.2s ease}.erp-task-toast.show{opacity:1;transform:none}.erp-task-toast-check{display:grid;place-items:center;width:24px;height:24px;border:2px solid #23a43c;border-radius:50%;color:#15803d;font-weight:900}.erp-task-toast>span:nth-child(2){display:grid;gap:2px;min-width:0}.erp-task-toast small{color:var(--muted,#64748b);font-size:.65rem}.erp-task-toast strong{font-size:.82rem}.erp-task-toast em{color:var(--brand,#714b67);font-size:.7rem;font-style:normal;font-weight:800}.erp-task-toast>span:nth-child(2)>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.72rem}.erp-task-toast b{font-size:1rem;color:var(--muted,#64748b);font-weight:500}
.erp-task-detail{width:min(720px,96vw)}.erp-task-detail-meta{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.erp-task-detail-meta>div{display:grid;gap:3px;padding:10px;border:1px solid var(--border,#dbe4ee);border-radius:9px;background:var(--soft,#f7f9fc)}.erp-task-detail-meta span{color:var(--muted,#64748b);font-size:.67rem}.erp-task-detail-meta strong{font-size:.8rem;overflow-wrap:anywhere}.erp-task-detail-message{padding:15px;border:1px solid var(--border,#dbe4ee);border-radius:10px;line-height:1.55;background:var(--card,#fff)}.erp-task-document-reference{display:grid;grid-template-columns:auto 1fr;gap:3px 10px;align-items:center;padding:12px;border-radius:10px;background:color-mix(in srgb,var(--brand,#714b67) 6%,var(--card,#fff))}.erp-task-document-reference>span{grid-row:1/3;color:var(--muted,#64748b);font-size:.7rem;font-weight:800}.erp-task-document-reference a{color:var(--brand,#714b67);font-weight:900;text-decoration:none}.erp-task-document-reference small{color:var(--muted,#64748b)}.priority-high{color:#b45309}.priority-urgent{color:#b91c1c}

/* The collaboration task bell makes the notification rail one item wider when present. */
.main-area:has(> .erp-notification-slot){--erp-global-notification-rail:56px}
.main-area:has(> .erp-notification-slot > .erp-notification-bell:nth-child(2)){--erp-global-notification-rail:104px}
.main-area:has(> .erp-notification-slot > .erp-notification-bell:nth-child(3)){--erp-global-notification-rail:152px}
.main-area:has(> .erp-notification-slot > .erp-notification-bell:nth-child(3)) .erp-launcher-user-panel{right:184px!important;margin:0!important}
@media(max-width:760px){.main-area:has(> .erp-notification-slot){--erp-global-notification-rail:48px}.main-area:has(> .erp-notification-slot > .erp-notification-bell:nth-child(2)){--erp-global-notification-rail:92px}.main-area:has(> .erp-notification-slot > .erp-notification-bell:nth-child(3)){--erp-global-notification-rail:136px}.erp-document-notification-panel{top:52px}.erp-task-detail-meta{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.erp-document-activity-toolbar{flex-wrap:wrap}.erp-document-activity-search-shell{order:1;flex-basis:100%}.erp-document-activity-tools{margin-left:auto}.erp-collab-task-grid,.erp-task-detail-meta{grid-template-columns:1fr}.erp-task-preferences{align-items:flex-start;flex-direction:column}.erp-collab-modal-backdrop{padding:8px}.erp-collab-modal{max-height:96vh}.erp-document-notification-panel{right:8px;width:calc(100vw - 16px)}}
.erp-task-priority{display:inline-flex;vertical-align:middle;margin-left:5px;padding:2px 6px;border-radius:999px;background:var(--soft,#f7f9fc);font-size:.6rem;font-style:normal;font-weight:900;text-transform:uppercase;letter-spacing:.02em}.priority-normal{color:var(--muted,#64748b)}
/* ERP v2026.08.31.2 - POS adjustment dialog preview + reliable activity search */
.sales-entry-page[data-document-mode="POS"] [data-legacy-pos-summary-adjustment]{display:none!important}
.sales-entry-page .sales-adjustment-modal-backdrop[hidden]{display:none!important}
.sales-entry-page .sales-adjustment-modal-backdrop{position:fixed;inset:0;z-index:2147483200;background:rgba(15,23,42,.48);display:grid;place-items:center;padding:18px;backdrop-filter:blur(1px)}
.sales-entry-page .sales-adjustment-modal{width:min(980px,calc(100vw - 28px));max-height:min(82vh,720px);overflow:auto;background:var(--card,#fff);color:var(--text,#111827);border:1px solid var(--border,#d1d5db);border-radius:10px;box-shadow:0 24px 70px rgba(15,23,42,.28)}
.sales-entry-page .sales-adjustment-modal-head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:17px 18px;border-bottom:1px solid var(--border,#d1d5db)}
.sales-entry-page .sales-adjustment-modal-head h2{margin:0;font-size:1.05rem;font-weight:800}
.sales-entry-page .sales-adjustment-modal-close{border:0;background:transparent;color:var(--muted,#6b7280);font-size:30px;line-height:1;cursor:pointer;padding:0 2px}
.sales-entry-page .sales-adjustment-modal-body{padding:22px 18px;display:grid;gap:18px}
.sales-entry-page .sales-adjustment-value-row{display:grid;grid-template-columns:minmax(160px,.45fr) minmax(220px,.55fr);gap:30px;align-items:center}
.sales-entry-page .sales-adjustment-value-row>label,.sales-entry-page .sales-shipping-preview-grid label>span{font-weight:700}
.sales-entry-page .sales-adjustment-number-wrap{display:flex;align-items:center;gap:10px;min-width:0}
.sales-entry-page .sales-adjustment-number-wrap input,.sales-entry-page .sales-shipping-preview-grid input,.sales-entry-page .sales-shipping-preview-grid select{width:100%;min-height:38px;border:0;border-bottom:1px solid color-mix(in srgb,var(--brand,var(--erp-primary,#714b67)) 45%,var(--border,#cbd5e1));background:transparent;color:var(--text,#111827);padding:7px 4px;outline:none}
.sales-entry-page .sales-adjustment-number-wrap input:focus,.sales-entry-page .sales-shipping-preview-grid input:focus,.sales-entry-page .sales-shipping-preview-grid select:focus{border-bottom-color:var(--brand,var(--erp-primary,#714b67));box-shadow:0 1px 0 var(--brand,var(--erp-primary,#714b67))}
.sales-entry-page .sales-adjustment-options{border:0;margin:0;padding:0 0 0 min(34%,300px);display:grid;gap:10px}
.sales-entry-page .sales-adjustment-options label{display:flex;align-items:center;gap:8px;font-weight:700;cursor:pointer}
.sales-entry-page .sales-adjustment-options input{accent-color:var(--brand,var(--erp-primary,#714b67))}
.sales-entry-page .sales-adjustment-modal-foot{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:16px 18px;border-top:1px solid var(--border,#d1d5db)}
.sales-entry-page .sales-adjustment-modal-foot .sales-action:disabled{opacity:.48;cursor:not-allowed}
.sales-entry-page .sales-adjustment-phase-note{margin-left:auto;color:var(--muted,#64748b);font-size:.78rem;font-weight:700}
.sales-entry-page .sales-shipping-preview-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 26px}
.sales-entry-page .sales-shipping-preview-grid label{display:grid;gap:5px}
.sales-entry-page .sales-adjustment-help{margin:0;color:var(--muted,#64748b);line-height:1.5}
.erp-document-activity-card .erp-document-activity-item[hidden],.erp-document-activity-card .sales-activity-item[hidden],.erp-document-activity-card .sales-activity-date-group[hidden]{display:none!important}
@media(max-width:680px){.sales-entry-page .sales-adjustment-value-row,.sales-entry-page .sales-shipping-preview-grid{grid-template-columns:1fr}.sales-entry-page .sales-adjustment-options{padding-left:0}.sales-entry-page .sales-adjustment-phase-note{width:100%;margin-left:0}}

\n\n/* v2026.08.31.4 - Default Ledger Accounts / document adjustments */\n.default-ledger-settings-page{max-width:1180px;margin:0 auto;padding:12px 16px 30px}.erp-settings-card{background:var(--surface,#fff);border:1px solid var(--border,#d8dee9);border-radius:12px;box-shadow:0 8px 28px rgba(15,23,42,.08);overflow:hidden}.erp-settings-heading{padding:20px 22px;border-bottom:1px solid var(--border,#d8dee9)}.erp-settings-heading h1{margin:2px 0 5px;font-size:23px}.erp-settings-heading p{margin:0;color:var(--muted,#64748b)}.erp-settings-kicker{font-size:11px;font-weight:800;letter-spacing:.11em;color:var(--primary,#2563eb)}.default-ledger-user-form{padding:16px 22px 4px;max-width:440px}.default-ledger-user-form label,.default-ledger-field{display:flex;flex-direction:column;gap:6px;font-weight:700}.default-ledger-user-form select,.default-ledger-field select{min-height:38px;border:1px solid var(--border,#cbd5e1);border-radius:7px;background:var(--surface,#fff);color:inherit;padding:6px 9px}.default-ledger-form{padding:12px 22px 22px}.default-ledger-grid{display:grid;grid-template-columns:repeat(2,minmax(260px,1fr));gap:14px 20px}.default-ledger-field small{font-weight:500;color:var(--muted,#64748b)}.default-ledger-help{margin-top:18px;padding:12px 14px;border-radius:8px;background:var(--surface-soft,#f8fafc);border:1px solid var(--border,#d8dee9);font-size:13px}.erp-settings-actions{display:flex;gap:8px;margin-top:18px}.sales-document-adjustment-row td{background:color-mix(in srgb,var(--surface,#fff) 92%,var(--primary,#2563eb) 8%);font-weight:600}.sales-document-adjustment-discount td{font-style:italic}.sales-adjustment-row-edit{border:0;background:transparent;cursor:pointer;padding:3px 6px}.sales-adjustment-legacy-lock{opacity:.65}.erp-collab-email-option .erp-user-suggestion-avatar,.erp-followers-pop-user.external .erp-followers-avatar{font-size:13px}.erp-collab-due-grid{display:grid;grid-template-columns:minmax(0,1fr) 120px;gap:10px}.erp-external-email-chip::before{content:'✉';margin-right:5px}.erp-followers-external-tag{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--muted,#64748b)}\n@media (max-width:760px){.default-ledger-grid{grid-template-columns:1fr}.erp-collab-due-grid{grid-template-columns:1fr}.default-ledger-settings-page{padding:8px}.default-ledger-form,.default-ledger-user-form,.erp-settings-heading{padding-left:14px;padding-right:14px}}\n
/* v2026.09.01.6 - POS Add Shipping modal clarity and VAT dropdown layering */
body.sales-adjustment-modal-open .erp-select-portal{
    z-index:2147483500!important;
}
.sales-entry-page .sales-shipping-preview-modal{
    width:min(920px,calc(100vw - 28px));
}
.sales-entry-page .sales-shipping-preview-grid{
    align-items:start;
}
.sales-entry-page .sales-shipping-preview-grid .sales-shipping-field > .erp-select-presenter{
    width:100%;
    min-width:0;
}
.sales-entry-page .sales-shipping-preview-grid .sales-shipping-field > span,
.sales-entry-page .sales-shipping-amount-field > span,
.sales-entry-page .sales-shipping-total-card > span{
    font-size:14px;
    line-height:1.25;
}
.sales-entry-page .sales-shipping-amount-card{
    grid-column:1 / -1;
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(210px,.72fr);
    gap:14px;
    padding:16px;
    border:1px solid color-mix(in srgb,var(--brand,var(--erp-primary,#714b67)) 20%,var(--border,#cbd5e1));
    border-radius:12px;
    background:color-mix(in srgb,var(--brand,var(--erp-primary,#714b67)) 3%,var(--card,#fff));
}
.sales-entry-page .sales-shipping-amount-field{
    display:grid;
    align-content:start;
    gap:6px;
    min-width:0;
}
.sales-entry-page .sales-shipping-amount-field small{
    color:var(--muted,#64748b);
    font-size:11px;
    line-height:1.35;
}
.sales-entry-page .sales-shipping-amount-field .sales-adjustment-number-wrap input{
    min-height:42px;
    font-size:14px!important;
    font-weight:800;
    font-variant-numeric:tabular-nums;
}
.sales-entry-page .sales-shipping-amount-field .sales-adjustment-number-wrap > span{
    font-size:14px;
    font-weight:800;
}
.sales-entry-page .sales-shipping-total-card{
    display:grid;
    align-content:center;
    gap:5px;
    min-width:0;
    padding:12px 14px;
    border:1px solid color-mix(in srgb,var(--brand,var(--erp-primary,#714b67)) 28%,var(--border,#cbd5e1));
    border-radius:10px;
    background:var(--card,#fff);
}
.sales-entry-page .sales-shipping-total-card strong{
    display:flex;
    align-items:baseline;
    gap:6px;
    color:var(--brand,var(--erp-primary,#714b67));
    font-size:20px;
    font-weight:900;
    font-variant-numeric:tabular-nums;
}
.sales-entry-page .sales-shipping-total-card strong em{
    font-size:14px;
    font-style:normal;
    font-weight:800;
}
.sales-entry-page .sales-shipping-total-card small{
    color:var(--muted,#64748b);
    font-size:12px;
    font-weight:700;
}
.sales-entry-page .sales-shipping-ledger-field{
    grid-column:1 / -1;
}
.sales-entry-page .sales-shipping-ledger-field input[readonly]{
    background:color-mix(in srgb,var(--soft,#f8fafc) 85%,transparent);
    color:var(--muted,#64748b);
}
@media(max-width:760px){
    .sales-entry-page .sales-shipping-amount-card{grid-template-columns:1fr;}
    .sales-entry-page .sales-shipping-total-card{min-height:84px;}
}

/* v2026.09.01.11 - converted Settings / Accounting / Default Ledger Accounts */
.default-ledger-settings-page .erp-settings-card{margin-top:10px}
.default-ledger-user-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center}
.default-ledger-user-row .btn{min-height:38px}
.default-ledger-user-form small{display:block;margin-top:6px;color:var(--muted,#64748b);font-weight:500}
.default-ledger-section{padding:18px 0 4px;border-top:1px solid var(--border,#d8dee9)}
.default-ledger-section:first-of-type{border-top:0;padding-top:2px}
.default-ledger-section-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:13px}
.default-ledger-section-heading h2{margin:0 0 3px;font-size:16px;font-weight:800}
.default-ledger-section-heading p{margin:0;color:var(--muted,#64748b);font-size:12px}
.default-ledger-transport-section{margin-top:4px}
.default-ledger-effective{display:block;padding:7px 9px;border:1px solid color-mix(in srgb,var(--brand,var(--erp-primary,#714b67)) 18%,var(--border,#d8dee9));border-radius:7px;background:color-mix(in srgb,var(--brand,var(--erp-primary,#714b67)) 4%,var(--surface,#fff));color:var(--text,#1f2937)!important}
.default-ledger-help a{font-weight:700}
@media(max-width:760px){.default-ledger-user-row{grid-template-columns:1fr}.default-ledger-user-row .btn{width:100%}}

/* ERPWebMvc hardened Web login / MFA */
.web-login-remember{display:grid!important;grid-template-columns:auto 1fr;gap:2px 8px!important;align-items:center;margin:2px 0 8px!important;font-weight:700!important}
.web-login-remember input{width:16px!important;height:16px!important;min-height:0!important;margin:0!important;grid-row:1/span 2}
.web-login-remember span{font-size:12px}.web-login-remember small{font-size:10.5px;color:var(--muted,var(--erp-muted,#64748b));font-weight:500}
.web-security-card{width:min(520px,calc(100vw - 28px))!important}.web-security-intro{margin:0 0 14px;color:var(--muted,var(--erp-muted,#64748b));font-size:12px;line-height:1.45}
.web-mfa-code{font-size:20px!important;letter-spacing:.12em!important;font-variant-numeric:tabular-nums;text-align:center}
.web-mfa-setup-card{width:min(620px,calc(100vw - 28px))!important}.web-mfa-setup-grid{display:grid;grid-template-columns:180px minmax(0,1fr);gap:18px;align-items:center;margin:4px 0 16px;padding:14px;border:1px solid var(--border,var(--erp-border,#dbe4ee));border-radius:10px;background:var(--soft,var(--erp-soft,#f8fafc))}
.web-mfa-qr img{display:block;width:170px;height:170px;max-width:100%;background:#fff;padding:6px;border-radius:8px}.web-mfa-setup-copy{display:grid;gap:6px}.web-mfa-setup-copy p{margin:0 0 8px;color:var(--muted,var(--erp-muted,#64748b));font-size:11px}.web-mfa-setup-copy code{display:block;padding:8px;border:1px solid var(--border,var(--erp-border,#dbe4ee));border-radius:6px;background:var(--card,var(--erp-card-bg,#fff));font-size:12px;overflow-wrap:anywhere;user-select:all}
.web-recovery-card{max-width:680px;margin:20px auto}.web-recovery-codes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:16px 0}.web-recovery-codes code{padding:9px 10px;border:1px solid var(--border,var(--erp-border,#dbe4ee));border-radius:7px;background:var(--soft,var(--erp-soft,#f8fafc));font-size:13px;text-align:center;user-select:all}
@media(max-width:620px){.web-mfa-setup-grid{grid-template-columns:1fr}.web-mfa-qr{display:flex;justify-content:center}.web-recovery-codes{grid-template-columns:1fr}}

/* POS Sales: compact single-line Outstanding credits to match the desktop reference. */
.sales-entry-page .sales-customer-credit-panel{margin:10px 0 5px;padding:10px 0 0}
.sales-entry-page .sales-customer-credit-title{margin:0 0 6px;font-size:12px;font-weight:800}
.sales-entry-page .sales-customer-credit-row{display:grid!important;grid-template-columns:16px auto minmax(0,1fr) auto auto!important;grid-template-rows:1fr!important;gap:6px!important;align-items:center!important;min-height:28px!important;padding:2px 0!important;font-size:11px!important;line-height:1.1!important;overflow:hidden!important}
.sales-entry-page .sales-customer-credit-row>*{grid-row:1!important;min-width:0!important}
.sales-entry-page .sales-customer-credit-info{grid-column:1!important;width:14px!important;height:14px!important;min-width:14px!important;padding:0!important;border:0!important;background:transparent!important;color:#0799a8!important;font-size:12px!important;line-height:1!important;box-shadow:none!important}
.sales-entry-page .sales-customer-credit-date{grid-column:2!important;white-space:nowrap!important;font-size:11px!important}
.sales-entry-page .sales-customer-credit-document{grid-column:3!important;width:auto!important;max-width:100%!important;padding:0!important;border:0!important;background:transparent!important;font-size:11px!important;line-height:1.1!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
.sales-entry-page .sales-customer-credit-method,.sales-entry-page .sales-customer-credit-meta{display:none!important}
.sales-entry-page .sales-customer-credit-add{grid-column:4!important;justify-self:end!important;min-height:24px!important;padding:3px 8px!important;border:1px solid var(--border,#cbd5e1)!important;border-radius:4px!important;background:var(--card,#fff)!important;color:var(--text,#0f172a)!important;font-size:11px!important;line-height:1!important;font-weight:700!important;white-space:nowrap!important}
.sales-entry-page .sales-customer-credit-amount{grid-column:5!important;min-width:max-content!important;max-width:none!important;font-size:11px!important;line-height:1.1!important;font-weight:700!important;white-space:nowrap!important;text-align:right!important;font-variant-numeric:tabular-nums}

/* POS Sales Received Payment: credit/payment history rows remain one compact line. */
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-line-row.pos-payment-line-credit-settlement,
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-line-row.pos-payment-line-credit-settlement{display:grid!important;grid-template-columns:minmax(0,1fr) auto auto!important;align-items:center!important;gap:6px!important;min-height:28px!important;padding:3px 6px!important;font-size:11px!important;line-height:1.1!important;overflow:hidden!important}
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-line-credit-settlement.pos-payment-line-receipt-settlement,
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-line-credit-settlement.pos-payment-line-receipt-settlement{grid-template-columns:minmax(0,1fr) auto!important}
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-line-credit-settlement .sales-credit-settlement-inline,
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-line-credit-settlement .sales-credit-settlement-inline{display:flex!important;align-items:center!important;gap:4px!important;min-width:0!important;max-width:100%!important;overflow:hidden!important}
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-line-credit-settlement .sales-customer-credit-info,
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-line-credit-settlement .sales-customer-credit-info{width:14px!important;height:14px!important;min-width:14px!important;font-size:12px!important;padding:0!important;border:0!important;background:transparent!important;box-shadow:none!important}
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-line-credit-settlement .sales-customer-credit-document,
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-line-credit-settlement .sales-customer-credit-document{display:block!important;min-width:0!important;width:auto!important;max-width:100%!important;padding:0!important;border:0!important;background:transparent!important;font-size:11px!important;font-weight:600!important;line-height:1.1!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;overflow-wrap:normal!important}
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-line-credit-settlement>span:nth-child(2),
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-line-credit-settlement>span:nth-child(2){font-size:11px!important;font-weight:600!important;white-space:nowrap!important;min-width:max-content!important;font-variant-numeric:tabular-nums}
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-line-credit-settlement .pos-payment-change-note,
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-line-credit-settlement .pos-payment-change-note{display:none!important}
body .sales-payment-touch-modal.pos-payment-confirmation-view .pos-payment-line-credit-settlement .pos-payment-remove,
body .pos-payment-touch-modal.pos-payment-confirmation-view .pos-payment-line-credit-settlement .pos-payment-remove{width:24px!important;height:24px!important;min-width:24px!important;padding:0!important;font-size:13px!important}

/* v2026.09.02.18 - Viva Smart Checkout payment gateway setup */
.viva-gateway-page { display:grid; gap:16px; }
.viva-gateway-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; padding-bottom:10px; border-bottom:1px solid var(--border); }
.viva-gateway-heading h2 { margin:0 0 3px; font-size:1.2rem; }
.viva-gateway-heading p { margin:0; color:var(--muted); }
.viva-status-cluster { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:7px; }
.viva-status-pill { display:inline-flex; align-items:center; min-height:25px; padding:4px 9px; border:1px solid var(--border); border-radius:999px; font-size:.72rem; font-weight:800; letter-spacing:.025em; background:var(--surface); }
.viva-status-pill.is-enabled,.viva-status-pill.is-configured { color:#087a42; border-color:rgba(8,122,66,.25); background:rgba(30,190,105,.10); }
.viva-status-pill.is-warning { color:#9a5700; border-color:rgba(192,116,0,.25); background:rgba(255,175,36,.12); }
.viva-status-pill.is-disabled { color:var(--muted); }
.viva-security-note { display:flex; gap:10px; align-items:flex-start; padding:10px 12px; border:1px solid color-mix(in srgb,var(--primary) 35%,var(--border)); border-radius:12px; background:color-mix(in srgb,var(--primary) 7%,var(--card)); font-size:.84rem; }
.viva-info-icon { flex:0 0 22px; width:22px; height:22px; display:inline-grid; place-items:center; border-radius:50%; background:var(--primary); color:#fff; font-size:.76rem; font-weight:800; }
.viva-config-card { display:grid; gap:14px; padding:16px; border:1px solid var(--border); border-radius:14px; background:var(--card); }
.viva-card-title { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; padding-bottom:10px; border-bottom:1px solid var(--border); }
.viva-card-title strong { display:block; font-size:.98rem; }
.viva-card-title small { display:block; margin-top:3px; color:var(--muted); font-weight:500; }
.viva-env-badge { padding:5px 10px; border-radius:999px; background:color-mix(in srgb,var(--primary) 10%,var(--card)); border:1px solid color-mix(in srgb,var(--primary) 28%,var(--border)); color:var(--primary); font-weight:800; font-size:.78rem; }
.viva-field-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
.viva-field-grid label,.viva-endpoints label { display:grid; gap:6px; min-width:0; }
.viva-field-grid label>span:first-child,.viva-endpoints label>span:first-child { color:var(--muted); font-size:.76rem; font-weight:750; }
.viva-field-grid input,.viva-field-grid select,.viva-field-grid textarea,.viva-endpoints input { width:100%; min-height:38px; box-sizing:border-box; border:1px solid var(--border); border-radius:8px; padding:7px 10px; background:var(--card); color:var(--text); font:inherit; }
.viva-field-grid textarea { min-height:82px; resize:vertical; }
.viva-field-grid input:focus,.viva-field-grid select:focus,.viva-field-grid textarea:focus { outline:none; border-color:var(--primary); box-shadow:0 0 0 2px color-mix(in srgb,var(--primary) 12%,transparent); }
.viva-field-grid small { color:var(--muted); font-size:.72rem; line-height:1.35; }
.viva-span-2 { grid-column:span 2; }
.viva-span-4 { grid-column:1/-1; }
.viva-endpoints { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px 12px; padding:12px; border-radius:10px; background:var(--surface); border:1px solid var(--border); }
.viva-endpoints input[readonly] { background:color-mix(in srgb,var(--surface) 78%,var(--card)); color:var(--muted); font-size:.78rem; }
.viva-copy-field { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; }
.viva-copy-field .btn-secondary { min-height:38px; white-space:nowrap; }
.viva-warning-text { color:#a24816!important; }
.viva-diagnostic-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.viva-diagnostic-grid>div { display:grid; gap:3px; padding:10px 12px; border:1px solid var(--border); border-radius:10px; background:var(--surface); }
.viva-diagnostic-grid strong { font-size:.78rem; }
.viva-diagnostic-grid span { color:var(--muted); font-size:.76rem; overflow-wrap:anywhere; }
.viva-diagnostic-grid span.ok { color:#087a42; }
.viva-diagnostic-grid small { color:var(--muted); }
.viva-toggle-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
.viva-advanced { border:1px solid var(--border); border-radius:12px; background:var(--card); overflow:hidden; }
.viva-advanced summary { cursor:pointer; padding:12px 14px; font-weight:750; background:var(--surface); }
.viva-advanced[open] summary { border-bottom:1px solid var(--border); }
.viva-advanced .viva-field-grid { padding:14px; }
.viva-actions { align-items:center; gap:12px; }
.viva-actions>div { display:flex; flex-wrap:wrap; gap:8px; justify-content:flex-end; }
.erp-breadcrumb-line { margin-bottom:4px; color:var(--muted); font-size:.76rem; }
.erp-breadcrumb-line span { padding:0 4px; color:var(--primary); }
@media(max-width:1050px){.viva-field-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.viva-span-4{grid-column:1/-1}.viva-endpoints{grid-template-columns:1fr}.viva-toggle-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:680px){.viva-gateway-heading{flex-direction:column}.viva-status-cluster{justify-content:flex-start}.viva-field-grid{grid-template-columns:1fr}.viva-span-2,.viva-span-4{grid-column:auto}.viva-diagnostic-grid,.viva-toggle-grid{grid-template-columns:1fr}.viva-actions{align-items:stretch;flex-direction:column}.viva-actions>div{justify-content:stretch}.viva-actions button{flex:1 1 auto}.viva-copy-field{grid-template-columns:1fr}.viva-config-card{padding:12px}}

/* v2026.09.02.22 - Admin Device & MFA Control */
.web-security-admin-page{display:grid;gap:14px;padding:12px 18px 28px;max-width:1600px;margin:0 auto}.web-security-note{padding:12px 14px;border:1px solid var(--border,#cbd5e1);border-radius:10px;background:color-mix(in srgb,var(--brand,#2563eb) 6%,var(--card,#fff));font-size:13px;line-height:1.5}.web-security-card{border:1px solid var(--border,#dbe4ee);border-radius:12px;background:var(--card,#fff);overflow:hidden}.web-security-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;padding:14px 16px;border-bottom:1px solid var(--border,#e5e7eb)}.web-security-card-head h2{margin:0 0 4px;font-size:17px}.web-security-card-head p{margin:0;color:var(--muted,#64748b);font-size:12px}.web-security-card-head>span{white-space:nowrap;font-size:11px;font-weight:800;color:var(--muted,#64748b)}.web-security-table-wrap{overflow:auto}.web-security-table{width:100%;border-collapse:collapse;font-size:12px}.web-security-table th,.web-security-table td{padding:9px 10px;border-bottom:1px solid var(--border,#edf0f4);text-align:left;vertical-align:middle;white-space:nowrap}.web-security-table th{position:sticky;top:0;background:var(--surface-soft,#f8fafc);z-index:1;font-size:11px}.web-security-table td small{display:block;color:var(--muted,#64748b);font-size:10px;margin-top:2px}.web-security-actions{display:flex;gap:6px}.web-security-actions form{margin:0}.web-security-table button{min-height:30px;padding:5px 9px;font-size:11px}.web-security-badge{display:inline-flex;align-items:center;padding:3px 7px;border-radius:999px;font-size:10px;font-weight:900;letter-spacing:.03em}.web-security-badge.ok{background:#e9f8ef;color:#166534}.web-security-badge.warn{background:#fff7df;color:#92400e}.web-security-badge.danger{background:#feecec;color:#b91c1c}.web-security-badge.neutral{background:#eef2f7;color:#475569}.web-security-agent{max-width:300px;overflow:hidden;text-overflow:ellipsis}.web-security-empty{text-align:center!important;color:var(--muted,#64748b);padding:22px!important}.web-security-unknown td{background:color-mix(in srgb,#dc2626 4%,var(--card,#fff))}@media(max-width:760px){.web-security-admin-page{padding:8px}.web-security-card-head{padding:12px}.web-security-table th,.web-security-table td{padding:8px}.web-security-agent{max-width:190px}}

/* v2026.09.02.25: Device & MFA Control uses the full ERP workspace; override the compact login-card width. */
.web-security-admin-page .web-security-card{width:100%!important;max-width:none!important}
.web-security-admin-page{width:100%;max-width:none!important;box-sizing:border-box}
.web-security-admin-page .web-security-table-wrap{width:100%;max-width:100%;overflow-x:auto}
.web-security-admin-page .web-security-table{min-width:980px;table-layout:auto}
.web-security-admin-page .web-security-table th,.web-security-admin-page .web-security-table td{white-space:nowrap}
.web-security-admin-page .web-security-agent{min-width:220px;max-width:420px}
.web-security-admin-page .web-security-actions{white-space:nowrap}
@media(max-width:760px){.web-security-admin-page .web-security-table{min-width:860px}}

/* v2026.09.03.26 - POS Sales Discount popup compact layout only */
.sales-entry-page [data-sales-discount-modal] .sales-adjustment-modal{
    width:min(620px,calc(100vw - 28px));
}
.sales-entry-page [data-sales-discount-modal] .sales-adjustment-modal-body{
    padding:18px;
    gap:14px;
}
.sales-entry-page [data-sales-discount-modal] .sales-adjustment-value-row{
    grid-template-columns:72px minmax(0,1fr);
    gap:12px;
}
.sales-entry-page [data-sales-discount-modal] .sales-adjustment-number-wrap{
    gap:8px;
}
.sales-entry-page [data-sales-discount-modal] .sales-adjustment-number-wrap input{
    min-height:34px;
    font-size:14px;
    font-weight:700;
}
.sales-entry-page [data-sales-discount-modal] .sales-adjustment-number-wrap span{
    min-width:18px;
    font-size:14px;
    font-weight:700;
}
.sales-entry-page [data-sales-discount-modal] .sales-adjustment-options{
    padding-left:84px;
    gap:9px;
}
.sales-entry-page [data-sales-discount-modal] .sales-adjustment-modal-foot{
    padding:14px 18px;
}
.sales-entry-page [data-sales-discount-modal] .sales-adjustment-phase-note{
    width:100%;
    margin-left:0;
    margin-top:2px;
}
@media(max-width:680px){
    .sales-entry-page [data-sales-discount-modal] .sales-adjustment-value-row{grid-template-columns:1fr;gap:5px}
    .sales-entry-page [data-sales-discount-modal] .sales-adjustment-options{padding-left:0}
}

/* v2026.09.03.31 - Direct Purchase Discount / Add Shipping adjustment modules */
.purchase-adjustment-action-row{display:flex!important;grid-template-columns:none!important;justify-content:flex-end;gap:8px!important;margin:0 0 12px!important;padding-bottom:10px;border-bottom:1px solid var(--border,#dbe5e0)}
.purchase-totals .purchase-adjustment-action{min-width:132px;justify-content:center;text-align:center}
.purchase-adjustment-modal-backdrop[hidden]{display:none!important}
.purchase-adjustment-modal-backdrop{position:fixed;inset:0;z-index:2147483200;background:rgba(15,23,42,.48);display:grid;place-items:center;padding:18px;backdrop-filter:blur(1px)}
.purchase-adjustment-modal{width:min(620px,calc(100vw - 28px));max-height:min(82vh,720px);overflow:auto;background:var(--card,#fff);color:var(--text,#111827);border:1px solid var(--border,#d1d5db);border-radius:12px;box-shadow:0 24px 70px rgba(15,23,42,.28)}
.purchase-adjustment-modal-head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:17px 18px;border-bottom:1px solid var(--border,#d1d5db)}
.purchase-adjustment-modal-head h2{margin:0;font-size:1.08rem;font-weight:800;color:var(--text,#111827)}
.purchase-adjustment-modal-close{border:0;background:transparent;color:var(--muted,#6b7280);font-size:30px;line-height:1;cursor:pointer;padding:0 2px}
.purchase-adjustment-modal-body{padding:20px 18px;display:grid;gap:18px}
.purchase-adjustment-value-field{display:grid;gap:7px;font-weight:800;color:var(--text,#111827)}
.purchase-adjustment-input-wrap{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;border:1px solid var(--border,#cbd5e1);border-radius:8px;background:var(--card,#fff);overflow:hidden}
.purchase-adjustment-input-wrap input{min-width:0;border:0!important;outline:0;background:transparent!important;color:var(--text,#111827)!important;padding:11px 12px;font:inherit;text-align:right}
.purchase-adjustment-input-wrap em{font-style:normal;font-weight:800;color:var(--muted,#64748b);padding:0 12px;border-left:1px solid var(--border,#cbd5e1)}
.purchase-adjustment-options{margin:0;padding:14px;border:1px solid var(--border,#d1d5db);border-radius:9px;display:grid;gap:10px;background:var(--soft,#f8fafc)}
.purchase-adjustment-options legend{padding:0 6px;font-weight:800;color:var(--text,#111827)}
.purchase-adjustment-options label{display:flex;align-items:center;gap:9px;cursor:pointer;color:var(--text,#111827)}
.purchase-adjustment-options input{accent-color:var(--brand,var(--primary,#2563eb))}
.purchase-adjustment-help{margin:0;color:var(--muted,#64748b);font-size:13px;line-height:1.45}
.purchase-adjustment-modal-foot{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:15px 18px;border-top:1px solid var(--border,#d1d5db)}
.purchase-shipping-preview-card{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px;border:1px solid var(--border,#d1d5db);border-radius:9px;background:var(--soft,#f8fafc)}
.purchase-shipping-preview-card span{color:var(--muted,#64748b)}
.purchase-shipping-preview-card strong{font-size:1.12rem;color:var(--text,#111827)}
body.purchase-adjustment-modal-open{overflow:hidden}
@media (max-width:640px){.purchase-adjustment-action-row{justify-content:stretch;flex-direction:column}.purchase-totals .purchase-adjustment-action{width:100%}.purchase-adjustment-modal-backdrop{padding:8px}.purchase-adjustment-modal{width:calc(100vw - 16px)}.purchase-adjustment-modal-body{padding:16px 14px}.purchase-adjustment-modal-foot,.purchase-adjustment-modal-head{padding-left:14px;padding-right:14px}}

/* v2026.09.03.32 - Direct Purchase controlled adjustments and payment-ledger mapping */
.purchase-direct-payment-table .purchase-tab-table-head,
.purchase-direct-payment-table .purchase-tab-table-row{grid-template-columns:minmax(190px,1fr) minmax(190px,1fr) 150px 46px}
.purchase-direct-payment-table .purchase-payment-ledger[readonly]{background:var(--surface-soft,#f8fafc)!important;color:var(--muted,#64748b);cursor:default}
.purchase-payment-method-warning{margin:8px 10px 10px;padding:9px 11px;border:1px solid var(--border,#d7e1ee);border-radius:8px;background:var(--surface-soft,#f8fafc);color:var(--muted,#64748b);font-size:12px}
.purchase-legacy-adjustment{color:var(--muted,#64748b)}
.purchase-legacy-adjustment strong{font-variant-numeric:tabular-nums}
.purchase-adjustment-phase-note{margin-left:auto;color:var(--muted,#64748b);font-size:.78rem;font-weight:700}
.purchase-shipping-modal{width:min(920px,calc(100vw - 28px))}
.purchase-shipping-preview-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 26px;align-items:start}
.purchase-shipping-field{display:grid;gap:5px;min-width:0}
.purchase-shipping-field>span,.purchase-shipping-amount-field>span,.purchase-shipping-total-card>span{font-size:14px;line-height:1.25;font-weight:700}
.purchase-shipping-preview-grid input,.purchase-shipping-preview-grid select{width:100%;min-height:38px;border:0;border-bottom:1px solid color-mix(in srgb,var(--brand,var(--erp-primary,#2563eb)) 45%,var(--border,#cbd5e1));background:transparent;color:var(--text,#111827);padding:7px 4px;outline:none}
.purchase-shipping-preview-grid input:focus,.purchase-shipping-preview-grid select:focus{border-bottom-color:var(--brand,var(--erp-primary,#2563eb));box-shadow:0 1px 0 var(--brand,var(--erp-primary,#2563eb))}
.purchase-shipping-amount-card{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(210px,.72fr);gap:14px;padding:16px;border:1px solid color-mix(in srgb,var(--brand,var(--erp-primary,#2563eb)) 20%,var(--border,#cbd5e1));border-radius:12px;background:color-mix(in srgb,var(--brand,var(--erp-primary,#2563eb)) 3%,var(--card,#fff))}
.purchase-shipping-amount-field{display:grid;align-content:start;gap:6px;min-width:0}
.purchase-shipping-amount-field small{color:var(--muted,#64748b);font-size:11px;line-height:1.35}
.purchase-adjustment-number-wrap{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;border-bottom:1px solid var(--border,#cbd5e1)}
.purchase-adjustment-number-wrap input{border:0!important;border-bottom:0!important;min-height:42px!important;font-size:14px!important;font-weight:800;font-variant-numeric:tabular-nums}
.purchase-adjustment-number-wrap>span{padding:0 8px;font-size:14px;font-weight:800;color:var(--text,#111827)}
.purchase-shipping-total-card{display:grid;align-content:center;gap:5px;min-width:0;padding:12px 14px;border:1px solid color-mix(in srgb,var(--brand,var(--erp-primary,#2563eb)) 28%,var(--border,#cbd5e1));border-radius:10px;background:var(--card,#fff)}
.purchase-shipping-total-card strong{display:flex;align-items:baseline;gap:6px;color:var(--brand,var(--erp-primary,#2563eb));font-size:20px;font-weight:900;font-variant-numeric:tabular-nums}
.purchase-shipping-total-card strong em{font-size:14px;font-style:normal;font-weight:800}
.purchase-shipping-total-card small{color:var(--muted,#64748b);font-size:12px;font-weight:700}
.purchase-shipping-ledger-field{grid-column:1/-1}
.purchase-shipping-ledger-field input[readonly]{background:color-mix(in srgb,var(--soft,#f8fafc) 85%,transparent);color:var(--muted,#64748b)}
@media(max-width:760px){.purchase-direct-payment-table .purchase-tab-table-head,.purchase-direct-payment-table .purchase-tab-table-row{grid-template-columns:1fr}.purchase-direct-payment-table .purchase-tab-table-head span:last-child{display:none}.purchase-shipping-preview-grid{grid-template-columns:1fr}.purchase-shipping-amount-card{grid-template-columns:1fr}.purchase-adjustment-phase-note{width:100%;margin-left:0}}

/* v2026.09.04.33 - Direct Purchase payment transaction entry/history */
.purchase-direct-payment-entry{display:grid;grid-template-columns:minmax(170px,1fr) minmax(180px,1fr) minmax(120px,.55fr) minmax(180px,1fr) auto;gap:10px;align-items:end;margin:12px 0 14px;padding:12px;border:1px solid var(--border-color,#d7dce3);border-radius:10px;background:var(--card-bg,#fff)}
.purchase-direct-payment-entry label{display:grid;gap:5px;min-width:0}.purchase-direct-payment-entry label>span{font-size:.78rem;font-weight:700;color:var(--text-muted,#667085)}
.purchase-direct-payment-entry .btn{min-height:38px;white-space:nowrap}
.purchase-direct-payment-table .purchase-tab-table-head,.purchase-direct-payment-table .purchase-tab-table-row{grid-template-columns:minmax(125px,1fr) minmax(150px,1.1fr) minmax(90px,.55fr) minmax(140px,1fr) minmax(85px,.6fr) 42px;align-items:center}
.purchase-direct-payment-row>span,.purchase-direct-payment-row>strong{min-width:0;overflow-wrap:anywhere}.purchase-direct-payment-row span small{display:block;margin-top:2px;color:var(--text-muted,#667085);font-size:.72rem}
.purchase-payment-row-status{display:inline-flex;align-items:center;justify-content:center;padding:3px 8px;border-radius:999px;font-style:normal;font-size:.72rem;font-weight:800;border:1px solid currentColor}.purchase-payment-row-status.is-pending{color:#8a5a00;background:rgba(245,158,11,.12)}.purchase-payment-row-status.is-saved{color:#14753d;background:rgba(34,197,94,.11)}.purchase-payment-row-status.is-reversed{color:#8a3442;background:rgba(225,29,72,.09)}
.purchase-direct-payment-row.is-reversed{opacity:.72}.purchase-direct-payment-row.is-reversed>span,.purchase-direct-payment-row.is-reversed>strong{text-decoration:line-through}.purchase-direct-payment-row.is-reversed .purchase-payment-row-status{text-decoration:none}
.purchase-payment-remove{border:0;background:transparent;cursor:pointer;font-size:1rem;min-width:34px;min-height:34px;border-radius:7px}.purchase-payment-remove:hover{background:rgba(225,29,72,.09)}
@media(max-width:1050px){.purchase-direct-payment-entry{grid-template-columns:repeat(2,minmax(0,1fr))}.purchase-direct-payment-entry .btn{grid-column:1/-1;justify-self:start}.purchase-direct-payment-table{overflow-x:auto}.purchase-direct-payment-table .purchase-tab-table-head,.purchase-direct-payment-table .purchase-tab-table-row{min-width:760px}}
@media(max-width:620px){.purchase-direct-payment-entry{grid-template-columns:1fr}.purchase-direct-payment-entry .btn{width:100%}}

/* v2026.09.05.43 - Purchase Request / Purchase Quotation use Direct Purchase grid geometry */
.purchase-request-shell .purchase-table-wrap{overflow-x:auto!important;overflow-y:visible!important;max-height:none!important}
.purchase-request-shell .purchase-request-lines-table{table-layout:fixed!important;width:max-content!important;min-width:100%!important}
.purchase-request-shell .purchase-request-lines-table th,.purchase-request-shell .purchase-request-lines-table td{white-space:nowrap!important;overflow:visible!important;text-overflow:clip!important}
.purchase-request-shell .purchase-request-lines-table th[data-col],.purchase-request-shell .purchase-request-lines-table td[data-col]{width:100px!important;min-width:100px!important;max-width:none!important}
.purchase-request-shell .purchase-request-lines-table th[data-col="product"],.purchase-request-shell .purchase-request-lines-table td[data-col="product"]{width:300px!important;min-width:300px!important;max-width:none!important}
.purchase-request-shell .purchase-request-lines-table th[data-col="itemCode"],.purchase-request-shell .purchase-request-lines-table td[data-col="itemCode"]{width:105px!important;min-width:105px!important}
.purchase-request-shell .purchase-request-lines-table th[data-col="qty"],.purchase-request-shell .purchase-request-lines-table td[data-col="qty"],
.purchase-request-shell .purchase-request-lines-table th[data-col="freeQty"],.purchase-request-shell .purchase-request-lines-table td[data-col="freeQty"]{width:90px!important;min-width:90px!important}
.purchase-request-shell .purchase-request-lines-table th[data-col="unit"],.purchase-request-shell .purchase-request-lines-table td[data-col="unit"]{width:80px!important;min-width:80px!important}
.purchase-request-shell .purchase-request-lines-table th[data-col="batchNo"],.purchase-request-shell .purchase-request-lines-table td[data-col="batchNo"]{width:100px!important;min-width:100px!important}
.purchase-request-shell .purchase-request-lines-table th[data-col="mfd"],.purchase-request-shell .purchase-request-lines-table td[data-col="mfd"],
.purchase-request-shell .purchase-request-lines-table th[data-col="expiry"],.purchase-request-shell .purchase-request-lines-table td[data-col="expiry"]{width:105px!important;min-width:105px!important}
.purchase-request-shell .purchase-request-lines-table th[data-col="unitPrice"],.purchase-request-shell .purchase-request-lines-table td[data-col="unitPrice"],
.purchase-request-shell .purchase-request-lines-table th[data-col="netRate"],.purchase-request-shell .purchase-request-lines-table td[data-col="netRate"],
.purchase-request-shell .purchase-request-lines-table th[data-col="taxValue"],.purchase-request-shell .purchase-request-lines-table td[data-col="taxValue"]{width:105px!important;min-width:105px!important}
.purchase-request-shell .purchase-request-lines-table th[data-col="disc"],.purchase-request-shell .purchase-request-lines-table td[data-col="disc"]{width:95px!important;min-width:95px!important}
.purchase-request-shell .purchase-request-lines-table th[data-col="disc2"],.purchase-request-shell .purchase-request-lines-table td[data-col="disc2"]{width:90px!important;min-width:90px!important}
.purchase-request-shell .purchase-request-lines-table th[data-col="tax"],.purchase-request-shell .purchase-request-lines-table td[data-col="tax"]{width:80px!important;min-width:80px!important}
.purchase-request-shell .purchase-request-lines-table th[data-col="value"],.purchase-request-shell .purchase-request-lines-table td[data-col="value"]{width:120px!important;min-width:120px!important}
.purchase-request-shell [data-invoice-product-search-wrap]{max-width:360px;min-width:220px}

/* v2026.09.05.47 Purchase Quotation product-grid interaction */
.purchase-request-shell [data-pq-product-grid] td[data-col="product"] .purchase-product-cell{
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
}
.purchase-cell-suggestions button.is-active,
.purchase-cell-suggestions button[aria-selected="true"]{
    background:color-mix(in srgb,var(--erp-primary,#2563eb) 14%,var(--erp-surface,#fff))!important;
    outline:2px solid var(--erp-primary,#2563eb);
    outline-offset:-2px;
}
.purchase-request-shell [data-pq-product-grid] th[data-col]{position:relative!important;}
.purchase-request-shell [data-pq-product-grid] .purchase-col-resizer{display:block!important;}

/* v2026.09.06.48 Purchase Quotation unit/load/status parity */
.purchase-request-shell .purchase-stagebar span.active.purchase-quotation-stage{
    background:linear-gradient(135deg,#2563eb 0%,#1d4ed8 100%)!important;
    border-color:#1d4ed8!important;
    color:#fff!important;
    font-weight:900!important;
    text-shadow:none!important;
    filter:drop-shadow(0 2px 4px rgba(29,78,216,.24));
}
.purchase-request-shell .purchase-state-pill.purchase-quotation-state{
    background:#2563eb!important;
    border-color:#1d4ed8!important;
    color:#fff!important;
    font-weight:900!important;
}
.purchase-request-shell .purchase-lines-table select[data-key="unit"]{min-width:100%!important;white-space:nowrap}
.purchase-request-shell [data-pq-load-modal] .purchase-load-search-card{width:min(1180px,96vw)!important;max-width:1180px!important}
.purchase-request-shell [data-pq-load-results] .purchase-load-row>span:first-child{font-weight:800}
@media(max-width:850px){
  .purchase-request-shell [data-pq-load-results] .purchase-load-row>span:nth-child(1)::before{content:'Quotation No'}
  .purchase-request-shell [data-pq-load-results] .purchase-load-row>span:nth-child(2)::before{content:'Date'}
  .purchase-request-shell [data-pq-load-results] .purchase-load-row>span:nth-child(3)::before{content:'Reference'}
  .purchase-request-shell [data-pq-load-results] .purchase-load-row>span:nth-child(4)::before{content:'Supplier'}
  .purchase-request-shell [data-pq-load-results] .purchase-load-row>span:nth-child(5)::before{content:'Ledger Code'}
  .purchase-request-shell [data-pq-load-results] .purchase-load-row>span:nth-child(6)::before{content:'Total Amount'}
}


/* v2026.09.06.49 Purchase Quotation: Product cell fills the complete Product column. */
.purchase-request-shell [data-pq-product-grid] td[data-col="product"].purchase-pq-product-cell{
    width:auto;
    min-width:0!important;
    max-width:none!important;
    padding-left:7px!important;
    padding-right:7px!important;
}
.purchase-request-shell [data-pq-product-grid] td[data-col="product"].purchase-pq-product-cell .purchase-grid-input.product{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    box-sizing:border-box!important;
}

/* Stock Items product smart actions: web replacement for the StockItems.vb
   right-click context menu on an already-open product. */
.stock-product-smart-action-row {
    display: grid;
    grid-template-columns: repeat(9, minmax(130px, 1fr));
    width: 100%;
    min-width: 0;
    overflow-x: auto;
    border-top: 1px solid color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 14%, var(--border, #dbe4ef));
    background: var(--card, #fff);
}
.stock-product-smart-action {
    min-height: 58px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 8px 10px;
    border-right: 1px solid var(--border, #dbe4ef);
    color: var(--text, #152238);
    text-decoration: none;
    text-align: center;
    font-size: .76rem;
    line-height: 1.2;
    background: var(--card, #fff);
    transition: background .14s ease, color .14s ease, box-shadow .14s ease;
}
.stock-product-smart-action:last-child { border-right: 0; }
.stock-product-smart-action > span {
    flex: 0 0 auto;
    color: var(--theme-primary, var(--brand, #714b67));
    font-size: 1.05rem;
    font-weight: 700;
}
.stock-product-smart-action > b { font-weight: 600; }
.stock-product-smart-action:hover,
.stock-product-smart-action:focus-visible {
    background: color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 8%, var(--card, #fff));
    color: var(--theme-secondary, var(--brand-dark, #52364b));
    box-shadow: inset 0 -2px 0 var(--theme-primary, var(--brand, #714b67));
    outline: none;
}
@media (max-width: 1100px) {
    .stock-product-smart-action-row { grid-template-columns: repeat(9, minmax(118px, 1fr)); }
}

/* Product-specific StockItems.vb detail pages. */
.stock-product-report-topbar {
    align-items: center;
    margin-bottom: 12px;
}
.stock-product-report-page {
    display: grid;
    gap: 14px;
}
.stock-product-report-actions {
    display: flex;
    align-items: stretch;
    gap: 0;
    max-width: 100%;
    overflow-x: auto;
    border: 1px solid var(--border, #dbe4ef);
    border-radius: 11px;
    background: var(--card, #fff);
}
.stock-product-back,
.stock-product-report-card {
    min-width: 132px;
    min-height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 8px 10px;
    border-right: 1px solid var(--border, #dbe4ef);
    color: var(--text, #152238);
    background: var(--card, #fff);
    text-align: center;
    text-decoration: none;
    font-size: .78rem;
    line-height: 1.18;
}
.stock-product-back {
    min-width: 100px;
    color: var(--theme-primary, var(--brand, #714b67));
    font-weight: 700;
}
.stock-product-report-card > span {
    color: var(--theme-primary, var(--brand, #714b67));
    font-size: 1rem;
}
.stock-product-report-card.active,
.stock-product-report-card:hover,
.stock-product-report-card:focus-visible,
.stock-product-back:hover,
.stock-product-back:focus-visible {
    background: color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 8%, var(--card, #fff));
    box-shadow: inset 0 -2px 0 var(--theme-primary, var(--brand, #714b67));
    outline: none;
}
.stock-product-report-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 16px 18px;
    border: 1px solid var(--border, #dbe4ef);
    border-radius: 12px;
    background: var(--card, #fff);
}
.stock-product-report-heading h2 { margin: 2px 0 4px; font-size: 1.25rem; }
.stock-product-report-heading p { margin: 0; color: var(--muted, #64748b); }
.stock-product-report-kicker {
    color: var(--theme-primary, var(--brand, #714b67));
    font-size: .75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
}
.stock-product-report-kpis {
    display: flex;
    align-items: stretch;
    border: 1px solid var(--border, #dbe4ef);
    border-radius: 9px;
    overflow: hidden;
    background: var(--card, #fff);
}
.stock-product-report-kpis > div {
    min-width: 116px;
    display: grid;
    place-items: center;
    gap: 2px;
    padding: 8px 10px;
    border-right: 1px solid var(--border, #dbe4ef);
}
.stock-product-report-kpis > div:last-child { border-right: 0; }
.stock-product-report-kpis strong { color: var(--theme-secondary, var(--brand-dark, #52364b)); }
.stock-product-report-kpis span { color: var(--muted, #64748b); font-size: .74rem; }
.stock-product-report-table-wrap {
    max-width: 100%;
    overflow: auto;
    border: 1px solid var(--border, #dbe4ef);
    border-radius: 12px;
    background: var(--card, #fff);
}
.stock-product-report-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
    font-size: .82rem;
}
.stock-product-report-table th,
.stock-product-report-table td {
    padding: 9px 10px;
    border-bottom: 1px solid var(--border, #dbe4ef);
    white-space: nowrap;
    text-align: left;
}
.stock-product-report-table th {
    position: sticky;
    top: 0;
    z-index: 2;
    background: color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 6%, var(--card, #fff));
    color: var(--text, #152238);
    font-weight: 700;
}
.stock-product-report-table .num { text-align: right; font-variant-numeric: tabular-nums; }
.stock-product-report-table a { color: var(--theme-primary, var(--brand, #714b67)); font-weight: 600; }
.stock-product-report-table tfoot td { background: var(--soft, #f7f4f7); }
.stock-product-empty { padding: 28px 14px !important; color: var(--muted, #64748b); text-align: center !important; }
.stock-movement-badge {
    display: inline-flex;
    min-width: 64px;
    justify-content: center;
    padding: 4px 7px;
    border-radius: 999px;
    font-size: .72rem;
    font-weight: 700;
}
.stock-movement-badge.inward { background: rgba(22, 163, 74, .10); color: #15803d; }
.stock-movement-badge.outward { background: rgba(220, 38, 38, .09); color: #b91c1c; }
@media (max-width: 760px) {
    .stock-product-report-heading { align-items: stretch; flex-direction: column; }
    .stock-product-report-kpis { overflow-x: auto; }
    .stock-product-report-kpis > div { min-width: 100px; }
}
@media print {
    .stock-product-report-page .no-print,
    .stock-product-report-topbar .user-panel,
    .sidebar,
    .site-sidebar { display: none !important; }
    .stock-product-report-page { margin: 0 !important; padding: 0 !important; }
    .stock-product-report-heading { border: 0; padding: 0 0 12px; }
    .stock-product-report-table-wrap { overflow: visible; border: 0; }
    .stock-product-report-table { min-width: 0; font-size: 9pt; }
    .stock-product-report-table th { position: static; }
}
.stock-product-open-link {
    color: inherit;
    text-decoration: none;
    font-weight: inherit;
}
.stock-product-open-link:hover,
.stock-product-open-link:focus-visible {
    color: var(--theme-primary, var(--brand, #714b67));
    text-decoration: underline;
    text-underline-offset: 2px;
    outline: none;
}
.stock-name-cell .stock-product-open-link { font-weight: 650; }


/* v2026.09.08.60 Global header alignment.
   Notifications and the logged-in account control share one global row. Page-level
   _UserMenu copies are hidden only inside .user-panel; other page buttons remain. */
.erp-notification-slot {
    gap: 8px;
}
.erp-notification-slot > .account-menu {
    pointer-events: auto;
    flex: 0 0 auto;
    align-self: center;
}
.erp-notification-slot > .account-menu .account-menu-button {
    height: 40px;
    min-height: 40px;
    padding: 5px 10px 5px 5px;
    box-shadow: 0 12px 28px rgba(15,23,42,.12);
}
.erp-notification-slot > .account-menu .account-avatar {
    width: 28px;
    height: 28px;
}
.user-panel > .account-menu {
    display: none;
}
@media (max-width: 720px) {
    .erp-notification-slot { gap: 6px; }
    .erp-notification-slot > .account-menu .account-menu-button {
        height: 36px;
        min-height: 36px;
        padding: 4px 8px 4px 4px;
    }
    .erp-notification-slot > .account-menu .account-avatar {
        width: 26px;
        height: 26px;
    }
    .erp-notification-slot > .account-menu .account-name {
        max-width: 110px;
    }
}

/* v2026.09.08.60 Product movement party context/search. */
.stock-product-party-search {
    display: flex;
    align-items: end;
    gap: 12px;
    padding: 12px 14px;
    border: 1px solid var(--border, #dbe4ef);
    border-radius: 12px;
    background: var(--card, #fff);
}
.stock-product-party-search > label {
    flex: 0 0 auto;
    padding-bottom: 9px;
    color: var(--text, #152238);
    font-size: .8rem;
    font-weight: 700;
}
.stock-product-party-search-box {
    flex: 1 1 360px;
    max-width: 620px;
    display: flex;
    align-items: center;
    min-height: 40px;
    border: 1px solid var(--border, #dbe4ef);
    border-radius: 9px;
    background: var(--theme-input-bg, var(--card, #fff));
    overflow: hidden;
}
.stock-product-party-search-box > span {
    padding-left: 11px;
    color: var(--muted, #64748b);
}
.stock-product-party-search-box input {
    flex: 1 1 auto;
    min-width: 0;
    height: 38px;
    border: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
    color: var(--text, #152238);
    padding: 7px 9px;
}
.stock-product-party-search-box button {
    align-self: stretch;
    border: 0;
    border-left: 1px solid var(--border, #dbe4ef);
    background: color-mix(in srgb, var(--theme-primary, var(--brand, #714b67)) 6%, var(--card, #fff));
    color: var(--theme-primary, var(--brand, #714b67));
    padding: 0 12px;
    font-weight: 700;
    cursor: pointer;
}
.stock-product-party-search > small {
    flex: 0 0 auto;
    padding-bottom: 10px;
    color: var(--muted, #64748b);
    white-space: nowrap;
}
.stock-product-party-cell {
    min-width: 190px;
}
.stock-product-party-cell strong,
.stock-product-party-cell span {
    display: block;
}
.stock-product-party-cell strong {
    max-width: 280px;
    overflow: hidden;
    text-overflow: ellipsis;
    font-weight: 700;
}
.stock-product-party-cell span:not(.muted) {
    margin-top: 2px;
    color: var(--muted, #64748b);
    font-size: .72rem;
}
@media (max-width: 760px) {
    .stock-product-party-search {
        align-items: stretch;
        flex-direction: column;
        gap: 7px;
    }
    .stock-product-party-search > label,
    .stock-product-party-search > small {
        padding: 0;
    }
    .stock-product-party-search-box {
        flex-basis: auto;
        max-width: none;
        width: 100%;
    }
}


/* v2026.09.08.61 Stock Items global header parity.
   Stock Items must use the same fixed top-right notification/account rail as
   Account Masters. The stock header keeps only page-specific controls. */
.stock-header-notification-host {
    display: none !important;
}
body:has(.stock-items-sticky-header) .main-area > .erp-notification-slot,
body:has(.stock-item-sticky-header) .main-area > .erp-notification-slot {
    position: fixed !important;
    top: 8px !important;
    right: 10px !important;
    bottom: auto !important;
    left: auto !important;
    width: max-content !important;
    min-width: 0 !important;
    max-width: calc(100vw - 20px) !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 8px !important;
    z-index: 1800 !important;
}
@media (max-width: 720px) {
    body:has(.stock-items-sticky-header) .main-area > .erp-notification-slot,
    body:has(.stock-item-sticky-header) .main-area > .erp-notification-slot {
        top: 8px !important;
        right: 10px !important;
        gap: 6px !important;
        max-width: calc(100vw - 20px) !important;
    }
}


/* v2026.09.09.62 Product Tracking: inline hierarchy + expandable movement routes. */
.stock-product-smart-action[type="button"]{font:inherit;cursor:pointer;border-top:0;border-bottom:0;border-left:0}
.stock-product-smart-action.is-active{background:color-mix(in srgb,var(--theme-primary,var(--brand,#714b67)) 12%,var(--card,#fff));box-shadow:inset 0 -3px 0 var(--theme-primary,var(--brand,#714b67));color:var(--theme-secondary,var(--brand-dark,#52364b))}
.stock-product-tracking-host{margin:10px 12px 0;scroll-margin-top:86px}
.stock-product-tracking-host[hidden]{display:none!important}
.stock-tracking-loading{min-height:88px;border:1px solid var(--border,#dbe4ef);border-radius:12px;background:var(--card,#fff);display:flex;align-items:center;justify-content:center;gap:10px;color:var(--muted,#64748b)}
.stock-tracking-shell{border:1px solid var(--border,#dbe4ef);border-radius:14px;background:var(--card,#fff);box-shadow:0 8px 26px rgba(15,23,42,.07);overflow:hidden;color:var(--text,#152238)}
.stock-tracking-header{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;padding:18px 20px;border-bottom:1px solid var(--border,#dbe4ef);background:linear-gradient(180deg,color-mix(in srgb,var(--theme-primary,var(--brand,#714b67)) 5%,var(--card,#fff)),var(--card,#fff))}
.stock-tracking-header h2{margin:2px 0 4px;font-size:1.25rem}.stock-tracking-header p{margin:0;color:var(--muted,#64748b);max-width:900px;font-size:.86rem;line-height:1.45}.stock-tracking-eyebrow{font-size:.7rem;text-transform:uppercase;letter-spacing:.09em;font-weight:800;color:var(--theme-primary,var(--brand,#714b67))}
.stock-tracking-close{width:36px;height:36px;border:1px solid var(--border,#dbe4ef);border-radius:10px;background:var(--card,#fff);color:var(--text,#152238);font-size:1.35rem;cursor:pointer}.stock-tracking-close:hover{background:var(--hover,#f4f7fb)}
.stock-tracking-kpis{display:grid;grid-template-columns:repeat(6,minmax(145px,1fr));gap:8px;padding:12px;background:color-mix(in srgb,var(--surface,#f5f7fb) 80%,var(--card,#fff))}
.stock-tracking-kpi{min-width:0;border:1px solid var(--border,#dbe4ef);border-radius:10px;background:var(--card,#fff);padding:10px 12px;text-align:left;cursor:pointer;color:var(--text,#152238);box-shadow:0 2px 6px rgba(15,23,42,.035)}
.stock-tracking-kpi span,.stock-tracking-kpi strong,.stock-tracking-kpi small{display:block}.stock-tracking-kpi span{font-size:.74rem;font-weight:800}.stock-tracking-kpi strong{margin:3px 0;font-size:1rem}.stock-tracking-kpi small{font-size:.67rem;color:var(--muted,#64748b);white-space:normal}.stock-tracking-kpi.is-active{box-shadow:inset 0 -3px 0 currentColor,0 3px 10px rgba(15,23,42,.06)}
.stock-tracking-kpi.purchase,.stock-tracking-flow-node.purchase,.stock-tracking-route-node.purchase{color:#137a3f;background:color-mix(in srgb,#22c55e 8%,var(--card,#fff));border-color:color-mix(in srgb,#22c55e 38%,var(--border,#dbe4ef))}.stock-tracking-kpi.sales,.stock-tracking-flow-node.sales,.stock-tracking-route-node.sales{color:#b42335;background:color-mix(in srgb,#ef4444 7%,var(--card,#fff));border-color:color-mix(in srgb,#ef4444 35%,var(--border,#dbe4ef))}.stock-tracking-kpi.return,.stock-tracking-flow-node.return,.stock-tracking-route-node.return{color:#6d3ab2;background:color-mix(in srgb,#8b5cf6 8%,var(--card,#fff));border-color:color-mix(in srgb,#8b5cf6 35%,var(--border,#dbe4ef))}.stock-tracking-kpi.adjustment,.stock-tracking-flow-node.adjustment,.stock-tracking-route-node.adjustment{color:#9a5b00;background:color-mix(in srgb,#f59e0b 9%,var(--card,#fff));border-color:color-mix(in srgb,#f59e0b 40%,var(--border,#dbe4ef))}.stock-tracking-kpi.expired,.stock-tracking-flow-node.expired,.stock-tracking-route-node.expired{color:#b14b12;background:color-mix(in srgb,#f97316 8%,var(--card,#fff));border-color:color-mix(in srgb,#f97316 38%,var(--border,#dbe4ef))}.stock-tracking-kpi.current{color:#1d5fbf;background:color-mix(in srgb,#3b82f6 8%,var(--card,#fff));border-color:color-mix(in srgb,#3b82f6 36%,var(--border,#dbe4ef))}
.stock-tracking-main-grid{display:grid;grid-template-columns:minmax(0,2.4fr) minmax(280px,.8fr);min-width:0}.stock-tracking-flow-column{min-width:0;padding:14px;border-right:1px solid var(--border,#dbe4ef)}
.stock-tracking-diagram{display:grid;grid-template-columns:minmax(130px,.7fr) 32px minmax(180px,1.35fr) 32px minmax(150px,.8fr);gap:8px;align-items:center;padding:16px;border:1px solid var(--border,#dbe4ef);border-radius:12px;background:color-mix(in srgb,var(--surface,#f5f7fb) 55%,var(--card,#fff));overflow-x:auto}
.stock-tracking-opening-node,.stock-tracking-current-node,.stock-tracking-flow-node{border:1px solid var(--border,#dbe4ef);border-radius:11px;padding:12px;background:var(--card,#fff);text-align:left;color:var(--text,#152238)}.stock-tracking-current-node{cursor:pointer;color:#1d5fbf;border-color:color-mix(in srgb,#3b82f6 38%,var(--border,#dbe4ef));background:color-mix(in srgb,#3b82f6 7%,var(--card,#fff))}.stock-tracking-current-node.is-active{box-shadow:0 0 0 2px color-mix(in srgb,#3b82f6 25%,transparent)}
.stock-tracking-opening-node span,.stock-tracking-opening-node strong,.stock-tracking-current-node span,.stock-tracking-current-node strong,.stock-tracking-current-node small,.stock-tracking-flow-node span,.stock-tracking-flow-node strong,.stock-tracking-flow-node small{display:block}.stock-tracking-opening-node span,.stock-tracking-current-node span,.stock-tracking-flow-node span{font-size:.75rem;font-weight:800}.stock-tracking-opening-node strong,.stock-tracking-current-node strong,.stock-tracking-flow-node strong{font-size:1rem;margin-top:3px}.stock-tracking-current-node small,.stock-tracking-flow-node small{margin-top:2px;font-size:.66rem;color:var(--muted,#64748b)}
.stock-tracking-route-stack{display:grid;grid-template-columns:repeat(2,minmax(150px,1fr));gap:7px}.stock-tracking-flow-node{cursor:pointer}.stock-tracking-flow-node.is-active{box-shadow:0 0 0 2px color-mix(in srgb,currentColor 20%,transparent)}.stock-tracking-arrow,.stock-tracking-mini-arrow{font-size:1.35rem;color:var(--muted,#64748b);text-align:center;font-weight:800}
.stock-tracking-detail{margin-top:12px;border:1px solid var(--border,#dbe4ef);border-radius:12px;background:var(--card,#fff);overflow:hidden;scroll-margin-top:90px}.stock-tracking-route-panel[hidden]{display:none!important}.stock-tracking-route-title{display:flex;justify-content:space-between;gap:16px;align-items:center;padding:12px 14px;border-bottom:1px solid var(--border,#dbe4ef);background:color-mix(in srgb,var(--surface,#f5f7fb) 55%,var(--card,#fff))}.stock-tracking-route-title span{font-size:.7rem;text-transform:uppercase;letter-spacing:.06em;font-weight:800;color:var(--muted,#64748b)}.stock-tracking-route-title h3{margin:1px 0 0;font-size:.96rem}.stock-tracking-route-title>div:last-child{text-align:right}.stock-tracking-route-title>div:last-child b,.stock-tracking-route-title>div:last-child small{display:block}.stock-tracking-route-title>div:last-child small{color:var(--muted,#64748b);font-size:.68rem}
.stock-tracking-documents{padding:10px;display:grid;gap:8px}.stock-tracking-document{border:1px solid var(--border,#dbe4ef);border-radius:10px;background:var(--card,#fff);overflow:hidden}.stock-tracking-document>summary{display:grid;grid-template-columns:minmax(170px,1fr) minmax(180px,1.2fr) minmax(120px,.65fr);gap:12px;align-items:center;padding:10px 12px;cursor:pointer;list-style:none}.stock-tracking-document>summary::-webkit-details-marker{display:none}.stock-tracking-document>summary:hover{background:var(--hover,#f5f7fb)}.stock-tracking-document-main b,.stock-tracking-document-main small,.stock-tracking-document-party b,.stock-tracking-document-party small,.stock-tracking-document-qty b,.stock-tracking-document-qty small{display:block}.stock-tracking-document-main small,.stock-tracking-document-party small,.stock-tracking-document-qty small{font-size:.68rem;color:var(--muted,#64748b)}.stock-tracking-document-qty{text-align:right}
.stock-tracking-document-flow{display:grid;grid-template-columns:repeat(5,minmax(125px,1fr) 22px);grid-template-columns:minmax(125px,1fr) 22px minmax(125px,1fr) 22px minmax(145px,1fr) 22px minmax(125px,1fr) 22px minmax(145px,1fr);align-items:center;gap:4px;padding:12px;border-top:1px solid var(--border,#dbe4ef);background:color-mix(in srgb,var(--surface,#f5f7fb) 45%,var(--card,#fff));overflow-x:auto}.stock-tracking-route-node{min-width:0;border:1px solid var(--border,#dbe4ef);border-radius:9px;padding:9px;background:var(--card,#fff);color:var(--text,#152238)}.stock-tracking-route-node span,.stock-tracking-route-node b,.stock-tracking-route-node small{display:block}.stock-tracking-route-node span{text-transform:uppercase;font-size:.59rem;letter-spacing:.05em;color:var(--muted,#64748b);font-weight:800}.stock-tracking-route-node b{font-size:.76rem;margin:2px 0;overflow-wrap:anywhere}.stock-tracking-route-node small{font-size:.63rem;color:var(--muted,#64748b);overflow-wrap:anywhere}.stock-tracking-route-node.endpoint{border-color:color-mix(in srgb,#22c55e 34%,var(--border,#dbe4ef));background:color-mix(in srgb,#22c55e 6%,var(--card,#fff))}
.stock-tracking-document-footer{display:flex;justify-content:space-between;gap:10px;padding:8px 12px;border-top:1px dashed var(--border,#dbe4ef);font-size:.7rem;color:var(--muted,#64748b)}.stock-tracking-document-footer a{color:var(--theme-primary,var(--brand,#714b67));font-weight:700;text-decoration:none}.stock-tracking-empty{margin:12px;padding:14px;border:1px dashed var(--border,#dbe4ef);border-radius:9px;color:var(--muted,#64748b);font-size:.78rem}.stock-tracking-empty span{display:block;margin-top:5px}
.stock-tracking-balance-grid{padding:10px;display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:8px}.stock-tracking-balance-card{border:1px solid var(--border,#dbe4ef);border-radius:10px;padding:11px;background:var(--card,#fff)}.stock-tracking-balance-card span,.stock-tracking-balance-card strong,.stock-tracking-balance-card small{display:block}.stock-tracking-balance-card span{font-size:.7rem;color:var(--muted,#64748b)}.stock-tracking-balance-card strong{margin:3px 0;font-size:.95rem}.stock-tracking-balance-card small{font-size:.66rem;color:var(--muted,#64748b)}
.stock-tracking-hierarchy{padding:14px;min-width:0;background:color-mix(in srgb,var(--surface,#f5f7fb) 38%,var(--card,#fff))}.stock-tracking-hierarchy-title{margin-bottom:9px}.stock-tracking-hierarchy-title span,.stock-tracking-hierarchy-title small{display:block}.stock-tracking-hierarchy-title span{font-weight:900}.stock-tracking-hierarchy-title small{font-size:.68rem;color:var(--muted,#64748b)}.stock-tracking-product-root{position:relative;padding:11px 11px 11px 18px;border:1px solid color-mix(in srgb,var(--theme-primary,var(--brand,#714b67)) 24%,var(--border,#dbe4ef));border-radius:10px;background:var(--card,#fff);margin-bottom:8px}.stock-tracking-product-root:before{content:'';position:absolute;left:7px;top:14px;bottom:14px;width:3px;border-radius:3px;background:var(--theme-primary,var(--brand,#714b67))}.stock-tracking-product-root b,.stock-tracking-product-root span,.stock-tracking-product-root small{display:block}.stock-tracking-product-root b{font-size:.78rem}.stock-tracking-product-root span,.stock-tracking-product-root small{font-size:.65rem;color:var(--muted,#64748b)}
.stock-tracking-hierarchy-group{border:1px solid var(--border,#dbe4ef);border-radius:9px;background:var(--card,#fff);margin-top:7px;overflow:hidden}.stock-tracking-hierarchy-group>summary{padding:8px 10px;cursor:pointer;font-size:.73rem;font-weight:800;display:flex;justify-content:space-between;gap:8px}.stock-tracking-hierarchy-group>summary span{min-width:22px;text-align:center;border-radius:999px;background:var(--surface,#eef2f7);padding:1px 6px}.stock-tracking-hierarchy-group>div{padding:4px 7px 8px;display:grid;gap:5px;border-top:1px solid var(--border,#dbe4ef)}.stock-tracking-hierarchy-group p{margin:5px;color:var(--muted,#64748b);font-size:.68rem}.stock-tracking-hierarchy-group a{display:grid;grid-template-columns:auto 1fr auto;gap:6px;align-items:center;padding:6px;border-radius:7px;text-decoration:none;color:var(--text,#152238);font-size:.68rem}.stock-tracking-hierarchy-group a:hover{background:var(--hover,#f5f7fb)}.stock-tracking-hierarchy-group a span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.stock-tracking-hierarchy-group a small{color:var(--muted,#64748b);white-space:nowrap}
@media(max-width:1180px){.stock-tracking-kpis{grid-template-columns:repeat(3,minmax(145px,1fr))}.stock-tracking-main-grid{grid-template-columns:1fr}.stock-tracking-flow-column{border-right:0;border-bottom:1px solid var(--border,#dbe4ef)}}
@media(max-width:760px){.stock-product-tracking-host{margin:8px 6px 0}.stock-tracking-header{padding:14px}.stock-tracking-kpis{grid-template-columns:repeat(2,minmax(130px,1fr))}.stock-tracking-diagram{grid-template-columns:1fr}.stock-tracking-arrow{transform:rotate(90deg)}.stock-tracking-route-stack{grid-template-columns:1fr}.stock-tracking-document>summary{grid-template-columns:1fr}.stock-tracking-document-party,.stock-tracking-document-qty{text-align:left}.stock-tracking-document-flow{grid-template-columns:1fr}.stock-tracking-mini-arrow{transform:rotate(90deg)}.stock-tracking-document-footer{flex-direction:column}.stock-tracking-hierarchy-group a{grid-template-columns:auto 1fr}.stock-tracking-hierarchy-group a small{grid-column:2}}


/* v2026.09.09.64 - User Management / Rights: legacy per-user Additional Rights */
.userrights-additional-card {
    margin: 0 0 14px;
    border: 1px solid var(--border-color, #d7dee8);
    border-radius: 12px;
    background: var(--panel-bg, #fff);
    overflow: hidden;
}

.userrights-additional-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 14px;
    border-bottom: 1px solid var(--border-color, #d7dee8);
    background: var(--surface-soft, rgba(148, 163, 184, .08));
}

.userrights-additional-head > div { display: grid; gap: 2px; }
.userrights-additional-head strong { font-size: 14px; }
.userrights-additional-head span { color: var(--muted-text, #64748b); font-size: 12px; }

.userrights-storage-warning {
    max-width: 420px;
    padding: 6px 9px;
    border: 1px solid rgba(217, 119, 6, .35);
    border-radius: 8px;
    background: rgba(245, 158, 11, .10);
    color: var(--text-color, #7c2d12) !important;
    font-weight: 600;
}

.userrights-additional-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px 12px;
    padding: 12px 14px 14px;
}

.userrights-additional-grid .userrights-switch { min-height: 42px; margin: 0; }
.userrights-additional-grid.is-disabled { opacity: .62; }

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

@media (max-width: 680px) {
    .userrights-additional-head { align-items: flex-start; flex-direction: column; }
    .userrights-additional-grid { grid-template-columns: 1fr; }
}

/* ERP v2026.09.10.65 - Theme Pack palette/preview parity + advanced themes */
/* Every preview owns its palette so it never inherits the currently-selected theme. */
.theme-preview-odoo { --bg:#f4f6fb; --card:#ffffff; --border:#e5e7eb; --brand:#714b67; --brand-dark:#52364b; --soft:#f8eef6; }
.theme-preview-blue { --bg:#eff6ff; --card:#ffffff; --border:#bfdbfe; --brand:#2563eb; --brand-dark:#1e3a8a; --soft:#dbeafe; }
.theme-preview-green { --bg:#ecfdf5; --card:#ffffff; --border:#bbf7d0; --brand:#059669; --brand-dark:#065f46; --soft:#d1fae5; }
.theme-preview-gold { --bg:#fffbeb; --card:#ffffff; --border:#fde68a; --brand:#a16207; --brand-dark:#713f12; --soft:#fef3c7; }
.theme-preview-red { --bg:#fff1f2; --card:#ffffff; --border:#fecdd3; --brand:#dc2626; --brand-dark:#991b1b; --soft:#ffe4e6; }
.theme-preview-dark { --bg:#0f172a; --card:#111827; --border:#334155; --brand:#8b5cf6; --brand-dark:#020617; --soft:#1e293b; }

body.theme-navy {
    --bg:#f1f5f9; --card:#ffffff; --text:#0f172a; --muted:#64748b; --border:#cbd5e1;
    --brand:#1e40af; --brand-dark:#172554; --on-brand:#ffffff; --soft:#dbeafe;
}
body.theme-lavender {
    --bg:#faf5ff; --card:#ffffff; --text:#2e1065; --muted:#6b7280; --border:#e9d5ff;
    --brand:#8b5cf6; --brand-dark:#5b21b6; --on-brand:#ffffff; --soft:#ede9fe;
}
body.theme-sage {
    --bg:#f7fee7; --card:#ffffff; --text:#1a2e05; --muted:#64748b; --border:#d9f99d;
    --brand:#4d7c0f; --brand-dark:#365314; --on-brand:#ffffff; --soft:#ecfccb;
}
body.theme-graphite {
    --bg:#f8fafc; --card:#ffffff; --text:#111827; --muted:#64748b; --border:#d1d5db;
    --brand:#334155; --brand-dark:#0f172a; --on-brand:#ffffff; --soft:#e2e8f0;
}
body.theme-burgundy {
    --bg:#fff7f8; --card:#ffffff; --text:#4a0718; --muted:#7f1d1d; --border:#fecdd3;
    --brand:#9f1239; --brand-dark:#4c0519; --on-brand:#ffffff; --soft:#ffe4e6;
}
body.theme-arctic {
    --bg:#ecfeff; --card:#ffffff; --text:#083344; --muted:#64748b; --border:#a5f3fc;
    --brand:#0891b2; --brand-dark:#164e63; --on-brand:#ffffff; --soft:#cffafe;
}

.theme-preview-navy { --bg:#f1f5f9; --card:#ffffff; --border:#cbd5e1; --brand:#1e40af; --brand-dark:#172554; --soft:#dbeafe; }
.theme-preview-lavender { --bg:#faf5ff; --card:#ffffff; --border:#e9d5ff; --brand:#8b5cf6; --brand-dark:#5b21b6; --soft:#ede9fe; }
.theme-preview-sage { --bg:#f7fee7; --card:#ffffff; --border:#d9f99d; --brand:#4d7c0f; --brand-dark:#365314; --soft:#ecfccb; }
.theme-preview-graphite { --bg:#f8fafc; --card:#ffffff; --border:#d1d5db; --brand:#334155; --brand-dark:#0f172a; --soft:#e2e8f0; }
.theme-preview-burgundy { --bg:#fff7f8; --card:#ffffff; --border:#fecdd3; --brand:#9f1239; --brand-dark:#4c0519; --soft:#ffe4e6; }
.theme-preview-arctic { --bg:#ecfeff; --card:#ffffff; --border:#a5f3fc; --brand:#0891b2; --brand-dark:#164e63; --soft:#cffafe; }

body.theme-navy .sidebar,
body.theme-lavender .sidebar,
body.theme-burgundy .sidebar,
body.theme-arctic .sidebar {
    background: linear-gradient(160deg, var(--brand-dark), var(--brand));
}

/* v2026.09.11.67 - Default Ledger Accounts responsive layout polish */
.default-ledger-settings-page{
    width:100%;
    max-width:1440px;
    margin:0 auto;
    padding:12px 18px 32px;
}
.default-ledger-page-header{
    position:relative;
    z-index:12;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
    min-height:64px;
    margin-bottom:12px;
    padding:11px 14px;
    border:1px solid var(--border,var(--erp-border,#d8dee9));
    border-radius:12px;
    background:var(--card,var(--erp-card-bg,#fff));
    box-shadow:0 4px 14px rgba(15,23,42,.05);
}
.default-ledger-page-heading{min-width:0}
.default-ledger-page-heading .erp-form-title{font-size:18px;font-weight:800;line-height:1.2}
.default-ledger-page-heading .erp-breadcrumb{margin-top:3px;font-size:12px;color:var(--muted,var(--erp-muted,#64748b))}
.default-ledger-header-actions{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:8px;
    flex:0 0 auto;
}
.default-ledger-settings-page .default-ledger-header-actions .btn,
.default-ledger-settings-page .default-ledger-user-row .btn,
.default-ledger-settings-page .default-ledger-actions .btn{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:auto!important;
    max-width:none!important;
    flex:0 0 auto!important;
    white-space:nowrap!important;
}
.default-ledger-settings-page .default-ledger-header-actions .btn{min-width:108px!important;min-height:38px!important;padding:7px 14px!important}
.default-ledger-form-body{padding:0!important}
.default-ledger-settings-page .erp-settings-card{margin-top:0;border-radius:12px}
.default-ledger-settings-page .erp-settings-heading{padding:20px 24px 16px}
.default-ledger-settings-page .erp-settings-heading h1{font-size:22px;line-height:1.2}
.default-ledger-user-panel{
    display:grid;
    grid-template-columns:minmax(260px,.72fr) minmax(360px,1.28fr);
    align-items:end;
    gap:24px;
    margin:16px 24px 4px;
    padding:14px 16px;
    border:1px solid var(--border,var(--erp-border,#d8dee9));
    border-radius:10px;
    background:color-mix(in srgb,var(--card,var(--erp-card-bg,#fff)) 94%,var(--brand,var(--erp-primary,#2563eb)) 6%);
}
.default-ledger-user-copy{display:flex;flex-direction:column;gap:4px;min-width:0}
.default-ledger-user-copy strong{font-size:14px;font-weight:800}
.default-ledger-user-copy span{font-size:12px;line-height:1.4;color:var(--muted,var(--erp-muted,#64748b))}
.default-ledger-user-form{display:block;max-width:none;padding:0;margin:0}
.default-ledger-user-form>label{display:block;margin-bottom:6px;font-size:12px;font-weight:800}
.default-ledger-user-row{display:grid;grid-template-columns:minmax(220px,1fr) auto;gap:8px;align-items:center}
.default-ledger-settings-page .default-ledger-user-row select,
.default-ledger-settings-page .default-ledger-field select{
    width:100%;
    min-width:0;
    min-height:40px;
    border:1px solid var(--border,var(--erp-border,#cbd5e1));
    border-radius:8px;
    background:var(--card,var(--erp-card-bg,#fff));
    color:var(--text,var(--erp-text,#1f2937));
    padding:7px 10px;
}
.default-ledger-settings-page .default-ledger-load-btn{min-width:88px!important;min-height:40px!important;padding:7px 16px!important}
.default-ledger-form{padding:10px 24px 24px}
.default-ledger-section{
    margin-top:14px;
    padding:18px;
    border:1px solid var(--border,var(--erp-border,#d8dee9));
    border-radius:11px;
    background:var(--card,var(--erp-card-bg,#fff));
}
.default-ledger-section:first-of-type{margin-top:6px;padding-top:18px;border-top:1px solid var(--border,var(--erp-border,#d8dee9))}
.default-ledger-section-heading{margin-bottom:14px;padding-bottom:10px;border-bottom:1px solid color-mix(in srgb,var(--border,var(--erp-border,#d8dee9)) 72%,transparent)}
.default-ledger-section-heading h2{font-size:15px;line-height:1.25}
.default-ledger-section-heading p{font-size:12px;line-height:1.4}
.default-ledger-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 22px}
.default-ledger-field{min-width:0;gap:6px}
.default-ledger-field>span{font-size:12px;font-weight:800}
.default-ledger-field small{min-height:16px;font-size:11px;line-height:1.35}
.default-ledger-effective{min-height:auto!important;margin-top:1px;padding:7px 9px!important;overflow-wrap:anywhere}
.default-ledger-help{margin-top:16px;padding:12px 14px;line-height:1.45}
.default-ledger-actions{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:10px;
    margin-top:18px;
    padding-top:16px;
    border-top:1px solid var(--border,var(--erp-border,#d8dee9));
}
.default-ledger-settings-page .default-ledger-reload-btn{min-width:110px!important;min-height:40px!important;padding:8px 18px!important}
.default-ledger-settings-page .default-ledger-save-btn{min-width:180px!important;min-height:40px!important;padding:8px 20px!important}
@media(max-width:900px){
    .default-ledger-user-panel{grid-template-columns:1fr;gap:12px}
    .default-ledger-grid{grid-template-columns:1fr}
}
@media(max-width:640px){
    .default-ledger-settings-page{padding:8px}
    .default-ledger-page-header{align-items:flex-start;flex-direction:column}
    .default-ledger-header-actions{width:100%;justify-content:flex-start;flex-wrap:wrap}
    .default-ledger-settings-page .default-ledger-header-actions .btn{flex:1 1 130px!important}
    .default-ledger-user-panel{margin:12px 14px 2px;padding:12px}
    .default-ledger-form{padding:8px 14px 18px}
    .default-ledger-settings-page .erp-settings-heading{padding:16px 14px 14px}
    .default-ledger-user-row{grid-template-columns:1fr}
    .default-ledger-settings-page .default-ledger-load-btn{width:100%!important}
    .default-ledger-section{padding:14px}
    .default-ledger-actions{flex-direction:column-reverse;align-items:stretch}
    .default-ledger-settings-page .default-ledger-actions .btn{width:100%!important}
}

/* v2026.09.14.70 - Settings / Hardware & Devices */
.hardware-settings-page{max-width:1680px;margin:0 auto;padding:18px 22px 32px}.hardware-settings-actionbar{align-items:flex-start;gap:22px}.hardware-settings-actionbar h1{margin:2px 0 4px}.hardware-settings-actionbar p{margin:0;max-width:920px;color:var(--erp-muted,#64748b)}.hardware-kicker{font-size:11px;font-weight:800;letter-spacing:.1em;color:var(--erp-primary,#7c3aed)}.hardware-header-actions,.hardware-editor-actions,.hardware-row-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.hardware-overview{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:16px 0}.hardware-overview>div{border:1px solid var(--erp-border,#dbe3ed);background:var(--erp-surface,#fff);border-radius:14px;padding:14px 16px;box-shadow:0 4px 14px rgba(15,23,42,.04)}.hardware-overview span,.hardware-overview small{display:block;color:var(--erp-muted,#64748b)}.hardware-overview strong{display:block;font-size:22px;margin:3px 0;color:var(--erp-text,#0f172a)}.hardware-tabs{display:flex;gap:8px;flex-wrap:wrap;padding:8px;border:1px solid var(--erp-border,#dbe3ed);background:var(--erp-surface,#fff);border-radius:14px;margin-bottom:14px;position:sticky;top:8px;z-index:8}.hardware-tabs button{border:0;border-radius:10px;padding:9px 14px;background:transparent;color:var(--erp-muted,#64748b);font-weight:700;cursor:pointer}.hardware-tabs button.is-active{background:var(--erp-primary,#7c3aed);color:#fff}.hardware-tab-panel[hidden]{display:none!important}.hardware-two-column{display:grid;grid-template-columns:minmax(360px,.86fr) minmax(520px,1.45fr);gap:16px;align-items:start}.hardware-editor-card,.hardware-list-card{padding:18px;border-radius:15px}.hardware-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:14px}.hardware-card-head h2{margin:2px 0 0;font-size:19px}.hardware-card-head p{margin:4px 0 0;color:var(--erp-muted,#64748b)}.hardware-field-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px 12px}.hardware-field-grid label,.hardware-full-field{display:flex;flex-direction:column;gap:5px}.hardware-field-grid label>span,.hardware-full-field>span{font-size:12px;font-weight:750;color:var(--erp-muted,#475569)}.hardware-span-2{grid-column:span 2}.hardware-subsection{border:1px solid var(--erp-border,#dbe3ed);border-radius:13px;padding:13px;margin:14px 0;background:color-mix(in srgb,var(--erp-surface,#fff) 92%,var(--erp-primary,#7c3aed) 8%)}.hardware-subsection-title{display:flex;justify-content:space-between;gap:14px;margin-bottom:11px}.hardware-subsection-title strong,.hardware-subsection-title small{display:block}.hardware-subsection-title small{margin-top:3px;color:var(--erp-muted,#64748b)}.hardware-switch,.hardware-check{display:flex!important;flex-direction:row!important;align-items:center!important;gap:8px!important}.hardware-switch input,.hardware-check input{width:17px;height:17px}.hardware-check-grid{display:flex;gap:14px;flex-wrap:wrap;margin:12px 0}.hardware-editor-actions{justify-content:flex-end;margin-top:14px;border-top:1px solid var(--erp-border,#e2e8f0);padding-top:13px}.hardware-table-wrap{overflow:auto;border:1px solid var(--erp-border,#dbe3ed);border-radius:12px}.hardware-table{width:100%;border-collapse:collapse;min-width:760px}.hardware-table th,.hardware-table td{padding:10px 11px;border-bottom:1px solid var(--erp-border,#e5e7eb);text-align:left;vertical-align:top;font-size:13px}.hardware-table th{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--erp-muted,#64748b);background:color-mix(in srgb,var(--erp-surface,#fff) 92%,#94a3b8 8%)}.hardware-table td strong,.hardware-table td small{display:block}.hardware-table td small{color:var(--erp-muted,#64748b);margin-top:2px}.hardware-table tbody tr:last-child td{border-bottom:0}.hardware-row-actions{justify-content:flex-end;white-space:nowrap}.hardware-inline-form{display:inline-flex;margin:0}.hardware-pill,.hardware-status{display:inline-flex;padding:3px 8px;border-radius:999px;font-size:11px;font-weight:800;background:#eef2ff;color:#4338ca}.hardware-status.is-on{background:#dcfce7;color:#166534}.hardware-status.is-off{background:#f1f5f9;color:#64748b}.hardware-empty{text-align:center!important;color:var(--erp-muted,#64748b)!important;padding:28px!important}.hardware-scope-help{font-size:12px;color:var(--erp-muted,#64748b);margin-top:9px;padding:9px 10px;border-radius:9px;background:color-mix(in srgb,var(--erp-surface,#fff) 94%,#94a3b8 6%)}.hardware-wide-card{padding:18px}.hardware-display-grid{display:grid;grid-template-columns:repeat(3,minmax(280px,1fr));gap:13px}.hardware-display-card{border:1px solid var(--erp-border,#dbe3ed);border-radius:14px;padding:14px;background:var(--erp-surface,#fff)}.hardware-display-card.is-enabled{box-shadow:inset 3px 0 0 var(--erp-primary,#7c3aed)}.hardware-display-head{display:flex;justify-content:space-between;gap:12px}.hardware-display-head strong,.hardware-display-head small{display:block}.hardware-display-head small{color:var(--erp-muted,#64748b)}.hardware-display-card dl{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:12px 0}.hardware-display-card dl div{background:color-mix(in srgb,var(--erp-surface,#fff) 94%,#94a3b8 6%);padding:8px;border-radius:9px}.hardware-display-card dt{font-size:10px;text-transform:uppercase;color:var(--erp-muted,#64748b)}.hardware-display-card dd{margin:2px 0 0;font-weight:700}.hardware-runtime-status{padding:12px 13px;border-radius:11px;background:color-mix(in srgb,var(--erp-surface,#fff) 90%,var(--erp-primary,#7c3aed) 10%);font-weight:700;margin-bottom:12px}.hardware-runtime-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}.hardware-runtime-grid>div{padding:10px;border:1px solid var(--erp-border,#dbe3ed);border-radius:10px}.hardware-runtime-grid span,.hardware-runtime-grid strong{display:block}.hardware-runtime-grid span{font-size:11px;color:var(--erp-muted,#64748b);text-transform:uppercase}.hardware-bridge-notes p{margin:0 0 12px;line-height:1.55}.hardware-bridge-notes code{font-size:12px}.hardware-contract-list{display:flex;flex-wrap:wrap;gap:7px}.hardware-contract-list span{padding:6px 9px;border-radius:8px;background:#0f172a;color:#e2e8f0;font-family:monospace;font-size:11px}
@media(max-width:1100px){.hardware-overview{grid-template-columns:repeat(2,minmax(0,1fr))}.hardware-two-column{grid-template-columns:1fr}.hardware-display-grid{grid-template-columns:repeat(2,minmax(260px,1fr))}}
@media(max-width:700px){.hardware-settings-page{padding:12px 10px 24px}.hardware-overview{grid-template-columns:1fr 1fr}.hardware-field-grid,.hardware-runtime-grid{grid-template-columns:1fr}.hardware-span-2{grid-column:auto}.hardware-display-grid{grid-template-columns:1fr}.hardware-tabs{position:static}.hardware-settings-actionbar{flex-direction:column}.hardware-header-actions{width:100%}}

/* v2026.09.15.74 - Hardware & Devices layout/button alignment */
.hardware-settings-page .btn{
    width:auto!important;
    max-width:none!important;
    margin-top:0!important;
    min-height:36px;
    padding:7px 14px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    flex:0 0 auto;
    white-space:nowrap;
}
.hardware-settings-page .btn.btn-sm{
    min-height:32px;
    padding:5px 10px;
    font-size:12px;
}
.hardware-settings-page .hardware-settings-actionbar{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:start!important;
    column-gap:24px;
    row-gap:12px;
}
.hardware-settings-page .hardware-header-actions{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    gap:8px!important;
    flex-wrap:nowrap!important;
    align-self:start;
}
.hardware-settings-page .hardware-header-actions .btn{
    min-width:126px;
}
.hardware-settings-page .hardware-overview{
    align-items:stretch;
}
.hardware-settings-page .hardware-overview>div{
    min-height:88px;
    display:flex;
    flex-direction:column;
    justify-content:center;
}
.hardware-settings-page .hardware-tabs{
    align-items:center;
    gap:6px;
}
.hardware-settings-page .hardware-tabs button{
    width:auto!important;
    min-height:36px;
    margin:0!important;
    padding:8px 14px;
    flex:0 0 auto;
}
.hardware-settings-page .hardware-two-column{
    grid-template-columns:minmax(430px,520px) minmax(0,1fr);
    gap:18px;
}
.hardware-settings-page .hardware-editor-card,
.hardware-settings-page .hardware-list-card,
.hardware-settings-page .hardware-wide-card{
    min-width:0;
}
.hardware-settings-page .hardware-card-head{
    align-items:center;
    margin-bottom:16px;
}
.hardware-settings-page .hardware-card-head>div{
    min-width:0;
}
.hardware-settings-page .hardware-card-head>.btn{
    min-width:82px;
}
.hardware-settings-page .hardware-field-grid{
    gap:12px 14px;
}
.hardware-settings-page .hardware-field-grid .form-control,
.hardware-settings-page .hardware-full-field .form-control{
    width:100%;
    min-width:0;
}
.hardware-settings-page .hardware-subsection{
    margin:16px 0;
    padding:14px;
}
.hardware-settings-page .hardware-subsection-title{
    align-items:flex-start;
}
.hardware-settings-page .hardware-editor-actions{
    display:flex!important;
    justify-content:flex-end!important;
    align-items:center!important;
    gap:8px!important;
    flex-wrap:wrap!important;
}
.hardware-settings-page .hardware-editor-actions .btn-primary{
    min-width:145px;
}
.hardware-settings-page .hardware-table-wrap{
    width:100%;
    overflow-x:auto;
}
.hardware-settings-page .hardware-table{
    min-width:780px;
    table-layout:auto;
}
.hardware-settings-page .hardware-table th,
.hardware-settings-page .hardware-table td{
    padding:11px 12px;
}
.hardware-settings-page .hardware-table th:last-child,
.hardware-settings-page .hardware-table td:last-child{
    width:230px;
}
.hardware-settings-page .hardware-table td.hardware-row-actions{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:6px;
    flex-wrap:nowrap;
    min-width:210px;
}
.hardware-settings-page .hardware-row-actions{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    gap:6px!important;
    flex-wrap:wrap!important;
}
.hardware-settings-page .hardware-row-actions .btn{
    min-width:72px;
}
.hardware-settings-page .hardware-inline-form{
    display:inline-flex!important;
    width:auto!important;
    margin:0!important;
    padding:0!important;
    flex:0 0 auto!important;
}
.hardware-settings-page .hardware-inline-form .btn{
    width:auto!important;
}
.hardware-settings-page .hardware-check,
.hardware-settings-page .hardware-switch{
    margin-top:0!important;
}
.hardware-settings-page .hardware-full-field{
    margin-top:2px;
}
@media(max-width:1100px){
    .hardware-settings-page .hardware-two-column{grid-template-columns:1fr}
    .hardware-settings-page .hardware-list-card{order:2}
}
@media(max-width:820px){
    .hardware-settings-page .hardware-settings-actionbar{grid-template-columns:1fr}
    .hardware-settings-page .hardware-header-actions{justify-content:flex-start!important;flex-wrap:wrap!important}
    .hardware-settings-page .hardware-header-actions .btn{min-width:0}
    .hardware-settings-page .hardware-tabs{position:static}
}
@media(max-width:560px){
    .hardware-settings-page .hardware-overview{grid-template-columns:1fr}
    .hardware-settings-page .hardware-header-actions,
    .hardware-settings-page .hardware-editor-actions{width:100%}
    .hardware-settings-page .hardware-header-actions .btn,
    .hardware-settings-page .hardware-editor-actions .btn{flex:1 1 100%!important;width:100%!important}
    .hardware-settings-page .hardware-card-head{align-items:flex-start}
    .hardware-settings-page .hardware-card-head>.btn{min-width:72px}
    .hardware-settings-page .hardware-field-grid{grid-template-columns:1fr}
    .hardware-settings-page .hardware-row-actions{justify-content:flex-start!important}
}

/* ERP Android POS download */
.mobile-app-download-page { max-width: 1180px; margin: 0 auto; }
.mobile-app-download-grid { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr); gap:18px; margin-top:18px; }
.mobile-app-card { border:1px solid var(--border); background:var(--surface); border-radius:14px; padding:20px; box-shadow:var(--shadow-sm); }
.mobile-app-card-head { display:flex; align-items:flex-start; justify-content:space-between; gap:14px; margin-bottom:12px; }
.mobile-app-card h2 { margin:0 0 10px; color:var(--text); }
.mobile-app-platform { display:inline-flex; padding:4px 8px; border-radius:999px; background:var(--surface-soft); color:var(--primary); font-size:.72rem; font-weight:800; letter-spacing:.08em; }
.mobile-app-meta { display:grid; gap:8px; margin:16px 0; }
.mobile-app-meta > div { display:grid; grid-template-columns:90px minmax(0,1fr); gap:10px; align-items:start; }
.mobile-app-meta dt { color:var(--text-muted); font-weight:700; }
.mobile-app-meta dd { margin:0; color:var(--text); }
.mobile-app-hash { overflow-wrap:anywhere; font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size:.82rem; }
.mobile-app-primary-action { width:auto !important; min-width:210px; margin-top:4px !important; }
.mobile-app-feature-list { margin:10px 0 18px 20px; padding:0; display:grid; gap:8px; }
.mobile-app-security-note { margin-top:18px; }
.status-pill.status-warning { background:#fff5d6; color:#7c5700; border:1px solid #f1d57c; }
@media (max-width: 820px) {
  .mobile-app-download-grid { grid-template-columns:1fr; }
  .mobile-app-card-head { flex-direction:column; }
}