/* variables.css */
/* frontend/assets/css/variables.css */
:root {
    /* Brand Colors - Modern and Premium */
    --primary: #2563eb;       /* Rich Blue */
    --primary-hover: #1d4ed8;
    --primary-light: #eff6ff;
    
    --secondary: #475569;
    --secondary-hover: #334155;
    
    --success: #10b981;
    --success-light: #d1fae5;
    
    --warning: #f59e0b;
    --warning-light: #fef3c7;
    
    --danger: #ef4444;
    --danger-light: #fee2e2;

    /* Backgrounds */
    --bg-app: #f7fafe;
    --bg-surface: #ffffff;
    --bg-sidebar: #ffffff;
    --bg-sidebar-hover: #f1f5fb;

    /* Sidebar tokens: the approved light navigation (white surface, navy text, blue icons) */
    --sidebar-bg: var(--bg-sidebar);
    --sidebar-module-open: #f7f9fd;
    --sidebar-submenu-bg: #f9fbfe;
    --sidebar-hover-bg: var(--bg-sidebar-hover);
    --sidebar-active-bg: #e9f3ff;
    --sidebar-accent: var(--primary);
    --sidebar-icon: var(--primary);
    --sidebar-text-main: #1e293b;
    --sidebar-text-secondary: #526581;
    --sidebar-active-text: var(--primary);
    --sidebar-border: #e4eaf3;
    --sidebar-brand: #0f172a;
    --sidebar-scrollbar: #d5dde8;

    /* Text Colors */
    --text-main: #1e293b;
    --text-muted: #64748b;

    /* Borders */
    --border-color: #e2e8f0;
    --border-radius: 8px;
    --border-radius-lg: 12px;
    --border-radius-full: 9999px;

    /* Shadows (Premium look) */
    --shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);
    --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
    --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);

    /* Typography — the one authoritative UI scale (print templates keep their
       own --tpl-font / sizes). Alexandria carries Arabic and Latin alike. */
    --font-family: 'Alexandria', 'Noto Sans Arabic', 'Segoe UI', Arial, sans-serif;
    --font-family-mono: ui-monospace, 'Cascadia Mono', Consolas, monospace;
    --font-xs: 12.5px;    /* captions, badges, helper text */
    --font-sm: 13.5px;    /* secondary text, form labels, placeholders */
    --font-ui: 14.5px;    /* dense operational text: table cells, controls, menus */
    --font-base: 15px;    /* body text */
    --font-md: 16px;      /* card titles, main sidebar items */
    --font-lg: 18px;      /* section / modal titles */
    --font-xl: 22px;      /* secondary page titles */
    --font-2xl: 26px;     /* page titles, KPI values */
    --weight-regular: 400;
    --weight-medium: 500;
    --weight-semibold: 600;
    --weight-bold: 700;
    --line-height-body: 1.6;   /* Arabic needs the taller leading */
    --line-height-tight: 1.35; /* headings, KPI values, table cells */
    
    /* Layout */
    --sidebar-width: 272px;
    --sidebar-collapsed-width: 76px;
    --header-height: 70px;
    
    /* Transitions */
    --transition-fast: 0.2s ease;
    --transition-base: 0.3s ease;
}
html[dir="ltr"] {
    --line-height-body: 1.5;
}

/* Phones: large headings and KPI values step down one size; body text keeps its size. */
@media (max-width: 620px) {
    :root {
        --font-2xl: 22px;
        --font-xl: 20px;
    }
}

/* Optional Dark Mode (Placeholder) */
[data-theme="dark"] {
    --bg-app: #0f172a;
    --bg-surface: #1e293b;
    --text-main: #f8fafc;
    --text-muted: #94a3b8;
    --border-color: #334155;
}

/* notification-system.css */
.app-notification-host {
    position: fixed;
    inset-block-start: 22px;
    inset-inline-start: 22px;
    z-index: 15000;
    display: grid;
    width: min(420px, calc(100vw - 32px));
    gap: 10px;
    pointer-events: none;
}

.app-toast {
    --toast-tone: var(--primary, #2563eb);
    position: relative;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: start;
    gap: 12px;
    overflow: hidden;
    padding: 15px 15px 14px;
    border: 1px solid var(--border-color, #e2e8f0);
    border-inline-start: 4px solid var(--toast-tone);
    border-radius: 15px;
    color: var(--text-main, #1e293b);
    background: var(--bg-surface, #fff);
    box-shadow: 0 16px 38px rgb(15 23 42 / 16%);
    opacity: 0;
    transform: translateX(-14px) translateY(-4px);
    transition: opacity 190ms ease, transform 190ms ease;
    pointer-events: auto;
}

.app-toast.is-visible { opacity: 1; transform: none; }
.app-toast.is-leaving { opacity: 0; transform: translateX(-10px); }
.app-toast--success { --toast-tone: var(--success, #10b981); }
.app-toast--error { --toast-tone: var(--danger, #ef4444); }
.app-toast--warning { --toast-tone: var(--warning, #f59e0b); }
.app-toast--info { --toast-tone: var(--primary, #2563eb); }

.app-toast__icon,
.app-dialog__icon {
    display: grid;
    width: 38px;
    height: 38px;
    flex: 0 0 auto;
    place-items: center;
    border-radius: 50%;
    color: var(--toast-tone, var(--dialog-tone, var(--primary, #2563eb)));
    background: color-mix(in srgb, var(--toast-tone, var(--dialog-tone, var(--primary, #2563eb))) 12%, var(--bg-surface, #fff));
    font-size: 1rem;
}

.app-toast__content { min-width: 0; }
.app-toast__title { display: block; margin-block: 1px 4px; font-size: var(--font-base); font-weight: 700; }
.app-toast__message { margin: 0; color: var(--text-muted, #64748b); font-size: var(--font-sm); line-height: 1.7; white-space: pre-line; }
.app-toast__reference,
.app-dialog__reference { display: inline-flex; direction: ltr; margin-block-start: 8px; padding: 3px 7px; border-radius: 6px; color: var(--text-muted, #64748b); background: color-mix(in srgb, var(--bg-app, #f8fafc) 80%, var(--bg-surface, #fff)); font-size: var(--font-xs); }
.app-toast__close,
.app-dialog__close { display: grid; width: 30px; height: 30px; place-items: center; padding: 0; border: 0; border-radius: 8px; color: var(--text-muted, #64748b); background: transparent; cursor: pointer; }
.app-toast__close:hover,
.app-dialog__close:hover { color: var(--text-main, #1e293b); background: var(--bg-app, #f8fafc); }
.app-toast__action { display: inline-flex; min-height: 30px; align-items: center; margin-block-start: 9px; padding: 5px 10px; border: 1px solid color-mix(in srgb, var(--toast-tone) 28%, var(--border-color, #e2e8f0)); border-radius: 8px; color: var(--toast-tone); background: color-mix(in srgb, var(--toast-tone) 7%, var(--bg-surface, #fff)); cursor: pointer; text-decoration: none; font-size: var(--font-sm); font-weight: 700; }
.app-toast__action:disabled { opacity: .55; cursor: wait; }
.app-toast__progress { position: absolute; inset-inline: 0; inset-block-end: 0; height: 3px; background: var(--toast-tone); transform-origin: right center; animation: app-toast-progress var(--toast-duration) linear forwards; }

.app-dialog-overlay {
    position: fixed;
    inset: 0;
    z-index: 16000;
    display: grid;
    place-items: center;
    padding: 20px;
    background: rgb(15 23 42 / 55%);
    backdrop-filter: blur(3px);
    opacity: 0;
    transition: opacity 180ms ease;
}

.app-dialog-overlay.is-visible { opacity: 1; }
.app-dialog-overlay.is-leaving { opacity: 0; }
.has-app-dialog { overflow: hidden; }

.app-dialog {
    --dialog-tone: var(--primary, #2563eb);
    width: min(520px, 100%);
    overflow: hidden;
    border: 1px solid var(--border-color, #e2e8f0);
    border-radius: 18px;
    color: var(--text-main, #1e293b);
    background: var(--bg-surface, #fff);
    box-shadow: 0 28px 80px rgb(2 6 23 / 34%);
    transform: translateY(12px) scale(.985);
    transition: transform 180ms ease;
}

.app-dialog-overlay.is-visible .app-dialog { transform: none; }
.app-dialog--danger { --dialog-tone: var(--danger, #ef4444); }
.app-dialog--warning { --dialog-tone: var(--warning, #f59e0b); }
.app-dialog__header { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; padding: 18px 20px; border-block-end: 1px solid var(--border-color, #e2e8f0); }
.app-dialog__identity { display: flex; min-width: 0; align-items: center; gap: 12px; }
.app-dialog__title { margin: 0; font-size: var(--font-md); font-weight: 850; }
.app-dialog__subtitle { display: block; margin-block-start: 3px; color: var(--text-muted, #64748b); font-size: var(--font-xs); }
.app-dialog__body { display: grid; gap: 12px; padding: 20px; }
.app-dialog__message { margin: 0; color: var(--text-main, #1e293b); font-size: var(--font-ui); line-height: 1.85; white-space: pre-line; }
.app-dialog__details { margin: 0; padding: 10px 12px; border-radius: 9px; color: var(--text-muted, #64748b); background: var(--bg-app, #f8fafc); font-size: var(--font-sm); line-height: 1.75; white-space: pre-line; }
.app-dialog__footer { display: flex; align-items: center; justify-content: flex-start; gap: 9px; padding: 14px 20px; border-block-start: 1px solid var(--border-color, #e2e8f0); background: color-mix(in srgb, var(--bg-app, #f8fafc) 68%, var(--bg-surface, #fff)); }
.app-dialog__button { display: inline-flex; min-height: 40px; align-items: center; justify-content: center; padding: 8px 16px; border: 1px solid transparent; border-radius: 10px; cursor: pointer; font: inherit; font-size: var(--font-ui); font-weight: 700; }
.app-dialog__button--secondary { border-color: var(--border-color, #e2e8f0); color: var(--text-main, #1e293b); background: var(--bg-surface, #fff); }
.app-dialog__button--primary { color: #fff; background: var(--primary, #2563eb); }
.app-dialog__button--danger { color: #fff; background: var(--danger, #ef4444); }
.app-dialog__button--warning { color: #fff; background: var(--warning, #f59e0b); }
.app-dialog__button:focus-visible,
.app-dialog__close:focus-visible,
.app-toast__close:focus-visible,
.app-toast__action:focus-visible { outline: 3px solid color-mix(in srgb, var(--primary, #2563eb) 24%, transparent); outline-offset: 2px; }

.app-dialog__field { display: grid; gap: 7px; }
.app-dialog__label { color: var(--text-main, #1e293b); font-size: var(--font-sm); font-weight: 700; }
.app-dialog__required { color: var(--danger, #ef4444); }
.app-dialog__input { width: 100%; min-height: 43px; padding: 9px 11px; border: 1px solid var(--border-color, #e2e8f0); border-radius: 10px; outline: 0; color: var(--text-main, #1e293b); background: var(--bg-surface, #fff); font: inherit; font-size: var(--font-ui); }
textarea.app-dialog__input { min-height: 105px; resize: vertical; }
.app-dialog__input:focus { border-color: var(--primary, #2563eb); box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary, #2563eb) 13%, transparent); }
.app-dialog__field.has-error .app-dialog__input { border-color: var(--danger, #ef4444); box-shadow: 0 0 0 3px color-mix(in srgb, var(--danger, #ef4444) 10%, transparent); }
.app-dialog__help { color: var(--text-muted, #64748b); font-size: var(--font-xs); }
.app-dialog__validation { display: flex; align-items: center; gap: 5px; color: var(--danger, #ef4444); font-size: var(--font-xs); font-weight: 700; }
.app-dialog__validation[hidden] { display: none; }

.app-field-invalid { border-color: var(--danger, #ef4444) !important; box-shadow: 0 0 0 3px color-mix(in srgb, var(--danger, #ef4444) 10%, transparent) !important; }
.app-field-validation { display: flex; align-items: center; gap: 5px; margin-block-start: 5px; color: var(--danger, #ef4444); font-size: var(--font-ui); font-weight: 700; }
.app-field-validation::before { font-family: "Font Awesome 6 Free"; font-weight: 900; content: "\f06a"; }

@keyframes app-toast-progress { to { transform: scaleX(0); } }

@media (max-width: 575px) {
    .app-notification-host { inset-block-start: 12px; inset-inline: 12px; width: auto; }
    .app-toast { padding: 13px; border-radius: 13px; }
    .app-dialog-overlay { align-items: end; padding: 10px; }
    .app-dialog { width: 100%; border-radius: 18px 18px 12px 12px; }
    .app-dialog__footer { display: grid; grid-template-columns: 1fr 1fr; }
    .app-dialog__button { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
    .app-toast,
    .app-dialog-overlay,
    .app-dialog { transition: none; }
    .app-toast__progress { animation: none; }
}

/* layout.css */
/* frontend/assets/css/layout.css */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: var(--font-family);
    font-size: var(--font-base);
    font-weight: var(--weight-regular);
    line-height: var(--line-height-body);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    background-color: var(--bg-app);
    color: var(--text-main);
    overflow-y: auto;
}

/* Form controls and buttons take the page typography instead of the UA default. */
button, input, select, textarea {
    font: inherit;
}

code, kbd, pre, samp {
    font-family: var(--font-family-mono);
}

/* Secondary text never drops below the smallest token (Bootstrap's small is .875em). */
small, .small {
    font-size: var(--font-xs);
}

#app-wrapper {
    display: flex;
    min-height: 100vh;
    width: 100%;
}

/* Sidebar: the approved light navigation surface (white, navy text, blue icons) */
.sidebar {
    width: var(--sidebar-width);
    background-color: var(--sidebar-bg);
    color: var(--sidebar-text-main);
    display: flex;
    flex-direction: column;
    border-inline-end: 1px solid var(--sidebar-border);
    z-index: 100;
    transition: width var(--transition-base), transform var(--transition-base);
    position: sticky;
    top: 0;
    height: 100vh;
}

.sidebar-header {
    position: relative;
    height: var(--header-height);
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 0 22px;
    border-bottom: 1px solid var(--sidebar-border);
}

.sidebar-brand {
    display: flex;
    align-items: center;
    font-size: var(--font-xl);
    font-weight: var(--weight-bold);
    color: var(--sidebar-brand);
    letter-spacing: 1px;
}

.sidebar-brand-logo {
    display: block;
    width: min(172px, 100%);
    height: auto;
}

.sidebar-close {
    display: none;
    position: absolute;
    top: 50%;
    inset-inline-end: 12px;
    width: 36px;
    height: 36px;
    transform: translateY(-50%);
    border: 1px solid var(--sidebar-border);
    border-radius: 10px;
    background: #fff;
    color: var(--sidebar-text-secondary);
    cursor: pointer;
}

.sidebar-nav {
    flex: 1;
    overflow-y: auto;
    padding: 10px 10px 12px;
}

/* Custom Scrollbar for Sidebar */
.sidebar-nav::-webkit-scrollbar {
    width: 5px;
}
.sidebar-nav::-webkit-scrollbar-thumb {
    background: var(--sidebar-scrollbar);
    border-radius: 4px;
}

.nav-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 2px 0;
    padding: 10px 14px;
    border-radius: 10px;
    color: var(--sidebar-text-main);
    text-decoration: none;
    font-size: var(--font-md);
    font-weight: var(--weight-medium);
    line-height: 1.45;
    transition: background-color var(--transition-fast), color var(--transition-fast);
}

.nav-item > div {
    min-width: 0;
}

.nav-item i {
    font-size: var(--font-md);
    width: 22px;
    text-align: center;
    flex: 0 0 auto;
    color: var(--sidebar-icon);
}

.nav-item .nav-chevron {
    font-size: var(--font-xs);
    width: auto;
    color: var(--sidebar-text-secondary);
}

.nav-section-title {
    font-size: var(--font-xs);
    font-weight: var(--weight-semibold);
    text-transform: uppercase;
    letter-spacing: 0;
    color: var(--sidebar-text-secondary);
}

.nav-item:hover {
    background-color: var(--sidebar-hover-bg);
    color: var(--sidebar-text-main);
}

.nav-item.active, .nav-toggle.active {
    background-color: var(--sidebar-active-bg);
    color: var(--sidebar-active-text);
    font-weight: var(--weight-semibold);
}

.nav-toggle.open {
    background-color: var(--sidebar-module-open);
}

.nav-toggle.open.active {
    background-color: var(--sidebar-active-bg);
}

/* Submenu Styles */
.nav-submenu {
    display: none;
    margin: 0 6px 6px;
    padding: 4px 0;
    border-inline-start: 2px solid var(--sidebar-border);
}

.nav-submenu.open {
    display: block;
}

.nav-sub-item {
    display: block;
    margin: 1px 0;
    padding: 8px 12px;
    padding-inline-start: 40px;
    border-radius: 8px;
    color: var(--sidebar-text-secondary);
    text-decoration: none;
    font-size: var(--font-ui);
    font-weight: var(--weight-medium);
    line-height: 1.45;
    transition: background-color var(--transition-fast), color var(--transition-fast);
}

.nav-sub-item i {
    width: 18px;
    margin-inline-end: 8px;
    text-align: center;
    font-size: var(--font-sm);
    color: var(--sidebar-icon);
}

/* Sub-items declared without an icon (the Settings Center groups) are marked with a dot. */
.nav-sub-dot {
    display: inline-block;
    width: 6px;
    height: 6px;
    margin-inline-end: 12px;
    border-radius: 50%;
    background-color: currentColor;
    opacity: 0.45;
    vertical-align: middle;
}

.nav-sub-item.active .nav-sub-dot {
    opacity: 1;
}

.nav-sub-item:hover {
    background-color: var(--sidebar-hover-bg);
    color: var(--sidebar-text-main);
}

.nav-sub-item.active {
    background-color: var(--sidebar-active-bg);
    color: var(--sidebar-active-text);
    font-weight: var(--weight-semibold);
}

.nav-toggle .fa-chevron-down {
    transition: transform 0.3s;
}

.nav-toggle.open .fa-chevron-down {
    transform: rotate(180deg);
}

/* Signed-in user area pinned under the menu */
.sidebar-user {
    display: grid;
    gap: 8px;
    padding: 12px 14px;
    border-top: 1px solid var(--sidebar-border);
    background: #fff;
}

.sidebar-user__profile {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    padding: 6px 8px;
    border-radius: 10px;
    color: var(--sidebar-text-main);
    text-decoration: none;
    transition: background-color var(--transition-fast);
}

.sidebar-user__profile:hover {
    background: var(--sidebar-hover-bg);
    color: var(--sidebar-text-main);
}

.sidebar-user__avatar {
    flex: 0 0 auto;
    width: 40px;
    height: 40px;
    border-radius: 12px;
    object-fit: cover;
    background: var(--primary-light);
}

.sidebar-user__copy {
    display: grid;
    min-width: 0;
}

.sidebar-user__copy strong {
    font-size: var(--font-ui);
    font-weight: var(--weight-semibold);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sidebar-user__copy small {
    color: var(--sidebar-text-secondary);
    font-size: var(--font-xs);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sidebar-user__logout {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 38px;
    border: 1px solid #f8c7c7;
    border-radius: 10px;
    background: #fff5f5;
    color: #b91c1c;
    font-size: var(--font-sm);
    font-weight: var(--weight-semibold);
    cursor: pointer;
    transition: background-color var(--transition-fast);
}

.sidebar-user__logout:hover {
    background: #fee2e2;
}

/* Desktop collapse: icons only, labels as hover tooltips, groups closed */
body.sidebar-collapsed .sidebar {
    width: var(--sidebar-collapsed-width);
}

body.sidebar-collapsed .sidebar-header {
    padding: 0 8px;
    align-items: center;
}

body.sidebar-collapsed .sidebar-brand-logo {
    width: 44px;
    height: 44px;
    object-fit: cover;
    object-position: left center;
}

body.sidebar-collapsed .sidebar-console-label,
body.sidebar-collapsed .nav-section-title,
body.sidebar-collapsed .nav-chevron,
body.sidebar-collapsed .nav-submenu,
body.sidebar-collapsed .sidebar-user__copy,
body.sidebar-collapsed .sidebar-user__logout span {
    display: none;
}

body.sidebar-collapsed .sidebar-nav {
    padding-inline: 8px;
}

body.sidebar-collapsed .nav-item {
    position: relative;
    justify-content: center;
    padding: 12px 0;
}

body.sidebar-collapsed .nav-item > div {
    font-size: 0;
    gap: 0;
}

body.sidebar-collapsed .nav-item i {
    font-size: var(--font-md);
    width: auto;
}

body.sidebar-collapsed .nav-item[data-label]:hover::after {
    content: attr(data-label);
    position: absolute;
    top: 50%;
    inset-inline-start: calc(100% + 10px);
    z-index: 200;
    transform: translateY(-50%);
    padding: 6px 10px;
    border-radius: 8px;
    background: #0f172a;
    color: #fff;
    font-size: var(--font-sm);
    font-weight: var(--weight-medium);
    white-space: nowrap;
    pointer-events: none;
}

body.sidebar-collapsed .sidebar-user {
    padding: 10px 8px;
}

body.sidebar-collapsed .sidebar-user__profile {
    justify-content: center;
    padding: 4px;
}

.sidebar-backdrop {
    display: none;
}

/* Main Content Area */
.main-wrapper {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    overflow: visible;
}

/* Topbar */
.topbar {
    height: var(--header-height);
    background-color: var(--bg-surface);
    border-bottom: 1px solid var(--border-color);
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 24px;
    box-shadow: var(--shadow-sm);
    z-index: 90;
}

.topbar-right, .topbar-left {
    display: flex;
    align-items: center;
    gap: 16px;
    font-size: var(--font-ui);
}

.topbar #current-user-name {
    font-size: var(--font-ui);
    font-weight: var(--weight-semibold);
}

.topbar #current-user-branch,
.topbar small {
    font-size: var(--font-sm);
}

/* Phones: the header keeps its controls and drops the text-only labels. */
@media (max-width: 640px) {
    .topbar-right > span.text-muted,
    .topbar-left .d-flex.flex-column.lh-sm {
        display: none;
    }
}

/* Main View Container */
.main-content {
    flex: 1;
    overflow-y: visible;
    padding: 24px;
}

.sidebar-toggle.btn {
    display: none;
}

.sidebar-collapse.btn {
    display: inline-flex;
}

@media (max-width: 940px) {
    #app-wrapper {
        display: block;
        width: 100%;
    }

    .sidebar {
        position: fixed;
        inset: 0 0 0 auto;
        width: min(var(--sidebar-width), 86vw);
        height: 100dvh;
        transform: translateX(100%);
        box-shadow: -12px 0 30px rgba(16, 33, 63, 0.18);
        z-index: 1050;
    }

    html[dir="ltr"] .sidebar {
        inset: 0 auto 0 0;
        transform: translateX(-100%);
        box-shadow: 12px 0 30px rgba(16, 33, 63, 0.18);
    }

    .sidebar.is-open {
        transform: translateX(0);
    }

    .sidebar-close {
        display: inline-grid;
        place-items: center;
    }

    .sidebar-backdrop {
        display: block;
        position: fixed;
        inset: 0;
        z-index: 1040;
        background: rgba(15, 23, 42, 0.42);
        opacity: 0;
        pointer-events: none;
        transition: opacity var(--transition-base);
    }

    body.sidebar-open .sidebar-backdrop {
        opacity: 1;
        pointer-events: auto;
    }

    body.sidebar-open {
        overflow: hidden;
    }

    /* The drawer always shows full labels; the desktop collapse never applies here. */
    body.sidebar-collapsed .sidebar { width: min(var(--sidebar-width), 86vw); }
    body.sidebar-collapsed .sidebar-header { padding: 0 22px; align-items: stretch; }
    body.sidebar-collapsed .sidebar-brand-logo { width: min(172px, 100%); height: auto; object-fit: fill; }
    body.sidebar-collapsed .nav-section-title, body.sidebar-collapsed .nav-submenu.open, body.sidebar-collapsed .sidebar-user__copy { display: block; }
    body.sidebar-collapsed .sidebar-user__copy { display: grid; }
    body.sidebar-collapsed .nav-chevron { display: inline-block; }
    body.sidebar-collapsed .sidebar-user__logout span { display: inline; }
    body.sidebar-collapsed .sidebar-nav { padding-inline: 10px; }
    body.sidebar-collapsed .nav-item { justify-content: space-between; padding: 10px 14px; }
    body.sidebar-collapsed .nav-item > div { font-size: inherit; gap: 12px; }
    body.sidebar-collapsed .nav-item[data-label]:hover::after { content: none; }
    body.sidebar-collapsed .sidebar-user { padding: 12px 14px; }
    body.sidebar-collapsed .sidebar-user__profile { justify-content: flex-start; padding: 6px 8px; }

    .main-wrapper {
        width: 100%;
        min-height: 100vh;
    }

    .sidebar-toggle.btn {
        display: inline-flex;
    }

    .sidebar-collapse.btn {
        display: none;
    }

    .topbar {
        padding-inline: 16px;
    }

    .topbar-right, .topbar-left {
        gap: 8px;
    }

    .main-content {
        padding: 20px 16px 32px;
    }

    .page-header,
    .header-actions {
        align-items: stretch;
        flex-wrap: wrap;
    }

    .page-header {
        flex-direction: column;
    }

    .header-actions {
        width: 100%;
    }

    .table-responsive > .table {
        min-width: 720px;
    }

    .nav-tabs {
        flex-wrap: nowrap;
        overflow-x: auto;
        overflow-y: hidden;
    }
}

@media (max-width: 620px) {
    .topbar {
        min-height: 64px;
        height: auto;
        gap: 10px;
    }

    .topbar-right,
    .topbar-left {
        gap: 8px;
    }

    .main-content {
        padding: 16px 12px 28px;
    }

    .header-actions > .btn,
    .header-actions > a.btn {
        flex: 1 1 auto;
    }

    .card {
        padding: 16px;
    }
}

/* Full-page employee contract editor */
.hr-contract-form-page {
    display: flex;
    flex-direction: column;
    height: calc(100dvh - 220px);
    min-height: 480px;
    overflow: hidden;
    padding: 0;
}

.hr-contract-form-scroll {
    flex: 1 1 auto;
    height: auto;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 20px;
    scrollbar-gutter: stable;
    overscroll-behavior: contain;
}

.hr-contract-form-actions {
    position: relative;
    flex: 0 0 auto;
    z-index: 5;
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    padding: 14px 20px;
    border-top: 1px solid var(--border-color, #dee2e6);
    background: rgba(255, 255, 255, 0.98);
    box-shadow: 0 -8px 20px rgba(16, 33, 63, 0.06);
}

.hr-contract-details-card .card-header {
    padding-block: 10px;
}

.hr-contract-details-card .card-body {
    padding-block: 12px;
}

.hr-contract-details-card .form-label {
    margin-bottom: 4px;
}

.hr-contract-details-card textarea.form-control {
    min-height: 56px;
}

@media (max-width: 940px) {
    .hr-contract-form-page {
        height: calc(100dvh - 290px);
        min-height: 440px;
    }

    .hr-contract-form-scroll {
        padding: 16px;
    }
}

@media (max-width: 620px) {
    .hr-contract-form-page {
        height: calc(100dvh - 320px);
        min-height: 400px;
        padding: 0;
    }

    .hr-contract-form-scroll {
        padding: 12px;
    }

    .hr-contract-form-actions {
        flex-wrap: wrap;
        padding: 12px;
    }

    .hr-contract-form-actions .btn {
        flex: 1 1 140px;
    }
}

/* Print Styles for Modals and Statement */
@media print {
    body, html {
        overflow: visible !important;
        background-color: white !important;
        height: auto !important;
        min-height: auto !important;
    }
    
    @page {
        margin: 1cm;
        size: auto;
    }
    
    * {
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
    }
}

/* components.css */
/* frontend/assets/css/components.css */

/* Cards */
.card {
    background: var(--bg-surface);
    border-radius: var(--border-radius-lg);
    box-shadow: var(--shadow-sm);
    border: 1px solid var(--border-color);
    padding: 24px;
    margin-bottom: 24px;
    transition: var(--transition-base);
}

.card:hover {
    box-shadow: var(--shadow-md);
}

/* Stat Cards (Dashboard) */
.stat-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 24px;
    margin-bottom: 24px;
}

.stat-card {
    background: var(--bg-surface);
    border-radius: var(--border-radius-lg);
    padding: 24px;
    box-shadow: var(--shadow-sm);
    border: 1px solid var(--border-color);
    display: flex;
    flex-direction: column;
    position: relative;
    overflow: hidden;
}

.stat-card::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 4px;
    height: 100%;
    background: var(--primary); /* RTL: Right side border */
}

.stat-title {
    color: var(--text-muted);
    font-size: var(--font-base);
    font-weight: 500;
    margin-bottom: 8px;
}

.stat-value {
    color: var(--text-main);
    font-size: 1.875rem;
    font-weight: 700;
}

/* Buttons */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 20px;
    border-radius: var(--border-radius);
    font-size: var(--font-ui);
    font-weight: 500;
    cursor: pointer;
    transition: var(--transition-fast);
    border: none;
    font-family: inherit;
}

.btn-primary {
    background-color: var(--primary);
    color: white;
}

.btn-primary:hover {
    background-color: var(--primary-hover);
    box-shadow: 0 4px 12px rgba(37, 99, 235, 0.2);
}

.btn-secondary {
    background-color: var(--bg-app);
    color: var(--text-main);
    border: 1px solid var(--border-color);
}

.btn-secondary:hover {
    background-color: var(--border-color);
}

/* Forms */
.form-group {
    margin-bottom: 16px;
}

.form-label {
    display: block;
    margin-bottom: 8px;
    font-size: var(--font-base);
    color: var(--text-main);
    font-weight: 500;
}

.form-control {
    width: 100%;
    padding: 10px 16px;
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
    background-color: var(--bg-surface);
    color: var(--text-main);
    font-family: inherit;
    font-size: var(--font-ui);
    transition: var(--transition-fast);
}

.form-control:focus {
    outline: none;
    border-color: var(--primary);
    box-shadow: 0 0 0 3px var(--primary-light);
}

/* Data Tables */
.table-responsive {
    overflow-x: auto;
}

.table {
    width: 100%;
    border-collapse: collapse;
}

.table th, .table td {
    padding: 16px;
    text-align: right; /* RTL Standard */
    border-bottom: 1px solid var(--border-color);
}

.table th {
    background-color: var(--bg-app);
    color: var(--text-muted);
    font-weight: 600;
    font-size: var(--font-ui);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.table tbody tr:hover {
    background-color: var(--bg-app);
}

.panel-close {

    background: none;

    border: none;

    font-size: var(--font-2xl);

    color: #64748b;

    cursor: pointer;

    transition: color 0.2s;

}

.panel-close:hover {

    color: #0f172a;

}






.table-hover tbody tr:hover {
    background: #f0f9ff !important;
    cursor: pointer;
}

/* ============================================
   CUSTOM MODALS & DROPDOWNS (ADDED)
   ============================================ */

/* Custom Modal Popup */
.custom-modal-overlay {
    position: fixed;
    top: 0; left: 0; width: 100%; height: 100%;
    background: rgba(15, 23, 42, 0.6);
    backdrop-filter: blur(4px);
    z-index: 10000;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s;
}
.custom-modal-overlay.show {
    opacity: 1;
    visibility: visible;
}
.custom-modal-content {
    background: #ffffff;
    border-radius: 16px;
    width: 90%;
    max-width: 800px;
    max-height: 90vh;
    overflow-y: auto;
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
    transform: translateY(20px) scale(0.95);
    transition: transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    padding: 30px;
}
.custom-modal-overlay.show .custom-modal-content {
    transform: translateY(0) scale(1);
}

/* Custom Table Dropdown Context Menu */
.ctx-menu-wrapper {
    position: relative;
    display: inline-block;
}
.ctx-menu-btn {
    background: none;
    border: none;
    cursor: pointer;
    padding: 6px 10px;
    border-radius: 6px;
    color: #64748b;
    transition: all 0.2s;
}
.ctx-menu-btn:hover {
    background: #f1f5f9;
    color: #0f172a;
}
.ctx-dropdown {
    position: absolute;
    right: 0; /* Align right to drop down naturally */
    top: 0;
    min-width: 220px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1);
    z-index: 50;
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px);
    transition: all 0.2s ease;
    padding: 8px 0;
}
.ctx-dropdown.show {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}
.ctx-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 16px;
    color: #334155;
    text-decoration: none;
    font-size: var(--font-ui);
    cursor: pointer;
    background: transparent;
    border: none;
    width: 100%;
    text-align: right;
}
.ctx-item:hover {
    background: #f8fafc;
    color: #1d4ed8;
}
.ctx-item.text-danger:hover {
    color: #dc2626;
    background: #fef2f2;
}
.ctx-divider {
    height: 1px;
    background: #e2e8f0;
    margin: 6px 0;
}

/* Operational ERP Views */
.page-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 24px;
}

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

.metric-note {
    display: block;
    color: var(--text-muted);
    font-size: var(--font-ui);
    margin-top: 8px;
}

.ops-grid,
.pos-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(320px, 0.8fr);
    gap: 24px;
    align-items: start;
}

.section-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 18px;
}

.section-title h3 {
    color: var(--text-main);
    font-size: var(--font-lg);
    font-weight: 700;
    margin: 0;
}

.section-title a {
    color: var(--primary);
    font-size: var(--font-base);
    font-weight: 600;
    text-decoration: none;
}

.module-list,
.alert-stack,
.cost-list {
    display: grid;
    gap: 12px;
}

.module-row {
    display: grid;
    grid-template-columns: minmax(180px, 1fr) auto;
    gap: 4px 16px;
    align-items: center;
    padding: 14px 0;
    border-bottom: 1px solid var(--border-color);
}

.module-row:last-child {
    border-bottom: 0;
}

.module-row span {
    display: flex;
    align-items: center;
    gap: 10px;
    color: var(--text-main);
    font-weight: 600;
}

.module-row small {
    grid-column: 1 / -1;
    color: var(--text-muted);
}

.status-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 72px;
    padding: 4px 10px;
    border-radius: var(--border-radius-full);
    font-size: var(--font-xs);
    font-weight: 700;
    white-space: nowrap;
}

.status-pill.success {
    background: var(--success-light);
    color: #047857;
}

.status-pill.warning {
    background: var(--warning-light);
    color: #b45309;
}

.status-pill.danger {
    background: var(--danger-light);
    color: #b91c1c;
}

.status-pill.info {
    background: var(--primary-light);
    color: var(--primary);
}

.status-pill.muted {
    background: #f1f5f9;
    color: var(--text-muted);
}

.ops-alert {
    border: 1px solid var(--border-color);
    border-right: 4px solid var(--primary);
    border-radius: var(--border-radius);
    padding: 14px 16px;
    background: #fff;
}

.ops-alert strong {
    display: block;
    color: var(--text-main);
    margin-bottom: 4px;
}

.ops-alert span {
    color: var(--text-muted);
    font-size: var(--font-base);
}

.ops-alert.warning {
    border-right-color: var(--warning);
}

.ops-alert.danger {
    border-right-color: var(--danger);
}

.ops-alert.info {
    border-right-color: var(--primary);
}

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

.quick-tile {
    display: flex;
    min-height: 86px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 8px;
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
    background: var(--bg-app);
    color: var(--text-main);
    font-family: inherit;
    font-weight: 700;
    cursor: pointer;
    transition: var(--transition-fast);
}

.quick-tile:hover {
    border-color: var(--primary);
    color: var(--primary);
    background: var(--primary-light);
}

.quick-tile i {
    font-size: 1.35rem;
}

.pos-total {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-top: 16px;
    padding: 18px;
    border-radius: var(--border-radius);
    background: var(--bg-app);
}

.pos-total span {
    color: var(--text-muted);
    font-weight: 600;
}

.pos-total strong {
    color: var(--success);
    font-size: var(--font-2xl);
}

.cost-list div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 13px 0;
    border-bottom: 1px solid var(--border-color);
}

.cost-list div:last-child {
    border-bottom: 0;
}

.cost-list span {
    color: var(--text-muted);
    font-weight: 600;
}

.cost-list strong {
    color: var(--text-main);
    font-family:var(--font-family-mono);
}

@media (max-width: 992px) {
    .page-header,
    .section-title {
        align-items: stretch;
        flex-direction: column;
    }

    .ops-grid,
    .pos-layout {
        grid-template-columns: 1fr;
    }
}

/* Invoice Template Library */
.templates-toolbar {
    padding: 18px;
}

.templates-filters {
    display: grid;
    grid-template-columns: minmax(260px, 1fr) repeat(3, minmax(170px, 0.35fr));
    gap: 16px;
}

.templates-layout {
    display: grid;
    grid-template-columns: minmax(380px, 0.95fr) minmax(560px, 1.25fr);
    gap: 24px;
    align-items: start;
}

.templates-gallery {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 18px;
}

.template-card {
    background: #fff;
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-lg);
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: var(--transition-fast);
}

.template-card:hover,
.template-card.active {
    border-color: var(--primary);
    box-shadow: var(--shadow-md);
    transform: translateY(-2px);
}

.template-preview-mini {
    height: 230px;
    overflow: hidden;
    background: #e2e8f0;
    padding: 12px;
    display: flex;
    align-items: flex-start;
    justify-content: center;
}

.template-card-body {
    padding: 16px;
}

.template-card-title {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;
}

.template-card-title strong,
.template-card-title small {
    display: block;
}

.template-card-title small {
    color: var(--text-muted);
    margin-top: 5px;
    line-height: 1.5;
}

.template-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.template-actions .btn,
.preview-switcher .btn {
    padding: 8px 12px;
    font-size: var(--font-ui);
}

.preview-switcher {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.preview-switcher .active {
    background: var(--primary);
    color: #fff;
    border-color: var(--primary);
}

.template-workspace {
    position: sticky;
    top: 20px;
}

.template-modal-overlay {
    position: fixed;
    inset: 0;
    z-index: 10050;
    background: rgba(15, 23, 42, 0.64);
    backdrop-filter: blur(4px);
    display: flex;
    align-items: flex-start;
    justify-content: center;
    overflow: auto;
    padding: 28px;
}

.template-modal-content {
    width: min(980px, 100%);
    background: #fff;
    border-radius: var(--border-radius-lg);
    box-shadow: var(--shadow-lg);
    padding: 22px;
}

.template-preview-stage {
    background: #eef2f7;
    border-radius: var(--border-radius);
    padding: 18px;
    overflow: auto;
    max-height: 780px;
}

.template-preview-stage.print,
.template-preview-stage.pdf {
    background:
        linear-gradient(90deg, rgba(15, 23, 42, 0.04) 1px, transparent 1px),
        linear-gradient(rgba(15, 23, 42, 0.04) 1px, transparent 1px),
        #f8fafc;
    background-size: 24px 24px;
}

.template-preview-stage.pdf::before {
    content: 'PDF Preview';
    display: inline-flex;
    background: #dc2626;
    color: #fff;
    padding: 5px 12px;
    border-radius: var(--border-radius-full);
    font-size: 0.78rem;
    margin-bottom: 12px;
}

.invoice-paper {
    width: 794px;
    min-height: 1123px;
    margin: 0 auto;
    padding: 42px;
    background: #fff;
    color: #111827;
    border: 1px solid #e5e7eb;
    box-shadow: 0 16px 38px rgba(15, 23, 42, 0.14);
    font-family: var(--tpl-font), var(--font-family);
    font-size: var(--tpl-size);
    line-height: 1.55;
}

/* Thermal documents take their paper width and margins from the template (as printed); the template font size applies. */
.invoice-thermal {
    width: 80mm;
    min-height: 0;
    padding: var(--tpl-margin-top, 3mm) var(--tpl-margin-right, 3mm) var(--tpl-margin-bottom, 3mm) var(--tpl-margin-left, 3mm);
    margin: 0 auto;
    text-align: center;
}

.invoice-thermal .invoice-head {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    margin-bottom: 15px;
}

.invoice-thermal .invoice-logo {
    font-size: 1.2rem;
}

.invoice-thermal .invoice-title {
    text-align: center;
}

.invoice-thermal .invoice-meta {
    display: flex;
    flex-direction: column;
    gap: 15px;
    text-align: center;
    border-bottom: 1px dashed #ccc;
    padding-bottom: 15px;
    margin-bottom: 15px;
}

.invoice-thermal .invoice-items th,
.invoice-thermal .invoice-items td {
    padding: 5px;
    font-size: 10px;
}

.invoice-thermal .invoice-bottom {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.invoice-thermal .invoice-side-notes {
    order: 2;
    text-align: center;
    border-top: 1px dashed #ccc;
    padding-top: 15px;
}

.invoice-thermal .invoice-summary {
    order: 1;
    width: 100%;
    margin-top: 10px;
}

.invoice-thermal .invoice-summary div {
    display: flex;
    justify-content: space-between;
    margin-bottom: 4px;
}

.invoice-thermal .invoice-signature {
    display: none;
}

.invoice-thermal .invoice-footer {
    text-align: center;
    font-size: 9px;
    margin-top: 20px;
    border-top: 1px dashed #ccc;
    padding-top: 10px;
}

.invoice-thumb {
    width: 794px;
    min-height: 1123px;
    transform: scale(0.18);
    transform-origin: top center;
    box-shadow: none;
    pointer-events: none;
}

.invoice-head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr);
    gap: 18px;
    align-items: center;
    margin-bottom: 28px;
}

.invoice-logo {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 96px;
    min-height: 54px;
    border-radius: 8px;
    background: transparent;
    color: var(--tpl-primary);
    font-weight: 800;
    letter-spacing: 0;
    padding: 0;
}

.invoice-logo .document-company-logo {
    display: block;
    width: auto;
    height: auto;
    max-width: min(100%, var(--document-logo-max-width, 140px));
    max-height: var(--document-logo-max-height, 80px);
    object-fit: contain;
    background: transparent;
}

.logo-center .invoice-logo {
    justify-self: center;
}

.logo-left .invoice-logo {
    justify-self: end;
}

.invoice-title span,
.invoice-title strong,
.invoice-total-badge small,
.invoice-total-badge strong {
    display: block;
}

.invoice-title span {
    color: var(--tpl-primary);
    font-weight: 700;
}

.invoice-title strong {
    font-size: 1.45rem;
}

.invoice-total-badge {
    background: rgba(37, 99, 235, 0.08);
    border: 1px solid rgba(37, 99, 235, 0.18);
    border-radius: 8px;
    padding: 14px;
}

.invoice-total-badge small,
.invoice-meta h4,
.invoice-summary span {
    color: #64748b;
    font-weight: 700;
}

.invoice-total-badge strong {
    color: var(--tpl-primary);
    font-size: 1.35rem;
}

.invoice-meta {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    margin-bottom: 24px;
}

.invoice-meta > div {
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    padding: 14px;
}

.invoice-meta h4 {
    margin: 0 0 8px;
    font-size: 0.9rem;
}

.invoice-meta p {
    margin: 3px 0;
}

.invoice-items {
    width: 100%;
    table-layout: fixed;
    border-collapse: collapse;
    margin-bottom: 24px;
}

.invoice-items th,
.invoice-items td {
    padding: 11px;
    border-bottom: 1px solid #e5e7eb;
    text-align: inherit;
}

.invoice-items th {
    background: var(--tpl-primary);
    color: #fff;
    font-weight: 700;
}

.language-bilingual .invoice-items th {
    padding-inline: 4px;
    font-size: 0.74em;
    line-height: 1.35;
    white-space: normal;
    overflow-wrap: anywhere;
}

.language-bilingual .invoice-items td {
    padding-inline: 5px;
    overflow-wrap: anywhere;
}

.table-soft .invoice-items th {
    background: rgba(37, 99, 235, 0.08);
    color: var(--tpl-primary);
}

/* Treasury / bank account statement (document type treasury_statement) */
.statement-layout { padding: 14mm 12mm; }
.statement-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; padding-bottom: 14px; border-bottom: 2px solid var(--tpl-primary); margin-bottom: 14px; }
.statement-title { text-align: center; flex: 1; }
.statement-title h1 { margin: 0; font-size: 1.35rem; color: var(--tpl-heading-color, var(--tpl-primary)); }
.statement-title h2 { margin: 6px 0 0; font-size: 1rem; font-weight: 600; color: var(--tpl-text, #14213d); }
.statement-bank { display: flex; align-items: center; gap: 10px; min-width: 150px; }
.statement-bank img { max-width: 72px; max-height: 44px; object-fit: contain; }
.statement-bank i { font-size: 1.8rem; color: var(--tpl-primary); }
.statement-bank b { display: block; font-size: 0.9rem; }
.statement-bank span { font-size: 0.78rem; color: #64748b; }
.statement-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px 16px; margin-bottom: 12px; }
.statement-fact { display: flex; flex-direction: column; gap: 2px; padding: 8px 10px; border: 1px solid #e5e7eb; border-radius: 8px; }
.statement-fact span { font-size: 0.72rem; color: #64748b; }
.statement-fact strong { font-size: 0.86rem; overflow-wrap: anywhere; }
.statement-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-bottom: 14px; }
.statement-summary > div { border: 1px solid #e5e7eb; border-radius: 8px; padding: 9px 12px; }
.statement-summary span { display: block; font-size: 0.72rem; color: #64748b; margin-bottom: 4px; }
.statement-summary strong { font-size: 0.98rem; }
.statement-summary .deposit strong { color: #15803d; }
.statement-summary .withdrawal strong { color: #b91c1c; }
.statement-summary .closing { background: rgba(37, 99, 235, 0.08); border-color: var(--tpl-primary); }
.statement-table th, .statement-table td { padding: 7px 8px; font-size: 0.82em; vertical-align: top; }
.statement-table td.deposit { color: #15803d; }
.statement-table td.withdrawal { color: #b91c1c; }
.statement-table td.statement-description { overflow-wrap: anywhere; }
.statement-table tfoot td { font-weight: 700; background: rgba(15, 23, 42, 0.04); }
/* Printed customer / supplier statements: debit blue, credit red, running balance navy, negative red. */
.statement-table th.statement-debit, .statement-table td.statement-debit { color: #1d4ed8; }
.statement-table th.statement-credit, .statement-table td.statement-credit { color: #c2414c; }
.statement-table th.statement-balance, .statement-table td.statement-balance { color: #17305e; font-weight: 700; background: rgba(23, 48, 94, 0.04); }
.statement-table td.statement-balance.is-negative { color: #b91c1c; }
.statement-table tr.statement-totals td { font-weight: 800; border-top: 2px solid var(--tpl-primary); vertical-align: top; }
.statement-table tr.statement-totals td small { display: block; font-size: 0.72em; font-weight: 700; opacity: 0.85; }
.print-grayscale .statement-table td.statement-debit, .print-grayscale .statement-table td.statement-credit, .print-grayscale .statement-table td.statement-balance { color: inherit; }
.statement-generated { font-size: 0.74rem; color: #64748b; margin: 6px 0 12px; }
/* Printed Trial Balance (document scope: sizes are the template's own, not the UI scale). */
.trial-balance-facts { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.trial-balance-table th, .trial-balance-table td { padding: 5px 6px; font-size: 0.78em; white-space: nowrap; }
.trial-balance-table td.trial-balance-name { white-space: normal; padding-inline-start: calc(6px + var(--tb-indent, 0) * 12px); }
.trial-balance-table tr.is-parent td { font-weight: 700; background: rgba(15, 23, 42, 0.03); }
.trial-balance-table tr.level-1 td { background: rgba(37, 99, 235, 0.07); }
.trial-balance-table td.debit { color: #15803d; }
.trial-balance-table td.credit { color: #b91c1c; }
.trial-balance-table td.is-zero { color: #94a3b8; }
.trial-balance-table tfoot td { font-weight: 700; background: rgba(15, 23, 42, 0.06); border-top: 2px solid var(--tpl-primary); }
.trial-balance-status { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; margin: 10px 0; padding: 9px 12px; border: 1px solid; border-radius: 8px; font-size: 0.86rem; break-inside: avoid; }
.trial-balance-status.is-balanced { color: #166534; background: #f0fdf4; border-color: #86efac; }
.trial-balance-status.is-unbalanced { color: #991b1b; background: #fef2f2; border-color: #fca5a5; }
.trial-balance-status em { flex-basis: 100%; font-size: 0.74rem; font-style: normal; opacity: 0.85; }
/* Printed Income Statement (document scope, like the Trial Balance above). */
.income-statement-facts { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.income-statement-kpis { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; margin: 10px 0 12px; break-inside: avoid; }
.income-statement-kpis > div { display: grid; gap: 3px; padding: 8px 10px; border: 1px solid #dbe3ee; border-radius: 8px; background: rgba(37, 99, 235, 0.04); }
.income-statement-kpis span { font-size: 0.72em; color: #64748b; }
.income-statement-kpis strong { font-size: 1.02em; }
.income-statement-kpis small { font-size: 0.7em; color: #15803d; }
.income-statement-kpis > div.is-negative strong, .income-statement-kpis > div.is-negative small { color: #b91c1c; }
.income-statement-table th, .income-statement-table td { padding: 6px 8px; font-size: 0.86em; white-space: nowrap; }
.income-statement-table td.income-statement-name { white-space: normal; padding-inline-start: calc(8px + var(--is-indent, 0) * 14px); }
.income-statement-table td.income-statement-name code { margin-inline-end: 6px; color: #64748b; font-size: 0.85em; }
.income-statement-table tr.is-section td { font-weight: 800; background: rgba(15, 23, 42, 0.05); border-top: 1px solid #cbd5e1; }
.income-statement-table tr.is-subsection td { font-weight: 700; background: rgba(15, 23, 42, 0.025); }
.income-statement-table tr.is-group td { font-weight: 700; }
.income-statement-table tr.is-subtotal td { font-weight: 700; background: rgba(15, 23, 42, 0.035); border-top: 1px solid #dbe3ee; }
.income-statement-table tr.is-result td { font-weight: 800; background: rgba(37, 99, 235, 0.09); border-top: 2px solid var(--tpl-primary); border-bottom: 2px solid var(--tpl-primary); }
.income-statement-table tr.is-result.is-loss td { background: rgba(185, 28, 28, 0.08); border-color: #b91c1c; }
.income-statement-table td.is-negative { color: #b91c1c; }
/* Printed Statement of Financial Position (document scope, like the statements above). */
.balance-sheet-facts { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.balance-sheet-kpis { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.balance-sheet-table th, .balance-sheet-table td { padding: 6px 8px; font-size: 0.86em; white-space: nowrap; }
.balance-sheet-table td.balance-sheet-name { white-space: normal; padding-inline-start: calc(8px + var(--bs-indent, 0) * 14px); }
.balance-sheet-table td.balance-sheet-name code { margin-inline-end: 6px; color: #64748b; font-size: 0.85em; }
.balance-sheet-table tr.is-part td { font-weight: 800; font-size: 0.95em; background: rgba(15, 23, 42, 0.07); border-top: 2px solid var(--tpl-primary); }
.balance-sheet-table tr.is-section td { font-weight: 700; background: rgba(15, 23, 42, 0.035); }
.balance-sheet-table tr.is-group td { font-weight: 700; }
.balance-sheet-table tr.is-result td { font-style: italic; }
.balance-sheet-table tr.is-subtotal td { font-weight: 700; background: rgba(15, 23, 42, 0.035); border-top: 1px solid #dbe3ee; }
.balance-sheet-table tr.is-total td { font-weight: 800; background: rgba(37, 99, 235, 0.09); border-top: 2px solid var(--tpl-primary); border-bottom: 2px solid var(--tpl-primary); }
.balance-sheet-table tr.is-difference td { font-weight: 800; background: rgba(15, 23, 42, 0.05); }
.balance-sheet-table td.is-negative { color: #b91c1c; }
.print-grayscale .balance-sheet-table td.is-negative { color: inherit; }
/* Printed General Ledger (document scope, like the Trial Balance above): account groups with opening,
   movements, running balance, period totals and closing balance. */
.general-ledger-facts { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.general-ledger-summary { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.general-ledger-table th, .general-ledger-table td { padding: 5px 7px; font-size: 0.8em; vertical-align: middle; }
.general-ledger-table td:nth-child(5), .general-ledger-table td:nth-child(6), .general-ledger-table td:nth-child(7), .general-ledger-table th:nth-child(n+5) { white-space: nowrap; }
.general-ledger-table td.statement-description { overflow-wrap: anywhere; }
.general-ledger-table tr.general-ledger-account td { padding-top: 9px; font-size: 0.9em; font-weight: 800; color: var(--tpl-primary); background: rgba(37, 99, 235, 0.09); border-top: 2px solid var(--tpl-primary); }
.general-ledger-table tr.general-ledger-account code { margin-inline-end: 6px; font-size: 0.95em; }
.general-ledger-table tr.general-ledger-opening td { font-weight: 700; background: rgba(15, 23, 42, 0.035); }
.general-ledger-table tr.general-ledger-total td { font-weight: 700; background: rgba(15, 23, 42, 0.05); border-top: 1px solid #cbd5e1; }
.general-ledger-table tr.general-ledger-closing td { font-weight: 800; background: rgba(37, 99, 235, 0.06); }
.general-ledger-table td.debit { color: #1e3a8a; }
.general-ledger-table td.credit { color: #b91c1c; }
.general-ledger-table tfoot td { font-weight: 800; background: rgba(15, 23, 42, 0.06); border-top: 2px solid var(--tpl-primary); }
.print-grayscale .general-ledger-table td.debit, .print-grayscale .general-ledger-table td.credit { color: inherit; }
.trial-balance-approvals { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: 16px 0 10px; break-inside: avoid; }
.trial-balance-approvals > div { display: flex; flex-direction: column; gap: 8px; padding: 10px 12px; border: 1px solid #e5e7eb; border-radius: 8px; font-size: 0.8rem; }
.trial-balance-approvals b { font-size: 0.9rem; color: var(--tpl-primary); }
.print-grayscale .statement-summary .deposit strong, .print-grayscale .statement-summary .withdrawal strong, .print-grayscale .statement-table td.deposit, .print-grayscale .statement-table td.withdrawal { color: inherit; }

.table-compact .invoice-items th,
.table-compact .invoice-items td {
    padding: 7px 8px;
    font-size: 0.86em;
}

.invoice-bottom {
    display: grid;
    grid-template-columns: 1.2fr 0.8fr;
    gap: 22px;
    align-items: start;
}

.invoice-side-notes p {
    margin: 0 0 10px;
    color: #475569;
}

.invoice-qr {
    width: fit-content;
    height: auto;
    border: 2px dashed var(--tpl-primary);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--tpl-primary);
    font-weight: 800;
    margin-bottom: 14px;
}

.invoice-summary {
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    overflow: hidden;
}

.invoice-summary div {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    padding: 10px 14px;
    border-bottom: 1px solid #e5e7eb;
}

.invoice-summary div:last-child {
    border-bottom: 0;
}

.invoice-summary .grand {
    background: var(--tpl-primary);
    color: #fff;
}

.invoice-summary .grand span,
.invoice-summary .grand strong {
    color: #fff;
}

.invoice-signature {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    margin-top: 38px;
}

.invoice-signature span {
    flex: 1;
    border-top: 1px solid #cbd5e1;
    padding-top: 10px;
    color: #64748b;
}

.invoice-footer {
    margin-top: 24px;
    padding-top: 12px;
    border-top: 1px solid #e5e7eb;
    color: #64748b;
    text-align: center;
}

.invoice-classic .invoice-head {
    border-bottom: 3px double var(--tpl-primary);
    padding-bottom: 18px;
}

.invoice-modern .invoice-head {
    grid-template-columns: minmax(0, .8fr) minmax(0, 1fr);
    padding: 22px;
    margin: -12px -12px 28px;
    background: linear-gradient(135deg, var(--tpl-primary), var(--tpl-secondary));
    color: #fff;
    border-radius: 10px;
}

.invoice-modern .invoice-title span,
.invoice-modern .invoice-total-badge small,
.invoice-modern .invoice-total-badge strong {
    color: #fff;
}

.invoice-modern .invoice-total-badge {
    background: rgba(255,255,255,0.16);
    border-color: rgba(255,255,255,0.3);
}

.invoice-minimal {
    border: 0;
    box-shadow: 0 12px 32px rgba(15, 23, 42, 0.08);
}

.invoice-minimal .invoice-items th {
    background: #111827;
}

.invoice-minimal .invoice-meta > div,
.invoice-minimal .invoice-summary {
    border-color: transparent;
    background: #f8fafc;
}

.invoice-corporate .invoice-head {
    background: #0f172a;
    color: #fff;
    padding: 24px;
    margin: -42px -42px 28px;
}

.invoice-corporate .invoice-total-badge {
    background: rgba(255,255,255,0.1);
    border-color: rgba(255,255,255,0.24);
}

.invoice-corporate .invoice-title span,
.invoice-corporate .invoice-total-badge small,
.invoice-corporate .invoice-total-badge strong {
    color: #fff;
}

.invoice-creative {
    background: linear-gradient(180deg, rgba(124,58,237,0.07), #fff 22%);
}

.invoice-creative .invoice-meta > div,
.invoice-creative .invoice-summary,
.invoice-creative .invoice-total-badge {
    border-radius: 14px;
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.06);
}

.invoice-creative .invoice-items th {
    background: linear-gradient(90deg, var(--tpl-primary), var(--tpl-secondary));
}

.invoice-compact {
    padding: 28px;
    font-size: 11px;
}

.invoice-compact .invoice-head,
.invoice-compact .invoice-meta,
.invoice-compact .invoice-bottom {
    gap: 10px;
    margin-bottom: 14px;
}

.invoice-compact .invoice-meta > div {
    padding: 10px;
}

.invoice-saudi-tax .invoice-head {
    border: 2px solid var(--tpl-primary);
    border-radius: 10px;
    padding: 18px;
}

.invoice-saudi-tax .invoice-qr {
    border-style: solid;
    background:
        linear-gradient(90deg, transparent 47%, var(--tpl-primary) 48%, var(--tpl-primary) 52%, transparent 53%),
        linear-gradient(transparent 47%, var(--tpl-primary) 48%, var(--tpl-primary) 52%, transparent 53%),
        #fff;
}

.editor-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
    gap: 14px;
}

.editor-grid label,
.template-toggles label {
    color: var(--text-main);
    font-weight: 600;
}

.color-control {
    height: 43px;
    padding: 4px;
}

.template-toggles {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 10px;
    margin-top: 18px;
}

.template-toggles label {
    background: var(--bg-app);
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
    padding: 10px;
}


@media (max-width: 1200px) {
    .templates-layout,
    .templates-filters {
        grid-template-columns: 1fr;
    }

    .template-workspace {
        position: static;
    }
}

/* Product / Item Creation */
.item-add-anchor {
    position: relative;
}

.item-type-popover {
    position: absolute;
    top: calc(100% + 10px);
    left: 0;
    width: min(360px, calc(100vw - 32px));
    background: #fff;
    border: 1px solid var(--border-color);
    border-radius: 12px;
    box-shadow: 0 16px 38px rgba(15, 23, 42, 0.16);
    padding: 8px;
    z-index: 130;
}

.item-type-option {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px;
    border: 0;
    border-radius: 10px;
    background: transparent;
    color: var(--text-main);
    text-align: right;
    cursor: pointer;
    font-family: inherit;
}

.item-type-option:hover,
.item-type-option:focus {
    outline: none;
    background: var(--primary-light);
}

.item-type-icon {
    width: 42px;
    height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: #eef2ff;
    color: var(--primary);
    flex: 0 0 auto;
}

.item-type-option strong,
.item-type-option small {
    display: block;
}

.item-type-option small {
    color: var(--text-muted);
    margin-top: 3px;
    line-height: 1.45;
}

.item-drawer-overlay {
    position: fixed;
    inset: 0;
    background:
        radial-gradient(circle at top right, rgba(93, 135, 117, 0.16), transparent 28%),
        radial-gradient(circle at top left, rgba(219, 184, 132, 0.18), transparent 24%),
        rgba(15, 23, 42, 0.46);
    z-index: 10040;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 18px;
    backdrop-filter: blur(8px);
}

.item-drawer-overlay.show .item-drawer {
    transform: translateY(0) scale(1);
    opacity: 1;
}

.item-drawer {
    width: min(1360px, calc(100vw - 36px));
    height: min(940px, calc(100vh - 36px));
    background:
        linear-gradient(180deg, rgba(247, 250, 247, 0.96), rgba(255, 255, 255, 0.98)),
        #fff;
    overflow-y: auto;
    padding: 24px;
    box-shadow: 0 28px 80px rgba(15, 23, 42, 0.22);
    border-radius: 28px;
    transform: translateY(24px) scale(0.985);
    opacity: 0;
    transition: transform 0.24s ease, opacity 0.24s ease;
}

.item-drawer-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    padding-bottom: 18px;
    border-bottom: 1px solid var(--border-color);
    margin-bottom: 20px;
}

.item-drawer-header h3 {
    margin: 0 0 6px;
    color: var(--text-main);
    font-size: var(--font-xl);
}

.item-drawer-header p {
    margin: 0;
    color: var(--text-muted);
}

.item-workspace-open {
    overflow: hidden;
}

.item-workspace-shell {
    display: grid;
    gap: 24px;
    min-height: 100%;
}

.item-workspace-hero {
    border: 1px solid rgba(148, 163, 184, 0.16);
    border-radius: 24px;
    padding: 24px;
    margin-bottom: 0;
    background:
        linear-gradient(135deg, rgba(233, 243, 236, 0.96), rgba(250, 247, 239, 0.98));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.6);
}

.item-workspace-hero-product {
    background:
        linear-gradient(135deg, rgba(233, 243, 236, 0.96), rgba(250, 247, 239, 0.98));
}

.item-workspace-hero-service {
    background:
        linear-gradient(135deg, rgba(233, 242, 248, 0.96), rgba(245, 249, 252, 0.98));
}

.item-workspace-hero-bundle {
    background:
        linear-gradient(135deg, rgba(250, 243, 231, 0.98), rgba(252, 248, 242, 0.98));
}

.item-workspace-hero-copy {
    display: grid;
    gap: 8px;
}

.item-workspace-kicker {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: fit-content;
    padding: 7px 12px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.8);
    color: #496657;
    font-size: var(--font-sm);
    font-weight: 700;
    letter-spacing: 0.01em;
}

.item-workspace-hero h3 {
    font-size: var(--font-2xl);
    margin-bottom: 0;
}

.item-workspace-hero p {
    max-width: 740px;
    line-height: 1.7;
}

.item-workspace-hero-actions {
    display: grid;
    gap: 12px;
    justify-items: end;
}

.item-type-switcher {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 10px;
}

.item-type-chip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border: 1px solid rgba(148, 163, 184, 0.24);
    background: rgba(255, 255, 255, 0.84);
    color: var(--text-main);
    border-radius: 999px;
    padding: 10px 14px;
    font-family: inherit;
    font-weight: 700;
    cursor: pointer;
    transition: var(--transition-fast);
}

.item-type-chip:hover,
.item-type-chip:focus {
    outline: none;
    transform: translateY(-1px);
    border-color: rgba(93, 135, 117, 0.4);
    box-shadow: 0 10px 18px rgba(93, 135, 117, 0.12);
}

.item-type-chip.active {
    background: linear-gradient(135deg, #5d8775, #6f9b86);
    color: #fff;
    border-color: transparent;
    box-shadow: 0 12px 22px rgba(93, 135, 117, 0.26);
}

.item-workspace-close {
    background: rgba(255, 255, 255, 0.82);
    border-radius: 50%;
    width: 44px;
    height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.item-form {
    display: grid;
    gap: 18px;
}

.item-form-page {
    gap: 22px;
}

.item-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    padding: 6px;
    border-radius: 20px;
    background: rgba(242, 246, 243, 0.92);
    border: 1px solid rgba(148, 163, 184, 0.16);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.65);
}

.item-tab {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 11px 14px;
    border: 0;
    border-radius: 14px;
    background: transparent;
    color: var(--text-muted);
    font-family: inherit;
    font-weight: 700;
    cursor: pointer;
    transition: var(--transition-fast);
}

.item-tab:hover,
.item-tab:focus {
    outline: none;
    color: var(--text-main);
    background: rgba(255, 255, 255, 0.82);
}

.item-tab.active {
    background: linear-gradient(135deg, #ffffff, #f5f8f6);
    color: #234033;
    box-shadow: 0 10px 20px rgba(148, 163, 184, 0.12);
}

.item-form-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.7fr) minmax(300px, 0.8fr);
    gap: 22px;
    align-items: start;
}

.item-form-main,
.item-form-sidebar {
    display: grid;
    gap: 18px;
}

.item-tab-panel {
    display: none;
}

.item-tab-panel.active {
    display: block;
}

.item-form-section {
    border: 1px solid rgba(148, 163, 184, 0.18);
    border-radius: 22px;
    padding: 22px;
    background: rgba(255, 255, 255, 0.92);
    box-shadow: 0 12px 32px rgba(148, 163, 184, 0.08);
}

.item-form-section h4 {
    margin: 0 0 14px;
    color: #244134;
    font-size: var(--font-md);
    font-weight: 700;
}

.item-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.item-field {
    display: grid;
    gap: 7px;
    color: var(--text-main);
    font-weight: 700;
}

.item-field > span {
    font-size: var(--font-ui);
}

.item-field-wide {
    grid-column: 1 / -1;
}

.field-error {
    min-height: 16px;
    color: var(--danger);
    font-size: var(--font-sm);
    font-weight: 600;
}

.inventory-toggle-row {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    align-items: center;
    margin-bottom: 14px;
    padding-bottom: 14px;
    border-bottom: 1px dashed rgba(148, 163, 184, 0.26);
}

.inventory-toggle-row p {
    margin: 4px 0 0;
    color: var(--text-muted);
}

.switch-control {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    font-weight: 700;
    color: var(--text-main);
    cursor: pointer;
}

.switch-control input {
    display: none;
}

.switch-control span {
    width: 44px;
    height: 24px;
    border-radius: 999px;
    background: #cbd5e1;
    position: relative;
    transition: var(--transition-fast);
}

.switch-control span::after {
    content: '';
    position: absolute;
    width: 18px;
    height: 18px;
    top: 3px;
    right: 3px;
    border-radius: 50%;
    background: #fff;
    transition: var(--transition-fast);
}

.switch-control input:checked + span {
    background: var(--primary);
}

.switch-control input:checked + span::after {
    transform: translateX(-20px);
}

.bundle-picker {
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius);
    padding: 12px;
    background: var(--bg-app);
    margin-bottom: 14px;
}

.bundle-search-results {
    display: grid;
    gap: 6px;
    margin-top: 10px;
    max-height: 240px;
    overflow: auto;
}

.bundle-result {
    text-align: right;
    border: 1px solid var(--border-color);
    background: #fff;
    border-radius: var(--border-radius);
    padding: 10px 12px;
    cursor: pointer;
    font-family: inherit;
}

.bundle-result:hover {
    border-color: var(--primary);
    background: var(--primary-light);
}

.bundle-result strong,
.bundle-result small {
    display: block;
}

.bundle-result small,
.bundle-empty {
    color: var(--text-muted);
}

.bundle-summary {
    display: grid;
    grid-template-columns: repeat(5, minmax(120px, 1fr));
    gap: 10px;
    margin-top: 14px;
}

.bundle-summary div {
    border: 1px solid rgba(148, 163, 184, 0.18);
    border-radius: 16px;
    background: linear-gradient(180deg, #fbfdfb, #f5f8f6);
    padding: 12px;
}

.bundle-summary span,
.bundle-summary strong {
    display: block;
}

.bundle-summary span {
    color: var(--text-muted);
    font-size: var(--font-ui);
    margin-bottom: 4px;
}

.item-insight-card,
.item-sidebar-card {
    border-radius: 22px;
    padding: 18px;
    border: 1px solid rgba(148, 163, 184, 0.18);
    background: rgba(255, 255, 255, 0.92);
    box-shadow: 0 12px 30px rgba(148, 163, 184, 0.08);
}

.item-preview-card {
    border-radius: 24px;
    padding: 18px;
    border: 1px solid rgba(148, 163, 184, 0.18);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(246, 249, 247, 0.94));
    box-shadow: 0 16px 34px rgba(148, 163, 184, 0.1);
    display: grid;
    gap: 14px;
}

.item-preview-frame {
    min-height: 220px;
    border-radius: 20px;
    overflow: hidden;
    background:
        linear-gradient(135deg, rgba(237, 243, 239, 0.96), rgba(248, 243, 235, 0.98));
    border: 1px dashed rgba(122, 155, 139, 0.28);
    display: flex;
    align-items: center;
    justify-content: center;
}

.item-image-preview {
    display: block;
    width: 100%;
    height: 220px;
    object-fit: cover;
}

.item-image-placeholder,
.item-preview-service-copy {
    display: grid;
    gap: 8px;
    text-align: center;
}

.item-image-placeholder {
    padding: 20px;
    color: var(--text-muted);
}

.item-image-placeholder i,
.item-preview-service-icon {
    font-size: 2rem;
    color: #5d8775;
}

.item-preview-caption {
    display: grid;
    gap: 5px;
}

.item-preview-caption strong,
.item-preview-service-copy strong {
    color: var(--text-main);
}

.item-preview-caption span,
.item-preview-service-copy span {
    color: var(--text-muted);
    line-height: 1.65;
}

.item-preview-card-service {
    min-height: 220px;
    align-content: center;
    justify-items: center;
    background:
        linear-gradient(135deg, rgba(236, 244, 249, 0.98), rgba(250, 252, 255, 0.98));
}

.item-preview-service-icon {
    width: 76px;
    height: 76px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 22px;
    background: rgba(88, 135, 174, 0.14);
    color: #315c79;
}

.item-insight-card {
    display: grid;
    gap: 10px;
}

.item-insight-card strong {
    color: var(--text-main);
    font-size: var(--font-lg);
}

.item-insight-card p {
    margin: 0;
    color: var(--text-muted);
    line-height: 1.7;
}

.item-insight-icon {
    width: 52px;
    height: 52px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 16px;
    font-size: 1.2rem;
}

.item-insight-card-sage .item-insight-icon {
    background: rgba(93, 135, 117, 0.12);
    color: #476a59;
}

.item-insight-card-sky .item-insight-icon {
    background: rgba(88, 135, 174, 0.14);
    color: #315c79;
}

.item-insight-card-sand .item-insight-icon {
    background: rgba(201, 156, 92, 0.16);
    color: #8b6130;
}

.item-sidebar-card h4 {
    margin: 0 0 12px;
    color: #244134;
    font-size: var(--font-md);
}

.item-sidebar-list {
    margin: 0;
    padding: 0;
    list-style: none;
    display: grid;
    gap: 10px;
}

.item-sidebar-list li {
    position: relative;
    padding-right: 16px;
    color: var(--text-muted);
    line-height: 1.75;
}

.item-sidebar-list li::before {
    content: '';
    position: absolute;
    right: 0;
    top: 11px;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #7a9b8b;
}

.item-sidebar-meta {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    padding: 12px 0;
    border-top: 1px dashed rgba(148, 163, 184, 0.25);
}

.item-sidebar-meta:first-of-type {
    border-top: 0;
    padding-top: 0;
}

.item-sidebar-meta span {
    color: var(--text-muted);
    font-size: var(--font-sm);
}

.item-sidebar-meta strong {
    color: var(--text-main);
    text-align: left;
}

.item-form-actions {
    position: sticky;
    bottom: 0;
    display: flex;
    gap: 10px;
    justify-content: flex-end;
    flex-wrap: wrap;
    background: linear-gradient(180deg, rgba(255,255,255,0.72), rgba(255,255,255,0.96));
    padding: 16px 4px 4px;
    border-top: 1px solid rgba(148, 163, 184, 0.18);
    backdrop-filter: blur(10px);
}

.toast-container {
    position: fixed;
    left: 22px;
    bottom: 22px;
    z-index: 12000;
    display: grid;
    gap: 10px;
}

.app-toast {
    min-width: 260px;
    padding: 12px 16px;
    border-radius: var(--border-radius);
    box-shadow: var(--shadow-lg);
    background: #fff;
    border-right: 4px solid var(--primary);
    color: var(--text-main);
    transform: translateY(12px);
    opacity: 0;
    transition: var(--transition-fast);
    font-weight: 700;
}

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

.app-toast.success {
    border-right-color: var(--success);
}

.app-toast.error {
    border-right-color: var(--danger);
}

.app-toast.info {
    border-right-color: var(--primary);
}

@media (max-width: 768px) {
    .item-type-popover {
        right: 0;
        left: auto;
        width: calc(100vw - 32px);
    }

    .item-drawer-overlay {
        padding: 0;
    }

    .item-drawer {
        width: 100vw;
        height: 100vh;
        border-radius: 0;
        padding: 16px;
    }

    .item-form-grid,
    .bundle-summary {
        grid-template-columns: 1fr;
    }

    .item-form-layout {
        grid-template-columns: 1fr;
    }

    .item-tabs {
        gap: 8px;
    }

    .item-tab {
        flex: 1 1 calc(50% - 8px);
        justify-content: center;
    }

    .item-workspace-hero,
    .item-form-section,
    .item-preview-card,
    .item-insight-card,
    .item-sidebar-card {
        border-radius: 18px;
        padding: 16px;
    }

    .item-workspace-hero-actions {
        width: 100%;
        justify-items: stretch;
    }

    .item-type-switcher {
        justify-content: stretch;
    }

    .item-type-chip {
        flex: 1 1 calc(50% - 8px);
        justify-content: center;
    }

.inventory-toggle-row {
        align-items: flex-start;
        flex-direction: column;
    }
}

/* Unified sales and purchase invoice form */
.invoice-entry-form {
    display: grid;
    gap: 16px;
}

.invoice-entry-card {
    margin: 0;
}

.invoice-entry-top-grid,
.invoice-bottom-grid {
    display: grid;
    grid-template-columns: minmax(260px, 0.9fr) minmax(0, 1.7fr);
    gap: 24px;
}

.invoice-party-section,
.invoice-details-section,
.invoice-notes-section,
.invoice-calculation-section {
    min-width: 0;
}

.invoice-party-section h3,
.invoice-notes-section h3,
.invoice-calculation-section h3 {
    font-size: var(--font-md);
    margin: 0 0 16px;
    color: var(--text-main);
}

.invoice-party-section {
    padding-inline-start: 20px;
    border-inline-start: 1px solid var(--border-color);
}

.invoice-details-grid,
.invoice-payment-fields {
    display: grid;
    grid-template-columns: repeat(3, minmax(150px, 1fr));
    gap: 14px;
}

.invoice-entry-table-wrap {
    border: 1px solid var(--border-color);
    border-radius: 8px;
}

.invoice-entry-table {
    min-width: 850px;
    margin-bottom: 0;
}

.invoice-entry-table th {
    background: var(--bg-app);
    white-space: nowrap;
}

.invoice-entry-table .form-control {
    min-width: 100px;
}

.invoice-add-row {
    margin-top: 14px;
}

.invoice-discount-controls {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin-bottom: 16px;
}

.invoice-summary-list {
    border: 1px solid var(--border-color);
    border-radius: 8px;
    background: var(--bg-app);
    overflow: hidden;
}

.invoice-summary-list > div {
    display: flex;
    justify-content: space-between;
    padding: 10px 14px;
    border-bottom: 1px solid var(--border-color);
}

.invoice-summary-list > div:last-child {
    border-bottom: 0;
}

.invoice-summary-list .invoice-grand-total {
    background: color-mix(in srgb, var(--primary) 8%, white);
    color: var(--primary);
    font-size: var(--font-md);
}

.invoice-payment-section {
    display: grid;
    gap: 18px;
    padding-top: 10px;
}

.invoice-paid-toggle {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    width: fit-content;
    cursor: pointer;
    font-weight: 600;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--border-color);
    width: 100%;
}

.invoice-paid-toggle input {
    width: 17px;
    height: 17px;
    accent-color: var(--primary);
}

.invoice-payment-fields {
    grid-template-columns: repeat(3, minmax(180px, 1fr));
    align-items: end;
}

.invoice-payment-fields .form-group {
    margin-bottom: 0;
}

.invoice-payment-fields .form-control:disabled {
    color: var(--text-main);
    background: var(--bg-app);
    cursor: not-allowed;
}

.invoice-document-section {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px 16px;
}

.invoice-document-section > div:first-child {
    flex: 1 1 260px;
}

.invoice-document-section h3 {
    margin: 0 0 4px;
    font-size: var(--font-md);
    color: var(--text-main);
}

.invoice-document-button {
    white-space: nowrap;
}

#invoice-document-name {
    flex: 1 1 200px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.invoice-documents-list {
    flex: 1 0 100%;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding-top: 8px;
    border-top: 1px solid var(--border-color);
}

.invoice-document-link {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: #b91c1c;
    font-size: var(--font-base);
}

@media (max-width: 900px) {
    .invoice-entry-top-grid,
    .invoice-bottom-grid {
        grid-template-columns: 1fr;
    }

    .invoice-party-section {
        padding-inline-start: 0;
        border-inline-start: 0;
        padding-bottom: 16px;
        border-bottom: 1px solid var(--border-color);
    }

    .invoice-details-grid,
    .invoice-payment-fields {
        grid-template-columns: repeat(2, minmax(150px, 1fr));
    }
}

@media (max-width: 600px) {
    .invoice-form-header,
    .invoice-form-header .header-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .invoice-form-header .header-actions .btn {
        width: 100%;
    }

    .invoice-details-grid,
    .invoice-payment-fields,
    .invoice-discount-controls {
        grid-template-columns: 1fr;
    }
}

/* Payment Methods */
.payment-methods-page-header {
    align-items: center;
    gap: 18px;
    margin-bottom: 16px;
}

.payment-methods-page-title {
    display: flex;
    align-items: center;
    gap: 13px;
}

.payment-methods-page-title h2 {
    font-size: var(--font-2xl);
    font-weight: 700;
}

.payment-methods-page-title p {
    font-size: var(--font-base);
}

.payment-methods-page-title-icon {
    display: inline-grid;
    width: 46px;
    height: 46px;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 14px;
    background: linear-gradient(135deg, var(--primary), #4f8fff);
    box-shadow: 0 8px 18px color-mix(in srgb, var(--primary) 22%, transparent);
    color: #fff;
}

.payment-methods-summary {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}

.payment-method-stat {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
    padding: 14px 16px;
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-lg);
    background: var(--bg-surface);
    box-shadow: var(--shadow-sm);
}

.payment-method-stat > span {
    display: inline-grid;
    width: 38px;
    height: 38px;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 11px;
    background: var(--primary-light);
    color: var(--primary);
}

.payment-method-stat small,
.payment-method-stat strong {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.payment-method-stat small { color: var(--text-muted); font-size: var(--font-xs); }
.payment-method-stat strong { margin-top: 2px; color: var(--text-main); font-size: var(--font-2xl); }
.payment-method-stat.is-active > span { background: #e8f8f1; color: #119c68; }
.payment-method-stat.is-linked > span { background: #edf5ff; color: #1467b8; }
.payment-method-stat.is-default > span { background: #fff8df; color: #c58900; }
.payment-method-stat.is-default strong { font-size: var(--font-2xl); }

.payment-options-card {
    padding: 18px 20px 20px;
    border: 1px solid var(--border-color);
    box-shadow: var(--shadow-sm);
}

.payment-options-heading,
.payment-method-drawer-title,
.payment-method-card-top,
.payment-method-card-bottom {
    display: flex;
    align-items: center;
}

.payment-options-heading {
    justify-content: space-between;
    gap: 14px;
    padding-bottom: 15px;
    border-bottom: 1px solid var(--border-color);
}

.payment-options-icon,
.payment-method-icon {
    width: 42px;
    height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    border-radius: 12px;
    background: var(--primary-light);
    color: var(--primary);
}

/* Brand mark of a payment method: fixed 3:2 box, image contained, never stretched */
.payment-method-mark {
    width: 60px;
    height: 40px;
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: #fff;
    border: 1px solid var(--border-color);
    overflow: hidden;
}

.payment-method-mark img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}

.payment-method-mark.is-small {
    width: 48px;
    height: 32px;
}

.payment-method-system {
    padding: 2px 7px;
    border-radius: 999px;
    background: var(--primary-light);
    color: var(--primary);
    font-size: var(--font-xs);
    font-weight: 600;
    vertical-align: middle;
}

.payment-method-card-meta .is-unlinked {
    color: #b45309;
    font-weight: 600;
}

.payment-method-link-action {
    margin-inline-start: 8px;
    padding: 4px 10px;
    border: 1px solid #fde68a;
    border-radius: 999px;
    background: #fffbeb;
    color: #b45309;
    font-size: var(--font-xs);
    font-weight: 700;
    cursor: pointer;
    white-space: nowrap;
}

.payment-method-link-action:hover {
    background: #fef3c7;
}

.payment-method-pos-flag {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-inline-start: 6px;
    color: var(--text-muted);
    font-size: var(--font-xs);
    font-weight: 600;
}

.payment-method-pos-flag.is-off {
    color: #b45309;
}

.payment-method-image-control {
    display: grid;
    gap: 6px;
}

.payment-method-card-ready {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 10px;
}

.payment-method-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 9px;
    border-radius: 999px;
    font-size: var(--font-xs);
    font-weight: 700;
    white-space: nowrap;
}

.payment-method-badge.is-ok { background: #e8f8f0; color: #098c58; }
.payment-method-badge.is-warn { background: #fff4e4; color: #bd6d08; }
.payment-method-badge.is-block { background: #ffebee; color: #c62f42; }

.payment-method-link-focus {
    padding: 12px;
    border-radius: 12px;
    background: #fffbeb;
    border: 1px solid #fde68a;
}

.payment-options-heading h3 {
    font-size: var(--font-md);
    margin: 0 0 3px;
    color: var(--text-main);
}

.payment-options-heading p,
.payment-method-drawer-title p {
    margin: 0;
    color: var(--text-muted);
    font-size: var(--font-ui);
}

.payment-methods-toolbar {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 15px 0;
}

.payment-methods-search {
    display: flex;
    align-items: center;
    min-width: 230px;
    flex: 1 1 310px;
    height: 40px;
    gap: 9px;
    padding-inline: 12px;
    border: 1px solid var(--border-color);
    border-radius: 10px;
    background: var(--bg-surface);
    color: var(--text-muted);
}

.payment-methods-search:focus-within {
    border-color: var(--primary);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 12%, transparent);
}

.payment-methods-search input {
    width: 100%;
    min-width: 0;
    border: 0;
    outline: 0;
    color: var(--text-main);
    background: transparent;
    font: inherit;
    font-size: var(--font-ui);
}

.payment-methods-filter {
    width: auto;
    min-width: 142px;
    height: 40px;
    padding-block: 0;
    font-size: var(--font-ui);
}

.payment-methods-view-toggle {
    display: inline-flex;
    overflow: hidden;
    flex: 0 0 auto;
    border: 1px solid var(--border-color);
    border-radius: 10px;
}

.payment-methods-view-toggle button,
.payment-method-table-actions button {
    display: inline-grid;
    width: 38px;
    height: 38px;
    place-items: center;
    border: 0;
    background: transparent;
    color: var(--text-muted);
    cursor: pointer;
}

.payment-methods-view-toggle button.is-selected { background: var(--primary-light); color: var(--primary); }

.payment-methods-section {
    margin-top: 16px;
}

.payment-methods-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 12px;
}

.payment-method-card {
    min-height: 172px;
    padding: 16px;
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-lg);
    background: var(--bg-surface);
    box-shadow: var(--shadow-sm);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 14px;
    transition: var(--transition-fast);
}

.payment-method-card:hover {
    border-color: color-mix(in srgb, var(--primary) 32%, var(--border-color));
    box-shadow: var(--shadow-md);
}

.payment-method-card.is-inactive {
    opacity: 0.62;
}

.payment-method-card-top {
    gap: 12px;
}

.payment-method-card-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    min-width: 0;
}

.payment-method-card-meta > div {
    display: flex;
    align-items: center;
    min-width: 0;
    gap: 7px;
    color: var(--text-muted);
    font-size: var(--font-xs);
}

.payment-method-card-meta > div span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.payment-method-status {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    flex: 0 0 auto;
    padding: 4px 7px;
    border-radius: 999px;
    font-size: var(--font-xs);
    font-weight: 700;
}

.payment-method-status.is-active { background: #e8f8f1; color: #11845b; }
.payment-method-status.is-inactive { background: #f1f5f9; color: #64748b; }

.payment-method-title {
    min-width: 0;
    flex: 1;
}

.payment-method-title h4 {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    margin: 0 0 4px;
    color: var(--text-main);
    font-size: var(--font-md);
    line-height: 1.3;
}

.payment-method-title span {
    display: block;
    color: var(--text-muted);
    font-size: var(--font-sm);
    line-height: 1.4;
}

.payment-method-star,
.payment-method-manage,
.payment-method-switch {
    border: 0;
    background: transparent;
    cursor: pointer;
}

.payment-method-star {
    padding: 5px;
    color: #cbd5e1;
    font-size: var(--font-md);
}

.payment-method-star.is-default {
    color: #eab308;
}

.payment-method-card-bottom {
    padding-top: 11px;
    border-top: 1px solid var(--border-color);
    justify-content: space-between;
}

.payment-method-switch {
    width: 42px;
    height: 24px;
    padding: 3px;
    border-radius: 999px;
    background: #cbd5e1;
    transition: var(--transition-fast);
}

.payment-method-switch span {
    display: block;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.24);
    transform: translateX(-18px);
    transition: var(--transition-fast);
}

.payment-method-switch.is-active {
    background: var(--success);
}

.payment-method-switch.is-active span {
    transform: translateX(0);
}

.payment-method-manage {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: var(--primary);
    font: inherit;
    font-size: var(--font-base);
    font-weight: 700;
    padding: 4px 0;
}

.payment-methods-empty,
.payment-methods-loading {
    grid-column: 1 / -1;
    min-height: 148px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 24px;
    border: 1px dashed var(--border-color);
    border-radius: var(--border-radius-lg);
    color: var(--text-muted);
    background: var(--bg-surface);
    text-align: center;
}

.payment-methods-grid.is-table-view { display: block; }

.payment-methods-table-wrap {
    overflow-x: auto;
    border: 1px solid var(--border-color);
    border-radius: 12px;
}

.payment-methods-table {
    width: 100%;
    min-width: 760px;
    border-collapse: collapse;
    background: var(--bg-surface);
}

.payment-methods-table th,
.payment-methods-table td {
    padding: 12px 14px;
    border-bottom: 1px solid var(--border-color);
    text-align: start;
    vertical-align: middle;
    font-size: var(--font-ui);
}

.payment-methods-table th {
    background: color-mix(in srgb, var(--primary-light) 48%, var(--bg-surface));
    color: var(--text-muted);
    font-size: var(--font-ui);
    font-weight: 700;
}

.payment-methods-table tbody tr:last-child td { border-bottom: 0; }
.payment-methods-table tbody tr:hover { background: color-mix(in srgb, var(--primary-light) 28%, var(--bg-surface)); }

.payment-method-table-name {
    display: flex;
    align-items: center;
    min-width: 180px;
    gap: 10px;
}

.payment-method-table-name .payment-method-icon { width: 34px; height: 34px; border-radius: 10px; }
.payment-method-table-name strong,
.payment-method-table-name small { display: block; }
.payment-method-table-name small { margin-top: 2px; color: var(--text-muted); font-size: var(--font-xs); }

.payment-method-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--text-muted);
}

.payment-method-link.is-linked { color: var(--text-main); }
.payment-method-table-actions { display: flex; justify-content: flex-end; gap: 3px; }
.payment-method-table-actions button { width: 32px; height: 32px; border-radius: 8px; }
.payment-method-table-actions button:hover { background: var(--primary-light); color: var(--primary); }

.payment-methods-empty i {
    color: var(--primary);
    font-size: 1.5rem;
}

.payment-methods-empty strong {
    color: var(--text-main);
}

.payment-methods-loading {
    flex-direction: row;
}

.payment-method-drawer-overlay {
    position: fixed;
    inset: 0;
    z-index: 10040;
    display: flex;
    justify-content: flex-start;
    background: rgba(15, 23, 42, 0.46);
    backdrop-filter: blur(3px);
}

.payment-method-drawer {
    width: min(500px, 100%);
    height: 100%;
    overflow-y: auto;
    padding: 24px;
    background: var(--bg-surface);
    box-shadow: 18px 0 44px rgba(15, 23, 42, 0.18);
    transform: translateX(100%);
    transition: transform 0.22s ease;
}

.payment-method-drawer-overlay.show .payment-method-drawer {
    transform: translateX(0);
}

.payment-method-drawer-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding-bottom: 18px;
    margin-bottom: 20px;
    border-bottom: 1px solid var(--border-color);
}

.payment-method-drawer-title {
    align-items: flex-start;
    gap: 12px;
}

.payment-method-drawer-title h3 {
    margin: 0 0 5px;
    color: var(--text-main);
    font-size: var(--font-lg);
}

.payment-method-form-section {
    margin: 0 0 18px;
    padding: 16px;
    border: 1px solid var(--border-color);
    border-radius: 12px;
    background: color-mix(in srgb, var(--bg-surface) 92%, var(--primary-light));
}

.payment-method-form-section h4 {
    margin: 0 0 3px;
    color: var(--text-main);
    font-size: var(--font-base);
}

.payment-method-form-section > p {
    margin: 0 0 14px;
    color: var(--text-muted);
    font-size: var(--font-ui);
}

.payment-method-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0 12px;
}

.payment-method-form-section .form-group:last-child { margin-bottom: 0; }

.payment-method-fieldset {
    margin: 0 0 16px;
    padding: 12px;
    border: 1px solid var(--border-color);
    border-radius: 10px;
}

.payment-method-fieldset legend {
    margin-bottom: 10px;
    color: var(--text-main);
    font-size: var(--font-base);
    font-weight: 700;
}

.payment-method-radio {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin-inline-end: 18px;
    color: var(--text-main);
    cursor: pointer;
    font-size: var(--font-base);
}

.payment-method-radio input {
    accent-color: var(--primary);
}

.payment-method-drawer-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    padding-top: 18px;
    border-top: 1px solid var(--border-color);
}

.payment-method-drawer-open {
    overflow: hidden;
}

@media (max-width: 768px) {
    .payment-methods-page-header {
        align-items: stretch;
        flex-direction: column;
    }

    .payment-methods-page-header .btn {
        width: 100%;
    }

    .payment-methods-summary {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .payment-methods-toolbar {
        align-items: stretch;
        flex-wrap: wrap;
    }

    .payment-methods-search { flex-basis: 100%; }
    .payment-methods-filter { flex: 1 1 140px; }
    .payment-methods-view-toggle { margin-inline-start: auto; }

    .payment-method-form-grid { grid-template-columns: 1fr; }

    .payment-method-drawer {
        width: 100%;
        padding: 18px;
    }
}

@media (max-width: 460px) {
    .payment-methods-summary { grid-template-columns: 1fr; }
    .payment-methods-page-title-icon { width: 42px; height: 42px; }
    .payment-methods-page-title h2 { font-size: var(--font-lg); }
    .payment-options-card { padding-inline: 14px; }
}

.product-summary-card {
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 20px 22px;
    border: 1px solid rgba(37, 99, 235, 0.12);
    background: linear-gradient(135deg, rgba(37, 99, 235, 0.08), rgba(20, 184, 166, 0.04));
}

.product-summary-icon {
    width: 56px;
    height: 56px;
    border-radius: 18px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(37, 99, 235, 0.12);
    color: var(--primary);
    font-size: 1.3rem;
    flex-shrink: 0;
}

.product-summary-copy {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.product-summary-label {
    color: var(--text-muted);
    font-size: var(--font-base);
    font-weight: 600;
}

.product-summary-value {
    color: var(--text-main);
    font-size: 2rem;
    font-weight: 700;
    line-height: 1;
}

.product-summary-meta {
    color: var(--text-muted);
    font-size: var(--font-sm);
}

.inventory-settings-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 24px;
    align-items: start;
}

.settings-inline-form {
    margin-bottom: 18px;
    padding: 18px;
    border: 1px solid var(--border-color);
    border-radius: 18px;
    background: rgba(148, 163, 184, 0.06);
}

.settings-inline-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.settings-inline-grid-wide {
    grid-column: 1 / -1;
}

.settings-actions-inline {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.settings-form-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 16px;
}

.field-error {
    color: #dc2626;
    font-size: var(--font-ui);
    margin-top: 6px;
}

.field-hint {
    color: var(--text-muted);
    font-size: var(--font-sm);
    margin-top: 6px;
}

.input-with-action {
    display: flex;
    gap: 10px;
    align-items: stretch;
}

.input-with-action .form-control {
    flex: 1 1 auto;
}

.barcode-generate-btn {
    white-space: nowrap;
    min-width: 128px;
}

.barcode-preview {
    display: flex;
    min-height: 56px;
    align-items: center;
    justify-content: center;
    margin-top: 10px;
    padding: 7px 10px;
    overflow: hidden;
    border: 1px solid var(--border-color);
    border-radius: 10px;
    background: #fff;
}

.barcode-preview svg {
    max-width: 100%;
}

.product-barcode {
    display: block;
    width: 128px;
    max-width: 100%;
    height: 42px;
}

.invoice-qr {
    display: inline-flex;
    width: fit-content;
    height: auto;
    max-width: 100%;
    padding: 6px;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    line-height: 0;
    overflow: visible;
}

.invoice-qr svg {
    display: block;
    width: 108px;
    height: 108px;
    max-width: 100%;
}

.invoice-qr-message {
    max-width: 220px;
    margin: 0;
    font-size: 0.78rem;
    line-height: 1.55;
}

.invoice-qr-input {
    grid-column: 1 / -1;
}

.account-profile-page {
    direction: rtl;
    color: #10213d;
}

.account-profile-page-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 18px;
}

.account-profile-page-header h1 {
    margin: 0 0 5px;
    color: #0f1f3a;
    font-size: var(--font-2xl);
    font-weight: 700;
}

.account-profile-page-header p {
    margin: 0;
    color: #6d7d96;
    font-size: var(--font-base);
}

.account-profile-loading {
    display: flex;
    min-height: 320px;
    align-items: center;
    justify-content: center;
    gap: 10px;
    border: 1px solid #e3ebf5;
    border-radius: 16px;
    background: #fff;
    color: #64748b;
}

.account-profile-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(230px, 280px);
    gap: 16px;
    align-items: start;
}

.account-profile-main-card,
.account-profile-side-card {
    border: 1px solid #dfe8f3;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 5px 18px rgba(15, 31, 58, .045);
}

.account-profile-main-card {
    min-width: 0;
    overflow: hidden;
}

.account-profile-identity {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 20px;
    border-bottom: 1px solid #e8eef6;
    background: #fbfdff;
}

.account-profile-identity-logo {
    display: grid;
    width: 68px;
    height: 68px;
    flex: 0 0 68px;
    place-items: center;
    overflow: hidden;
    border: 1px solid #dce7f4;
    border-radius: 15px;
    background: #fff;
}

.account-profile-identity-logo img,
.account-profile-logo-preview img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.account-profile-logo-fallback {
    display: grid;
    width: 100%;
    height: 100%;
    place-items: center;
    color: #2563eb;
    background: #eef5ff;
    font-size: 1.8rem;
}

.account-profile-identity-copy {
    min-width: 0;
    flex: 1;
}

.account-profile-name-line {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}

.account-profile-name-line h2 {
    margin: 0;
    color: #0f1f3a;
    font-size: var(--font-lg);
    font-weight: 700;
}

.account-profile-identity-copy > p {
    margin: 4px 0 12px;
    color: #6b7c94;
    font-size: var(--font-ui);
}

.account-profile-status {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 10px;
    border-radius: 999px;
    font-size: var(--font-xs);
    font-weight: 700;
}

.account-profile-status i {
    font-size: .48rem;
}

.account-profile-status.is-success {
    color: #087443;
    background: #e9f9f1;
}

.account-profile-status.is-warning {
    color: #9a5b08;
    background: #fff7e6;
}

.account-profile-status.is-muted {
    color: #64748b;
    background: #f1f5f9;
}

.account-profile-metadata {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.account-profile-metadata > span {
    display: grid;
    grid-template-columns: 26px auto;
    min-width: 142px;
    align-items: center;
    column-gap: 7px;
    padding: 7px 10px;
    border: 1px solid #e6edf6;
    border-radius: 10px;
    background: #fff;
}

.account-profile-metadata i {
    grid-row: 1 / span 2;
    color: #3b82f6;
    font-size: .85rem;
    text-align: center;
}

.account-profile-metadata small {
    color: #8794a8;
    font-size: var(--font-xs);
}

.account-profile-metadata strong {
    color: #263b5b;
    font-size: var(--font-sm);
    font-weight: 700;
}

.account-profile-completion {
    display: grid;
    grid-template-columns: 62px minmax(0, 1fr) auto;
    align-items: center;
    gap: 14px;
    margin: 16px 20px 0;
    padding: 14px;
    border: 1px solid #dce8f7;
    border-radius: 14px;
    background: #f7fbff;
}

.account-profile-progress {
    display: grid;
    width: 58px;
    height: 58px;
    place-items: center;
    border-radius: 50%;
    background: conic-gradient(#2563eb var(--profile-progress), #dfe9f6 0);
    position: relative;
}

.account-profile-progress::before {
    position: absolute;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: #fff;
    content: '';
}

.account-profile-progress span {
    position: relative;
    z-index: 1;
    color: #173d82;
    font-size: var(--font-sm);
    font-weight: 700;
}

.account-profile-completion-copy {
    display: grid;
    gap: 2px;
}

.account-profile-completion-copy span {
    color: #74839a;
    font-size: var(--font-sm);
}

.account-profile-completion-copy strong {
    color: #132946;
    font-size: var(--font-base);
}

.account-profile-completion-copy small {
    color: #b0660a;
    font-size: var(--font-xs);
}

.account-profile-missing-list {
    margin: 10px 20px 0;
    padding: 13px 15px;
    border: 1px solid #f4d8a8;
    border-radius: 12px;
    background: #fffaf0;
}

.account-profile-missing-list > strong {
    color: #77490c;
    font-size: var(--font-ui);
}

.account-profile-missing-list ul {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    margin: 10px 0 0;
    padding: 0;
    list-style: none;
}

.account-profile-missing-list li {
    display: flex;
    gap: 8px;
    color: #8a570f;
    font-size: var(--font-sm);
}

.account-profile-missing-list li > i {
    margin-top: 3px;
}

.account-profile-missing-list li span {
    display: grid;
    gap: 2px;
}

.account-profile-missing-list li small {
    color: #9a713a;
    line-height: 1.5;
}

.account-profile-basic {
    padding: 18px 20px 20px;
}

.account-profile-section-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
}

.account-profile-section-title span {
    color: #2563eb;
    font-size: var(--font-sm);
    font-weight: 700;
}

.account-profile-section-title h3 {
    margin: 2px 0 0;
    color: #172b49;
    font-size: var(--font-md);
    font-weight: 700;
}

.account-profile-editing-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 9px;
    border-radius: 999px;
    background: #eaf2ff;
}

.account-profile-fields {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.account-profile-field {
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr) auto;
    min-height: 72px;
    align-items: center;
    gap: 9px;
    padding: 11px;
    border: 1px solid #e3ebf5;
    border-radius: 12px;
    background: #fff;
}

.account-profile-field.has-missing-value {
    border-color: #f1dfc0;
    background: #fffdf9;
}

.account-profile-field-icon {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;
    border-radius: 9px;
    color: #2563eb;
    background: #edf4ff;
    font-size: .82rem;
}

.account-profile-field-content {
    display: grid;
    min-width: 0;
    gap: 4px;
}

.account-profile-field-content > span {
    color: #8190a5;
    font-size: var(--font-ui);
}

.account-profile-field-value {
    overflow: hidden;
    color: #182c4a;
    font-size: var(--font-ui);
    font-weight: 700;
    line-height: 1.45;
    text-overflow: ellipsis;
}

.account-profile-field-value.is-missing {
    color: #b36d12;
    font-weight: 600;
}

.account-profile-copy {
    display: grid;
    width: 28px;
    height: 28px;
    padding: 0;
    place-items: center;
    border: 0;
    border-radius: 8px;
    color: #58759f;
    background: #f2f6fb;
    cursor: pointer;
}

.account-profile-copy:hover,
.account-profile-copy:focus-visible {
    color: #1d5dcc;
    background: #e6effd;
    outline: none;
}

.account-profile-edit-input {
    width: 100%;
    min-width: 0;
    height: 34px;
    padding: 6px 9px;
    border: 1px solid #b9cae2;
    border-radius: 8px;
    color: #162b49;
    background: #fff;
    font: inherit;
    font-size: var(--font-ui);
}

.account-profile-edit-input:focus {
    border-color: #2563eb;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, .1);
    outline: none;
}

.account-profile-page .is-ltr {
    direction: ltr;
    unicode-bidi: isolate;
    text-align: right;
}

.account-profile-note {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    padding: 12px 20px;
    border-top: 1px solid #e8eef6;
    color: #64748b;
    background: #fbfdff;
    font-size: var(--font-xs);
    line-height: 1.6;
}

.account-profile-note i {
    margin-top: 3px;
    color: #3b82f6;
}

.account-profile-side {
    display: grid;
    gap: 14px;
}

.account-profile-side-card {
    display: grid;
    gap: 12px;
    padding: 16px;
}

.account-profile-side-card h3 {
    margin: 0 0 3px;
    color: #172b49;
    font-size: var(--font-base);
    font-weight: 700;
}

.account-profile-side-card p,
.account-profile-side-card > small {
    margin: 0;
    color: #7b8aa0;
    font-size: var(--font-xs);
    line-height: 1.55;
}

.account-profile-logo-card {
    text-align: center;
}

.account-profile-logo-card > div:first-child {
    text-align: right;
}

.account-profile-logo-preview {
    display: grid;
    width: 128px;
    height: 128px;
    margin: 2px auto;
    place-items: center;
    overflow: hidden;
    border: 1px solid #dce7f4;
    border-radius: 14px;
    background: #f9fbfe;
}

.account-profile-logo-card .btn,
.account-profile-actions .btn {
    width: 100%;
    justify-content: center;
}

.account-profile-actions {
    gap: 9px;
}

.account-profile-message {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 12px;
    padding: 10px 13px;
    border: 1px solid;
    border-radius: 11px;
    font-size: var(--font-ui);
}

.account-profile-message.is-success {
    border-color: #bfe8d2;
    color: #087443;
    background: #effaf4;
}

.account-profile-message.is-error {
    border-color: #f4c7c7;
    color: #a62b2b;
    background: #fff5f5;
}

@media (max-width: 768px) {
    .product-summary-card {
        align-items: flex-start;
        flex-direction: column;
    }

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

    .settings-form-actions,
    .settings-actions-inline,
    .input-with-action {
        flex-direction: column;
    }

    .barcode-generate-btn {
        width: 100%;
    }
}

@media (max-width: 1100px) {
    .account-profile-layout {
        grid-template-columns: minmax(0, 1fr) 230px;
    }

    .account-profile-fields {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 820px) {
    .account-profile-layout {
        grid-template-columns: 1fr;
    }

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

    .account-profile-logo-card {
        grid-column: auto;
    }
}

@media (max-width: 600px) {
    .account-profile-page-header {
        margin-bottom: 14px;
    }

    .account-profile-identity {
        align-items: flex-start;
        padding: 15px;
    }

    .account-profile-metadata {
        display: grid;
        grid-template-columns: 1fr;
    }

    .account-profile-metadata > span {
        min-width: 0;
    }

    .account-profile-completion {
        grid-template-columns: 56px minmax(0, 1fr);
        margin: 12px 14px 0;
    }

    .account-profile-completion .btn {
        grid-column: 1 / -1;
        width: 100%;
    }

    .account-profile-missing-list {
        margin: 9px 14px 0;
    }

    .account-profile-missing-list ul,
    .account-profile-fields,
    .account-profile-side {
        grid-template-columns: 1fr;
    }

    .account-profile-basic {
        padding: 16px 14px;
    }

    .account-profile-note {
        padding: 12px 14px;
    }
}

@media print {
    .account-profile-page .account-profile-actions,
    .account-profile-page .account-profile-logo-card .btn,
    .account-profile-page #account-profile-missing-toggle {
        display: none !important;
    }

    .account-profile-page .account-profile-main-card,
    .account-profile-page .account-profile-side-card {
        box-shadow: none;
    }
}

/* Topbar notification center */
.app-notifications { position: relative; }
.app-notifications-toggle { position: relative; padding: 10px 14px; }
.app-notifications-badge { position: absolute; top: -4px; inset-inline-end: -4px; min-width: 20px; height: 20px; padding: 0 5px; border-radius: 999px; background: #dc2626; color: #fff; font-size: 11px; font-weight: 700; line-height: 20px; text-align: center; }
.app-notifications-panel { position: absolute; top: calc(100% + 10px); inset-inline-start: 0; z-index: 1200; width: min(380px, calc(100vw - 32px)); border: 1px solid var(--border-color); border-radius: 14px; background: var(--bg-surface); box-shadow: 0 18px 40px rgba(15, 23, 42, .16); overflow: hidden; }
[dir="rtl"] .app-notifications-panel { inset-inline-start: auto; inset-inline-end: 0; }
.app-notifications-panel > header { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 12px 16px; border-bottom: 1px solid var(--border-color); font-size: var(--font-ui); }
.app-notifications-panel > header .btn-link { padding: 0; font-size: var(--font-sm); text-decoration: none; }
.app-notification-list { max-height: 420px; overflow: auto; }
.app-notification-item { display: flex; gap: 10px; width: 100%; padding: 12px 16px; border: 0; border-bottom: 1px solid var(--border-color); background: transparent; text-align: start; cursor: pointer; font: inherit; color: inherit; }
.app-notification-item:last-child { border-bottom: 0; }
.app-notification-item:hover { background: rgba(37, 99, 235, .06); }
.app-notification-item.is-unread { background: rgba(37, 99, 235, .04); }
.app-notification-dot { flex: 0 0 auto; width: 8px; height: 8px; margin-top: 7px; border-radius: 50%; background: transparent; }
.app-notification-item.is-unread .app-notification-dot { background: #2563eb; }
.app-notification-body { display: grid; gap: 2px; min-width: 0; }
.app-notification-body strong { font-size: var(--font-ui); }
.app-notification-body small { color: var(--text-muted); font-size: var(--font-sm); overflow-wrap: anywhere; }
.app-notification-body time { color: var(--text-muted); font-size: var(--font-xs); }
.app-notification-empty { margin: 0; padding: 26px 16px; text-align: center; color: var(--text-muted); font-size: var(--font-sm); }

/* ---- Global report states (shared by every report screen: empty / loading / no results / error / pending criteria) ---- */
.report-state{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:56px 24px;text-align:center;background:#fff;border:1px dashed #d8dde6;border-radius:16px;margin-top:16px}
.report-state i{font-size:2rem;color:#8791a1}
.report-state strong{font-size:var(--font-lg,1.05rem);font-weight:800;color:#1f2f4d;line-height:1.7}
.report-state span{color:#667085;font-size:var(--font-ui,.95rem)}
.report-state .btn{margin-top:6px;min-height:42px;display:inline-flex;align-items:center;gap:8px;font-weight:800}
.report-state-loading i{color:#5a3ca2}
.report-state-error{border-color:#f0b9bd;background:#fffafa}
.report-state-error i{color:#ce4651}
.report-state-no-results i{color:#b98d2b}
.report-pending-note{display:flex;align-items:center;gap:9px;padding:10px 14px;margin:12px 0 0;border:1px solid #f4d38b;border-radius:9px;background:#fff8e6;color:#7a5a12;font-weight:700}
.report-pending-note[hidden]{display:none}
.report-pending-note i{color:#b87800}
.is-report-blocked{opacity:.55;cursor:not-allowed}
.report-kpi-placeholder strong{color:#9aa3b2!important}
@media print{.report-pending-note,.report-state-empty,.report-state-loading{display:none!important}}

/* The one Detailed / Summary control of the report screens (ReportViewSwitch): a page-level segmented control between the
   header and the filters card, at the start of the line in either direction; the pressed mode is filled and bold, not only
   coloured. */
.report-view-switch { display: inline-flex; align-items: center; justify-self: start; align-self: flex-start; gap: 4px; padding: 4px; border: 1px solid #dbe5f1; border-radius: 11px; background: #fff; box-shadow: 0 1px 2px rgba(15, 23, 42, .05); }
.report-view-switch button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 36px; padding: 6px 16px; border: 1px solid transparent; border-radius: 8px; background: transparent; color: #475569; font: inherit; font-size: var(--font-sm); font-weight: 600; cursor: pointer; }
.report-view-switch button:hover { background: #f1f5f9; color: #0f172a; }
.report-view-switch button:focus-visible { outline: 2px solid var(--primary, #185adb); outline-offset: 2px; }
.report-view-switch button[aria-pressed="true"] { background: var(--primary, #185adb); border-color: var(--primary, #185adb); color: #fff; font-weight: 700; }
@media (max-width: 540px) { .report-view-switch { display: flex; align-self: stretch; justify-self: stretch; } .report-view-switch button { flex: 1 1 0; } }
@media print { .report-view-switch { display: none !important; } }

/* Customer / Supplier Statement print: five summary tiles (opening, two party buckets, adjustments, closing). */
.statement-summary.statement-summary-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.statement-table tr.statement-row-opening td, .statement-table tr.statement-row-closing td { font-weight: 700; background: rgba(15, 23, 42, 0.04); }

/* ===== Expenses feature (restored from production release line — feature kept per owner decision) ===== */
.expenses-action-bar {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 16px;
    flex-wrap: wrap;
    gap: 12px;
}
.expenses-title-block h2 {
    font-size: 1.4rem;
    font-weight: 700;
    color: var(--text-main, #1e293b);
    margin-bottom: 4px;
}
.expenses-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}
.btn-action {
    padding: 8px 18px;
    border: none;
    border-radius: 8px;
    font-size: 0.875rem;
    font-weight: 600;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 6px;
    transition: all 0.2s ease;
}
.btn-action i { font-size: 0.85rem; }
.btn-green {
    background: linear-gradient(135deg, #059669 0%, #10b981 100%);
    color: #ffffff;
    box-shadow: 0 2px 8px rgba(16, 185, 129, 0.35);
}
.btn-green:hover { transform: translateY(-1px); box-shadow: 0 4px 12px rgba(16, 185, 129, 0.45); }
.btn-blue-ai {
    background: linear-gradient(135deg, #1d4ed8 0%, #3b82f6 100%);
    color: #ffffff;
    box-shadow: 0 2px 8px rgba(59, 130, 246, 0.35);
}
.btn-blue-ai:hover { transform: translateY(-1px); }
.action-icon-group {
    display: flex;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    overflow: hidden;
}
.icon-btn {
    background: #fff;
    border: none;
    padding: 8px 12px;
    cursor: pointer;
    color: #64748b;
    font-size: 0.85rem;
    transition: background 0.15s;
}
.icon-btn:hover { background: #f1f5f9; color: #1e293b; }
.pagination-ctrl {
    display: flex;
    align-items: center;
    gap: 6px;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 4px 8px;
    font-size: 0.8rem;
    color: #64748b;
    background: #fff;
}
.pagination-ctrl .icon-btn { padding: 4px 6px; border-radius: 4px; }

/* Summary Strip */
.expenses-summary-strip {
    display: flex;
    align-items: center;
    background: linear-gradient(135deg, #064e3b 0%, #065f46 100%);
    border-radius: 12px;
    padding: 16px 24px;
    margin-bottom: 16px;
    gap: 0;
    overflow-x: auto;
}
.summary-strip-item {
    flex: 1;
    text-align: center;
    min-width: 120px;
}
.summary-strip-label {
    font-size: 0.75rem;
    color: rgba(255,255,255,0.7);
    margin-bottom: 4px;
    letter-spacing: 0.5px;
}
.summary-strip-value {
    font-size: 1.1rem;
    font-weight: 700;
    color: #6ee7b7;
}
.summary-strip-divider {
    width: 1px;
    height: 40px;
    background: rgba(255,255,255,0.2);
    margin: 0 16px;
    flex-shrink: 0;
}

/* Filter Card */
.expenses-filter-card {
    padding: 16px 20px !important;
}
.filter-row {
    display: flex;
    align-items: flex-end;
    gap: 12px;
    flex-wrap: wrap;
}
.filter-field {
    flex: 1;
    min-width: 130px;
}
.filter-field label {
    display: block;
    font-size: 0.75rem;
    font-weight: 600;
    color: #64748b;
    margin-bottom: 4px;
    text-transform: uppercase;
    letter-spacing: 0.4px;
}
.filter-actions {
    display: flex;
    gap: 6px;
    align-items: flex-end;
    padding-bottom: 2px;
}

/* Slide-in Expense Panel */
.expense-slide-panel {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    margin-bottom: 16px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.06);
    animation: slideDown 0.25s ease;
}
@keyframes slideDown {
    from { opacity: 0; transform: translateY(-8px); }
    to { opacity: 1; transform: translateY(0); }
}
.expense-slide-inner { padding: 28px; }

/* rtl.css */
/* frontend/assets/css/rtl.css */

/* Core RTL Settings */
html {
    direction: rtl;
}

/* Forms */
.form-control {
    text-align: right;
}

/* Margin/Padding Flips */
.ml-auto {
    margin-right: auto !important;
    margin-left: 0 !important;
}

.mr-auto {
    margin-left: auto !important;
    margin-right: 0 !important;
}

.pl-3 {
    padding-right: 1rem !important;
    padding-left: 0 !important;
}

.pr-3 {
    padding-left: 1rem !important;
    padding-right: 0 !important;
}

/* Alignments */
.text-right {
    text-align: left !important;
}

.text-left {
    text-align: right !important;
}

/* Icons */
.nav-item i {
    margin-left: 12px;
    margin-right: 0;
}

/* user-preferences.css */
html[dir="ltr"] #app-wrapper{direction:ltr}
html[dir="ltr"] .sidebar{border-right:1px solid rgba(255,255,255,.05);border-left:0;box-shadow:4px 0 15px rgba(0,0,0,.1)}
html[dir="ltr"] .nav-item:hover,html[dir="ltr"] .nav-item.active{border-left:4px solid var(--sidebar-accent);border-right:0}
html[dir="ltr"] .nav-item i{margin-right:12px;margin-left:0}
html[dir="ltr"] .form-control,html[dir="ltr"] .form-select,html[dir="ltr"] select{text-align:left}
html[dir="ltr"] .dropdown-menu{text-align:left}
html[dir="ltr"] .fa-arrow-left{transform:scaleX(-1)}
html[dir="ltr"] [dir="rtl"]:not([data-fixed-direction]){direction:ltr}
html[dir="ltr"] [dir="ltr"],html[dir="rtl"] [dir="ltr"]{unicode-bidi:isolate}
html[dir="rtl"] [dir="ltr"]{text-align:left}
.accman-numeric,[data-format-number]{font-variant-numeric:tabular-nums}
@media(max-width:940px){html[dir="ltr"] .sidebar{inset:0 auto 0 0;transform:translateX(-100%);box-shadow:12px 0 30px rgba(16,33,63,.22)}html[dir="ltr"] .sidebar.is-open{transform:translateX(0)}}

/* dashboard-interactive.css */
/* Main user dashboard (the approved light layout): banner/welcome, four KPIs,
   analytics row, secondary row, quick actions, footer. Tokens from variables.css. */
.user-dashboard { --dash-ink: #172033; --dash-muted: #64748b; --dash-line: #e3e9f3; --dash-soft: #f5f8fc; --dash-primary: var(--primary, #2563eb); --dash-primary-soft: #e9f3ff; --dash-radius: 12px; --dash-shadow: 0 1px 2px rgba(15, 23, 42, .04), 0 6px 18px rgba(15, 23, 42, .04); display: grid; gap: 18px; min-width: 0; max-width: 1560px; margin: 0 auto; color: var(--dash-ink); }
.user-dashboard > * { min-width: 0; }
.user-dashboard.is-loading { opacity: .72; pointer-events: none; }

/* announcement / welcome (same footprint in both states) */
.dash-banner { --banner-accent: var(--dash-primary); --banner-bg: #eef5ff; --banner-border: #cfe0fb; display: flex; align-items: center; gap: 14px; min-height: 84px; padding: 14px 18px; border: 1px solid var(--banner-border); border-inline-start: 4px solid var(--banner-accent); border-radius: var(--dash-radius); background: var(--banner-bg); }
.dash-banner--welcome { --banner-bg: #f5f9ff; --banner-border: #dbe7fb; }
.dash-banner--success { --banner-accent: #16a34a; --banner-bg: #effaf3; --banner-border: #bfe8cc; }
.dash-banner--warning { --banner-accent: #d97706; --banner-bg: #fff8ec; --banner-border: #fbdfa9; }
.dash-banner--urgent { --banner-accent: #dc2626; --banner-bg: #fff2f2; --banner-border: #f8c7c7; }
.dash-banner__icon { flex: 0 0 auto; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 12px; background: #fff; color: var(--banner-accent); font-size: 1.15rem; box-shadow: var(--shadow-sm); }
.dash-banner__copy { flex: 1 1 auto; min-width: 0; }
.dash-banner__copy strong { display: block; font-size: var(--font-lg); font-weight: var(--weight-bold); line-height: var(--line-height-tight); }
.dash-banner__copy p { margin: 3px 0 0; color: var(--dash-muted); font-size: var(--font-ui); line-height: 1.55; }
.dash-banner__actions { display: flex; align-items: center; gap: 8px; }
.dash-banner__action { display: inline-flex; align-items: center; min-height: 36px; padding: 6px 14px; border-radius: 9px; background: var(--banner-accent); color: #fff; font-size: var(--font-sm); font-weight: var(--weight-semibold); text-decoration: none; white-space: nowrap; }
.dash-banner__action:hover { color: #fff; filter: brightness(.94); }
.dash-banner__close { width: 34px; height: 34px; border: 1px solid var(--banner-border); border-radius: 9px; background: #fff; color: var(--dash-muted); cursor: pointer; }
.dash-banner__close:hover { color: var(--dash-ink); }

/* period / branch context (existing report context, restyled) */
.dash-context { display: flex; flex-wrap: wrap; align-items: end; gap: 10px; padding: 12px 14px; border: 1px solid var(--dash-line); border-radius: var(--dash-radius); background: #fff; }
.dash-context__field { display: grid; gap: 4px; min-width: 150px; color: var(--dash-muted); font-size: var(--font-sm); font-weight: var(--weight-semibold); }
.dash-context__field .form-control, .dash-context__field .form-select { min-height: 38px; border-color: #d8e0ec; border-radius: 9px; font-size: var(--font-ui); }
.dash-context__apply, .dash-context__reset { min-height: 38px; border-radius: 9px; font-size: var(--font-sm); font-weight: var(--weight-semibold); }
.dash-context__reset { border: 1px solid var(--dash-line); background: #fff; color: var(--dash-muted); }

/* KPI row */
.dash-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.dash-kpi { position: relative; display: grid; grid-template-columns: 1fr auto; grid-template-areas: 'label icon' 'value icon' 'meta meta'; align-items: start; gap: 4px 12px; padding: 18px 20px; border: 1px solid var(--dash-line); border-radius: var(--dash-radius); background: #fff; color: var(--dash-ink); text-decoration: none; box-shadow: var(--dash-shadow); transition: box-shadow .18s, border-color .18s, transform .18s; }
a.dash-kpi:hover { color: var(--dash-ink); border-color: #c9dcfb; box-shadow: 0 10px 26px rgba(37, 99, 235, .1); transform: translateY(-1px); text-decoration: none; }
.dash-kpi__icon { grid-area: icon; display: grid; place-items: center; width: 46px; height: 46px; border-radius: 12px; font-size: 1.15rem; }
.dash-kpi__label { grid-area: label; color: var(--dash-muted); font-size: var(--font-ui); font-weight: var(--weight-semibold); }
.dash-kpi__value { grid-area: value; font-size: clamp(20px, 1.7vw, 26px); font-weight: var(--weight-bold); line-height: var(--line-height-tight); letter-spacing: -.01em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dash-kpi__meta { grid-area: meta; display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin-top: 6px; font-size: var(--font-xs); }
.dash-kpi__delta { display: inline-flex; align-items: center; gap: 4px; padding: 2px 8px; border-radius: 999px; font-weight: var(--weight-bold); }
.dash-kpi__delta.is-up { background: #dcfce7; color: #15803d; }
.dash-kpi__delta.is-down { background: #fee2e2; color: #b91c1c; }
.dash-kpi__delta.is-flat { background: #f1f5f9; color: var(--dash-muted); }
.dash-kpi__compare { color: var(--dash-muted); }

/* tone palette shared by icons, badges, quick actions */
.tone-primary { background: var(--dash-primary-soft); color: var(--dash-primary); }
.tone-success { background: #dcfce7; color: #15803d; }
.tone-danger { background: #fee2e2; color: #b91c1c; }
.tone-warning { background: #fef3c7; color: #b45309; }
.tone-info { background: #cffafe; color: #0e7490; }
.tone-violet { background: #ede9fe; color: #6d28d9; }
.tone-muted { background: #f1f5f9; color: #475569; }

/* cards & grids */
.dash-grid { display: grid; gap: 16px; }
.dash-grid--analytics { grid-template-columns: 1.35fr .9fr 1.75fr; }
.dash-grid--secondary { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.dash-card { display: grid; align-content: start; gap: 14px; min-width: 0; padding: 18px 20px; border: 1px solid var(--dash-line); border-radius: var(--dash-radius); background: #fff; box-shadow: var(--dash-shadow); }
.dash-card__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.dash-card__head h2 { margin: 0; font-size: var(--font-md); font-weight: var(--weight-bold); line-height: 1.35; }
.dash-card__head small { display: block; margin-top: 2px; color: var(--dash-muted); font-size: var(--font-xs); }
.dash-card__action { display: inline-flex; align-items: center; gap: 6px; color: var(--dash-primary); font-size: var(--font-sm); font-weight: var(--weight-semibold); text-decoration: none; white-space: nowrap; }
.dash-card__action:hover { text-decoration: underline; }
.dash-card__select { width: auto; min-height: 34px; padding: 4px 30px 4px 10px; border-color: #d8e0ec; border-radius: 8px; font-size: var(--font-sm); }
.dash-chart { position: relative; height: 280px; }
.dash-chart--donut { height: 200px; }
.dash-donut { display: grid; gap: 12px; }
.dash-donut__center { position: absolute; inset: 0; display: grid; place-content: center; justify-items: center; pointer-events: none; text-align: center; }
.dash-donut__center strong { font-size: var(--font-2xl); font-weight: var(--weight-bold); line-height: 1.1; }
.dash-donut__center small { color: var(--dash-muted); font-size: var(--font-xs); font-weight: var(--weight-semibold); }
.dash-legend { display: grid; gap: 6px; margin: 0; padding: 0; list-style: none; }
.dash-legend li { display: flex; align-items: center; gap: 8px; font-size: var(--font-sm); }
.dash-legend li i { width: 10px; height: 10px; border-radius: 999px; background: var(--dot); }
.dash-legend li strong { margin-inline-start: auto; font-variant-numeric: tabular-nums; }

/* recent operations */
.dash-table-wrap { overflow: auto; border: 1px solid var(--dash-line); border-radius: 10px; }
.dash-table { width: 100%; border-collapse: collapse; font-size: var(--font-ui); }
.dash-table th { padding: 10px 12px; background: var(--dash-soft); color: #475467; font-size: var(--font-sm); font-weight: var(--weight-bold); text-align: start; white-space: nowrap; border-bottom: 1px solid var(--dash-line); }
.dash-table td { padding: 9px 10px; border-bottom: 1px solid var(--dash-line); text-align: start; vertical-align: middle; white-space: nowrap; }
.dash-table tbody tr:last-child td { border-bottom: 0; }
.dash-table tbody tr[data-href] { cursor: pointer; transition: background .15s; }
.dash-table tbody tr[data-href]:hover td, .dash-table tbody tr[data-href]:focus-visible td { background: #f8fbff; }
.dash-table .is-num { text-align: end; font-variant-numeric: tabular-nums; white-space: nowrap; }
.dash-number { display: inline-block; max-width: 150px; overflow: hidden; text-overflow: ellipsis; vertical-align: middle; color: var(--dash-primary); font-weight: var(--weight-semibold); text-decoration: none; }
.dash-type { display: inline-flex; align-items: center; gap: 6px; padding: 3px 9px; border-radius: 999px; font-size: var(--font-xs); font-weight: var(--weight-semibold); white-space: nowrap; }
.dash-status { display: inline-block; padding: 3px 9px; border-radius: 999px; font-size: var(--font-xs); font-weight: var(--weight-bold); white-space: nowrap; }

/* ranked lists (customers, products) */
.dash-rank { display: grid; gap: 6px; margin: 0; padding: 0; list-style: none; counter-reset: rank; }
.dash-rank__item { display: grid; grid-template-columns: 30px 1fr auto; align-items: center; gap: 12px; padding: 9px 10px; border-radius: 10px; color: var(--dash-ink); text-decoration: none; transition: background .15s; }
a.dash-rank__item:hover { background: var(--dash-soft); color: var(--dash-ink); text-decoration: none; }
.dash-rank__index { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 9px; background: var(--dash-soft); color: var(--dash-muted); font-size: var(--font-sm); font-weight: var(--weight-bold); }
.dash-rank__copy { display: grid; gap: 5px; min-width: 0; }
.dash-rank__copy strong { font-size: var(--font-ui); font-weight: var(--weight-semibold); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dash-rank__copy small { color: var(--dash-muted); font-size: var(--font-xs); }
.dash-rank__bar { display: block; height: 6px; border-radius: 999px; background: #edf2f9; overflow: hidden; }
.dash-rank__bar b { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #2563eb, #60a5fa); }
.dash-rank__value { display: grid; justify-items: end; font-size: var(--font-ui); font-weight: var(--weight-bold); font-variant-numeric: tabular-nums; white-space: nowrap; }
.dash-rank__value small { color: var(--dash-muted); font-size: var(--font-xs); font-weight: var(--weight-medium); }

/* alerts */
.dash-alerts { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.dash-alerts__item { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border: 1px solid var(--dash-line); border-radius: 10px; background: #fff; color: var(--dash-ink); text-decoration: none; transition: border-color .15s, background .15s; }
a.dash-alerts__item:hover { border-color: #c9dcfb; background: #f8fbff; color: var(--dash-ink); text-decoration: none; }
.dash-alerts__icon { flex: 0 0 auto; display: grid; place-items: center; width: 38px; height: 38px; border-radius: 10px; }
.dash-alerts__copy { flex: 1 1 auto; min-width: 0; display: grid; gap: 2px; }
.dash-alerts__copy strong { font-size: var(--font-ui); font-weight: var(--weight-semibold); }
.dash-alerts__copy small { color: var(--dash-muted); font-size: var(--font-xs); }
.dash-alerts__chevron { color: #98a2b3; font-size: .8rem; }
[dir="ltr"] .dash-alerts__chevron, [dir="ltr"] .dash-card__action i { transform: scaleX(-1); }

/* quick actions (dashboard only, never the sidebar) */
.dash-quick { display: grid; gap: 12px; }
.dash-quick__grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; }
.dash-quick__item { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border: 1px solid var(--dash-line); border-radius: var(--dash-radius); background: #fff; color: var(--dash-ink); font-size: var(--font-ui); font-weight: var(--weight-semibold); text-decoration: none; box-shadow: var(--dash-shadow); transition: border-color .18s, box-shadow .18s, transform .18s; }
.dash-quick__item:hover { border-color: #c9dcfb; color: var(--dash-primary); box-shadow: 0 10px 24px rgba(37, 99, 235, .1); transform: translateY(-1px); text-decoration: none; }
.dash-quick__icon { flex: 0 0 auto; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 11px; font-size: 1.05rem; }

/* states */
.dash-empty { display: grid; justify-items: center; gap: 8px; padding: 28px 12px; color: var(--dash-muted); font-size: var(--font-ui); text-align: center; }
.dash-empty i { font-size: 1.5rem; color: #98a2b3; }
.dash-error { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; padding: 22px 24px; border: 1px solid #f8c7c7; border-radius: var(--dash-radius); background: #fff5f5; }
.dash-error__icon { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 12px; background: #fee2e2; color: #b91c1c; font-size: 1.2rem; }
.dash-error h2 { margin: 0; font-size: var(--font-lg); }
.dash-error p { margin: 4px 0 0; color: var(--dash-muted); font-size: var(--font-ui); }
.dash-error .btn { margin-inline-start: auto; }
.dash-skeleton { display: grid; gap: 16px; }
.dash-skeleton span { display: block; border-radius: var(--dash-radius); background: linear-gradient(90deg, #eef2f7 25%, #f7f9fc 50%, #eef2f7 75%); background-size: 200% 100%; animation: dash-shimmer 1.4s infinite; }
.dash-skeleton__banner { height: 84px; }
.dash-skeleton__row { height: 64px; }
.dash-skeleton__kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.dash-skeleton__kpis span { height: 128px; }
.dash-skeleton__panels { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.dash-skeleton__panels span { height: 300px; }
@keyframes dash-shimmer { from { background-position: 200% 0; } to { background-position: -200% 0; } }

/* footer */
.dash-footer { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 16px; padding: 14px 4px 4px; border-top: 1px solid var(--dash-line); color: var(--dash-muted); font-size: var(--font-xs); }
.dash-footer__links { display: flex; gap: 14px; }
.dash-footer a { color: var(--dash-primary); text-decoration: none; font-weight: var(--weight-semibold); }

@media (max-width: 1400px) {
    .dash-grid--analytics { grid-template-columns: 1.4fr 1fr; }
    .dash-grid--analytics > :last-child { grid-column: 1 / -1; }
    .dash-quick__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 1100px) {
    .dash-kpis, .dash-skeleton__kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .dash-grid--analytics, .dash-grid--secondary, .dash-skeleton__panels { grid-template-columns: 1fr; }
    .dash-grid--analytics > :last-child { grid-column: auto; }
}
@media (max-width: 640px) {
    .user-dashboard { gap: 14px; }
    .dash-banner { flex-wrap: wrap; padding: 14px; }
    .dash-banner__actions { width: 100%; justify-content: flex-end; }
    .dash-kpis, .dash-skeleton__kpis, .dash-quick__grid { grid-template-columns: 1fr; }
    .dash-card { padding: 14px; }
    .dash-context__field { flex: 1 1 100%; min-width: 0; }
    .dash-context__apply, .dash-context__reset { flex: 1 1 auto; }
    .dash-table thead { display: none; }
    .dash-table tr { display: grid; gap: 4px; padding: 10px 12px; border-bottom: 1px solid var(--dash-line); }
    .dash-table td { display: flex; justify-content: space-between; gap: 12px; padding: 2px 0; border: 0; white-space: normal; }
    .dash-table td::before { content: attr(data-label); flex: 0 0 auto; color: var(--dash-muted); font-size: var(--font-xs); font-weight: var(--weight-semibold); }
    .dash-rank__item { grid-template-columns: 26px 1fr; }
    .dash-rank__value { grid-column: 2; justify-items: start; }
}

/* support-center.css */
/* Tenant support center (/support): list, new request, ticket thread. Tokens from variables.css. */
.support-center { --sc-ink: #172033; --sc-muted: #64748b; --sc-line: #e3e9f3; --sc-soft: #f5f8fc; --sc-primary: var(--primary, #2563eb); --sc-primary-soft: #e9f3ff; --sc-radius: 12px; display: grid; gap: 18px; max-width: 1280px; margin: 0 auto; color: var(--sc-ink); }
.sc-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-start; gap: 12px 20px; }
.sc-head h1 { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 0 0 4px; font-size: var(--font-2xl); font-weight: var(--weight-bold); line-height: var(--line-height-tight); }
.sc-head p { margin: 0; max-width: 720px; color: var(--sc-muted); font-size: var(--font-ui); }
.sc-head__actions { display: flex; flex-wrap: wrap; gap: 8px; }
.sc-meta { display: flex; flex-wrap: wrap; gap: 6px 16px; margin-top: 8px; color: var(--sc-muted); font-size: var(--font-sm); }
.sc-meta i { margin-inline-end: 6px; color: var(--sc-primary); }
.sc-btn { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 8px 16px; border: 1px solid var(--sc-line); border-radius: 10px; background: #fff; color: var(--sc-ink); font: inherit; font-size: var(--font-sm); font-weight: var(--weight-semibold); text-decoration: none; cursor: pointer; transition: background .15s, border-color .15s; }
.sc-btn:hover { background: var(--sc-soft); color: var(--sc-ink); text-decoration: none; }
.sc-btn--primary { border-color: var(--sc-primary); background: var(--sc-primary); color: #fff; }
.sc-btn--primary:hover { background: var(--primary-hover, #1d4ed8); color: #fff; }
.sc-btn--ghost { background: transparent; }
.sc-btn[disabled] { opacity: .55; cursor: default; }
.sc-layout { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 18px; align-items: start; }
.sc-main { display: grid; gap: 16px; min-width: 0; }
.sc-card { padding: 18px 20px; border: 1px solid var(--sc-line); border-radius: var(--sc-radius); background: #fff; box-shadow: 0 1px 2px rgba(15, 23, 42, .04), 0 6px 18px rgba(15, 23, 42, .04); }
.sc-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.sc-kpi { display: flex; align-items: center; gap: 12px; padding: 14px 16px; border: 1px solid var(--sc-line); border-radius: var(--sc-radius); background: #fff; }
.sc-kpi i { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 11px; background: var(--sc-primary-soft); color: var(--sc-primary); }
.sc-kpi--warning i { background: #fef3c7; color: #b45309; } .sc-kpi--success i { background: #dcfce7; color: #15803d; } .sc-kpi--muted i { background: #f1f5f9; color: #475569; }
.sc-kpi small { display: block; color: var(--sc-muted); font-size: var(--font-xs); font-weight: var(--weight-semibold); }
.sc-kpi strong { font-size: var(--font-xl); font-weight: var(--weight-bold); line-height: 1.2; }
.sc-toolbar { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 10px; }
.sc-tabs { display: flex; flex-wrap: wrap; gap: 6px; padding: 5px; border: 1px solid var(--sc-line); border-radius: 12px; background: var(--sc-soft); }
.sc-tabs button { display: inline-flex; align-items: center; gap: 8px; min-height: 36px; padding: 6px 12px; border: 0; border-radius: 9px; background: transparent; color: #475467; font: inherit; font-size: var(--font-sm); font-weight: var(--weight-semibold); cursor: pointer; }
.sc-tabs button b { padding: 1px 7px; border-radius: 999px; background: #e2e8f0; color: #334155; font-size: var(--font-xs); }
.sc-tabs button.is-active { background: #fff; color: var(--sc-primary); box-shadow: 0 2px 6px rgba(15, 23, 42, .08); }
.sc-search { display: flex; gap: 6px; min-width: 260px; }
.sc-search .form-control { min-height: 40px; border-radius: 10px; font-size: var(--font-ui); }
.sc-table-wrap { overflow: auto; border: 1px solid var(--sc-line); border-radius: var(--sc-radius); background: #fff; }
.sc-table { width: 100%; border-collapse: collapse; font-size: var(--font-ui); }
.sc-table th { padding: 10px 12px; background: var(--sc-soft); color: #475467; font-size: var(--font-sm); font-weight: var(--weight-bold); text-align: start; white-space: nowrap; border-bottom: 1px solid var(--sc-line); }
.sc-table td { padding: 11px 12px; border-bottom: 1px solid var(--sc-line); text-align: start; vertical-align: middle; }
.sc-table tbody tr:last-child td { border-bottom: 0; }
.sc-table tbody tr { cursor: pointer; transition: background .15s; }
.sc-table tbody tr:hover td, .sc-table tbody tr:focus-visible td { background: #f8fbff; }
.sc-table td small { display: block; margin-top: 2px; color: var(--sc-muted); font-size: var(--font-xs); }
.sc-ref { color: var(--sc-primary); font-weight: var(--weight-semibold); text-decoration: none; }
.sc-cat { display: inline-flex; align-items: center; gap: 6px; }
.sc-cat i { color: var(--sc-primary); }
.sc-chip { display: inline-flex; align-items: center; padding: 3px 10px; border-radius: 999px; background: #eef2f7; color: #475467; font-size: var(--font-xs); font-weight: var(--weight-bold); white-space: nowrap; }
.sc-chip--info { background: #dbeafe; color: #1d4ed8; } .sc-chip--warning { background: #fef3c7; color: #a16207; } .sc-chip--success { background: #dcfce7; color: #15803d; } .sc-chip--danger { background: #ffe4e6; color: #be123c; } .sc-chip--muted { background: #eef2f7; color: #64748b; }
.sc-dot { display: inline-block; width: 9px; height: 9px; margin-inline-start: 6px; border-radius: 999px; background: #d97706; vertical-align: middle; }
.sc-pager { display: flex; justify-content: center; align-items: center; gap: 12px; color: var(--sc-muted); font-size: var(--font-sm); }
.sc-contact h2 { margin: 0 0 8px; font-size: var(--font-md); font-weight: var(--weight-bold); }
.sc-contact p { margin: 0 0 10px; color: var(--sc-muted); font-size: var(--font-sm); line-height: 1.6; }
.sc-contact__links { display: grid; gap: 6px; }
.sc-contact__links a { display: flex; align-items: center; gap: 10px; padding: 9px 12px; border: 1px solid var(--sc-line); border-radius: 10px; color: var(--sc-ink); font-size: var(--font-sm); font-weight: var(--weight-semibold); text-decoration: none; }
.sc-contact__links a:hover { background: var(--sc-soft); }
.sc-contact__links i { color: var(--sc-primary); }
.sc-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.sc-field { display: grid; gap: 5px; color: var(--sc-muted); font-size: var(--font-sm); font-weight: var(--weight-semibold); }
.sc-field.is-wide, .sc-form__actions { grid-column: 1 / -1; }
.sc-field .form-control, .sc-field .form-select { min-height: 42px; border-radius: 10px; font-size: var(--font-ui); color: var(--sc-ink); }
.sc-form__actions { display: flex; justify-content: flex-end; }
.sc-files { display: grid; gap: 8px; }
.sc-files__drop { display: flex; align-items: center; gap: 10px; padding: 12px 14px; border: 1px dashed #c7d2fe; border-radius: 10px; background: #f8fbff; color: var(--sc-primary); font-size: var(--font-sm); font-weight: var(--weight-semibold); cursor: pointer; }
.sc-files__drop input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.sc-files__list { display: grid; gap: 4px; margin: 0; padding: 0; list-style: none; }
.sc-files__list li { display: flex; align-items: center; gap: 8px; padding: 6px 10px; border: 1px solid var(--sc-line); border-radius: 8px; font-size: var(--font-sm); font-weight: var(--weight-medium); }
.sc-files__list small { color: var(--sc-muted); }
.sc-files__list button { margin-inline-start: auto; border: 0; background: none; color: #b91c1c; cursor: pointer; }
.sc-attachments { display: flex; flex-wrap: wrap; gap: 6px; margin: 10px 0 0; padding: 0; list-style: none; }
.sc-attachments a { display: inline-flex; align-items: center; gap: 6px; padding: 5px 10px; border: 1px solid var(--sc-line); border-radius: 8px; background: #fff; color: var(--sc-ink); font-size: var(--font-xs); font-weight: var(--weight-semibold); text-decoration: none; }
.sc-attachments a:hover { border-color: #c7d2fe; color: var(--sc-primary); }
.sc-attachments small { color: var(--sc-muted); }
.sc-thread { display: grid; gap: 12px; }
.sc-msg { max-width: 88%; padding: 14px 16px; border: 1px solid var(--sc-line); border-radius: 14px; background: #fff; }
.sc-msg.is-customer { justify-self: start; background: var(--sc-primary-soft); border-color: #cfe0fb; }
.sc-msg.is-support { justify-self: end; }
.sc-msg header { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 6px; font-size: var(--font-sm); }
.sc-msg header i { color: var(--sc-primary); }
.sc-msg header time { color: var(--sc-muted); font-size: var(--font-xs); }
.sc-msg p { margin: 0; font-size: var(--font-ui); line-height: 1.7; white-space: pre-wrap; overflow-wrap: anywhere; }
.sc-reply { display: grid; gap: 12px; }
.sc-notice { display: flex; gap: 12px; align-items: flex-start; padding: 14px 16px; border: 1px solid var(--sc-line); border-radius: var(--sc-radius); background: var(--sc-soft); }
.sc-notice--success { border-color: #bfe8cc; background: #effaf3; }
.sc-notice i { margin-top: 3px; color: var(--sc-primary); }
.sc-notice--success i { color: #15803d; }
.sc-notice strong { display: block; font-size: var(--font-ui); }
.sc-notice p { margin: 4px 0; font-size: var(--font-sm); }
.sc-notice small { color: var(--sc-muted); font-size: var(--font-xs); }
.sc-empty, .sc-loading { display: grid; justify-items: center; gap: 8px; padding: 36px 16px; border: 1px solid var(--sc-line); border-radius: var(--sc-radius); background: #fff; color: var(--sc-muted); text-align: center; font-size: var(--font-ui); }
.sc-empty i, .sc-loading i { font-size: 1.6rem; color: #98a2b3; }
.sc-empty p { margin: 0; }
.sc-error { display: flex; align-items: center; gap: 10px; padding: 14px 16px; border: 1px solid #f8c7c7; border-radius: var(--sc-radius); background: #fff5f5; color: #b91c1c; }
@media (max-width: 1100px) { .sc-layout { grid-template-columns: 1fr; } .sc-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) {
    .support-center { gap: 14px; }
    .sc-head h1 { font-size: var(--font-xl); }
    .sc-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .sc-kpi { padding: 12px; }
    .sc-form { grid-template-columns: 1fr; }
    .sc-search { min-width: 0; width: 100%; }
    .sc-msg { max-width: 100%; }
    .sc-table thead { display: none; }
    .sc-table tr { display: grid; gap: 4px; padding: 10px 12px; border-bottom: 1px solid var(--sc-line); }
    .sc-table td { display: flex; justify-content: space-between; gap: 12px; padding: 2px 0; border: 0; }
    .sc-table td::before { content: attr(data-label); flex: 0 0 auto; color: var(--sc-muted); font-size: var(--font-xs); font-weight: var(--weight-semibold); }
}

/* unified-list-pages.css */
/* Unified list-page layout: limited to routes initialized by unified_list_pages.js. */
#app-content.acc-list-page {
    width: 100%;
    max-width: none;
    margin: 0;
    overflow: visible;
}

#app-content.acc-list-page > * {
    width: 100%;
    max-width: none !important;
}

.acc-list-header {
    width: 100%;
    display: flex !important;
    align-items: flex-start !important;
    justify-content: space-between !important;
    gap: 18px;
    margin: 0 0 18px !important;
    padding: 17px 19px !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 10px !important;
    background: #fff !important;
    box-shadow: 0 2px 8px rgba(15, 23, 42, .035) !important;
    text-align: right !important;
}

.acc-list-header h2,
.acc-list-header h3 {
    margin: 0 0 4px !important;
    color: #172033 !important;
    font-size: var(--font-xl) !important;
    font-weight: 700 !important;
}

.acc-list-header p {
    margin: 0 !important;
    color: #64748b !important;
    font-size: var(--font-base);
}

.acc-list-header-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 8px;
    flex: 0 0 auto;
}

.acc-list-header-actions .btn {
    margin: 0 !important;
}

.acc-actions-dropdown,
.acc-row-actions {
    position: relative;
}

.acc-actions-trigger {
    min-width: 108px !important;
    min-height: 38px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 8px !important;
    padding: 7px 13px !important;
    border: 1px solid #dce3eb !important;
    border-radius: 8px !important;
    background: #fff !important;
    color: #263449 !important;
    box-shadow: 0 1px 2px rgba(15, 23, 42, .04) !important;
    font-size: var(--font-ui) !important;
    font-weight: 700 !important;
    letter-spacing: 0 !important;
    white-space: nowrap;
}

.acc-actions-trigger:hover,
.acc-actions-trigger[aria-expanded="true"] {
    border-color: #9db9f5 !important;
    background: #f8faff !important;
    color: #2463eb !important;
}

.acc-actions-trigger .fa-ellipsis-h {
    color: #64748b;
    font-size: 12px;
}

.acc-actions-trigger .fa-chevron-down {
    color: #94a3b8;
    font-size: 9px;
}

.acc-actions-menu,
.acc-list-page .ctx-dropdown,
.acc-list-page .dropdown-menu {
    min-width: 190px !important;
    padding: 6px !important;
    border: 1px solid #e1e7ef !important;
    border-radius: 10px !important;
    background: #fff !important;
    box-shadow: 0 12px 28px rgba(15, 23, 42, .14) !important;
    text-align: right !important;
    direction: rtl;
    z-index: 1060 !important;
}

.acc-list-page .ctx-dropdown {
    left: 0 !important;
    right: auto !important;
    top: calc(100% + 6px) !important;
    margin-top: 0 !important;
}

.acc-actions-menu .dropdown-item,
.acc-list-page .ctx-item,
.acc-list-page .dropdown-item {
    width: 100%;
    min-height: 36px;
    display: flex !important;
    align-items: center;
    gap: 9px;
    padding: 8px 10px !important;
    border: 0 !important;
    border-radius: 7px !important;
    background: transparent !important;
    color: #334155 !important;
    font-weight:600;font-size:var(--font-ui)!important;
    text-align: right !important;
    text-decoration: none;
}

.acc-actions-menu .dropdown-item:hover,
.acc-list-page .ctx-item:hover,
.acc-list-page .dropdown-item:hover {
    background: #f2f6fd !important;
    color: #1d4ed8 !important;
}

.acc-actions-menu .dropdown-item.text-danger,
.acc-list-page .ctx-item.text-danger,
.acc-list-page .dropdown-item.text-danger {
    color: #be123c !important;
}

.acc-actions-empty {
    display: block;
    padding: 9px 10px;
    color: #94a3b8;
    font-size: var(--font-sm);
    white-space: nowrap;
}

/* Full-width results without an internal vertical or horizontal scrolling box on desktop. */
.acc-list-page .card,
.acc-list-page .table-responsive,
.acc-list-page [id$="-list-table"],
.acc-list-page [id$="s-list-table"] {
    width: 100%;
    max-width: none !important;
}

.acc-list-page .table-responsive {
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
}

.acc-list-page table.table {
    width: 100% !important;
    max-width: 100%;
    table-layout: auto;
}

.acc-list-page table.table th,
.acc-list-page table.table td {
    padding: 12px 11px;
    font-size: var(--font-ui);
    white-space: normal;
    overflow-wrap: anywhere;
}

.acc-list-page .row {
    width: auto;
}

.acc-list-page .card > .table-responsive:first-child:last-child {
    margin: 0;
}

.acc-list-page .pagination {
    flex-wrap: wrap;
}

@media (max-width: 900px) {
    .acc-list-header {
        flex-direction: column;
        align-items: stretch !important;
    }

    .acc-list-header-actions {
        width: 100%;
        justify-content: flex-start;
    }

    .acc-list-page .table-responsive {
        overflow-x: auto !important;
        overflow-y: visible !important;
    }
}

@media (max-width: 560px) {
    .acc-list-header-actions > .btn,
    .acc-list-header-actions > a.btn,
    .acc-actions-dropdown,
    .acc-actions-trigger {
        width: 100%;
    }
}

/* products.css */
.products-page {
    color: var(--text-main);
    padding-bottom: 32px;
}

/* Product import workflow */
.product-import-overlay{position:fixed;inset:0;z-index:1085;background:rgba(15,23,42,.46);backdrop-filter:blur(3px);display:flex;align-items:center;justify-content:center;padding:24px;opacity:0;transition:opacity .2s ease}.product-import-overlay.show{opacity:1}.product-import-dialog{width:min(1180px,100%);max-height:calc(100vh - 48px);background:#f8fafc;border:1px solid #dbe5f1;border-radius:18px;box-shadow:0 24px 70px rgba(15,42,78,.2);overflow:hidden;display:flex;flex-direction:column;color:#14213d}.product-import-header{background:#fff;border-bottom:1px solid #e2e8f0;padding:20px 24px;display:flex;align-items:center;justify-content:space-between}.product-import-title{display:flex;align-items:center;gap:13px}.product-import-title>span{width:44px;height:44px;border-radius:12px;background:#eaf2ff;color:#185adb;display:grid;place-items:center;font-size:var(--font-lg)}.product-import-title h3{font-size:var(--font-xl);margin:0 0 4px;font-weight:700}.product-import-title p{margin:0;color:#64748b;font-size:var(--font-sm)}.product-import-close{width:38px;height:38px;border:1px solid #e2e8f0;border-radius:10px;background:#fff;color:#64748b}.product-import-close:hover{background:#f1f5f9;color:#0f172a}.product-import-steps{background:#fff;padding:14px 24px;border-bottom:1px solid #e2e8f0;display:flex;align-items:center;justify-content:center}.product-import-steps span{display:flex;align-items:center;gap:8px;color:#94a3b8;font-size:var(--font-sm);font-weight:700;white-space:nowrap}.product-import-steps span b{width:27px;height:27px;border-radius:50%;display:grid;place-items:center;background:#eef2f7;color:#64748b}.product-import-steps span.active{color:#185adb}.product-import-steps span.active b{background:#185adb;color:#fff;box-shadow:0 0 0 4px #eaf2ff}.product-import-steps span.done{color:#168451}.product-import-steps span.done b{background:#dcfce7;color:#168451}.product-import-steps>i{height:1px;width:90px;background:#dbe5f1;margin:0 16px}#product-import-content{overflow:auto;min-height:0;padding:22px}.product-import-start{display:grid;gap:16px}.product-import-template-card,.product-import-upload-card{background:#fff;border:1px solid #dbe5f1;border-radius:14px;padding:20px}.product-import-template-card{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:16px}.product-import-card-icon{width:50px;height:50px;border-radius:13px;background:#eafbf2;color:#159457;display:grid;place-items:center;font-size:24px}.product-import-template-card h4,.product-import-upload-card h4,.product-import-preview h4{font-size:var(--font-md);font-weight:700;margin:0 0 6px}.product-import-template-card p,.product-import-upload-card p{font-size:var(--font-sm);color:#64748b;margin:0}.product-import-sheet-tags{display:flex;gap:7px;margin-top:11px;flex-wrap:wrap}.product-import-sheet-tags span{font-size:var(--font-xs);border:1px solid #dbe5f1;border-radius:999px;background:#f8fafc;padding:4px 8px;color:#475569}.product-import-upload-card{display:grid;grid-template-columns:minmax(250px,.8fr) minmax(350px,1.2fr);gap:20px;align-items:start}.product-import-mode-options{display:grid;gap:9px;margin-top:15px}.product-import-mode-options label{display:flex;align-items:flex-start;gap:10px;border:1px solid #dbe5f1;border-radius:11px;padding:11px;cursor:pointer}.product-import-mode-options label:has(input:checked){border-color:#80aaff;background:#f4f8ff}.product-import-mode-options label.disabled{opacity:.55;cursor:not-allowed}.product-import-mode-options input{margin-top:4px;accent-color:#185adb}.product-import-mode-options span{display:grid;gap:2px}.product-import-mode-options strong{font-size:var(--font-ui)}.product-import-mode-options small{font-size:var(--font-xs);color:#64748b}.product-import-dropzone{min-height:170px;border:1.5px dashed #9db5d6;border-radius:13px;background:#f8fbff;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:7px;padding:22px;cursor:pointer;transition:.2s}.product-import-dropzone:hover,.product-import-dropzone.has-file{border-color:#185adb;background:#f1f6ff}.product-import-dropzone input{position:absolute;width:1px;height:1px;opacity:0}.product-import-dropzone:focus-within{outline:2px solid #185adb;outline-offset:2px}.product-import-dropzone>span{width:44px;height:44px;border-radius:12px;background:#e7efff;color:#185adb;display:grid;place-items:center;font-size:var(--font-lg)}.product-import-dropzone strong{font-size:var(--font-ui)}.product-import-dropzone small{font-size:var(--font-xs);color:#64748b}.product-import-dropzone em{font-style:normal;font-size:var(--font-xs);color:#185adb;font-weight:700}.product-import-primary{grid-column:2;width:100%;height:42px}.product-import-inline-error[hidden]{display:none}.product-import-inline-error{grid-column:1/-1;border:1px solid #fecaca;background:#fff1f2;color:#b91c1c;border-radius:10px;padding:10px 12px;display:flex;gap:8px;font-size:var(--font-sm)}.product-import-info{border:1px solid #cfe0ff;background:#eff6ff;border-radius:12px;padding:12px 15px;display:flex;align-items:center;gap:11px;color:#1e4e9e}.product-import-info>i{font-size:18px}.product-import-info div{display:grid;gap:2px}.product-import-info strong{font-size:var(--font-sm)}.product-import-info span{font-size:var(--font-xs);color:#4d6b99}.product-import-preview{display:grid;gap:15px}.product-import-preview-head{display:flex;align-items:center;justify-content:space-between}.product-import-preview-head p{margin:0;color:#64748b;font-size:var(--font-sm)}.product-import-kpis{display:grid;grid-template-columns:repeat(5,minmax(100px,1fr));gap:9px}.product-import-kpis article{background:#fff;border:1px solid #dbe5f1;border-radius:11px;padding:11px;display:flex;align-items:center;gap:9px;min-width:0}.product-import-kpis article>span{width:31px;height:31px;border-radius:9px;background:#eef4ff;color:#185adb;display:grid;place-items:center}.product-import-kpis article div{display:grid;min-width:0}.product-import-kpis small{font-size:var(--font-xs);color:#64748b;white-space:nowrap}.product-import-kpis strong{font-size:var(--font-2xl);font-variant-numeric:tabular-nums}.product-import-kpis .tone-green>span{background:#eafbf2;color:#159457}.product-import-kpis .tone-red>span{background:#fff0f1;color:#d72d3f}.product-import-kpis .tone-orange>span{background:#fff6e8;color:#e17a0b}.product-import-kpis .tone-purple>span{background:#f3edff;color:#7b4ed8}.product-import-blocked,.product-import-ready{border-radius:11px;padding:12px 14px;display:flex;align-items:center;gap:11px}.product-import-blocked{border:1px solid #fecaca;background:#fff1f2;color:#b91c1c}.product-import-ready{border:1px solid #bbf7d0;background:#f0fdf4;color:#168451}.product-import-blocked>i,.product-import-ready>i{font-size:20px}.product-import-blocked div,.product-import-ready div{display:grid;gap:2px}.product-import-blocked strong,.product-import-ready strong{font-size:var(--font-sm)}.product-import-blocked span,.product-import-ready span{font-size:var(--font-xs)}.product-import-preview-tools{display:flex;align-items:center;justify-content:space-between;gap:12px}.product-import-filters{display:flex;border:1px solid #dbe5f1;background:#fff;border-radius:9px;padding:3px}.product-import-filters button{border:0;background:transparent;border-radius:7px;padding:6px 13px;color:#64748b;font-size:var(--font-ui)}.product-import-filters button.active{background:#185adb;color:#fff}.product-import-preview-tools label{position:relative;width:min(320px,100%)}.product-import-preview-tools label i{position:absolute;inset-inline-start:11px;top:11px;color:#94a3b8}.product-import-preview-tools input{width:100%;height:36px;border:1px solid #dbe5f1;border-radius:9px;padding-block:0;padding-inline:34px 10px;font-size:var(--font-ui)}.product-import-table-wrap{background:#fff;border:1px solid #dbe5f1;border-radius:12px;overflow:auto;max-height:360px}.product-import-table{width:100%;border-collapse:collapse;min-width:820px;font-size:var(--font-ui)}.product-import-table th{position:sticky;top:0;z-index:1;background:#f1f5f9;color:#334155;padding:10px;border-bottom:1px solid #dbe5f1;font-weight:700;text-align:start}.product-import-table td{padding:9px 10px;border-bottom:1px solid #edf1f6;vertical-align:top}.product-import-sheet{display:inline-flex;border-radius:6px;background:#eef4ff;color:#2458a8;padding:4px 7px;font-size:var(--font-xs);font-weight:700}.product-import-status{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:4px 8px;font-size:var(--font-xs);font-weight:700}.product-import-status i{width:6px;height:6px;border-radius:50%}.product-import-status.valid{background:#eafbf2;color:#168451}.product-import-status.valid i{background:#22a866}.product-import-status.warning{background:#fff6e8;color:#b76108}.product-import-status.warning i{background:#f59e0b}.product-import-status.error{background:#fff0f1;color:#b91c1c}.product-import-status.error i{background:#ef4455}.product-import-message{margin-bottom:3px;line-height:1.5}.product-import-message.error{color:#b91c1c}.product-import-message.warning{color:#b76108}.product-import-no-message{color:#7a8aa0}.product-import-empty{text-align:center;color:#7a8aa0;padding:30px}.product-import-truncated{font-size:var(--font-xs);color:#64748b;margin:0}.product-import-preview-footer{display:flex;justify-content:flex-end;gap:9px;border-top:1px solid #e2e8f0;padding-top:14px}.product-import-preview-footer .btn{min-width:140px}.product-import-result{text-align:center;background:#fff;border:1px solid #dbe5f1;border-radius:15px;padding:34px;display:grid;justify-items:center}.product-import-success-icon{width:66px;height:66px;border-radius:50%;background:#dcfce7;color:#168451;display:grid;place-items:center;font-size:28px;box-shadow:0 0 0 8px #f0fdf4}.product-import-result h4{font-size:var(--font-xl);margin:18px 0 5px}.product-import-result>p{font-size:var(--font-sm);color:#64748b;margin:0}.product-import-result-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;width:100%;margin:24px 0}.product-import-result-grid article{border:1px solid #dbe5f1;background:#f8fafc;border-radius:11px;padding:15px;display:grid;gap:4px}.product-import-result-grid strong{font-size:var(--font-xl);color:#185adb}.product-import-result-grid span{font-size:var(--font-xs);color:#64748b}.product-import-result-actions{display:flex;gap:10px}.product-import-overlay.is-busy .product-import-close{pointer-events:none;opacity:.45}
.product-import-format-choice{display:grid;grid-template-columns:1fr;gap:12px}.product-import-format-card{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:15px;padding:20px;border:1px solid #dbe5f1;border-radius:14px;background:#fff;cursor:pointer;position:relative;transition:border-color .16s ease,box-shadow .16s ease,transform .16s ease}.product-import-format-card:hover{transform:translateY(-1px);border-color:#aac2e8}.product-import-format-card.active{border-color:#6d9cf3;box-shadow:0 0 0 3px rgba(24,90,219,.08)}.product-import-format-card.recommended{background:linear-gradient(135deg,#fff,#f8fbff)}.product-import-format-card em{display:inline-flex;margin-bottom:5px;border-radius:999px;background:#e8f1ff;color:#185adb;padding:3px 8px;font-size:var(--font-xs);font-style:normal;font-weight:700}.product-import-format-card h4{font-size:var(--font-base);font-weight:700;margin:0 0 5px}.product-import-format-card p{font-size:var(--font-sm);color:#64748b;margin:0;line-height:1.7}.product-import-card-icon.is-excel{background:#eef4ff;color:#185adb}.product-import-message{display:flex;align-items:flex-start;flex-wrap:wrap;gap:4px 7px}.product-import-message code{direction:auto;border:1px solid #fecaca;border-radius:5px;background:#fff;padding:1px 5px;color:inherit;font-weight:700;font-size:var(--font-xs)}.product-import-message span{flex:1 1 210px}.product-import-preview>.product-import-inline-error{grid-column:auto}
@media(max-width:1100px){.product-import-kpis{grid-template-columns:repeat(4,1fr)}.product-import-format-choice{grid-template-columns:1fr}.product-import-format-card{grid-template-columns:auto 1fr auto}}
@media(max-width:760px){.product-import-overlay{padding:0}.product-import-dialog{height:100vh;max-height:none;border-radius:0}.product-import-header{padding:15px}.product-import-title p{display:none}.product-import-steps{padding:11px}.product-import-steps>i{width:18px;margin:0 5px}.product-import-steps span{font-size:0}.product-import-steps span b{font-size:var(--font-sm)}#product-import-content{padding:14px}.product-import-format-card,.product-import-template-card{grid-template-columns:auto 1fr}.product-import-format-card .btn,.product-import-template-card .btn{grid-column:1/-1;width:100%}.product-import-upload-card{grid-template-columns:1fr}.product-import-primary,.product-import-inline-error{grid-column:1}.product-import-kpis{grid-template-columns:repeat(2,1fr)}.product-import-preview-tools{align-items:stretch;flex-direction:column}.product-import-preview-tools label{width:100%}.product-import-filters{overflow:auto}.product-import-preview-head{align-items:flex-start;gap:10px}.product-import-result{padding:24px 14px}.product-import-result-grid{grid-template-columns:repeat(2,1fr)}.product-import-result-actions{width:100%;flex-direction:column}.product-import-result-actions .btn{width:100%}}

.products-page button,
.products-page input,
.products-page select {
    font-family: inherit;
}

.products-page__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 18px;
}

.products-page__eyebrow {
    display: flex;
    align-items: center;
    gap: 7px;
    color: var(--primary);
    font-size: var(--font-xs);
    font-weight: 700;
    margin-bottom: 4px;
}

.products-page__title {
    color: #0f172a;
    font-size: var(--font-2xl);
    font-weight: 700;
    letter-spacing: -.35px;
    margin: 0;
}

.products-page__subtitle {
    color: var(--text-muted);
    font-size: var(--font-sm);
    margin: 5px 0 0;
}

.products-page__actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.products-action-btn {
    align-items: center;
    border-radius: 8px;
    display: inline-flex;
    font-size: var(--font-ui);
    font-weight: 700;
    gap: 8px;
    min-height: 39px;
    padding: 8px 14px;
}

.products-action-btn--primary {
    box-shadow: 0 5px 13px rgb(37 99 235 / 18%);
}

.products-tabs {
    align-items: center;
    background: var(--bg-surface);
    border: 1px solid var(--border-color);
    border-radius: 10px;
    display: flex;
    gap: 3px;
    margin-bottom: 14px;
    overflow-x: auto;
    padding: 5px;
    scrollbar-width: thin;
}

.products-tab {
    align-items: center;
    background: transparent;
    border: 0;
    border-radius: 7px;
    color: #64748b;
    display: inline-flex;
    flex: 0 0 auto;
    font-size: var(--font-ui);
    font-weight: 700;
    gap: 7px;
    min-height: 37px;
    padding: 7px 13px;
}

.products-tab b {
    background: #f1f5f9;
    border-radius: 999px;
    color: #64748b;
    font-size: var(--font-xs);
    min-width: 24px;
    padding: 3px 6px;
    text-align: center;
}

.products-tab:hover {
    background: #f8fafc;
    color: #334155;
}

.products-tab.active {
    background: var(--primary-light);
    color: var(--primary);
}

.products-tab.active b {
    background: #dbeafe;
    color: #1d4ed8;
}

.products-metrics {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin-bottom: 14px;
}

.products-metric {
    align-items: center;
    background: #fff;
    border: 1px solid var(--border-color);
    border-radius: 10px;
    color: var(--text-main);
    display: grid;
    gap: 10px;
    grid-template-columns: 38px 1fr 14px;
    min-height: 76px;
    padding: 12px 14px;
    text-align: right;
}

.products-metric:hover,
.products-metric.active {
    border-color: #bfdbfe;
    box-shadow: var(--shadow-sm);
    transform: translateY(-1px);
}

.products-metric__icon {
    align-items: center;
    background: var(--primary-light);
    border-radius: 9px;
    color: var(--primary);
    display: inline-flex;
    height: 38px;
    justify-content: center;
    width: 38px;
}

.products-metric small {
    color: var(--text-muted);
    display: block;
    font-size: var(--font-sm);
    font-weight: 600;
    margin-bottom: 2px;
}

.products-metric strong {
    color: #0f172a;
    display: block;
    font-size: var(--font-2xl);
    line-height: 1.1;
}

.products-metric__arrow {
    color: #cbd5e1;
    font-size: var(--font-xs);
}

.products-metric--danger .products-metric__icon { background: #fef2f2; color: #dc2626; }
.products-metric--warning .products-metric__icon { background: #fffbeb; color: #d97706; }
.products-metric--muted .products-metric__icon { background: #f1f5f9; color: #64748b; }

.products-filter-card,
.products-table-card {
    background: #fff;
    border: 1px solid var(--border-color);
    border-radius: 10px;
    box-shadow: var(--shadow-sm);
}

.products-filter-card {
    margin-bottom: 12px;
    padding: 12px;
}

.products-filter-card__main {
    align-items: flex-end;
    display: grid;
    gap: 9px;
    grid-template-columns: minmax(270px, 1fr) minmax(170px, 220px) auto auto;
}

.products-search {
    align-items: center;
    background: #fff;
    border: 1px solid #cbd5e1;
    border-radius: 8px;
    display: flex;
    height: 39px;
    padding: 0 11px;
}

.products-search:focus-within {
    border-color: var(--primary);
    box-shadow: 0 0 0 3px rgb(37 99 235 / 10%);
}

.products-search > i {
    color: #94a3b8;
    margin-left: 9px;
}

.products-search input {
    border: 0;
    color: var(--text-main);
    flex: 1;
    font-size: var(--font-ui);
    min-width: 0;
    outline: 0;
}

.products-search input::placeholder { color: #94a3b8; }

.products-filter-field label,
.products-rows-control label {
    color: #64748b;
    display: block;
    font-size: var(--font-ui);
    font-weight: 700;
    margin-bottom: 3px;
}

.products-filter-field select,
.products-rows-control select {
    border-color: #cbd5e1;
    border-radius: 8px;
    font-size: var(--font-ui);
    min-height: 39px;
}

.products-filter-toggle {
    border-radius: 8px;
    font-size: var(--font-sm);
    font-weight: 700;
    min-height: 39px;
    white-space: nowrap;
}

.products-clear-btn {
    color: #64748b;
    font-size: var(--font-ui);
    min-height: 39px;
    text-decoration: none;
    white-space: nowrap;
}

.products-filter-card__advanced {
    align-items: flex-end;
    border-top: 1px solid #f1f5f9;
    display: grid;
    gap: 9px;
    grid-template-columns: 180px 150px 165px 1fr;
    margin-top: 11px;
    padding-top: 11px;
}

.products-filter-card__advanced.collapsed { display: none; }

.products-quick-filters {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    min-height: 39px;
}

.products-quick-filters > span {
    color: #64748b;
    font-size: var(--font-xs);
    font-weight: 700;
}

.products-quick-filters button {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 999px;
    color: #475569;
    font-size: var(--font-ui);
    font-weight: 700;
    padding: 5px 9px;
}

.products-quick-filters button:hover,
.products-quick-filters button.active {
    background: var(--primary-light);
    border-color: #bfdbfe;
    color: var(--primary);
}

.products-bulk-toolbar {
    align-items: center;
    background: #eff6ff;
    border: 1px solid #bfdbfe;
    border-radius: 9px;
    color: #1e3a8a;
    display: flex;
    gap: 9px;
    margin-bottom: 10px;
    min-height: 50px;
    padding: 8px 12px;
}

.products-bulk-toolbar select { max-width: 190px; }

.products-table-card { overflow: visible; }

.products-table-card__head {
    align-items: center;
    border-bottom: 1px solid var(--border-color);
    display: flex;
    justify-content: space-between;
    min-height: 58px;
    padding: 10px 14px;
}

.products-table-card__head strong {
    color: #0f172a;
    display: block;
    font-size: var(--font-base);
}

.products-table-card__head span {
    color: var(--text-muted);
    display: block;
    font-size: var(--font-xs);
    margin-top: 2px;
}

.products-rows-control {
    align-items: center;
    display: flex;
    gap: 8px;
}

.products-rows-control label { margin: 0; white-space: nowrap; }
.products-rows-control select { min-height: 32px; width: 72px; }

.products-table-wrap { min-height: 280px; }

.products-table {
    border-collapse: separate;
    border-spacing: 0;
    font-size: var(--font-ui);
    min-width: 1040px;
}

.products-table thead th {
    background: #f8fafc;
    border-bottom: 1px solid var(--border-color);
    color: #64748b;
    font-size: var(--font-ui);
    font-weight: 700;
    height: 42px;
    letter-spacing: .02em;
    padding: 9px 11px;
    position: sticky;
    text-align: right;
    top: 0;
    white-space: nowrap;
    z-index: 2;
}

.products-table thead th.products-sortable { cursor: pointer; user-select: none; }
.products-table thead th.products-sortable:hover { color: var(--primary); }
.products-table thead th .sort-icon { color: #cbd5e1; font-size: var(--font-ui); margin-right: 4px; }
.products-table thead th.sorted .sort-icon { color: var(--primary); }

.products-table tbody td {
    border-bottom: 1px solid #f1f5f9;
    color: #334155;
    padding: 10px 11px;
    text-align: right;
    vertical-align: middle;
    white-space: nowrap;
}

.products-table tbody tr:hover { background: #f8fbff; }
.products-table tbody tr.selected { background: #eff6ff; }

.product-cell {
    align-items: center;
    display: flex;
    gap: 10px;
    min-width: 235px;
    white-space: normal;
}

.product-cell__avatar {
    align-items: center;
    background: #eff6ff;
    border: 1px solid #dbeafe;
    border-radius: 9px;
    color: var(--primary);
    display: inline-flex;
    flex: 0 0 38px;
    height: 38px;
    justify-content: center;
    overflow: hidden;
    width: 38px;
}

.product-cell__avatar img { height: 100%; object-fit: cover; width: 100%; }
.product-cell__avatar.bundle { background: #f0fdf4; border-color: #dcfce7; color: #059669; }
.product-cell__avatar.service { background: #fff7ed; border-color: #ffedd5; color: #ea580c; }

.product-cell__name {
    background: transparent;
    border: 0;
    color: #0f172a;
    display: block;
    font-size: var(--font-sm);
    font-weight: 700;
    max-width: 230px;
    overflow: hidden;
    padding: 0;
    text-align: right;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.product-cell__name:hover { color: var(--primary); }
.product-cell__meta { color: #94a3b8; font-size: var(--font-xs); margin-top: 3px; }

.product-type-badge,
.product-status-badge,
.product-stock-badge {
    align-items: center;
    border-radius: 999px;
    display: inline-flex;
    font-size: var(--font-xs);
    font-weight: 700;
    gap: 5px;
    padding: 4px 8px;
}

.product-type-badge.raw_material { background: #fff7ed; color: #c2410c; }
.product-type-badge.finished_product { background: #eff6ff; color: #1d4ed8; }
.product-type-badge.bundle { background: #f0fdf4; color: #047857; }
.product-type-badge.service { background: #faf5ff; color: #7e22ce; }
.product-type-badge.other { background: #f1f5f9; color: #475569; }

.product-status-badge.active { background: #ecfdf5; color: #047857; }
.product-status-badge.inactive { background: #f1f5f9; color: #64748b; }
.product-stock-badge.available { background: #ecfdf5; color: #047857; }
.product-stock-badge.low { background: #fffbeb; color: #b45309; }
.product-stock-badge.out { background: #fef2f2; color: #b91c1c; }
.product-stock-badge.not_applicable,
.product-stock-badge.not_tracked { background: #f8fafc; color: #94a3b8; }

.product-money { color: #0f172a; direction: ltr; display: inline-block; font-weight: 700; }
.product-money.sale { color: #047857; }
.product-margin.positive { color: #047857; }
.product-margin.negative { color: #b91c1c; }

.product-code {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 6px;
    color: #475569;
    direction: ltr;
    display: inline-block;
    font-family:var(--font-family-mono);
    font-size: var(--font-xs);
    padding: 3px 6px;
}

.product-alerts { display: flex; gap: 4px; margin-top: 4px; }
.product-alert-dot { border-radius: 50%; display: inline-block; height: 5px; width: 5px; }
.product-alert-dot.warning { background: #f59e0b; }
.product-alert-dot.danger { background: #ef4444; }
.product-alert-dot.muted { background: #94a3b8; }

.product-row-actions .btn {
    align-items: center;
    border-color: #e2e8f0;
    border-radius: 7px;
    color: #64748b;
    display: inline-flex;
    height: 31px;
    justify-content: center;
    padding: 0;
    width: 34px;
}

.product-row-actions .dropdown-menu { border: 1px solid #e2e8f0; border-radius: 9px; font-size: var(--font-ui); min-width: 175px; padding: 5px; }
.product-row-actions .dropdown-item { border-radius: 6px; padding: 7px 9px; }

.products-loading-cell,
.products-empty-cell {
    color: #64748b !important;
    height: 240px;
    text-align: center !important;
}

.products-empty-state i { color: #cbd5e1; font-size: 30px; margin-bottom: 10px; }
.products-empty-state strong { color: #334155; display: block; font-size: var(--font-base); }
.products-empty-state span { display: block; font-size: var(--font-sm); margin-top: 4px; }

.products-pagination {
    align-items: center;
    display: flex;
    justify-content: space-between;
    min-height: 57px;
    padding: 9px 14px;
}

.products-pagination__info { color: #64748b; font-size: var(--font-sm); }
.products-pagination__buttons { display: flex; gap: 4px; }
.products-pagination__buttons button { border-radius: 6px; font-size: var(--font-ui); min-width: 32px; }

.products-columns-modal { border: 0; border-radius: 12px; }
.products-columns-modal .modal-header small { color: #64748b; font-size: var(--font-xs); }
.products-columns-list { display: flex; flex-direction: column; gap: 6px; }

.products-column-item {
    align-items: center;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    cursor: grab;
    display: grid;
    gap: 10px;
    grid-template-columns: 22px 1fr auto;
    min-height: 45px;
    padding: 8px 10px;
}

.products-column-item.dragging { opacity: .45; }
.products-column-item.fixed { background: #f8fafc; cursor: default; }
.products-column-item .drag-handle { color: #94a3b8; }
.products-column-item label { color: #334155; font-size: var(--font-ui); font-weight: 700; margin: 0; }
.products-column-item small { color: #94a3b8; display: block; font-size: var(--font-xs); }

@media (max-width: 1199.98px) {
    .products-filter-card__main { grid-template-columns: minmax(230px, 1fr) minmax(150px, 190px) auto; }
    .products-clear-btn { grid-column: 3; }
    .products-filter-card__advanced { grid-template-columns: repeat(3, 1fr); }
    .products-quick-filters { grid-column: 1 / -1; }
}

@media (max-width: 991.98px) {
    .products-page__header { align-items: stretch; flex-direction: column; }
    .products-page__actions { justify-content: flex-start; }
    .products-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .products-filter-card__main { grid-template-columns: 1fr 1fr; }
    .products-search { grid-column: 1 / -1; }
    .products-clear-btn { grid-column: auto; }
    .products-filter-card__advanced { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 767.98px) {
    .products-page__title { font-size: var(--font-xl); }
    .products-page__actions .products-action-btn span { display: none; }
    .products-action-btn { justify-content: center; min-width: 40px; padding: 8px 11px; }
    .products-metrics { grid-template-columns: 1fr 1fr; }
    .products-metric { grid-template-columns: 34px 1fr; min-height: 68px; padding: 10px; }
    .products-metric__icon { height: 34px; width: 34px; }
    .products-metric__arrow { display: none; }
    .products-metric strong { font-size: var(--font-2xl); }
    .products-filter-card__main,
    .products-filter-card__advanced { grid-template-columns: 1fr; }
    .products-search,
    .products-quick-filters { grid-column: auto; }
    .products-filter-field--branch { display: block; }
    .products-bulk-toolbar { align-items: stretch; flex-direction: column; }
    .products-bulk-toolbar select { max-width: none; }
    .products-table-card__head { align-items: flex-start; gap: 8px; }
    .products-pagination { align-items: stretch; flex-direction: column; gap: 9px; }
    .products-pagination__buttons { justify-content: center; }
}

@media (max-width: 479.98px) {
    .products-metrics { grid-template-columns: 1fr; }
    .products-page__actions { width: 100%; }
    .products-tabs { margin-left: -8px; margin-right: -8px; border-radius: 0; }
}

/* Product information -> stock movement full-page workspace */
body.product-details-open { overflow: hidden; }

.product-details-overlay {
    --pdm-purple: #6754e8;
    --pdm-purple-dark: #5140c9;
    --pdm-purple-soft: #f1efff;
    --pdm-border: #e8e9f1;
    --pdm-muted: #7b8194;
    background: #f8f8fb;
    color: #202437;
    inset: 0;
    overflow: auto;
    position: fixed;
    z-index: 1085;
}

.pdm-shell { min-height: 100dvh; }

.pdm-topbar {
    align-items: center;
    background: rgb(255 255 255 / 96%);
    border-bottom: 1px solid var(--pdm-border);
    display: flex;
    justify-content: space-between;
    min-height: 72px;
    padding: 12px clamp(18px, 4vw, 54px);
    position: sticky;
    top: 0;
    z-index: 12;
}

.pdm-title-block { align-items: center; display: flex; gap: 14px; }
.pdm-title-block h1 { color: #111528; font-size: var(--font-2xl); font-weight: 850; margin: 3px 0 0; }
.pdm-breadcrumb { align-items: center; color: #9297a8; display: flex; font-size: var(--font-xs); font-weight: 650; gap: 8px; }
.pdm-breadcrumb strong { color: var(--pdm-purple); }
.pdm-breadcrumb i { font-size: 7px; }
.pdm-eyebrow { color: var(--pdm-purple); font-size: var(--font-xs); font-weight: 700; }

.pdm-back-btn,
.pdm-icon-btn {
    align-items: center;
    background: transparent;
    border: 0;
    border-radius: 9px;
    color: #202437;
    display: inline-flex;
    height: 38px;
    justify-content: center;
    width: 38px;
}

.pdm-back-btn:hover,
.pdm-icon-btn:hover { background: var(--pdm-purple-soft); color: var(--pdm-purple); }

.pdm-actions { align-items: center; display: flex; gap: 8px; }
.pdm-action {
    align-items: center;
    background: #fff;
    border: 1px solid #d9d8ef;
    border-radius: 7px;
    color: #5445b9;
    cursor: pointer;
    display: inline-flex;
    font-size: var(--font-ui);
    font-weight: 700;
    gap: 7px;
    min-height: 36px;
    padding: 7px 13px;
    white-space: nowrap;
}

.pdm-action:hover { background: #f8f7ff; border-color: #b9b2ef; }
.pdm-action-primary { background: var(--pdm-purple); border-color: var(--pdm-purple); box-shadow: 0 5px 12px rgb(103 84 232 / 20%); color: #fff; }
.pdm-action-primary:hover { background: var(--pdm-purple-dark); color: #fff; }
.pdm-more { position: relative; }
.pdm-more > summary { list-style: none; }
.pdm-more > summary::-webkit-details-marker { display: none; }
.pdm-more > div {
    background: #fff;
    border: 1px solid var(--pdm-border);
    border-radius: 9px;
    box-shadow: 0 15px 35px rgb(31 35 54 / 14%);
    left: 0;
    min-width: 175px;
    padding: 6px;
    position: absolute;
    top: calc(100% + 7px);
    z-index: 20;
}
.pdm-more > div button { background: transparent; border: 0; border-radius: 6px; color: #42475a; display: block; font-size: var(--font-ui); padding: 8px 9px; text-align: right; width: 100%; }
.pdm-more > div button:hover { background: var(--pdm-purple-soft); color: var(--pdm-purple-dark); }
.pdm-more > div i { margin-left: 7px; }

.pdm-main {
    margin: 0 auto;
    max-width: 1540px;
    padding: 14px clamp(18px, 4vw, 54px) 38px;
}

.pdm-product-card,
.pdm-filter-card,
.pdm-panel,
.pdm-table-card {
    background: #fff;
    border: 1px solid var(--pdm-border);
    border-radius: 10px;
    box-shadow: 0 3px 10px rgb(41 45 64 / 4%);
}

.pdm-product-card {
    align-items: stretch;
    display: grid;
    grid-template-columns: minmax(300px, 1.25fr) minmax(620px, 2.7fr);
    min-height: 112px;
    overflow: hidden;
}

.pdm-product-identity { align-items: center; display: flex; gap: 14px; padding: 15px 20px; }
.pdm-product-image { align-items: center; background: #f5f1e9; border-radius: 7px; color: #8a7350; display: flex; flex: 0 0 70px; height: 78px; justify-content: center; overflow: hidden; width: 70px; }
.pdm-product-image img { height: 100%; object-fit: cover; width: 100%; }
.pdm-product-image i { font-size: 28px; }
.pdm-product-identity h2 { color: #15192b; font-size: var(--font-lg); font-weight: 850; margin: 0 0 4px; }
.pdm-product-identity p { color: #777d90; font-size: var(--font-xs); margin: 0 0 7px; }
.pdm-product-identity p span { margin: 0 4px; }
.pdm-status { align-items: center; border-radius: 999px; display: inline-flex; font-size: var(--font-xs); font-weight: 700; gap: 5px; padding: 4px 7px; }
.pdm-status i { border-radius: 50%; height: 5px; width: 5px; }
.pdm-status.active { background: #eefbf3; color: #169b56; }
.pdm-status.active i { background: #22c66b; }
.pdm-status.inactive { background: #f2f3f6; color: #7b8194; }
.pdm-status.inactive i { background: #9297a8; }

.pdm-product-facts { display: grid; grid-template-columns: repeat(5, minmax(105px, 1fr)); }
.pdm-product-facts > div { align-content: center; border-right: 1px solid #f0f1f5; display: grid; gap: 6px; padding: 14px 20px; }
.pdm-product-facts span { color: #8a8fa1; font-size: var(--font-xs); font-weight: 650; }
.pdm-product-facts strong { color: #2b2f40; font-size: var(--font-sm); font-weight: 700; }

.pdm-kpi-grid { display: grid; gap: 12px; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: 12px; }
.pdm-kpi { align-items: center; background: #fff; border: 1px solid var(--pdm-border); border-radius: 9px; display: grid; gap: 14px; grid-template-columns: 54px minmax(0, 1fr); min-height: 89px; padding: 13px 16px; }
.pdm-kpi-icon { align-items: center; background: #edf9f1; border-radius: 50%; color: #16a05a; display: inline-flex; font-size: 19px; height: 48px; justify-content: center; width: 48px; }
.pdm-kpi label { color: #858a9b; display: block; font-size: var(--font-sm); font-weight: 750; margin-bottom: 3px; }
.pdm-kpi strong { color: #1a1e31; display: block; direction: rtl; font-size: var(--font-2xl); font-weight: 700; line-height: 1.25; }
.pdm-kpi strong small { color: inherit; font-size: var(--font-xs); }
.pdm-kpi > div > small { color: #8d92a3; display: block; font-size: var(--font-xs); margin-top: 3px; }
.pdm-kpi-success .pdm-kpi-icon { background: #e7f8ed; color: #19a45e; }
.pdm-kpi-warning .pdm-kpi-icon { background: #fff5df; color: #d68b16; }
.pdm-kpi-danger .pdm-kpi-icon { background: #ffe8ed; color: #e33d5e; }
.pdm-kpi-danger strong { color: #d82f52; }
.pdm-kpi-neutral .pdm-kpi-icon { background: #f0eff8; color: #77718e; }
.pdm-kpi-value .pdm-kpi-icon { background: #fff0d6; color: #ef9d22; }
.pdm-kpi-sales .pdm-kpi-icon { background: #eee8ff; color: #7456d9; }
.pdm-locked { color: #777d90; font-size: var(--font-sm); }
.pdm-kpi-error { align-items: center; background: #fff; border: 1px solid #ffd2d8; border-radius: 9px; color: #c52f47; display: flex; gap: 12px; grid-column: 1 / -1; min-height: 86px; padding: 14px 18px; }
.pdm-kpi-error > i { font-size: 22px; }
.pdm-kpi-error div { flex: 1; }
.pdm-kpi-error strong,.pdm-kpi-error span { display: block; }
.pdm-kpi-error span { color: #8a6068; font-size: var(--font-xs); margin-top: 3px; }
.pdm-kpi-error button,.pdm-error-state button { background: #fff; border: 1px solid #e59aa8; border-radius: 6px; color: #b6243e; font-size: var(--font-ui); font-weight: 700; padding: 7px 10px; }

.pdm-filter-card { align-items: end; display: grid; gap: 10px; grid-template-columns: minmax(250px, 1.4fr) minmax(290px, 1.2fr) minmax(140px, .65fr) minmax(140px, .65fr) auto; margin-top: 9px; padding: 10px 12px; }
.pdm-search { align-items: center; border: 1px solid #dedfea; border-radius: 7px; display: flex; height: 38px; padding: 0 11px; }
.pdm-search:focus-within { border-color: var(--pdm-purple); box-shadow: 0 0 0 3px rgb(103 84 232 / 9%); }
.pdm-search > i { color: #979cad; margin-left: 8px; }
.pdm-search input { border: 0; color: #34384b; flex: 1; font-size: var(--font-ui); min-width: 0; outline: 0; }
.pdm-filter-field > span { color: #888d9e; display: block; font-size: var(--font-ui); font-weight: 750; margin-bottom: 4px; }
.pdm-filter-field select,.pdm-date-range { background: #fff; border: 1px solid #dedfea; border-radius: 7px; color: #4a4f61; font-size: var(--font-ui); height: 38px; min-width: 0; width: 100%; }
.pdm-filter-field select { padding: 0 10px; }
.pdm-date-range { align-items: center; display: flex; gap: 5px; padding: 0 9px; }
.pdm-date-range i { color: #979cad; }
.pdm-date-range input { border: 0; color: #555a6c; font-size: var(--font-ui); min-width: 110px; outline: 0; padding: 0; }
.pdm-date-range b { color: #a1a5b4; font-size: var(--font-xs); font-weight: 600; }
.pdm-advanced-toggle { align-items: center; background: #fff; border: 1px solid #cabff5; border-radius: 7px; color: var(--pdm-purple); display: inline-flex; font-size: var(--font-xs); font-weight: 700; gap: 7px; height: 38px; padding: 0 12px; white-space: nowrap; }
.pdm-advanced-toggle:hover,.pdm-advanced-toggle[aria-expanded="true"] { background: var(--pdm-purple-soft); }
.pdm-advanced-panel { align-items: end; border-top: 1px solid #f0f1f5; display: grid; gap: 10px; grid-column: 1 / -1; grid-template-columns: 220px 130px auto; padding-top: 10px; }
.pdm-advanced-panel[hidden] { display: none; }
.pdm-clear-filters { align-items: center; background: transparent; border: 0; color: #777d90; display: inline-flex; font-size: var(--font-xs); gap: 6px; height: 38px; justify-content: center; }
.pdm-controls-muted { opacity: .62; }

.pdm-tabs { align-items: flex-end; border-bottom: 1px solid var(--pdm-border); display: flex; gap: clamp(18px, 4vw, 52px); margin-top: 10px; overflow-x: auto; padding: 0 14px; }
.pdm-tabs button { align-items: center; background: transparent; border: 0; border-bottom: 2px solid transparent; color: #757b8e; display: inline-flex; flex: 0 0 auto; font-size: var(--font-ui); font-weight: 750; gap: 7px; min-height: 42px; padding: 8px 4px; }
.pdm-tabs button:hover { color: var(--pdm-purple); }
.pdm-tabs button.active { border-bottom-color: var(--pdm-purple); color: var(--pdm-purple); }
.pdm-tab-pane { display: none; }
.pdm-tab-pane.active { display: block; }

.pdm-table-card { border-radius: 8px; border-top: 0; overflow: hidden; }
.pdm-table-wrap { max-height: calc(100dvh - 395px); min-height: 300px; }
.pdm-movements-table { border-collapse: collapse; font-size: var(--font-ui); min-width: 1080px; width: 100%; }
.pdm-movements-table thead th { background: #f8f8fb; border-bottom: 1px solid var(--pdm-border); color: #62687b; font-size: var(--font-ui); font-weight: 850; padding: 9px 10px; position: sticky; text-align: right; top: 0; white-space: nowrap; z-index: 2; }
.pdm-movements-table thead th[data-pdm-sort] { cursor: pointer; }
.pdm-movements-table thead th[data-pdm-sort]:hover { color: var(--pdm-purple); }
.pdm-movements-table tbody td { border-bottom: 1px solid #f0f1f5; color: #464b5d; height: 41px; padding: 7px 10px; text-align: right; vertical-align: middle; white-space: nowrap; }
.pdm-movements-table tbody tr:hover { background: #fbfaff; }
.pdm-movements-table tbody td > strong { color: #363b4e; display: block; font-size: var(--font-ui); }
.pdm-movements-table tbody td > small { color: #969baa; display: block; font-size: var(--font-xs); margin-top: 2px; }
.pdm-number { direction: rtl; font-weight: 700; }
.pdm-number small { color: inherit; font-size: var(--font-ui); }
.pdm-incoming { color: #19995a !important; }
.pdm-outgoing { color: #dd3b59 !important; }
.pdm-balance { color: #313647 !important; }
.pdm-reference { direction: ltr; display: inline-block; font-family:var(--font-family-mono); font-size: var(--font-xs); }
.pdm-notes { max-width: 200px; overflow: hidden; text-overflow: ellipsis; }
.pdm-dash { color: #b5b8c4; }
.pdm-movement-badge { border-radius: 4px; display: inline-flex; font-size: var(--font-xs); font-weight: 850; padding: 4px 7px; }
.pdm-movement-badge.purchase,.pdm-movement-badge.transfer-in { background: #eaf9ef; color: #168a4e; }
.pdm-movement-badge.sale,.pdm-movement-badge.transfer-out { background: #ffe9ee; color: #d62f50; }
.pdm-movement-badge.return { background: #fff4df; color: #cc7b11; }
.pdm-movement-badge.adjustment,.pdm-movement-badge.opening { background: #f0eaff; color: #744bd1; }
.pdm-movement-badge.waste { background: #fcecec; color: #b82f3b; }

.pdm-pagination { align-items: center; background: #fff; border-top: 1px solid var(--pdm-border); display: flex; justify-content: space-between; min-height: 50px; padding: 8px 12px; }
.pdm-pagination > span { color: #777d90; font-size: var(--font-xs); }
.pdm-pagination > div { display: flex; gap: 4px; }
.pdm-pagination button { align-items: center; background: #fff; border: 1px solid #ececf2; border-radius: 5px; color: #666c7d; display: inline-flex; font-size: var(--font-ui); height: 28px; justify-content: center; min-width: 28px; }
.pdm-pagination button:hover:not(:disabled),.pdm-pagination button.active { background: var(--pdm-purple); border-color: var(--pdm-purple); color: #fff; }
.pdm-pagination button:disabled { color: #c5c8d1; }

.pdm-overview-grid { display: grid; gap: 12px; grid-template-columns: .85fr 1.5fr; padding-top: 12px; }
.pdm-panel { margin-top: 0; padding: 16px; }
.pdm-panel > header { align-items: center; border-bottom: 1px solid #f0f1f5; display: flex; justify-content: space-between; margin-bottom: 12px; padding-bottom: 10px; }
.pdm-panel > header span { color: #9498a8; display: block; font-size: var(--font-xs); }
.pdm-panel > header h3 { font-size: var(--font-ui); font-weight: 850; margin: 2px 0 0; }
.pdm-panel > header > i { color: var(--pdm-purple); }
.pdm-info-list > div { align-items: center; border-bottom: 1px solid #f5f5f8; display: flex; justify-content: space-between; min-height: 40px; }
.pdm-info-list span { color: #858a9c; font-size: var(--font-xs); }
.pdm-info-list strong { font-size: var(--font-xs); }
.pdm-notice { align-items: flex-start; background: #f7f5ff; border: 1px solid #e6e0ff; border-radius: 10px; color: #514979; display: flex; gap: 12px; min-height: 112px; padding: 18px; }
.pdm-notice > i { color: var(--pdm-purple); font-size: 18px; margin-top: 2px; }
.pdm-notice strong { color: #27213d; display: block; font-size: var(--font-sm); margin-bottom: 6px; }
.pdm-notice p { font-size: var(--font-xs); line-height: 1.85; margin: 0; }
.pdm-mini-table { border-collapse: collapse; font-size: var(--font-ui); width: 100%; }
.pdm-mini-table th { background: #fafafd; color: #777d90; font-size: var(--font-ui); padding: 8px; text-align: right; }
.pdm-mini-table td { border-bottom: 1px solid #f1f2f5; padding: 9px 8px; }
.pdm-empty-mini { color: #989cab; text-align: center; }

.pdm-empty-state,.pdm-error-state { align-items: center; color: #8b90a0; display: flex; flex-direction: column; justify-content: center; min-height: 250px; text-align: center; }
.pdm-empty-state i,.pdm-error-state i { color: #d4d5dd; font-size: 29px; margin-bottom: 9px; }
.pdm-empty-state strong,.pdm-error-state strong { color: #4c5163; font-size: var(--font-sm); }
.pdm-empty-state span,.pdm-error-state span { font-size: var(--font-xs); margin: 4px 0 10px; }
.pdm-error-state i { color: #e6687c; }
.pdm-loading-inline { color: #83889a; font-size: var(--font-xs); padding: 50px; text-align: center; }
.pdm-centered { align-items: center; display: flex; justify-content: center; min-height: calc(100dvh - 80px); }
.pdm-error-card { background: #fff; border: 1px solid var(--pdm-border); border-radius: 12px; max-width: 520px; padding: 38px; text-align: center; }
.pdm-error-card > i { color: #e44f68; font-size: 34px; }
.pdm-error-card h2 { font-size: var(--font-lg); margin: 12px 0 5px; }
.pdm-error-card p { color: #7d8294; font-size: var(--font-sm); }
.pdm-error-card > div { display: flex; gap: 8px; justify-content: center; margin-top: 15px; }

.pdm-skeleton { animation: pdmPulse 1.3s ease-in-out infinite; background: linear-gradient(90deg,#f0f1f5 25%,#f8f8fa 50%,#f0f1f5 75%); background-size: 200% 100%; border-radius: 9px; }
.pdm-skeleton-title { height: 32px; width: 220px; }
.pdm-skeleton-hero { height: 112px; }
.pdm-skeleton-table { height: 340px; margin-top: 12px; }
.pdm-skeleton-card { animation: pdmPulse 1.3s ease-in-out infinite; background: linear-gradient(90deg,#f1f2f6 25%,#fafafa 50%,#f1f2f6 75%); background-size: 200% 100%; }
.pdm-skeleton-card span { background: #e7e8ee; border-radius: 50%; height: 45px; width: 45px; }
.pdm-skeleton-card b,.pdm-skeleton-card small { background: #e5e6eb; border-radius: 4px; display: block; height: 12px; width: 70%; }
.pdm-table-skeleton { padding: 10px; }
.pdm-table-skeleton i { animation: pdmPulse 1.3s ease-in-out infinite; background: linear-gradient(90deg,#f0f1f5 25%,#fafafa 50%,#f0f1f5 75%); background-size: 200% 100%; border-radius: 5px; display: block; height: 31px; margin: 7px 0; }
@keyframes pdmPulse { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } }

@media (max-width: 1199.98px) {
    .pdm-product-card { grid-template-columns: 1fr; }
    .pdm-product-facts { border-top: 1px solid #f0f1f5; }
    .pdm-filter-card { grid-template-columns: 1.3fr 1.1fr .7fr .7fr; }
    .pdm-advanced-toggle { grid-column: 4; }
}

@media (max-width: 991.98px) {
    .pdm-topbar { align-items: flex-start; gap: 10px; }
    .pdm-breadcrumb { display: none; }
    .pdm-kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .pdm-filter-card { grid-template-columns: 1fr 1fr; }
    .pdm-search { grid-column: 1 / -1; }
    .pdm-advanced-toggle { grid-column: auto; }
    .pdm-overview-grid { grid-template-columns: 1fr; }
    .pdm-table-wrap { max-height: none; }
}

@media (max-width: 767.98px) {
    .pdm-topbar { padding: 10px 12px; }
    .pdm-main { padding: 10px 10px 28px; }
    .pdm-actions .pdm-action { font-size: 0; padding: 7px 10px; }
    .pdm-actions .pdm-action i { font-size: 12px; }
    .pdm-more > summary { font-size: 0; }
    .pdm-product-facts { grid-template-columns: repeat(2, 1fr); }
    .pdm-product-facts > div:last-child { grid-column: 1 / -1; }
    .pdm-kpi-grid { grid-template-columns: 1fr; }
    .pdm-filter-card,.pdm-advanced-panel { grid-template-columns: 1fr; }
    .pdm-search { grid-column: auto; }
    .pdm-advanced-panel { grid-column: 1; }
    .pdm-tabs { gap: 20px; }
    .pdm-date-range input { min-width: 0; width: 100%; }
    .pdm-pagination { align-items: flex-start; flex-direction: column; gap: 8px; }
}

@media (max-width: 479.98px) {
    .pdm-title-block h1 { font-size: var(--font-md); }
    .pdm-product-identity { padding: 12px; }
    .pdm-product-image { flex-basis: 58px; height: 66px; width: 58px; }
    .pdm-product-facts { grid-template-columns: 1fr; }
    .pdm-product-facts > div:last-child { grid-column: auto; }
}

/* Full-screen product, service and bundle editor */
.item-drawer-overlay {
    align-items: stretch;
    background: #f5f7fb;
    backdrop-filter: none;
    padding: 0;
}

.item-drawer {
    background: #f7f8fc;
    border-radius: 0;
    box-shadow: none;
    height: 100dvh;
    opacity: 1;
    overflow: hidden;
    padding: 0;
    transform: none;
    width: 100vw;
}

.item-drawer-overlay.show .item-drawer {
    opacity: 1;
    transform: none;
}

.item-workspace-shell {
    --item-accent: #3d9b70;
    --item-accent-deep: #267452;
    --item-accent-soft: #edf8f2;
    display: grid;
    gap: 0;
    grid-template-rows: auto minmax(0, 1fr);
    height: 100dvh;
    min-height: 0;
}

.item-workspace-shell-service {
    --item-accent: #705ee8;
    --item-accent-deep: #5744ca;
    --item-accent-soft: #f1efff;
}

.item-workspace-shell-bundle {
    --item-accent: #6857e8;
    --item-accent-deep: #5140c9;
    --item-accent-soft: #f1efff;
}

.item-workspace-hero,
.item-workspace-hero-product,
.item-workspace-hero-service,
.item-workspace-hero-bundle {
    align-items: center;
    background: #fff;
    border: 0;
    border-bottom: 1px solid #e8eaf1;
    border-radius: 0;
    box-shadow: 0 2px 12px rgb(15 23 42 / 4%);
    display: flex;
    margin: 0;
    min-height: 82px;
    padding: 13px clamp(20px, 3vw, 48px);
    position: relative;
    z-index: 4;
}

.item-workspace-title-group {
    align-items: center;
    display: flex;
    gap: 13px;
    min-width: 280px;
}

.item-workspace-title-icon {
    align-items: center;
    background: var(--item-accent-soft);
    border: 1px solid color-mix(in srgb, var(--item-accent) 26%, white);
    border-radius: 12px;
    color: var(--item-accent);
    display: inline-flex;
    flex: 0 0 44px;
    font-size: 17px;
    height: 44px;
    justify-content: center;
    width: 44px;
}

.item-workspace-hero-copy {
    gap: 1px;
}

.item-workspace-kicker {
    background: transparent;
    color: #8a93a5;
    font-size: var(--font-xs);
    padding: 0;
}

.item-workspace-hero h3 {
    color: #182034;
    font-size: var(--font-xl);
    line-height: 1.35;
    margin: 0;
}

.item-workspace-hero p {
    color: #8b94a5;
    font-size: var(--font-sm);
    line-height: 1.5;
    margin: 1px 0 0;
}

.item-workspace-hero-actions {
    align-items: center;
    display: flex;
    gap: 14px;
    justify-items: initial;
    margin-inline-start: auto;
}

.item-type-switcher {
    background: #f7f8fb;
    border: 1px solid #e8eaf0;
    border-radius: 12px;
    display: flex;
    gap: 4px;
    padding: 4px;
}

.item-type-chip {
    border: 0;
    border-radius: 8px;
    color: #697386;
    font-size: var(--font-xs);
    min-height: 34px;
    padding: 7px 11px;
}

.item-type-chip:hover,
.item-type-chip:focus {
    border: 0;
    box-shadow: none;
    transform: none;
}

.item-type-chip.active {
    background: #fff;
    box-shadow: 0 3px 9px rgb(15 23 42 / 8%);
    color: var(--item-accent-deep);
}

.item-workspace-close {
    background: #fff;
    border: 1px solid #e2e5ec;
    border-radius: 10px;
    color: #687386;
    flex: 0 0 38px;
    height: 38px;
    width: 38px;
}

.item-workspace-close:hover {
    background: #fff1f2;
    border-color: #fecdd3;
    color: #e11d48;
}

.item-form.item-form-page {
    display: grid;
    gap: 0;
    grid-template-rows: auto minmax(0, 1fr) auto;
    min-height: 0;
    overflow: hidden;
}

.item-tabs {
    background: #fff;
    border: 1px solid #e5e8ef;
    border-radius: 10px;
    box-shadow: 0 2px 7px rgb(15 23 42 / 3%);
    display: grid;
    gap: 0;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin: 14px auto 0;
    max-width: 1500px;
    overflow: hidden;
    padding: 0;
    width: calc(100% - clamp(40px, 6vw, 96px));
}

.item-workspace-shell-service .item-tabs,
.item-workspace-shell-bundle .item-tabs {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.item-tab {
    align-items: center;
    background: #fff;
    border: 0;
    border-bottom: 2px solid transparent;
    border-inline-start: 1px solid #edf0f4;
    border-radius: 0;
    display: flex;
    gap: 10px;
    justify-content: center;
    min-height: 62px;
    padding: 9px 12px;
    position: relative;
}

.item-tab:last-child {
    border-inline-start: 0;
}

.item-tab:hover,
.item-tab:focus {
    background: #fafbfe;
    box-shadow: none;
    color: #323b4d;
}

.item-tab.active {
    background: linear-gradient(180deg, var(--item-accent-soft), #fff);
    border-bottom-color: var(--item-accent);
    box-shadow: none;
    color: var(--item-accent-deep);
}

.item-tab-number {
    align-items: center;
    background: #f2f4f8;
    border: 1px solid #e0e4eb;
    border-radius: 50%;
    color: #8b94a5;
    display: inline-flex;
    flex: 0 0 25px;
    font-size: var(--font-ui);
    height: 25px;
    justify-content: center;
    width: 25px;
}

.item-tab.active .item-tab-number {
    background: var(--item-accent);
    border-color: var(--item-accent);
    color: #fff;
    box-shadow: 0 4px 10px color-mix(in srgb, var(--item-accent) 24%, transparent);
}

.item-tab-copy {
    display: grid;
    gap: 1px;
    text-align: right;
}

.item-tab-copy strong {
    font-size: var(--font-sm);
    font-weight: 700;
}

.item-tab-copy small {
    color: #98a1b1;
    font-size: var(--font-xs);
    font-weight: 500;
}

.item-form-layout {
    align-items: start;
    display: grid;
    gap: 18px;
    grid-template-columns: minmax(0, 1fr) minmax(245px, 305px);
    margin: 0 auto;
    max-width: 1500px;
    min-height: 0;
    overflow-y: auto;
    padding: 18px clamp(20px, 3vw, 48px) 24px;
    scrollbar-color: #cbd1dc transparent;
    width: 100%;
}

.item-form-main,
.item-form-sidebar {
    gap: 13px;
}

.item-form-sidebar {
    position: sticky;
    top: 0;
}

.item-form-section {
    background: #fff;
    border: 1px solid #e4e7ed;
    border-radius: 10px;
    box-shadow: 0 3px 12px rgb(15 23 42 / 4%);
    min-height: 330px;
    padding: clamp(18px, 2.2vw, 30px);
}

.item-section-heading {
    align-items: flex-start;
    border-bottom: 1px solid #f0f1f5;
    display: flex;
    gap: 11px;
    margin-bottom: 22px;
    padding-bottom: 15px;
}

.item-section-heading > span {
    align-items: center;
    background: var(--item-accent-soft);
    border-radius: 9px;
    color: var(--item-accent);
    display: inline-flex;
    flex: 0 0 35px;
    height: 35px;
    justify-content: center;
}

.item-section-heading h4,
.item-form-section .item-section-heading h4 {
    color: #20293b;
    font-size: var(--font-base);
    margin: 0 0 3px;
}

.item-section-heading p {
    color: #929aaa;
    font-size: var(--font-xs);
    line-height: 1.55;
    margin: 0;
}

.item-section-heading-with-control > div:nth-child(2) {
    flex: 1;
}

.item-form-grid {
    gap: 15px 18px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.item-field {
    color: #3d4658;
    gap: 6px;
}

.item-field > span {
    font-size: var(--font-ui);
    font-weight: 700;
}

.item-field .form-control,
.item-form-section .form-control,
.item-form-section .form-select {
    background-color: #fff;
    border: 1px solid #dfe3ea;
    border-radius: 7px;
    box-shadow: none;
    color: #2f3748;
    font-size: var(--font-ui);
    min-height: 42px;
    padding: 8px 11px;
}

.item-field textarea.form-control {
    min-height: 92px;
    resize: vertical;
}

.item-field .form-control:focus,
.item-form-section .form-control:focus,
.item-form-section .form-select:focus {
    border-color: var(--item-accent);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--item-accent) 12%, transparent);
}

.field-error {
    font-size: var(--font-xs);
    min-height: 12px;
}

.item-field-help {
    align-items: center;
    color: #8a94a6;
    display: flex;
    font-size: var(--font-ui);
    font-weight: 600;
    gap: 5px;
    line-height: 1.55;
}

.item-field-help i {
    color: var(--item-accent);
}

.item-image-upload-field {
    align-content: start;
}

.item-image-upload-control {
    align-items: center;
    background: #fafbfc;
    border: 1px dashed #d9dee7;
    border-radius: 8px;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    min-height: 56px;
    padding: 8px;
}

.item-image-upload-control .btn {
    align-items: center;
    border-radius: 7px;
    display: inline-flex;
    font-size: var(--font-ui);
    font-weight: 700;
    gap: 6px;
    min-height: 36px;
}

.item-image-upload-control > span {
    color: #8a94a6;
    flex: 1 1 130px;
    font-size: var(--font-xs);
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.item-image-upload-status {
    color: var(--item-accent-deep);
    font-size: var(--font-xs);
    font-weight: 700;
    min-height: 12px;
}

.input-with-action {
    display: grid;
    gap: 7px;
    grid-template-columns: minmax(0, 1fr) auto;
}

.barcode-generate-btn {
    border-radius: 7px;
    font-size: var(--font-ui);
    min-width: 86px;
}

.barcode-preview {
    background: #fafbfc;
    border: 1px dashed #dfe3ea;
    border-radius: 7px;
    font-size: var(--font-xs);
    min-height: 44px;
    overflow: hidden;
    padding: 7px;
}

.item-preview-card,
.item-insight-card,
.item-sidebar-card {
    background: #fff;
    border: 1px solid #e4e7ed;
    border-radius: 10px;
    box-shadow: 0 3px 12px rgb(15 23 42 / 4%);
    padding: 14px;
}

.item-preview-frame {
    background: linear-gradient(145deg, var(--item-accent-soft), #fafbfc);
    border-color: color-mix(in srgb, var(--item-accent) 22%, #dce1e8);
    border-radius: 8px;
    min-height: 168px;
}

.item-image-preview {
    height: 168px;
}

.item-image-placeholder {
    font-size: var(--font-ui);
}

.item-image-placeholder i,
.item-preview-service-icon {
    color: var(--item-accent);
}

.item-preview-caption strong,
.item-preview-service-copy strong {
    font-size: var(--font-xs);
}

.item-preview-caption span,
.item-preview-service-copy span,
.item-insight-card p,
.item-sidebar-list li {
    font-size: var(--font-xs);
    line-height: 1.65;
}

.item-preview-card-service {
    background: linear-gradient(145deg, var(--item-accent-soft), #fff);
    min-height: 180px;
}

.item-preview-service-icon {
    background: color-mix(in srgb, var(--item-accent) 12%, white);
    height: 62px;
    width: 62px;
}

.item-insight-icon {
    background: var(--item-accent-soft) !important;
    color: var(--item-accent) !important;
    height: 40px;
    width: 40px;
}

.item-insight-card strong,
.item-sidebar-card h4 {
    color: #283144;
    font-size: var(--font-sm);
}

.item-sidebar-meta {
    font-size: var(--font-xs);
    padding: 9px 0;
}

.inventory-toggle-row {
    align-items: center;
    border-bottom: 0;
    margin-bottom: 20px;
    padding-bottom: 0;
}

.inventory-toggle-row .item-section-heading {
    border-bottom: 0;
    flex: 1;
    margin: 0;
    padding: 0;
}

.item-workspace-shell .switch-control {
    background: #fafbfc;
    border: 1px solid #e5e8ee;
    border-radius: 8px;
    font-size: var(--font-xs);
    padding: 9px 11px;
}

.item-workspace-shell .switch-control input:checked + span {
    background: var(--item-accent);
}

.bundle-table {
    font-size: var(--font-ui);
    min-width: 860px;
}

.bundle-table th {
    background: #f8f9fc;
    color: #747e91;
    font-size: var(--font-ui);
}

.bundle-summary {
    gap: 7px;
    grid-template-columns: repeat(5, minmax(95px, 1fr));
}

.bundle-summary div {
    background: #fafbfc;
    border: 1px solid #e7e9ef;
    border-radius: 8px;
    padding: 10px;
}

.bundle-summary-pricing {
    margin: 0 0 20px;
}

.item-form-actions {
    align-items: center;
    background: #fff;
    border-top: 1px solid #e4e7ee;
    box-shadow: 0 -3px 12px rgb(15 23 42 / 4%);
    display: flex;
    justify-content: space-between;
    min-height: 68px;
    padding: 11px clamp(20px, 3vw, 48px);
    position: relative;
    z-index: 5;
}

.item-form-actions-primary,
.item-form-actions-secondary {
    align-items: center;
    display: flex;
    gap: 8px;
}

.item-form-actions .btn {
    align-items: center;
    border-radius: 7px;
    display: inline-flex;
    font-size: var(--font-ui);
    font-weight: 700;
    gap: 7px;
    justify-content: center;
    min-height: 40px;
    min-width: 112px;
    padding: 8px 16px;
}

.item-form-actions .btn-primary {
    background: linear-gradient(135deg, var(--item-accent), var(--item-accent-deep));
    border-color: var(--item-accent);
    box-shadow: 0 6px 14px color-mix(in srgb, var(--item-accent) 22%, transparent);
}

.item-form-actions .btn-outline-primary {
    border-color: color-mix(in srgb, var(--item-accent) 48%, #d7dce5);
    color: var(--item-accent-deep);
}

@media (max-width: 1100px) {
    .item-form-layout {
        grid-template-columns: minmax(0, 1fr);
    }

    .item-form-sidebar {
        display: none;
    }

    .item-workspace-hero p,
    .item-tab-copy small {
        display: none;
    }
}

@media (max-width: 780px) {
    .item-workspace-hero {
        align-items: flex-start;
        padding: 10px 14px;
    }

    .item-workspace-title-icon {
        flex-basis: 38px;
        height: 38px;
        width: 38px;
    }

    .item-workspace-hero-copy p,
    .item-workspace-kicker,
    .item-type-chip span {
        display: none;
    }

    .item-workspace-title-group {
        min-width: 0;
    }

    .item-type-switcher {
        gap: 2px;
    }

    .item-type-chip {
        min-width: 34px;
        padding: 6px 9px;
    }

    .item-tabs {
        margin-top: 9px;
        width: calc(100% - 24px);
    }

    .item-tab {
        gap: 5px;
        min-height: 50px;
        padding: 7px 4px;
    }

    .item-tab-copy strong {
        font-size: var(--font-xs);
    }

    .item-tab-number {
        flex-basis: 21px;
        height: 21px;
        width: 21px;
    }

    .item-form-layout {
        padding: 12px;
    }

    .item-form-section {
        border-radius: 8px;
        min-height: 0;
        padding: 15px;
    }

    .item-form-grid {
        grid-template-columns: 1fr;
    }

    .item-form-actions {
        min-height: 62px;
        padding: 9px 12px;
    }

    .item-form-actions .btn {
        min-width: 0;
        padding: 8px 11px;
    }

    #save-add-another {
        display: none !important;
    }
}

@media (max-width: 520px) {
    .item-tab-copy {
        display: none;
    }

    .item-tab {
        min-height: 44px;
    }

    .item-form-actions .btn {
        font-size: var(--font-ui);
    }
}
/* Import type cards: Full Product Structure (.XLSX) / Products & Services (.CSV). The selected card decides the accepted file. */
.product-import-format-card[role="radio"]:focus-visible{outline:2px solid #185adb;outline-offset:2px}
.product-import-format-card[aria-checked="false"]{background:#fff}
.product-import-format-card[aria-checked="false"] .product-import-card-icon{opacity:.75}
.product-import-card-icon.is-csv{background:#ecfdf3;color:#15803d}
.product-import-dropzone.is-dragging{border-color:#185adb;background:#e9f1ff}
.product-import-preview-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.product-import-guide ul{margin:6px 0 0;padding-inline-start:18px;display:grid;gap:4px;font-size:var(--font-sm);color:#475569;line-height:1.7}
.product-import-kpis.is-csv{grid-template-columns:repeat(4,minmax(0,1fr))}
.product-import-result-grid.is-compact{grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:760px){.product-import-kpis.is-csv{grid-template-columns:repeat(2,minmax(0,1fr))}.product-import-result-grid.is-compact{grid-template-columns:1fr}}
.product-import-guide-skipped{color:#1e4e9e;font-weight:700}.product-import-overlay.is-busy .product-import-dropzone{pointer-events:none;opacity:.6}.product-import-guide-skipped i{margin-inline-end:3px}

/* system-features.css */

.system-feature-page{display:grid;gap:14px}.system-feature-page-header{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;padding:2px 2px 0}.system-feature-page-header h3{margin:2px 0 4px;color:var(--text-main);font-size:var(--font-2xl);font-weight:700}.system-feature-page-header p{margin:0;color:var(--text-muted);font-size:var(--font-ui)}.system-feature-eyebrow{display:flex;align-items:center;gap:6px;color:var(--primary-color);font-size:var(--font-xs);font-weight:700}.system-feature-alert{display:flex;align-items:center;gap:9px;margin:0;padding:10px 13px;border-radius:10px;font-size:var(--font-ui)}.system-feature-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.system-feature-summary article{display:flex;align-items:center;gap:10px;min-width:0;padding:12px 14px;background:var(--bg-card);border:1px solid var(--border-color);border-radius:11px;box-shadow:0 3px 11px rgba(15,23,42,.035)}.system-feature-summary span{width:34px;height:34px;border-radius:9px;display:grid;place-items:center;flex:0 0 auto}.system-feature-summary .is-total{background:#edf4ff;color:#2563eb}.system-feature-summary .is-enabled{background:#e8faf1;color:#10a56f}.system-feature-summary .is-disabled{background:#fff1f2;color:#e11d48}.system-feature-summary .is-groups{background:#f2efff;color:#7357e8}.system-feature-summary small{display:block;color:var(--text-muted);font-size:var(--font-xs);font-weight:700}.system-feature-summary strong{display:block;color:var(--text-main);font-size:var(--font-2xl);line-height:1.15;margin-top:2px}
.system-feature-browser{padding:12px;background:var(--bg-card);border:1px solid var(--border-color);border-radius:12px;box-shadow:0 4px 14px rgba(15,23,42,.035)}.system-feature-toolbar{display:grid;grid-template-columns:minmax(220px,1fr) 160px 170px;gap:9px;padding-bottom:12px;border-bottom:1px solid var(--border-color)}.system-feature-search{position:relative;display:block}.system-feature-search>i{position:absolute;inset-inline-start:12px;top:50%;transform:translateY(-50%);color:var(--text-muted);font-size:.8rem}.system-feature-search input,.system-feature-toolbar select{width:100%;min-height:37px;border:1px solid var(--border-color);border-radius:8px;background:var(--bg-card);color:var(--text-main);font-size:var(--font-ui)}.system-feature-search input{padding-inline:34px 12px}.system-feature-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding-top:12px}.system-feature-card,.system-feature-policy-card{overflow:hidden;background:var(--bg-card);border:1px solid var(--border-color);border-radius:11px}.system-feature-card>header,.system-feature-policy-card>header{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 13px;background:linear-gradient(180deg,rgba(248,250,252,.86),rgba(255,255,255,.6));border-bottom:1px solid var(--border-color)}.system-feature-group-title,.system-feature-policy-entry{display:flex;align-items:center;gap:9px;min-width:0}.system-feature-group-title h4{margin:0;color:var(--text-main);font-size:var(--font-base);font-weight:700}.system-feature-group-title small,.system-feature-policy-entry small{display:block;margin-top:2px;color:var(--text-muted);font-size:var(--font-xs)}.system-feature-group-icon,.system-feature-icon{width:33px;height:33px;display:grid;place-items:center;flex:0 0 auto;border-radius:9px;background:rgba(37,99,235,.1);color:var(--primary-color)}.system-feature-group-actions{display:flex;align-items:center;gap:7px;color:var(--text-muted);font-size:var(--font-xs);white-space:nowrap}.system-feature-group-actions button{width:26px;height:26px;padding:0;border:0;border-radius:7px;background:var(--bg-body);color:var(--primary-color)}.system-feature-rows{display:grid}.system-feature-row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:10px 13px;border-bottom:1px solid var(--border-color);transition:background-color .15s,opacity .15s}.system-feature-row:last-child{border-bottom:0}.system-feature-row:hover{background:var(--bg-body)}.system-feature-row.is-child{padding-inline-start:28px}.system-feature-row.is-saving{opacity:.55;pointer-events:none}.system-feature-copy{display:flex;align-items:center;gap:9px;min-width:0}.system-feature-copy .system-feature-icon{width:30px;height:30px;border-radius:8px;background:var(--bg-body);font-size:.78rem}.system-feature-row.is-parent .system-feature-icon{background:rgba(37,99,235,.1)}.system-feature-copy strong{display:block;color:var(--text-main);font-size:var(--font-ui);line-height:1.3}.system-feature-copy small{display:block;color:var(--text-muted);font-size:var(--font-xs);line-height:1.3;margin-top:2px}.system-feature-copy code{display:block;width:max-content;max-width:100%;margin-top:3px;padding:1px 5px;border-radius:4px;background:var(--bg-body);color:var(--text-muted);font-size:var(--font-xs);direction:ltr}.system-feature-copy mark{padding:0;background:#fff3b7;color:inherit}.system-feature-sensitive{margin-inline-start:5px;color:#d48b14;font-size:var(--font-xs)}.system-feature-control{display:flex;align-items:center;gap:8px;white-space:nowrap}.system-feature-control .form-check-input{width:2.35rem;height:1.15rem;cursor:pointer}.system-feature-control .form-check-input:disabled{cursor:not-allowed;opacity:.55}.system-feature-status{padding:3px 7px;border-radius:999px;background:#f1f5f9;color:#64748b;font-size:var(--font-xs);font-weight:700}.system-feature-status.is-enabled{background:#e1f8ed;color:#0a9b68}.system-feature-empty{grid-column:1/-1;display:flex;align-items:center;justify-content:center;gap:9px;min-height:100px;padding:18px;color:var(--text-muted);font-size:var(--font-ui)}.system-feature-empty strong{color:var(--text-main)}
.system-feature-policy-card{grid-column:1/-1}.system-feature-policy-entry strong{display:block;color:var(--text-main);font-size:var(--font-ui);font-weight:700}.system-feature-policy-card>header{border-bottom:0}.system-feature-policy-card.is-open>header{border-bottom:1px solid var(--border-color)}.system-feature-lock-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px;padding:13px}.system-feature-lock-form>.form-check{align-self:end}.system-feature-lock-form .form-label{margin:0 0 -7px;color:var(--text-muted);font-size:var(--font-sm);font-weight:700}.system-feature-lock-form .form-select{min-height:36px;font-size:var(--font-ui)}.system-feature-lock-options{grid-column:1/-1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px 14px;padding-top:3px}.system-feature-lock-options .form-check{margin:0;font-size:var(--font-ui)}.system-feature-lock-actions{grid-column:1/-1;display:flex;justify-content:flex-end}.system-feature-lock-actions .btn{font-size:var(--font-ui)}
@media(max-width:980px){.system-feature-summary{grid-template-columns:repeat(2,minmax(0,1fr))}.system-feature-grid{grid-template-columns:1fr}.system-feature-lock-options{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:700px){.system-feature-toolbar{grid-template-columns:1fr 1fr}.system-feature-search{grid-column:1/-1}}@media(max-width:576px){.system-feature-summary{grid-template-columns:1fr 1fr}.system-feature-summary article{padding:10px}.system-feature-summary span{width:30px;height:30px}.system-feature-row{align-items:flex-start;flex-direction:column}.system-feature-control{width:100%;justify-content:space-between}.system-feature-row.is-child{padding-inline-start:18px}.system-feature-lock-form{grid-template-columns:1fr}.system-feature-lock-options{grid-template-columns:1fr}.system-feature-policy-card>header{align-items:flex-start;flex-direction:column}.system-feature-policy-card>header .system-feature-control{justify-content:space-between}.system-feature-empty{flex-direction:column}.system-feature-toolbar{grid-template-columns:1fr}}

/* settings-center.css */
/* Settings Center — the canonical company/system settings hub (/settings and /settings/<group>).
   Owns the settings local tabs too (.settings-tabs, also used by the backup center's local nav). */
.settings-tabs{display:flex;flex-direction:row;gap:6px}
.settings-tabs .nav-link{color:var(--text-muted);font-weight:700;border-radius:8px}
.settings-tabs .nav-link.active{background:var(--primary);color:#fff}

.sc-page{container-type:inline-size;padding:2px 0 28px}
.sc-header{margin-bottom:22px}
.sc-header h1{display:flex;align-items:center;gap:12px;margin:0 0 6px;font-size:var(--font-2xl);font-weight:700;color:var(--text-main)}
.sc-header h1>.fa-gear{font-size:22px;color:var(--text-main)}
.sc-header p{margin:0;color:var(--text-muted);font-size:var(--font-base);line-height:1.7}
.sc-breadcrumb{display:flex;align-items:center;gap:8px;margin-bottom:10px;color:var(--text-muted);font-size:var(--font-xs);font-weight:600}
.sc-breadcrumb a{color:var(--primary);text-decoration:none}
.sc-breadcrumb strong{color:var(--text-main);font-weight:600}
.sc-breadcrumb .sc-dir{font-size:11px}
html[dir="ltr"] .sc-dir{transform:scaleX(-1)}

/* Group tones: ACCMAN tokens where they exist, fixed accents for the rest. */
.sc-icon{--sc-tone:var(--primary);--sc-tone-bg:var(--primary-light);width:48px;height:48px;flex:0 0 auto;display:grid;place-items:center;border-radius:12px;background:var(--sc-tone-bg);color:var(--sc-tone);font-size:20px}
.sc-tone-blue{--sc-tone:var(--primary);--sc-tone-bg:var(--primary-light)}
.sc-tone-green{--sc-tone:#16a34a;--sc-tone-bg:#e8f7ee}
.sc-tone-amber{--sc-tone:#d97706;--sc-tone-bg:#fff4e0}
.sc-tone-purple{--sc-tone:#6d4bd8;--sc-tone-bg:#f1edff}
.sc-tone-red{--sc-tone:#e11d48;--sc-tone-bg:#ffedf0}
.sc-tone-sky{--sc-tone:#2563eb;--sc-tone-bg:#e6efff}
.sc-tone-teal{--sc-tone:#0d9488;--sc-tone-bg:#e2f6f3}
.sc-tone-pink{--sc-tone:#db2777;--sc-tone-bg:#fdebf4}

.sc-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.sc-card{display:flex;flex-direction:column;align-items:flex-start;min-width:0;padding:18px 18px 16px;background:var(--bg-surface);border:1px solid var(--border-color);border-radius:14px;box-shadow:var(--shadow-sm);transition:box-shadow .16s ease,border-color .16s ease}
.sc-card:hover{border-color:#cfdcf2;box-shadow:var(--shadow-md)}
.sc-card h2{margin:14px 0 6px;font-size:var(--font-md);font-weight:700;color:var(--text-main)}
.sc-card__desc{margin:0 0 12px;min-height:3.4em;color:var(--text-muted);font-size:var(--font-sm);line-height:1.7}

.sc-rows{align-self:stretch;list-style:none;margin:0 0 14px;padding:0}
.sc-rows li+li{border-top:1px solid #eef2f7}
.sc-rows a{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 2px;color:var(--text-main);font-size:var(--font-sm);font-weight:600;text-decoration:none}
.sc-rows a:hover{color:var(--primary)}
.sc-rows .sc-dir{color:#94a3b8;font-size:12px}
.sc-rows a:hover .sc-dir{color:var(--primary)}
.sc-card .sc-rows{border-top:1px solid #eef2f7}

.sc-card__open{align-self:stretch;margin-top:auto;display:flex;align-items:center;justify-content:center;gap:8px;min-height:38px;border-radius:9px;background:var(--primary-light);color:var(--primary);font-size:var(--font-sm);font-weight:700;text-decoration:none;transition:background .16s ease}
.sc-card__open:hover{background:#dcebff;color:var(--primary-hover)}
.sc-card__open .sc-dir{font-size:12px}

/* Group pages */
.sc-group .sc-header h1{gap:14px}
.sc-group .sc-header h1 .sc-icon{width:44px;height:44px;font-size:18px}
.sc-tabs{margin-bottom:18px;padding:8px;background:var(--bg-surface);border:1px solid var(--border-color);border-radius:12px}
.sc-tabs .nav-link{padding:8px 14px}
.sc-group__layout{display:grid;grid-template-columns:minmax(0,1fr);gap:18px;align-items:start}
.sc-group__layout.has-related{grid-template-columns:minmax(0,1fr) 300px}
.sc-related{padding:16px 18px;background:var(--bg-surface);border:1px solid var(--border-color);border-radius:14px;box-shadow:var(--shadow-sm)}
.sc-related h3{margin:0 0 6px;font-size:var(--font-ui);font-weight:700;color:var(--text-muted)}
.sc-related .sc-rows{margin:0}
.sc-empty{display:flex;flex-direction:column;align-items:center;gap:10px;padding:40px 20px;text-align:center;background:var(--bg-surface);border:1px dashed var(--border-color);border-radius:14px;color:var(--text-muted)}
.sc-empty i{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:var(--primary-light);color:var(--primary);font-size:18px}

/* Columns follow the space the page actually gets (sidebar open or collapsed): 4 → 2 → 1. */
@container (max-width:759px){.sc-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.sc-group__layout.has-related{grid-template-columns:minmax(0,1fr)}}
@container (max-width:479px){.sc-grid{grid-template-columns:1fr}.sc-card__desc{min-height:0}}
@media (max-width:576px){.settings-tabs{overflow-x:auto;flex-wrap:nowrap}.settings-tabs .nav-link{white-space:nowrap}.sc-header h1{font-size:var(--font-xl)}}

/* ai-assistant.css */
.ai-assistant-trigger{position:relative;width:44px;height:44px;display:inline-grid;place-items:center;padding:0!important;border-radius:50%!important}.ai-assistant-trigger::after{content:"";position:absolute;top:7px;left:7px;width:8px;height:8px;border:2px solid #fff;border-radius:50%;background:#22c55e}.ai-assistant-backdrop{position:fixed;inset:0;z-index:2040;background:rgba(15,23,42,.32);backdrop-filter:blur(2px)}.ai-assistant-drawer{position:fixed;z-index:2050;inset:0 0 0 auto;width:min(440px,100vw);height:100dvh;display:grid;grid-template-rows:auto auto minmax(0,1fr) auto auto;background:#f8fafc;border-left:1px solid #dbe4ef;box-shadow:-20px 0 55px rgba(15,23,42,.18);transform:translateX(105%);transition:transform .24s ease;overflow:hidden;color:#17233a}.ai-assistant-drawer.is-open{transform:translateX(0)}.ai-assistant-header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;background:#fff;border-bottom:1px solid #e5eaf1}.ai-assistant-brand{display:flex;align-items:center;gap:10px;min-width:0}.ai-assistant-logo,.ai-message-avatar{display:grid;place-items:center;flex:0 0 auto;background:linear-gradient(145deg,#2f6df3,#7149d9);color:#fff;box-shadow:0 7px 16px rgba(47,109,243,.22)}.ai-assistant-logo{width:38px;height:38px;border-radius:12px}.ai-assistant-brand>div{display:grid;gap:2px}.ai-assistant-brand strong{font-size:var(--font-base)}.ai-assistant-brand small{display:flex;align-items:center;gap:5px;color:#7b879b;font-size:var(--font-xs)}.ai-assistant-brand small span{width:6px;height:6px;border-radius:50%;background:#f59e0b}.ai-assistant-brand small.is-ready span{background:#22c55e}.ai-assistant-header-actions{display:flex;align-items:center;gap:4px}.ai-assistant-header-actions button,.ai-assistant-subhead button{width:32px;height:32px;display:grid;place-items:center;border:0;border-radius:9px;background:transparent;color:#69778d;transition:.16s}.ai-assistant-header-actions button:hover,.ai-assistant-subhead button:hover{background:#eef4ff;color:#2563eb}.ai-assistant-page-context{min-width:0;display:flex;align-items:center;gap:7px;padding:8px 16px;background:#f1f5fb;border-bottom:1px solid #e2e8f0;color:#728096;font-size:var(--font-xs)}.ai-assistant-page-context i{color:#2563eb}.ai-assistant-page-context strong{overflow:hidden;color:#334155;text-overflow:ellipsis;white-space:nowrap}.ai-assistant-messages{min-height:0;padding:18px 16px;overflow-y:auto;overscroll-behavior:contain;scrollbar-color:#cbd5e1 transparent}.ai-assistant-welcome{min-height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:30px 25px;text-align:center}.ai-assistant-welcome>span{width:58px;height:58px;display:grid;place-items:center;margin-bottom:14px;border-radius:18px;background:linear-gradient(145deg,#eef4ff,#f3efff);color:#4f64db;font-size:var(--font-xl)}.ai-assistant-welcome h2{margin:0 0 7px;font-size:var(--font-lg);font-weight:700}.ai-assistant-welcome p{max-width:310px;margin:0;color:#718096;font-size:var(--font-ui);line-height:1.8}.ai-message{display:flex;align-items:flex-start;gap:8px;margin-bottom:14px}.ai-message-user{justify-content:flex-start}.ai-message-avatar{width:28px;height:28px;margin-top:3px;border-radius:9px;font-size:.67rem}.ai-message-body{max-width:86%;padding:11px 12px;border:1px solid #e2e8f0;border-radius:14px 5px 14px 14px;background:#fff;box-shadow:0 3px 10px rgba(15,23,42,.03)}.ai-message-user .ai-message-body{border:0;border-radius:5px 14px 14px 14px;background:#275fdb;color:#fff}.ai-message-text{font-size:var(--font-ui);line-height:1.85;overflow-wrap:anywhere}.ai-message-actions{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px;padding-top:9px;border-top:1px solid #edf1f6}.ai-message-actions a{display:inline-flex;align-items:center;gap:5px;padding:6px 8px;border:1px solid #dbe6fc;border-radius:8px;background:#f5f8ff;color:#245fcf;text-decoration:none;font-size:var(--font-ui);font-weight:700}.ai-message-actions a:hover{border-color:#93b3f7;background:#edf3ff}.ai-message-meta{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:8px;color:#8a96a8;font-size:var(--font-xs)}.ai-message-meta button{border:0;background:transparent;color:#61728b;font-size:var(--font-xs)}.ai-message-meta button:hover{color:#2563eb}.ai-message-loading .ai-message-body{display:flex;align-items:center;gap:4px;padding:13px}.ai-message-loading .ai-message-body span{width:6px;height:6px;border-radius:50%;background:#7a91bb;animation:ai-dot 1.1s infinite ease-in-out}.ai-message-loading .ai-message-body span:nth-child(2){animation-delay:.15s}.ai-message-loading .ai-message-body span:nth-child(3){animation-delay:.3s}@keyframes ai-dot{0%,60%,100%{transform:translateY(0);opacity:.45}30%{transform:translateY(-4px);opacity:1}}.ai-assistant-error,.ai-assistant-notice{display:flex;align-items:flex-start;gap:7px;margin:8px 0;padding:9px 10px;border-radius:9px;font-size:var(--font-sm);line-height:1.6}.ai-assistant-error{border:1px solid #fecaca;background:#fef2f2;color:#b91c1c}.ai-assistant-notice{border:1px solid #fde68a;background:#fffbeb;color:#92400e}.ai-assistant-quick-actions{display:flex;gap:7px;padding:8px 12px;overflow-x:auto;background:#fff;border-top:1px solid #e8edf4;scrollbar-width:none}.ai-assistant-quick-actions::-webkit-scrollbar{display:none}.ai-assistant-quick-actions button{display:inline-flex;align-items:center;gap:6px;flex:0 0 auto;padding:7px 9px;border:1px solid #dbe4f1;border-radius:999px;background:#fff;color:#52637b;font-size:var(--font-ui);font-weight:700}.ai-assistant-quick-actions button:hover{border-color:#9db8f3;color:#2563eb;background:#f7f9ff}.ai-assistant-composer{padding:10px 12px 11px;background:#fff;border-top:1px solid #e5eaf1}.ai-assistant-composer form{padding:7px;border:1px solid #d7e0eb;border-radius:14px;background:#fff;transition:.16s}.ai-assistant-composer form:focus-within{border-color:#82a7f3;box-shadow:0 0 0 3px rgba(37,99,235,.08)}.ai-assistant-composer textarea{display:block;width:100%;max-height:120px;resize:none;padding:5px 6px;border:0;outline:0;background:transparent;color:#17233a;font:inherit;font-size:var(--font-ui);line-height:1.6}.ai-assistant-composer textarea::placeholder{color:#9aa7b9}.ai-composer-actions{display:flex;align-items:center;justify-content:space-between;margin-top:3px}.ai-composer-actions>div{display:flex;gap:2px}.ai-composer-actions button{width:31px;height:31px;display:grid;place-items:center;border:0;border-radius:9px;background:transparent;color:#718096}.ai-composer-actions button:hover{background:#f0f4f9;color:#2563eb}.ai-composer-actions button.is-listening{background:#fee2e2;color:#dc2626;animation:ai-pulse 1.4s infinite}.ai-composer-actions .ai-send-button{background:#2563eb;color:#fff}.ai-composer-actions .ai-send-button:hover{background:#1748bd;color:#fff}.ai-composer-actions .ai-send-button:disabled{opacity:.5}.ai-assistant-disclaimer{display:block;margin-top:6px;color:#9aa6b8;text-align:center;font-size:var(--font-xs)}.ai-image-preview{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:8px;margin-bottom:7px;padding:6px 8px;border:1px solid #dbe4ef;border-radius:10px;background:#f8fafc;color:#596981;font-size:var(--font-xs)}.ai-image-preview img{width:35px;height:35px;border-radius:7px;object-fit:cover}.ai-image-preview span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ai-image-preview button{width:25px;height:25px;border:0;border-radius:7px;background:#fff;color:#ef4444}.ai-assistant-history,.ai-assistant-settings{position:absolute;z-index:3;inset:67px 0 0;background:#fff;overflow-y:auto}.ai-assistant-history[hidden],.ai-assistant-settings[hidden]{display:none}.ai-assistant-subhead{display:flex;align-items:center;justify-content:space-between;padding:13px 15px;border-bottom:1px solid #e8edf4}.ai-assistant-subhead strong{font-size:var(--font-base)}.ai-history-row{display:grid;grid-template-columns:1fr auto;align-items:center;border-bottom:1px solid #edf1f5}.ai-history-row>button:first-child{display:flex;align-items:center;gap:10px;min-width:0;padding:12px 14px;border:0;background:transparent;text-align:right}.ai-history-row>button:first-child>i{color:#7390bd}.ai-history-row span{display:grid;min-width:0;gap:3px}.ai-history-row strong{overflow:hidden;color:#334155;font-size:var(--font-sm);text-overflow:ellipsis;white-space:nowrap}.ai-history-row small{color:#94a3b8;font-size:var(--font-xs)}.ai-history-row:hover,.ai-history-row.is-active{background:#f5f8ff}.ai-history-delete{width:32px;height:32px;margin-left:9px;border:0;border-radius:8px;background:transparent;color:#a3adba}.ai-history-delete:hover{background:#fef2f2;color:#dc2626}.ai-history-empty{display:grid;place-items:center;gap:7px;padding:70px 20px;color:#94a3b8;text-align:center}.ai-history-empty i{font-size:1.8rem}.ai-assistant-settings{padding-bottom:20px}.ai-assistant-settings>label{display:grid;gap:7px;padding:12px 16px;color:#475569;font-size:var(--font-sm)}.ai-assistant-settings select{height:40px;padding:0 10px;border:1px solid #dbe3ed;border-radius:9px;background:#fff}.ai-setting-toggle{grid-template-columns:1fr auto!important;align-items:center}.ai-setting-toggle input{width:18px;height:18px}.ai-stop-speaking{display:inline-flex;align-items:center;gap:7px;margin:8px 16px;padding:8px 11px;border:1px solid #dbe4ef;border-radius:9px;background:#fff;color:#52637b;font-size:var(--font-sm)}.ai-stop-speaking:hover{border-color:#fca5a5;color:#dc2626}.is-busy textarea{opacity:.65}@keyframes ai-pulse{50%{box-shadow:0 0 0 5px rgba(220,38,38,.12)}}@media(max-width:620px){.ai-assistant-drawer{width:100vw;border-left:0}.ai-assistant-backdrop{display:none}.ai-assistant-header{padding-top:max(13px,env(safe-area-inset-top))}.ai-assistant-messages{padding-inline:12px}.ai-message-body{max-width:90%}}@media(prefers-reduced-motion:reduce){.ai-assistant-drawer,.ai-assistant-trigger,.ai-message-actions a{transition:none}.ai-message-loading .ai-message-body span,.ai-composer-actions button.is-listening{animation:none}}

/* ai-assistant-enhancements.css */
.ai-message-actions button {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 6px 8px;
    border: 1px solid #dbe6fc;
    border-radius: 8px;
    background: #f5f8ff;
    color: #245fcf;
    font-size: var(--font-ui);
    font-weight: 700;
}

.ai-message-actions .ai-support-action {
    border-color: #bfdbfe;
    background: #eff6ff;
    color: #1d4ed8;
}

.ai-message-actions .ai-support-action:hover {
    border-color: #60a5fa;
    background: #dbeafe;
}

.ai-support-card {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 10px;
    padding: 10px;
    border: 1px solid #bfdbfe;
    border-radius: 11px;
    background: linear-gradient(135deg, #eff6ff, #f8fafc);
}

.ai-support-thread {
    margin: 12px 14px;
    border: 1px solid #bfdbfe;
    border-radius: 14px;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 8px 24px rgba(37, 99, 235, .08);
}

.ai-support-thread .ai-support-card {
    margin: 0;
    border: 0;
    border-radius: 0;
}

.ai-support-card > button {
    margin-inline-start: auto;
    width: 30px;
    height: 30px;
    border: 1px solid #bfdbfe;
    border-radius: 8px;
    background: #fff;
    color: #2563eb;
}

.ai-support-replies {
    display: grid;
    gap: 8px;
    padding: 12px;
    border-top: 1px solid #dbeafe;
}

.ai-support-replies > strong {
    color: #1e3a8a;
    font-size: var(--font-sm);
}

.ai-support-reply {
    padding: 10px;
    border-radius: 10px;
    background: #f0f7ff;
    border-inline-start: 3px solid #2563eb;
}

.ai-support-reply small {
    display: flex;
    align-items: center;
    gap: 5px;
    color: #64748b;
    font-size: var(--font-xs);
}

.ai-support-reply p {
    margin: 5px 0 0;
    color: #172554;
    font-size: var(--font-sm);
    line-height: 1.7;
}

.ai-support-reply.is-customer {
    background: #f8fafc;
    border-inline-start-color: #94a3b8;
}

.ai-support-reply-form {
    display: grid;
    gap: 7px;
    padding: 10px 12px;
    border-top: 1px solid #eef2ff;
}

.ai-support-reply-form textarea {
    width: 100%;
    min-height: 58px;
    resize: vertical;
    padding: 8px 10px;
    border: 1px solid #cbd5e1;
    border-radius: 9px;
    color: #0f172a;
    background: #fff;
    font: inherit;
    font-size: var(--font-ui);
}

.ai-support-reply-form textarea:focus {
    border-color: #2563eb;
    outline: 3px solid rgba(37, 99, 235, .1);
}

.ai-support-reply-form button {
    justify-self: start;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 7px 10px;
    border: 0;
    border-radius: 8px;
    background: #2563eb;
    color: #fff;
    font-size: var(--font-ui);
    font-weight: 700;
}

.ai-support-waiting,
.ai-support-customer-message {
    margin: 0;
    padding: 10px 12px;
    border-top: 1px solid #eef2ff;
    color: #64748b;
    font-size: var(--font-xs);
}

.ai-support-resolution {
    display: flex;
    gap: 8px;
    align-items: flex-start;
    margin: 10px 12px;
    padding: 9px;
    border-radius: 9px;
    background: #ecfdf5;
    color: #047857;
    font-size: var(--font-xs);
}

.ai-support-resolution span { display: grid; gap: 2px; }

.ai-support-contact {
    padding: 10px 12px 12px;
    border-top: 1px solid #eef2ff;
}

.ai-support-thread .ai-support-open {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin: 0 12px 12px;
    padding: 9px 12px;
    border: 1px solid #c7d2fe;
    border-radius: 10px;
    background: #f8fbff;
    color: var(--primary, #2563eb);
    font-size: var(--font-sm);
    font-weight: var(--weight-semibold);
    text-decoration: none;
}

.ai-support-contact > small {
    display: block;
    margin-bottom: 7px;
    color: #64748b;
    font-size: var(--font-xs);
}

.ai-support-contact > div,
.ai-welcome-support > div {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}

.ai-support-contact a,
.ai-welcome-support a {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 6px 8px;
    border: 1px solid #bfdbfe;
    border-radius: 8px;
    background: #fff;
    color: #1d4ed8;
    font-size: var(--font-xs);
    font-weight: 700;
    text-decoration: none;
}

.ai-welcome-support {
    width: 100%;
    margin-top: 12px;
    padding: 10px;
    border: 1px solid #dbeafe;
    border-radius: 10px;
    background: #f8fbff;
}

.ai-welcome-support:empty { display: none; }
.ai-welcome-support p { margin: 0 0 7px; color: #475569; font-size: var(--font-xs); }

.ai-support-card > span {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    border-radius: 10px;
    background: #2563eb;
    color: #fff;
}

.ai-support-card > div {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 2px 10px;
    align-items: center;
}

.ai-support-card small {
    grid-column: 1 / -1;
    color: #64748b;
    font-size: var(--font-xs);
}

.ai-support-card strong {
    color: #172554;
    font-size: var(--font-sm);
}

.ai-support-card em {
    padding: 2px 7px;
    border-radius: 999px;
    background: #dbeafe;
    color: #1d4ed8;
    font-size: var(--font-xs);
    font-style: normal;
}

.ai-voice-provider {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 14px 16px 4px;
    padding: 12px;
    border: 1px solid #e2e8f0;
    border-radius: 11px;
    background: #f8fafc;
    color: #64748b;
}

.ai-voice-provider > i {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    border-radius: 9px;
    background: #e2e8f0;
}

.ai-voice-provider > span {
    display: grid;
    gap: 2px;
}

.ai-voice-provider strong { font-size: var(--font-sm); }
.ai-voice-provider small { color: #94a3b8; font-size: var(--font-xs); }

.ai-voice-provider.is-natural {
    border-color: #bbf7d0;
    background: #f0fdf4;
    color: #15803d;
}

.ai-voice-provider.is-natural > i {
    background: #dcfce7;
    color: #16a34a;
}

.ai-message-meta button:disabled {
    opacity: .65;
    cursor: wait;
}

/* reports.css */
.reports-page {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 22px;
    color: var(--text-main);
}

.reports-hero,
.report-category-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 22px;
    padding: clamp(20px, 3vw, 30px);
    overflow: hidden;
    border: 1px solid var(--border-color);
    border-radius: 18px;
    background: linear-gradient(135deg, var(--bg-surface) 0%, var(--primary-light) 100%);
    box-shadow: var(--shadow-sm);
}

.reports-hero {
    justify-content: flex-start;
}

.reports-hero-icon,
.report-section-icon,
.report-ready-icon {
    display: grid;
    flex: 0 0 auto;
    place-items: center;
}

.reports-hero-icon {
    width: 64px;
    height: 64px;
    border-radius: 18px;
    color: #fff;
    background: var(--primary);
    box-shadow: 0 12px 24px rgb(37 99 235 / 20%);
    font-size: 1.45rem;
}

.reports-eyebrow,
.reports-section-heading span {
    display: block;
    margin-bottom: 4px;
    color: var(--primary);
    font-size: var(--font-xs);
    font-weight: 700;
}

.reports-hero h1,
.report-category-header h1 {
    margin: 0 0 6px;
    color: var(--text-main);
    font-size: var(--font-2xl);
    font-weight: 700;
}

.reports-hero p,
.report-category-header p {
    max-width: 760px;
    margin: 0;
    color: var(--text-muted);
    line-height: 1.75;
}

.report-section-grid,
.report-ready-grid,
.report-placeholder-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 270px), 1fr));
    gap: 16px;
}

.report-section-card {
    --report-accent: var(--primary);
    --report-soft: var(--primary-light);
    position: relative;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 14px;
    min-height: 190px;
    padding: 20px;
    overflow: hidden;
    border: 1px solid var(--border-color);
    border-radius: 16px;
    color: var(--text-main);
    background: var(--bg-surface);
    box-shadow: var(--shadow-sm);
    text-decoration: none;
    transition: transform var(--transition-fast), border-color var(--transition-fast), box-shadow var(--transition-fast);
}

.report-section-card::before {
    position: absolute;
    inset: 0 0 auto;
    height: 4px;
    background: var(--report-accent);
    content: '';
}

.report-section-card:hover {
    transform: translateY(-3px);
    border-color: color-mix(in srgb, var(--report-accent) 35%, var(--border-color));
    color: var(--text-main);
    box-shadow: var(--shadow-md);
}

.report-card-unavailable {
    cursor: default;
    opacity: .82;
    box-shadow: none;
}

.report-card-unavailable:hover {
    transform: none;
    border-color: var(--border-color);
    box-shadow: none;
}

.report-card-duplicate {
    border-style: dashed;
}

.report-section-card:focus-visible,
.report-ready-card:focus-visible,
.report-back-link:focus-visible {
    outline: 3px solid color-mix(in srgb, var(--report-accent, var(--primary)) 32%, transparent);
    outline-offset: 3px;
}

.report-section-icon {
    width: 48px;
    height: 48px;
    border-radius: 13px;
    color: var(--report-accent);
    background: var(--report-soft);
    font-size: 1.1rem;
}

.report-section-copy {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.report-status {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    gap: 5px;
    margin-bottom: 3px;
    padding: 4px 8px;
    border-radius: var(--border-radius-full);
    font-size: var(--font-xs);
    font-weight: 700;
}

.report-status-working {
    color: #166534;
    background: #dcfce7;
}

.report-status-duplicate {
    color: #075985;
    background: #e0f2fe;
}

.report-status-future,
.report-status-placeholder,
.report-status-broken_link {
    color: #92400e;
    background: #fef3c7;
}

.report-section-copy strong {
    margin: 3px 0 7px;
    font-size: var(--font-md);
    font-weight: 700;
}

.report-section-copy small,
.report-ready-card small,
.report-placeholder-card small {
    color: var(--text-muted);
    font-size: var(--font-xs);
    line-height: 1.7;
}

.report-section-action {
    display: inline-flex;
    grid-column: 1 / -1;
    align-self: end;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    color: var(--report-accent);
    font-size: var(--font-ui);
    font-weight: 700;
}

.report-category-header {
    --report-accent: var(--primary);
    --report-soft: var(--primary-light);
    background: linear-gradient(135deg, var(--bg-surface) 0%, var(--report-soft) 100%);
}

.report-category-title {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 16px;
}

.report-category-title .reports-eyebrow {
    color: var(--report-accent);
}

.report-back-link {
    --report-accent: var(--primary);
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    border: 1px solid var(--border-color);
    border-radius: var(--border-radius-full);
    color: var(--secondary);
    background: var(--bg-surface);
    box-shadow: var(--shadow-sm);
    text-decoration: none;
    white-space: nowrap;
    font-size: var(--font-sm);
    font-weight: 700;
    transition: color var(--transition-fast), border-color var(--transition-fast), box-shadow var(--transition-fast);
}

.report-back-link:hover {
    border-color: var(--primary);
    color: var(--primary);
    box-shadow: var(--shadow-md);
}

.report-ready-section,
.report-planned-section {
    padding: clamp(18px, 2.5vw, 24px);
    border: 1px solid var(--border-color);
    border-radius: 16px;
    background: var(--bg-surface);
    box-shadow: var(--shadow-sm);
}

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

.reports-section-heading h2 {
    margin: 0;
    color: var(--text-main);
    font-size: var(--font-md);
    font-weight: 700;
}

.reports-section-heading > i {
    color: #94a3b8;
    font-size: 1.2rem;
}

.report-ready-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    min-width: 0;
    padding: 15px;
    border: 1px solid var(--border-color);
    border-radius: 13px;
    color: var(--text-main);
    background: var(--bg-surface);
    text-decoration: none;
    transition: background-color var(--transition-fast), border-color var(--transition-fast), transform var(--transition-fast);
}

.report-ready-card:hover {
    transform: translateY(-2px);
    border-color: #bfdbfe;
    color: var(--text-main);
    background: var(--primary-light);
}

.report-ready-card > span:nth-child(2) {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.report-ready-card strong,
.report-placeholder-card strong {
    margin-bottom: 3px;
    font-size: var(--font-ui);
    font-weight: 700;
}

.report-ready-icon {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: var(--primary-light);
}

.report-card-arrow {
    color: #94a3b8;
    font-size: var(--font-sm);
}

.report-placeholder-card {
    display: flex;
    gap: 12px;
    min-width: 0;
    padding: 15px;
    border: 1px dashed #cbd5e1;
    border-radius: 13px;
    background: color-mix(in srgb, var(--bg-app) 68%, var(--bg-surface));
}

.report-placeholder-link {
    align-items: center;
    color: var(--text-main);
    text-decoration: none;
    transition: border-color var(--transition-fast), transform var(--transition-fast), background-color var(--transition-fast);
}

.report-placeholder-link:hover {
    transform: translateY(-2px);
    border-color: var(--primary);
    color: var(--text-main);
    background: var(--primary-light);
}

.report-placeholder-link > i:last-child {
    margin-inline-start: auto;
    color: var(--primary);
}

.report-center-empty {
    display: flex;
    grid-column: 1 / -1;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 150px;
    padding: 24px;
    border: 1px dashed var(--border-color);
    border-radius: 16px;
    color: var(--text-muted);
    background: var(--bg-surface);
}

.report-placeholder-card > span {
    display: grid;
    width: 38px;
    height: 38px;
    flex: 0 0 auto;
    place-items: center;
    border-radius: 10px;
    color: var(--secondary);
    background: var(--bg-surface);
    box-shadow: var(--shadow-sm);
}

.report-placeholder-card > div {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.report-related-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 18px 20px;
    border: 1px solid var(--border-color);
    border-radius: 14px;
    background: var(--bg-surface);
}

.report-related-footer > div {
    display: flex;
    flex-direction: column;
}

.report-related-footer strong {
    font-size: var(--font-base);
}

.report-related-footer span {
    margin-top: 3px;
    color: var(--text-muted);
    font-size: var(--font-sm);
}

.report-related-footer .btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
}

.report-tone-primary { --report-accent: var(--primary); --report-soft: var(--primary-light); }
.report-tone-secondary { --report-accent: var(--secondary); --report-soft: #f1f5f9; }
.report-tone-success { --report-accent: var(--success); --report-soft: var(--success-light); }
.report-tone-warning { --report-accent: var(--warning); --report-soft: var(--warning-light); }
.report-tone-danger { --report-accent: var(--danger); --report-soft: var(--danger-light); }
.report-tone-info { --report-accent: #0891b2; --report-soft: #ecfeff; }

@media (max-width: 768px) {
    .reports-hero,
    .report-category-header,
    .report-view-header,
    .report-related-footer {
        align-items: stretch !important;
        flex-direction: column;
    }

    .reports-hero {
        align-items: flex-start !important;
    }

    .report-back-link,
    .report-related-footer .btn {
        justify-content: center;
        width: 100%;
    }
}

@media (max-width: 480px) {
    .reports-page {
        gap: 16px;
    }

    .reports-hero-icon {
        width: 52px;
        height: 52px;
        border-radius: 14px;
        font-size: 1.2rem;
    }

    .report-category-title {
        align-items: flex-start;
    }

    .report-category-title .report-section-icon {
        width: 42px;
        height: 42px;
    }

    .report-section-card {
        min-height: 175px;
        padding: 18px;
    }

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

    .report-ready-card .report-card-arrow {
        display: none;
    }
}

/* sales-reports.css */
.sales-reports-page {
    --sales-accent: var(--primary);
    --sales-soft: var(--primary-light);
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 20px;
    color: var(--text-main);
}

.sales-reports-hero,
.sales-report-view-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 22px;
    padding: clamp(20px, 3vw, 30px);
    border: 1px solid var(--border-color);
    border-radius: 18px;
    background: linear-gradient(135deg, var(--bg-surface), var(--primary-light));
    box-shadow: var(--shadow-sm);
}

.sales-reports-hero-copy,
.sales-report-view-title {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 16px;
}

.sales-reports-hero-icon,
.sales-report-view-title > span {
    display: grid;
    width: 60px;
    height: 60px;
    flex: 0 0 auto;
    place-items: center;
    border-radius: 17px;
    color: #fff;
    background: var(--primary);
    box-shadow: 0 12px 24px rgb(37 99 235 / 20%);
    font-size: 1.35rem;
}

.sales-reports-eyebrow {
    display: block;
    margin-bottom: 4px;
    color: var(--primary);
    font-size: var(--font-xs);
    font-weight: 700;
}

.sales-reports-hero h1,
.sales-report-view-header h1 {
    margin: 0 0 6px;
    font-size: var(--font-2xl);
    font-weight: 700;
}

.sales-reports-hero p,
.sales-report-view-header p {
    max-width: 790px;
    margin: 0;
    color: var(--text-muted);
    line-height: 1.7;
}

.sales-report-groups {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.sales-report-group {
    --sales-accent: var(--primary);
    --sales-soft: var(--primary-light);
    position: relative;
    min-width: 0;
    overflow: hidden;
    border: 1px solid var(--border-color);
    border-radius: 17px;
    background: var(--bg-surface);
    box-shadow: var(--shadow-sm);
}

.sales-report-group::before {
    position: absolute;
    inset: 0 0 auto;
    height: 4px;
    background: var(--sales-accent);
    content: '';
}

.sales-report-group.is-wide {
    grid-column: 1 / -1;
}

.sales-report-group-header {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 13px;
    padding: 20px;
    border-bottom: 1px solid var(--border-color);
    background: linear-gradient(135deg, var(--bg-surface), var(--sales-soft));
}

.sales-report-group-icon {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 12px;
    color: var(--sales-accent);
    background: var(--bg-surface);
    box-shadow: var(--shadow-sm);
    font-size: 1.05rem;
}

.sales-report-group-header h2 {
    margin: 0 0 4px;
    font-size: var(--font-md);
    font-weight: 700;
}

.sales-report-group-header p {
    margin: 0;
    color: var(--text-muted);
    font-size: var(--font-sm);
    line-height: 1.6;
}

.sales-report-count {
    padding: 6px 9px;
    border-radius: var(--border-radius-full);
    color: var(--sales-accent);
    background: var(--bg-surface);
    white-space: nowrap;
    font-size: var(--font-xs);
    font-weight: 700;
}

.sales-report-items {
    display: grid;
    gap: 0;
}

.sales-report-item {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    min-width: 0;
    padding: 13px 16px;
    border-bottom: 1px solid var(--border-color);
    transition: background-color var(--transition-fast);
}

.sales-report-item:last-child {
    border-bottom: 0;
}

.sales-report-item:hover {
    background: color-mix(in srgb, var(--sales-soft) 44%, var(--bg-surface));
}

.sales-report-item-title {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    min-width: 0;
    color: var(--text-main);
    text-decoration: none;
}

.sales-report-item-title:hover {
    color: var(--sales-accent);
}

.sales-report-item-title > span {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;
    border-radius: 9px;
    color: var(--sales-accent);
    background: var(--sales-soft);
    font-size: var(--font-ui);
}

.sales-report-item-title strong {
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: var(--font-ui);
    font-weight: 700;
    white-space: nowrap;
}

.sales-report-item-title > i {
    color: #94a3b8;
    font-size: .66rem;
}

.sales-report-item-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 5px;
}

.sales-report-item-actions a {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 6px 8px;
    border: 1px solid var(--border-color);
    border-radius: 8px;
    color: var(--secondary);
    background: var(--bg-surface);
    text-decoration: none;
    font-size: var(--font-ui);
    font-weight: 700;
    transition: border-color var(--transition-fast), color var(--transition-fast), background-color var(--transition-fast);
}

.sales-report-item-actions a:hover,
.sales-report-item-actions a.is-primary {
    border-color: var(--sales-accent);
    color: var(--sales-accent);
    background: var(--sales-soft);
}

.sales-period-shortcut {
    padding: 18px 20px 20px;
    border-top: 1px solid var(--border-color);
    background: color-mix(in srgb, var(--warning-light) 28%, var(--bg-surface));
}

.sales-period-shortcut-heading {
    display: flex;
    flex-direction: column;
    margin-bottom: 13px;
}

.sales-period-shortcut-heading strong {
    font-size: var(--font-base);
}

.sales-period-shortcut-heading span {
    margin-top: 2px;
    color: var(--text-muted);
    font-size: var(--font-sm);
}

.sales-report-filters-card,
.sales-report-results-card {
    min-width: 0;
    border: 1px solid var(--border-color);
    border-radius: 16px;
    background: var(--bg-surface);
    box-shadow: var(--shadow-sm);
}

.sales-report-filters-card > header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 16px 18px;
    border-bottom: 1px solid var(--border-color);
}

.sales-report-filters-card > header span,
.sales-report-results-toolbar > div:first-child > span {
    display: block;
    margin-bottom: 2px;
    color: var(--primary);
    font-size: var(--font-xs);
    font-weight: 700;
}

.sales-report-filters-card > header h2,
.sales-report-results-toolbar h2 {
    margin: 0;
    font-size: var(--font-base);
    font-weight: 700;
}

.sales-report-filters-card > header > i {
    color: #94a3b8;
}

.sales-report-filter-form {
    padding: 18px;
}

.sales-report-filter-form.is-compact {
    padding: 0;
}

.sales-report-filter-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(140px, 1fr));
    gap: 12px;
}

.sales-report-filter-form.is-compact .sales-report-filter-grid {
    grid-template-columns: repeat(4, minmax(130px, 1fr));
}

.sales-filter-field {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 6px;
}

.sales-filter-field > span {
    display: flex;
    align-items: center;
    gap: 6px;
    color: var(--text-muted);
    font-size: var(--font-ui);
    font-weight: 700;
}

.sales-filter-field > span i {
    width: 14px;
    color: var(--primary);
    text-align: center;
}

.sales-filter-field .form-control,
.sales-filter-field .form-select {
    min-height: 40px;
    border-color: var(--border-color);
    font-size: var(--font-ui);
}

.sales-filter-field .form-control:focus,
.sales-filter-field .form-select:focus {
    border-color: var(--primary);
    box-shadow: 0 0 0 3px rgb(37 99 235 / 10%);
}

.sales-report-filter-actions {
    display: flex;
    justify-content: flex-end;
    gap: 9px;
    margin-top: 15px;
}

.sales-report-filter-actions .btn,
.sales-report-export-actions .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    font-size: var(--font-ui);
    font-weight: 700;
}

.sales-report-kpis {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}

.sales-report-kpis article {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 11px;
    padding: 14px;
    border: 1px solid var(--border-color);
    border-radius: 13px;
    background: var(--bg-surface);
    box-shadow: var(--shadow-sm);
}

.sales-report-kpis article > span {
    display: grid;
    width: 38px;
    height: 38px;
    flex: 0 0 auto;
    place-items: center;
    border-radius: 10px;
    color: var(--primary);
    background: var(--primary-light);
    font-size: var(--font-ui);
}

.sales-report-kpis article > div {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.sales-report-kpis small {
    overflow: hidden;
    color: var(--text-muted);
    text-overflow: ellipsis;
    font-size: var(--font-xs);
    white-space: nowrap;
}

.sales-report-kpis strong {
    margin-top: 3px;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: var(--font-ui);
    white-space: nowrap;
}

.sales-channel-summary {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}

.sales-channel-card {
    --channel-accent: var(--primary);
    --channel-soft: var(--primary-light);
    position: relative;
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 11px;
    padding: 14px;
    overflow: hidden;
    border: 1px solid var(--border-color);
    border-radius: 13px;
    background: var(--bg-surface);
    box-shadow: var(--shadow-sm);
}

.sales-channel-card::before {
    position: absolute;
    inset-block: 0;
    inset-inline-start: 0;
    width: 3px;
    background: var(--channel-accent);
    content: '';
}

.sales-channel-card > span:first-child {
    display: grid;
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    place-items: center;
    border-radius: 10px;
    color: var(--channel-accent);
    background: var(--channel-soft);
}

.sales-channel-card > div {
    display: grid;
    min-width: 0;
    gap: 2px;
}

.sales-channel-card small,
.sales-channel-card em {
    overflow: hidden;
    color: var(--text-muted);
    text-overflow: ellipsis;
    font-size: var(--font-xs);
    font-style: normal;
    white-space: nowrap;
}

.sales-channel-card strong {
    overflow: hidden;
    color: var(--text-main);
    text-overflow: ellipsis;
    font-size: var(--font-base);
    white-space: nowrap;
}

.sales-channel-card > span:last-child:not(:first-child) {
    margin-inline-start: auto;
    padding: 4px 7px;
    border-radius: var(--border-radius-full);
    color: var(--channel-accent);
    background: var(--channel-soft);
    font-size: var(--font-xs);
    font-weight: 700;
}

.sales-channel-card.is-ecommerce { --channel-accent: #345eb7; --channel-soft: #edf3ff; }
.sales-channel-card.is-direct { --channel-accent: var(--secondary); --channel-soft: #f1f5f9; }
.sales-channel-card.is-pos { --channel-accent: var(--success); --channel-soft: var(--success-light); }

.sales-channel-cell {
    display: grid;
    justify-items: start;
    gap: 4px;
}

.sales-channel-cell small {
    color: var(--text-muted);
    font-size: var(--font-xs);
}

.sales-report-results-toolbar {
    display: grid;
    grid-template-columns: minmax(170px, 1fr) minmax(230px, 360px) auto;
    align-items: center;
    gap: 13px;
    padding: 15px 18px;
    border-bottom: 1px solid var(--border-color);
}

.sales-report-search {
    position: relative;
    display: flex;
    min-width: 0;
}

.sales-report-search > i {
    position: absolute;
    inset: 50% 11px auto auto;
    transform: translateY(-50%);
    color: #94a3b8;
    font-size: .75rem;
}

.sales-report-search input {
    width: 100%;
    min-height: 38px;
    padding: 7px 34px 7px 58px;
    border: 1px solid var(--border-color);
    border-radius: 9px;
    color: var(--text-main);
    background: var(--bg-surface);
    font: inherit;
    font-size: var(--font-ui);
}

.sales-report-search button {
    position: absolute;
    inset: 4px auto 4px 4px;
    padding: 0 10px;
    border: 0;
    border-radius: 7px;
    color: #fff;
    background: var(--primary);
    font: inherit;
    font-size: var(--font-ui);
    font-weight: 700;
}

.sales-report-export-actions {
    display: flex;
    justify-content: flex-end;
    gap: 7px;
}

.sales-report-table-wrap {
    width: 100%;
    overflow-x: auto;
}

.sales-report-table {
    width: 100%;
    min-width: 1080px;
    border-collapse: collapse;
}

.sales-report-table th,
.sales-report-table td {
    padding: 11px 12px;
    border-bottom: 1px solid var(--border-color);
    text-align: right;
    vertical-align: middle;
    font-size: var(--font-ui);
    white-space: nowrap;
}

.sales-report-table th {
    background: color-mix(in srgb, var(--bg-app) 72%, var(--bg-surface));
}

.sales-report-table th button {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 0;
    border: 0;
    color: var(--secondary);
    background: transparent;
    font: inherit;
    font-weight: 700;
}

.sales-report-table th button i {
    color: #94a3b8;
    font-size: var(--font-ui);
}

.sales-report-table th button:hover,
.sales-report-table th button.is-active {
    color: var(--primary);
}

.sales-report-table tbody tr:hover {
    background: var(--primary-light);
}

.sales-report-table tfoot td {
    position: sticky;
    bottom: 0;
    border-top: 2px solid color-mix(in srgb, var(--primary) 28%, var(--border-color));
    border-bottom: 0;
    color: var(--secondary);
    background: color-mix(in srgb, var(--primary-light) 58%, var(--bg-surface));
    font-weight: 700;
}

.sales-report-table td.type-money,
.sales-report-table td.type-number,
.sales-report-table td.type-percent {
    ;
    font-weight: 700;
}

.sales-status {
    display: inline-flex;
    padding: 4px 8px;
    border-radius: var(--border-radius-full);
    font-size: var(--font-xs);
    font-weight: 700;
}

.sales-status-primary { color: #1d4ed8; background: #dbeafe; }
.sales-status-success { color: #047857; background: #d1fae5; }
.sales-status-warning { color: #b45309; background: #fef3c7; }
.sales-status-danger { color: #b91c1c; background: #fee2e2; }
.sales-status-muted { color: #475569; background: #e2e8f0; }

.sales-report-pagination {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 12px;
    padding: 13px 16px;
    color: var(--text-muted);
    font-size: var(--font-sm);
}

.sales-report-pagination > label {
    justify-self: end;
}

.sales-report-pagination select {
    margin-inline-start: 5px;
    padding: 4px 7px;
    border: 1px solid var(--border-color);
    border-radius: 7px;
    color: var(--text-main);
    background: var(--bg-surface);
}

.sales-page-buttons {
    display: flex;
    gap: 4px;
}

.sales-page-buttons button {
    display: grid;
    min-width: 30px;
    height: 30px;
    padding: 0 7px;
    place-items: center;
    border: 1px solid var(--border-color);
    border-radius: 7px;
    color: var(--secondary);
    background: var(--bg-surface);
    font: inherit;
    font-weight: 700;
}

.sales-page-buttons button:hover:not(:disabled),
.sales-page-buttons button.active {
    border-color: var(--primary);
    color: #fff;
    background: var(--primary);
}

.sales-page-buttons button:disabled {
    cursor: not-allowed;
    opacity: .45;
}

.sales-report-loading,
.sales-report-error,
.sales-report-empty,
.sales-report-inline-loading {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    color: var(--text-muted);
}

.sales-report-loading,
.sales-report-error {
    min-height: 270px;
    flex-direction: column;
    padding: 30px;
    border: 1px solid var(--border-color);
    border-radius: 16px;
    background: var(--bg-surface);
    text-align: center;
    box-shadow: var(--shadow-sm);
}

.sales-report-loading > i,
.sales-report-error > i {
    margin-bottom: 4px;
    color: var(--primary);
    font-size: 2rem;
}

.sales-report-error > i {
    color: var(--danger);
}

.sales-report-loading strong,
.sales-report-error strong,
.sales-report-empty strong {
    color: var(--text-main);
}

.sales-report-loading span,
.sales-report-error span,
.sales-report-empty span {
    font-size: var(--font-sm);
}

.sales-report-empty {
    min-height: 180px;
    flex-direction: column;
}

.sales-report-empty i {
    color: #cbd5e1;
    font-size: 1.8rem;
}

.sales-report-inline-loading {
    min-height: 70px;
    font-size: var(--font-sm);
}

.sales-tone-primary { --sales-accent: var(--primary); --sales-soft: var(--primary-light); }
.sales-tone-success { --sales-accent: var(--success); --sales-soft: var(--success-light); }
.sales-tone-warning { --sales-accent: var(--warning); --sales-soft: var(--warning-light); }
.sales-tone-danger { --sales-accent: var(--danger); --sales-soft: var(--danger-light); }
.sales-tone-info { --sales-accent: #0891b2; --sales-soft: #ecfeff; }
.sales-tone-secondary { --sales-accent: var(--secondary); --sales-soft: #f1f5f9; }

@media (max-width: 1180px) {
    .sales-report-groups {
        grid-template-columns: 1fr;
    }

    .sales-report-group.is-wide {
        grid-column: auto;
    }

    .sales-report-filter-grid,
    .sales-report-filter-form.is-compact .sales-report-filter-grid {
        grid-template-columns: repeat(3, minmax(130px, 1fr));
    }

    .sales-report-results-toolbar {
        grid-template-columns: 1fr minmax(220px, 340px);
    }

    .sales-report-export-actions {
        grid-column: 1 / -1;
    }
}

@media (max-width: 820px) {
    .sales-reports-hero,
    .sales-report-view-header {
        align-items: stretch;
        flex-direction: column;
    }

    .sales-reports-hero .report-back-link,
    .sales-report-view-header .report-back-link {
        justify-content: center;
        width: 100%;
    }

    .sales-report-item {
        grid-template-columns: 1fr;
    }

    .sales-report-item-actions {
        justify-content: flex-start;
        padding-inline-start: 44px;
    }

    .sales-report-filter-grid,
    .sales-report-filter-form.is-compact .sales-report-filter-grid {
        grid-template-columns: repeat(2, minmax(130px, 1fr));
    }

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

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

    .sales-report-results-toolbar {
        grid-template-columns: 1fr;
    }

    .sales-report-export-actions {
        grid-column: auto;
        justify-content: flex-start;
    }

    .sales-report-pagination {
        grid-template-columns: 1fr 1fr;
    }

    .sales-page-buttons {
        grid-column: 1 / -1;
        grid-row: 1;
        justify-content: center;
    }
}

@media (max-width: 540px) {
    .sales-reports-page {
        gap: 15px;
    }

    .sales-reports-hero-copy,
    .sales-report-view-title {
        align-items: flex-start;
    }

    .sales-reports-hero-icon,
    .sales-report-view-title > span {
        width: 48px;
        height: 48px;
        border-radius: 13px;
        font-size: 1.05rem;
    }

    .sales-report-group-header {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .sales-report-count {
        grid-column: 1 / -1;
        justify-self: start;
    }

    .sales-report-item-title strong {
        white-space: normal;
    }

    .sales-report-filter-grid,
    .sales-report-filter-form.is-compact .sales-report-filter-grid,
    .sales-report-kpis,
    .sales-channel-summary {
        grid-template-columns: 1fr;
    }

    .sales-report-filter-actions,
    .sales-report-export-actions {
        flex-direction: column;
    }

    .sales-report-filter-actions .btn,
    .sales-report-export-actions .btn {
        width: 100%;
    }

    .sales-report-pagination {
        grid-template-columns: 1fr;
        justify-items: center;
    }

    .sales-report-pagination > label {
        justify-self: center;
    }
}

@media print {
    .sidebar,
    .topbar,
    .sales-report-view-header .report-back-link,
    .sales-report-filters-card,
    .sales-report-search,
    .sales-report-export-actions,
    .sales-report-pagination {
        display: none !important;
    }

    #app-wrapper,
    .main-wrapper {
        display: block;
        width: 100%;
    }

    .main-content {
        padding: 0;
    }

    .sales-report-view-header,
    .sales-report-results-card,
    .sales-report-kpis article,
    .sales-channel-card {
        border-color: #cbd5e1;
        box-shadow: none;
    }

    .sales-report-table {
        min-width: 100%;
    }

    .sales-report-table th,
    .sales-report-table td {
        padding: 6px;
        font-size: 8pt;
    }
}

/* ---- Redesigned sales report screens (المبيعات حسب العميل) ----------------------------------------------------------
   The page uses the redesigned report layout shared with the inventory reports (.ivr-* in inventory-reports.css: header,
   breadcrumbs, output actions, filters card, KPI cards, notes, table, pagination) and the shared Detailed / Summary switch
   (.report-view-switch in components.css); only the sales specifics are below. */
.sales-modern-page { --primary: #185adb; --primary-light: #eaf2ff; display: grid; gap: 14px; }
.sales-modern-page > * { min-width: 0; }
.sales-filters-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; padding-bottom: 10px; border-bottom: 1px solid #edf1f6; }
.sales-filters-head strong { display: block; font-size: var(--font-md); color: #0f172a; }
.sales-filters-head span { font-size: var(--font-xs); color: #64748b; }
.sales-filters-head > i { color: #94a3b8; }
/* The report's criteria on two lines (five or six per line, --sales-fields), View Report at the end of the last line; its
   secondary criteria sit behind «إعدادات متقدمة» (a native disclosure, open when one of them is set). */
.ivr-filter-form.sales-filter-form { grid-template-columns: repeat(var(--sales-fields, 5), minmax(0, 1fr)); }
.sales-filter-form .ivr-filter-submit { grid-column: -2 / -1; justify-self: end; }
.sales-advanced-filters { align-self: end; min-width: 0; }
.sales-advanced-filters > summary { display: inline-flex; align-items: center; gap: 7px; height: 40px; padding-inline: 14px; border: 1px solid #dbe5f1; border-radius: 9px; background: #fff; color: #334155; font-size: var(--font-sm); font-weight: 600; cursor: pointer; list-style: none; }
.sales-advanced-filters > summary::-webkit-details-marker { display: none; }
.sales-advanced-filters > summary:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }
.sales-advanced-filters[open] > summary { border-color: var(--primary); color: var(--primary); }
.sales-advanced-filters > div { display: grid; gap: 12px; margin-top: 10px; }

/* Results: title, mode and counts beside the search. The table fits a laptop width with compact cells (scoped to the page
   so they win over the shared .ivr-table rules): names wrap, figures and codes stay on one line, the invoice number sits
   under its customer and the profit under its margin; the table still scrolls inside its card when needed. */
.sales-results-head { display: flex; align-items: flex-end; justify-content: space-between; flex-wrap: wrap; gap: 12px 20px; padding: 14px 16px; border-bottom: 1px solid #e2e8f0; }
.sales-results-head span { font-size: var(--font-xs); font-weight: 700; color: var(--primary); }
.sales-results-head h2 { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin: 2px 0; font-size: var(--font-lg); color: #0f172a; }
.sales-results-head small { font-size: var(--font-xs); color: #64748b; }
.sales-mode-chip { padding: 2px 10px; border-radius: 999px; background: var(--primary-light); color: var(--primary); font-size: var(--font-xs); font-style: normal; font-weight: 700; }
.sales-results-search { position: relative; display: flex; align-items: center; gap: 8px; flex: 0 1 440px; min-width: 260px; }
.sales-results-search > i { position: absolute; inset-inline-start: 12px; color: #94a3b8; font-size: 13px; pointer-events: none; }
.sales-results-search input { flex: 1 1 auto; min-width: 0; height: 38px; padding-inline: 34px 12px; border: 1px solid #dbe5f1; border-radius: 9px; font: inherit; font-size: var(--font-sm); }
.sales-results-search input:focus { outline: 2px solid var(--primary); outline-offset: 1px; border-color: var(--primary); }
.sales-results-search .btn { height: 38px; padding-inline: 16px; border-radius: 9px; font-weight: 600; }
.sales-results-card .report-state { margin: 16px; }
.sales-modern-page .sales-table { font-size: var(--font-sm); }
/* Thirteen columns or more (the detailed tables, the employee summary): the caption size and tighter cells so a laptop shows them whole. */
.sales-modern-page .sales-table.is-compact { font-size: var(--font-xs); }
.sales-modern-page .sales-table.is-compact td { padding-inline: 4px; }
.sales-modern-page .sales-table.is-compact th > button, .sales-modern-page .sales-table.is-compact .ivr-th-label { padding-inline: 4px; font-size: 11.5px; }
.sales-modern-page .sales-table.is-compact .sales-badge { min-width: 0; padding-inline: 8px; }
.sales-modern-page .sales-table.is-compact .is-index { width: 24px; }
.sales-modern-page .sales-table.is-compact th.is-numeric { min-width: 60px; }
.sales-modern-page .sales-table td { padding: 7px 5px; }
.sales-modern-page .sales-table th > button, .sales-modern-page .sales-table .ivr-th-label { gap: 4px; padding: 9px 6px; font-size: var(--font-xs); }
.sales-modern-page .sales-table th > button i { font-size: 10px; }
.sales-modern-page .sales-table th.is-numeric { min-width: 68px; }
.sales-modern-page .sales-table .is-party { min-width: 130px; max-width: 230px; }
.sales-modern-page .sales-table .is-party > a, .sales-modern-page .sales-table .is-party > bdi { font-weight: 700; color: #0f172a; text-decoration: none; }
.sales-modern-page .sales-table .is-party > a:hover, .sales-modern-page .sales-table .is-party > a:focus-visible { color: var(--primary); text-decoration: underline; }
.sales-invoice-number { display: block; margin-top: 2px; font-size: 11.5px; color: #64748b; white-space: nowrap; }
.sales-profit-amount { display: block; margin-top: 2px; font-size: var(--font-xs); font-weight: 400; color: #64748b; white-space: nowrap; }
.sales-modern-page .sales-table .is-person { min-width: 64px; }
.sales-modern-page .sales-table .is-date, .sales-modern-page .sales-table .si-channel-badge { white-space: nowrap; }
.sales-modern-page .sales-table .si-channel-badge { gap: 4px; padding: 2px 7px; }
.sales-modern-page .sales-table td.is-actions, .sales-modern-page .sales-table th.is-actions { width: 64px; }
.sales-modern-page .sales-table .ivr-view { padding: 3px 8px; }
.sales-channel-order { display: block; margin-top: 2px; font-size: var(--font-xs); color: #64748b; }
/* Invoice status and the customer's profitability are written in words (never colour alone). */
.sales-badge { display: inline-flex; align-items: center; justify-content: center; min-width: 58px; padding: 3px 10px; border-radius: 999px; font-size: var(--font-xs); font-weight: 700; white-space: nowrap; }
.sales-badge.is-issued { background: #e0ecff; color: #1d4ed8; }
.sales-badge.is-paid, .sales-badge.is-profitable { background: #dcfce7; color: #166534; }
.sales-badge.is-loss { background: #fee2e2; color: #b91c1c; }
.sales-badge.is-break_even { background: #f1f5f9; color: #475569; }
.sales-profit.is-profitable { color: #15803d; font-weight: 700; }
.sales-profit.is-loss { color: #b91c1c; font-weight: 700; }
.sales-cost-missing { margin-inline-start: 5px; color: #d97706; font-size: 11px; cursor: help; }

/* Below a wide screen the row's «Details» shows its icon only (the words stay for screen readers and in the tooltip). */
@media (max-width: 1599px) {
    .sales-modern-page .sales-view-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
    .sales-modern-page .sales-table td.is-actions, .sales-modern-page .sales-table th.is-actions { width: 44px; }
}

@media (max-width: 1280px) {
    .ivr-filter-form.sales-filter-form { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
    .ivr-filter-form.sales-filter-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .sales-filter-form .ivr-filter-submit { grid-column: 1 / -1; justify-self: stretch; }
    .sales-results-search { flex-basis: 100%; min-width: 0; }
}

@media (max-width: 420px) {
    .ivr-filter-form.sales-filter-form { grid-template-columns: minmax(0, 1fr); }
}

/* The printed document (canonical preview = print = PDF): the full result on A4 landscape sheets. It lives in the
   body-level print host, so these rules never depend on the page around the report. */
.sales-report-document { background: #fff; color: #0f172a; font-size: 9px; line-height: 1.45; }
.sales-report-document .sales-doc-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 8mm; margin-bottom: 3mm; padding-bottom: 2.5mm; border-bottom: 1.5px solid #0f172a; }
.sales-report-document .sales-doc-head strong { font-size: 10px; color: #334155; }
.sales-report-document .sales-doc-head h1 { margin: 1mm 0; font-size: 15px; }
.sales-report-document .sales-doc-head p { margin: 0; color: #475569; }
.sales-report-document .sales-doc-head dl { display: grid; grid-template-columns: repeat(3, auto); gap: 1mm 5mm; margin: 0; }
.sales-report-document .sales-doc-head dl div { display: flex; gap: 1.5mm; }
.sales-report-document .sales-doc-head dt { font-weight: 700; color: #334155; }
.sales-report-document .sales-doc-head dd { margin: 0; }
.sales-report-document .sales-doc-kpis { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 1.5mm; margin-bottom: 3mm; }
.sales-report-document .sales-doc-kpis div { padding: 1.5mm 2mm; border: .6px solid #cbd5e1; border-radius: 1.5mm; }
.sales-report-document .sales-doc-kpis span { display: block; color: #475569; }
.sales-report-document .sales-doc-kpis strong { font-size: 10.5px; font-variant-numeric: tabular-nums; }
.sales-report-document .sales-doc-table { width: 100%; border-collapse: collapse; }
.sales-report-document .sales-doc-table th, .sales-report-document .sales-doc-table td { padding: 1mm 1.2mm; border: .6px solid #94a3b8; text-align: start; vertical-align: top; }
.sales-report-document .sales-doc-table th { background: #eef2f7; font-weight: 700; }
.sales-report-document .sales-doc-table .is-numeric { text-align: end; white-space: nowrap; font-variant-numeric: tabular-nums; }
.sales-report-document .sales-doc-table .is-index { width: 6mm; color: #64748b; }
.sales-report-document .sales-doc-table tfoot td { background: #f1f5f9; font-weight: 700; }
.sales-report-document .sales-doc-table tr { break-inside: avoid; }
.sales-report-document .sales-doc-note, .sales-report-document .sales-doc-empty { margin: 2.5mm 0 0; color: #475569; font-size: 8.5px; }

/* purchase-reports.css */
.purchase-reports-hero .sales-reports-hero-icon,
.purchase-report-view-header .sales-report-view-title > span {
    background: linear-gradient(145deg, #f59e0b, #d97706);
}

.purchase-report-note {
    display: flex;
    align-items: center;
    gap: .4rem;
    padding: 0 .85rem .65rem;
    color: var(--text-muted, #64748b);
    font-size: var(--font-xs);
    line-height: 1.6;
}

/* RV-24: a report's note takes its own full-width line under the title; as a third grid child it fell into the actions
   column, squeezed the title to an ellipsis and pushed the actions to a line of their own. */
.sales-report-item > .purchase-report-note {
    grid-column: 1 / -1;
    grid-row: 2;
    padding: 0;
}

.purchase-report-guidance > i {
    animation: none;
    color: #d97706;
}

@media (min-width: 1100px) {
    .purchase-report-groups {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media print {
    .purchase-reports-page .sales-report-view-header,
    .purchase-reports-page .sales-report-filters-card,
    .purchase-reports-page .sales-report-search,
    .purchase-reports-page .sales-report-export-actions,
    .purchase-reports-page .sales-report-pagination {
        display: none !important;
    }
}

/* purchase-invoices.css */
/* Purchase invoices — isolated full-page experience. */
:root {
    --pi-purple: #6246e5;
    --pi-purple-strong: #5138cf;
    --pi-purple-soft: #f1efff;
    --pi-ink: #172033;
    --pi-muted: #697386;
    --pi-line: #e7e9f2;
    --pi-surface: #ffffff;
    --pi-bg: #f7f8fc;
    --pi-shadow: 0 8px 24px rgba(35, 42, 74, .06);
}

#purchase-invoices-root {
    color: var(--pi-ink);
    min-width: 0;
}

.pi-page { width: 100%; min-width: 0; }
.pi-page button, .pi-page input, .pi-page select, .pi-page textarea,
.pi-modal-overlay button, .pi-modal-overlay input, .pi-modal-overlay select, .pi-modal-overlay textarea {
    font-family: inherit;
}

.pi-page-head, .pi-detail-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 22px;
}

.pi-page-head h1, .pi-detail-head h1 {
    margin: 7px 0 4px;
    color: var(--pi-ink);
    font-size: var(--font-2xl);
    font-weight: 700;
}

.pi-page-head p, .pi-detail-head p { margin: 0; color: var(--pi-muted); font-size: var(--font-base); }
.pi-breadcrumb { display: flex; align-items: center; gap: 8px; color: #8b93a5; font-size: var(--font-xs); }
.pi-breadcrumb i { font-size: .6rem; }
.pi-breadcrumb strong { color: var(--pi-purple); }
.pi-head-actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.pi-head-actions .btn, .pi-page-head .btn { border-radius: 9px; padding: .7rem 1rem; font-weight: 700; box-shadow: none; }
.pi-head-actions .btn-primary, .pi-page-head .btn-primary { background: var(--pi-purple); border-color: var(--pi-purple); }
.pi-head-actions .btn-primary:hover, .pi-page-head .btn-primary:hover { background: var(--pi-purple-strong); }

.pi-kpi-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(145px, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}

.pi-kpi {
    min-height: 92px;
    padding: 16px;
    display: flex;
    gap: 12px;
    align-items: center;
    background: var(--pi-surface);
    border: 1px solid var(--pi-line);
    border-radius: 12px;
    box-shadow: 0 3px 12px rgba(35, 42, 74, .035);
}

.pi-kpi-icon {
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
    border-radius: 10px;
    display: grid;
    place-items: center;
    color: var(--pi-purple);
    background: var(--pi-purple-soft);
}

.pi-kpi small { display: block; margin-bottom: 5px; color: var(--pi-muted); font-size: var(--font-sm); white-space: nowrap; }
.pi-kpi strong { display: block; color: var(--pi-ink); font-weight:700;font-size:var(--font-base);line-height:1.25; }
.pi-kpi.is-blue .pi-kpi-icon { color: #2773d2; background: #ecf5ff; }
.pi-kpi.is-green .pi-kpi-icon { color: #16945f; background: #eaf9f2; }
.pi-kpi.is-orange .pi-kpi-icon { color: #d77919; background: #fff5e9; }
.pi-kpi.is-red .pi-kpi-icon { color: #d94e5a; background: #fff0f1; }
.pi-kpi.is-violet .pi-kpi-icon { color: #8b47c8; background: #f7effd; }

.pi-filter-card, .pi-table-card, .pi-card, .pi-supplier-card, .pi-items-card, .pi-attachments-card,
.pi-payment-summary, .pi-payment-tab-head, .pi-invoice-meta-strip {
    background: var(--pi-surface);
    border: 1px solid var(--pi-line);
    border-radius: 12px;
    box-shadow: 0 3px 12px rgba(35, 42, 74, .035);
}

.pi-filter-card { padding: 16px; margin-bottom: 14px; }
.pi-search-row { display: flex; align-items: center; gap: 10px; }
.pi-search-box {
    min-height: 43px;
    flex: 1;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 0 13px;
    border: 1px solid #dfe2eb;
    border-radius: 9px;
    background: #fbfcff;
    transition: .18s ease;
}
.pi-search-box:focus-within { border-color: #9e8df2; box-shadow: 0 0 0 3px rgba(98, 70, 229, .09); background: #fff; }
.pi-search-box i { color: #9299aa; }
.pi-search-box input { width: 100%; border: 0; outline: 0; background: transparent; color: var(--pi-ink); font-size: var(--font-ui); }
.pi-search-row .btn { min-height: 43px; border-radius: 9px; color: #4b5366; font-size: var(--font-ui); white-space: nowrap; }

.pi-filter-grid { display: grid; grid-template-columns: repeat(6, minmax(130px, 1fr)); gap: 12px; margin-top: 14px; }
.pi-filter-grid.pi-advanced { padding-top: 14px; border-top: 1px dashed var(--pi-line); }
.pi-filter-grid label, .pi-form-grid label { min-width: 0; }
.pi-filter-grid label > span, .pi-form-grid label > span { display: block; margin-bottom: 6px; color: #5d6578; font-size: var(--font-sm); font-weight: 700; }
.pi-filter-grid input, .pi-filter-grid select, .pi-form-grid input, .pi-form-grid select, .pi-form-grid textarea {
    width: 100%; min-height: 40px; border: 1px solid #dfe2eb; border-radius: 8px; background: #fff; color: var(--pi-ink); outline: none; padding: 7px 10px; font-size: var(--font-ui);
}
.pi-filter-grid input:focus, .pi-filter-grid select:focus, .pi-form-grid input:focus, .pi-form-grid select:focus, .pi-form-grid textarea:focus { border-color: #9e8df2; box-shadow: 0 0 0 3px rgba(98, 70, 229, .08); }

.pi-quick-row { display: flex; align-items: center; gap: 15px; margin: 0 2px 14px; overflow-x: auto; }
.pi-quick-row > strong { color: #525a6d; font-size: var(--font-sm); white-space: nowrap; }
.pi-quick-row > div { display: flex; align-items: center; gap: 7px; }
.pi-quick-row button { border: 1px solid var(--pi-line); border-radius: 999px; background: #fff; color: #677084; padding: 7px 13px; font-size: var(--font-ui); white-space: nowrap; }
.pi-quick-row button:hover, .pi-quick-row button.active { color: var(--pi-purple); border-color: #b6aaf4; background: var(--pi-purple-soft); font-weight: 700; }

.pi-table-card { position: relative; overflow: visible; }
.pi-table-scroll { overflow: auto; border-radius: 12px 12px 0 0; }
.pi-table { width: 100%; min-width: 1480px; border-collapse: separate; border-spacing: 0; margin: 0; font-size: var(--font-ui); }
.pi-table thead { position: sticky; top: 0; z-index: 2; }
.pi-table th { padding: 12px 11px; color: #636c7f; background: #f8f9fc; border-bottom: 1px solid var(--pi-line); font-weight: 700; white-space: nowrap; }
.pi-table td { padding: 12px 11px; vertical-align: middle; color: #343c4e; border-bottom: 1px solid #eff0f5; background: #fff; white-space: nowrap; }
.pi-table tbody tr { cursor: pointer; transition: background .15s ease; }
.pi-table tbody tr:hover td { background: #fbfaff; }
.pi-table tbody tr:last-child td { border-bottom: 0; }
.pi-table td small { display: block; color: #8a92a3; margin-top: 3px; font-size: var(--font-xs); }
.pi-table input[type="checkbox"] { accent-color: var(--pi-purple); width: 15px; height: 15px; }
.pi-money { direction: rtl; font-weight: 600; }
.pi-invoice-link { padding: 0; border: 0; background: none; color: var(--pi-purple); font-weight: 700; }
.pi-sort { border: 0; padding: 0; background: none; color: inherit; font-weight: inherit; display: inline-flex; align-items: center; gap: 6px; }
.pi-sort i { color: #a2a8b6; font-size: .68rem; }

.pi-badge { display: inline-flex; align-items: center; justify-content: center; min-height: 24px; padding: 3px 9px; border: 1px solid transparent; border-radius: 999px; font-size: var(--font-xs); font-weight: 700; white-space: nowrap; }
.pi-badge.is-success { color: #13734c; background: #eaf8f1; border-color: #c6edda; }
.pi-badge.is-warning { color: #a85c09; background: #fff5e6; border-color: #f7dfb8; }
.pi-badge.is-danger { color: #b93643; background: #fff0f1; border-color: #f4cfd3; }
.pi-badge.is-info { color: #345eb7; background: #edf3ff; border-color: #d3dffc; }
.pi-badge.is-muted { color: #667085; background: #f3f4f7; border-color: #e1e4e9; }
.si-channel-badge { gap: 6px; }
.si-channel-badge i { font-size: .65rem; }
.si-source-cell { display: grid; justify-items: start; gap: 5px; }
.si-order-link { padding: 0; border: 0; background: transparent; color: var(--pi-purple); font-size: var(--font-xs); font-weight: 700; text-align: start; }
.si-order-link:hover { color: var(--pi-purple-strong); text-decoration: underline; }
.si-order-reference { color: var(--pi-muted); font-size: var(--font-xs); }
.si-ecommerce-card { margin-bottom: 14px; overflow: hidden; }
.si-ecommerce-card > header { display: flex; align-items: center; gap: 11px; padding: 15px 17px; border-bottom: 1px solid var(--pi-line); }
.si-ecommerce-card > header > span:first-child { width: 36px; height: 36px; display: grid; flex: 0 0 36px; place-items: center; border-radius: 10px; color: #345eb7; background: #edf3ff; }
.si-ecommerce-card > header > div { min-width: 0; flex: 1; }
.si-ecommerce-card > header small { display: block; color: var(--pi-muted); font-size: var(--font-xs); }
.si-ecommerce-card > header h3 { margin: 3px 0 0; color: var(--pi-ink); font-size: var(--font-base); }
.si-ecommerce-card .pi-info-grid { padding: 0; }
.si-ecommerce-card .pi-info-cell { min-height: 70px; }
.si-source-filter-grid { grid-template-columns: repeat(7, minmax(120px, 1fr)); }

.pi-action-menu { position: relative; display: inline-block; }
.pi-dots { width: 32px; height: 30px; border: 1px solid var(--pi-line); border-radius: 7px; background: #fff; color: #60687a; }
.pi-dots:hover { color: var(--pi-purple); border-color: #bdb2f4; background: #faf9ff; }
.pi-menu { display: none; position: fixed; z-index: 1110; width: 195px; padding: 6px; background: #fff; border: 1px solid var(--pi-line); border-radius: 10px; box-shadow: 0 14px 38px rgba(23, 32, 51, .16); }
.pi-menu.show { display: block; }
.pi-menu button { width: 100%; display: flex; align-items: center; gap: 9px; padding: 9px 10px; border: 0; border-radius: 7px; background: transparent; color: #40485a; text-align: start; font-size: var(--font-ui); }
.pi-menu button i { width: 16px; color: #747d90; }
.pi-menu button:hover:not(:disabled) { background: var(--pi-purple-soft); color: var(--pi-purple); }
.pi-menu button:disabled { opacity: .46; cursor: not-allowed; }
.pi-menu-separator { height: 1px; margin: 5px 3px; background: var(--pi-line); }

.pi-pagination { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 13px 16px; border-top: 1px solid var(--pi-line); color: var(--pi-muted); font-size: var(--font-sm); }
.pi-pagination label, .pi-pagination > div { display: flex; align-items: center; gap: 7px; }
.pi-pagination select { border: 1px solid var(--pi-line); border-radius: 7px; padding: 4px 8px; background: #fff; }
.pi-pagination button { min-width: 31px; height: 31px; padding: 0 8px; border: 1px solid var(--pi-line); border-radius: 7px; background: #fff; color: #667085; }
.pi-pagination button.active { color: #fff; border-color: var(--pi-purple); background: var(--pi-purple); }
.pi-pagination button:disabled { opacity: .4; }

.pi-loading-page, .pi-error-state, .pi-empty, .pi-mini-empty { min-height: 280px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; text-align: center; color: var(--pi-muted); }
.pi-loading-page i, .pi-error-state > i { color: var(--pi-purple); font-size: 1.8rem; }
.pi-error-state { padding: 36px; background: #fff; border: 1px solid var(--pi-line); border-radius: 12px; }
.pi-error-state.compact { min-height: 180px; }
.pi-empty { border: 0; box-shadow: none; }
.pi-empty > span { width: 60px; height: 60px; display: grid; place-items: center; border-radius: 18px; background: var(--pi-purple-soft); color: var(--pi-purple); font-size: var(--font-xl); }
.pi-empty h3, .pi-error-state h2 { margin: 4px 0 0; color: var(--pi-ink); font-size: var(--font-2xl); }
.pi-empty p, .pi-error-state p { margin: 0 0 6px; }
.pi-skeleton { padding: 16px; }
.pi-skeleton span { display: block; height: 38px; margin: 8px 0; border-radius: 7px; background: linear-gradient(90deg,#f2f3f7 25%,#fafafa 50%,#f2f3f7 75%); background-size: 200% 100%; animation: piShimmer 1.2s infinite; }
@keyframes piShimmer { to { background-position: -200% 0; } }

/* Full invoice details */
.pi-detail-head { align-items: center; }
.pi-detail-head { justify-content: flex-start; }
.pi-back { width: 39px; height: 39px; flex: 0 0 39px; border: 1px solid var(--pi-line); border-radius: 9px; background: #fff; color: #555e72; }
.pi-back:hover { color: var(--pi-purple); border-color: #b9adf4; }
.pi-title-row { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; }

.pi-toolbar { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; padding: 11px; margin-bottom: 14px; border: 1px solid var(--pi-line); border-radius: 11px; background: #fff; box-shadow: var(--pi-shadow); }
.pi-toolbar button { min-height: 36px; display: inline-flex; align-items: center; gap: 7px; border: 1px solid var(--pi-line); border-radius: 8px; background: #fff; color: #495166; padding: 7px 12px; font-size: var(--font-ui); font-weight: 700; }
.pi-toolbar button:hover:not(:disabled) { border-color: #b7abf3; color: var(--pi-purple); background: #faf9ff; }
.pi-toolbar button.primary { margin-inline-start: auto; color: #fff; border-color: var(--pi-purple); background: var(--pi-purple); }
.pi-toolbar button:disabled { opacity: .45; cursor: not-allowed; }

.pi-invoice-meta-strip { display: grid; grid-template-columns: repeat(7, minmax(115px, 1fr)); margin-bottom: 14px; overflow: hidden; }
.pi-info-cell { padding: 13px 15px; min-width: 0; border-inline-end: 1px solid var(--pi-line); }
.pi-info-cell:last-child { border-inline-end: 0; }
.pi-info-cell small, .pi-info-cell span { display: block; color: var(--pi-muted); font-size: var(--font-xs); }
.pi-info-cell strong { display: block; margin-top: 5px; color: var(--pi-ink); font-size: var(--font-ui); word-break: break-word; }

.pi-tabs { display: flex; gap: 4px; padding: 0 5px; margin-bottom: 15px; border-bottom: 1px solid var(--pi-line); overflow-x: auto; }
.pi-tabs button { position: relative; display: inline-flex; align-items: center; gap: 7px; min-height: 44px; padding: 0 14px; border: 0; background: none; color: #6a7284; font-size: var(--font-ui); white-space: nowrap; }
.pi-tabs button::after { content: ''; position: absolute; inset-inline: 12px; bottom: -1px; height: 2px; border-radius: 2px 2px 0 0; background: transparent; }
.pi-tabs button.active { color: var(--pi-purple); font-weight: 700; }
.pi-tabs button.active::after { background: var(--pi-purple); }
.pi-tabs button span { min-width: 19px; height: 19px; display: grid; place-items: center; border-radius: 99px; background: #f0f1f5; font-weight:700;font-size:var(--font-ui); }
.pi-tabs button.active span { background: var(--pi-purple-soft); }

/* Sales invoice detail header */
#sales-invoice-detail-page .si-invoice-hero {
    margin-bottom: 14px;
    overflow: hidden;
    border: 1px solid var(--pi-line);
    border-radius: 16px;
    background: var(--pi-surface);
    box-shadow: 0 10px 30px rgba(35, 42, 74, .065);
}
#sales-invoice-detail-page .si-detail-head {
    margin: 0;
    padding: 20px 22px 18px;
    background: linear-gradient(135deg, #fff 0%, #fbfaff 100%);
}
#sales-invoice-detail-page .si-detail-identity {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 14px;
}
#sales-invoice-detail-page .si-detail-identity > div { min-width: 0; }
#sales-invoice-detail-page .si-title-row { margin-top: 5px; gap: 12px; }
#sales-invoice-detail-page .si-title-row h1 {
    margin: 0;
    direction: ltr;
    font-size: var(--font-2xl);
    line-height: 1.25;
    letter-spacing: .015em;
    word-break: break-word;
}
#sales-invoice-detail-page .si-statuses { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }
#sales-invoice-detail-page .si-detail-subtitle {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px 18px;
    margin-top: 7px;
}
#sales-invoice-detail-page .si-detail-subtitle span { display: inline-flex; align-items: center; gap: 7px; }
#sales-invoice-detail-page .si-detail-subtitle i { color: #9a91c9; font-size: .75rem; }
#sales-invoice-detail-page .si-source-badge {
    width: fit-content;
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px 10px;
    margin-top: 9px;
    padding: 6px 10px;
    border: 1px solid #d3dffc;
    border-radius: 999px;
    color: #345eb7;
    background: #edf3ff;
    font-size: var(--font-xs);
}
#sales-invoice-detail-page .si-source-badge strong { font-weight: 700; }
#sales-invoice-detail-page .si-detail-toolbar {
    gap: 8px;
    margin: 0;
    padding: 12px 22px;
    border: 0;
    border-top: 1px solid var(--pi-line);
    border-radius: 0;
    background: #fcfcff;
    box-shadow: none;
}
#sales-invoice-detail-page .si-detail-toolbar button {
    min-height: 38px;
    padding-inline: 14px;
    background: #fff;
}
#sales-invoice-detail-page .si-detail-toolbar button.primary {
    margin-inline-start: 0;
    padding-inline: 17px;
    color: #fff;
    border-color: var(--pi-purple);
    background: var(--pi-purple);
    box-shadow: 0 5px 14px rgba(98, 70, 229, .18);
}
#sales-invoice-detail-page .si-detail-toolbar button.primary:hover:not(:disabled) {
    color: #fff;
    border-color: var(--pi-purple-strong);
    background: var(--pi-purple-strong);
}
#sales-invoice-detail-page .si-toolbar-divider {
    width: 1px;
    height: 24px;
    margin-inline: 3px;
    background: var(--pi-line);
}
#sales-invoice-detail-page .si-detail-meta {
    margin: 0;
    border: 0;
    border-top: 1px solid var(--pi-line);
    border-radius: 0;
    background: #fff;
    box-shadow: none;
}
#sales-invoice-detail-page .si-detail-meta .pi-info-cell {
    min-height: 78px;
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    padding: 14px;
    border-bottom: 0;
}
#sales-invoice-detail-page .si-meta-icon {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    border-radius: 9px;
    color: var(--pi-purple);
    background: var(--pi-purple-soft);
    font-size: .78rem;
}
#sales-invoice-detail-page .si-meta-copy { min-width: 0; }
#sales-invoice-detail-page .si-meta-copy small {
    margin: 0 0 5px;
    color: #858da0;
    font-size: var(--font-xs);
    font-weight: 600;
}
#sales-invoice-detail-page .si-meta-copy strong {
    margin: 0;
    overflow: hidden;
    color: var(--pi-ink);
    font-size: var(--font-xs);
    line-height: 1.45;
    text-overflow: ellipsis;
}
#sales-invoice-detail-page .si-detail-tabs {
    margin-bottom: 15px;
    padding: 0 8px;
    border: 1px solid var(--pi-line);
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 3px 12px rgba(35, 42, 74, .035);
    scrollbar-width: none;
}
#sales-invoice-detail-page .si-detail-tabs::-webkit-scrollbar { display: none; }
#sales-invoice-detail-page .si-detail-tabs button { min-height: 48px; }
#sales-invoice-detail-page .si-detail-tabs button.active { background: linear-gradient(180deg, transparent 0%, #faf9ff 100%); }

/* Sales invoice collections */
#sales-invoice-detail-page .si-payment-panel {
    overflow: hidden;
    padding: 0;
}
#sales-invoice-detail-page .si-payment-head {
    min-height: 94px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 18px 20px;
    border-bottom: 1px solid var(--pi-line);
    background: linear-gradient(135deg, #fff 0%, #fbfaff 100%);
}
#sales-invoice-detail-page .si-payment-heading { min-width: 0; display: flex; align-items: center; gap: 13px; }
#sales-invoice-detail-page .si-payment-heading > span {
    width: 44px;
    height: 44px;
    flex: 0 0 44px;
    display: grid;
    place-items: center;
    border-radius: 12px;
    color: var(--pi-purple);
    background: var(--pi-purple-soft);
    font-size: var(--font-md);
}
#sales-invoice-detail-page .si-payment-heading small { display: block; margin-bottom: 3px; color: var(--pi-muted); font-size: var(--font-xs); }
#sales-invoice-detail-page .si-payment-heading h3 { margin: 0; font-size: var(--font-md); }
#sales-invoice-detail-page .si-payment-heading p { margin: 5px 0 0; color: var(--pi-muted); font-size: var(--font-sm); }
#sales-invoice-detail-page .si-payment-head .btn { min-height: 39px; border-radius: 9px; white-space: nowrap; }
#sales-invoice-detail-page .si-payment-kpis {
    display: grid;
    grid-template-columns: repeat(6, minmax(120px, 1fr));
    gap: 10px;
    padding: 16px 20px;
    border-bottom: 1px solid var(--pi-line);
    background: #fff;
}
#sales-invoice-detail-page .si-payment-kpi {
    min-height: 82px;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px;
    border: 1px solid #eceef5;
    border-radius: 11px;
    background: #fafbfe;
}
#sales-invoice-detail-page .si-payment-kpi-icon {
    width: 36px;
    height: 36px;
    flex: 0 0 36px;
    display: grid;
    place-items: center;
    border-radius: 10px;
    color: var(--pi-purple);
    background: var(--pi-purple-soft);
}
#sales-invoice-detail-page .si-payment-kpi small { display: block; margin-bottom: 5px; color: var(--pi-muted); font-size: var(--font-xs); }
#sales-invoice-detail-page .si-payment-kpi strong { display: block; color: var(--pi-ink); font-weight:700;font-size:var(--font-sm);line-height:1.35; }
#sales-invoice-detail-page .si-payment-kpi.is-green .si-payment-kpi-icon { color: #16875a; background: #eaf8f1; }
#sales-invoice-detail-page .si-payment-kpi.is-orange .si-payment-kpi-icon { color: #be721c; background: #fff4e8; }
#sales-invoice-detail-page .si-payment-kpi.is-red .si-payment-kpi-icon { color: #c83f4c; background: #fff0f1; }
#sales-invoice-detail-page .si-payment-kpi.is-blue .si-payment-kpi-icon { color: #3567c7; background: #edf3ff; }
#sales-invoice-detail-page .si-payment-list-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 16px 20px 12px;
}
#sales-invoice-detail-page .si-payment-list-head h4 { margin: 0; color: var(--pi-ink); font-size: var(--font-base); font-weight: 700; }
#sales-invoice-detail-page .si-payment-list-head p { margin: 4px 0 0; color: var(--pi-muted); font-size: var(--font-sm); }
#sales-invoice-detail-page .si-payment-panel > .pi-detail-table-wrap { margin: 0 20px 20px; }
#sales-invoice-detail-page .si-payment-table { min-width: 1050px; }
#sales-invoice-detail-page .si-payment-amount { color: #16875a; font-weight: 700; }

.invoice-payment-status-note {
    margin: 10px 0 0;
    padding: 10px 12px;
    border: 1px solid #cdebdc;
    border-radius: 9px;
    color: #176e4d;
    background: #eefaf4;
    font-size: var(--font-xs);
    font-weight: 600;
}
.invoice-paid-toggle input:disabled { cursor: default; opacity: 1; }

.pi-overview-grid, .pi-detail-columns { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(280px, .45fr); gap: 14px; align-items: start; }
.pi-card, .pi-supplier-card, .pi-items-card, .pi-attachments-card, .pi-payment-summary, .pi-payment-tab-head { padding: 17px; margin-bottom: 14px; }
.pi-card h3, .pi-supplier-card h3, .pi-items-card h3, .pi-attachments-card h3, .pi-payment-tab-head h3 { margin: 0 0 14px; font-size: var(--font-base); color: var(--pi-ink); font-weight: 700; }
.pi-card h3 i, .pi-supplier-card h3 i, .pi-items-card h3 i, .pi-attachments-card h3 i { color: var(--pi-purple); margin-inline-end: 7px; }
.pi-info-grid { display: grid; grid-template-columns: repeat(3, minmax(130px, 1fr)); gap: 0; border: 1px solid var(--pi-line); border-radius: 9px; overflow: hidden; }
.pi-info-grid .pi-info-cell { min-height: 70px; border-bottom: 1px solid var(--pi-line); background: #fff; }
.pi-info-grid .pi-info-cell:nth-child(3n) { border-inline-end: 0; }
.pi-info-grid .pi-info-cell:nth-last-child(-n+3) { border-bottom: 0; }
.pi-info-cell.wide { grid-column: 1 / -1; }

.pi-detail-table-wrap { overflow: auto; border: 1px solid var(--pi-line); border-radius: 9px; }
.pi-detail-table { width: 100%; min-width: 780px; border-collapse: collapse; font-size: var(--font-ui); }
.pi-detail-table th { padding: 11px; background: #f8f9fc; color: #626b7d; border-bottom: 1px solid var(--pi-line); white-space: nowrap; }
.pi-detail-table td { padding: 12px 11px; border-bottom: 1px solid #eff0f5; vertical-align: middle; }
.pi-detail-table tbody tr:last-child td { border-bottom: 0; }
.pi-detail-table td small { display: block; color: #8b93a3; margin-top: 3px; }
.pi-legacy-note { display: inline-flex !important; align-items: center; gap: 4px; color: #9a6717 !important; }
.pi-totals { margin-inline-start: auto; margin-top: 14px; width: min(100%, 390px); }
.pi-totals > div { display: flex; justify-content: space-between; gap: 18px; padding: 8px 4px; color: #5e6678; font-size: var(--font-ui); border-bottom: 1px dashed var(--pi-line); }
.pi-totals > div strong { color: var(--pi-ink); }
.pi-totals .pi-total-area { padding: 12px; margin-top: 5px; border: 0; border-radius: 8px; color: var(--pi-purple-strong); background: var(--pi-purple-soft); font-size: var(--font-ui); }
.pi-notes { padding: 12px; margin-top: 13px; border-radius: 8px; color: #596174; background: #fafbfe; font-size: var(--font-xs); }
.pi-safety-note, .pi-finance-note { display: flex; align-items: flex-start; gap: 10px; padding: 12px 13px; border: 1px solid #dcd6fa; border-radius: 9px; color: #565076; background: #faf9ff; font-size: var(--font-xs); }
.pi-safety-note i, .pi-finance-note i { color: var(--pi-purple); margin-top: 2px; }

.pi-payment-summary { display: grid; grid-template-columns: repeat(5, minmax(125px, 1fr)); gap: 10px; }
.pi-payment-summary > div, .pi-modal-summary > div { padding: 12px; border-radius: 9px; background: #f8f9fc; }
.pi-payment-summary span, .pi-modal-summary span { display: block; color: var(--pi-muted); font-size: var(--font-sm); }
.pi-payment-summary strong, .pi-modal-summary strong { display: block; margin-top: 5px; color: var(--pi-ink); font-size: var(--font-base); }
.pi-payment-tab-head { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.pi-payment-tab-head h3 { margin-bottom: 3px; }
.pi-payment-tab-head p { margin: 0; color: var(--pi-muted); font-size: var(--font-sm); }
.pi-inline-actions { display: flex; align-items: center; gap: 5px; }
.pi-inline-actions button { width: 30px; height: 29px; border: 1px solid var(--pi-line); border-radius: 7px; background: #fff; color: #667085; }
.pi-inline-actions button:hover { color: var(--pi-purple); border-color: #b8adf2; }

.pi-timeline { position: relative; padding-inline-start: 24px; }
.pi-timeline::before { content: ''; position: absolute; inset-inline-start: 8px; top: 8px; bottom: 8px; width: 1px; background: #dfe2eb; }
.pi-timeline > article { position: relative; display: grid; grid-template-columns: 1fr auto; gap: 4px 16px; padding: 0 0 18px; }
.pi-timeline-dot { position: absolute; inset-inline-start: -22px; top: 5px; width: 13px; height: 13px; border: 3px solid #e8e3ff; border-radius: 50%; background: var(--pi-purple); }
.pi-timeline h4 { margin: 0; color: var(--pi-ink); font-size: var(--font-ui); }
.pi-timeline p { margin: 3px 0 0; color: var(--pi-muted); font-size: var(--font-sm); }
.pi-timeline time { color: #8d95a6; font-size:var(--font-xs); direction: rtl; }
.pi-attachments { display: grid; gap: 8px; }
.pi-attachment-row { display: flex; align-items: stretch; gap: 6px; }
.pi-attachments a { min-width: 0; flex: 1; display: flex; align-items: center; gap: 8px; padding: 9px; border: 1px solid var(--pi-line); border-radius: 8px; color: #4f5870; text-decoration: none; font-size: var(--font-sm); }
.pi-attachments a i { color: #cf3f51; }
.pi-attachment-row > button { width: 38px; border: 1px solid #f0d2d6; border-radius: 8px; color: #c43d49; background: #fff5f6; }
.pi-mini-empty { min-height: 130px; font-size: var(--font-sm); }
.pi-cost-total { display: flex; justify-content: space-between; align-items: center; padding: 13px; margin-bottom: 13px; border-radius: 9px; background: var(--pi-purple-soft); color: #51468b; }
.pi-cost-total strong { ; }

/* Modals */
.pi-modal-overlay, .template-modal-overlay {
    position: fixed;
    inset: 0;
    z-index: 1095;
    display: grid;
    place-items: center;
    padding: 22px;
    overflow: auto;
    background: rgba(20, 25, 43, .54);
    backdrop-filter: blur(2px);
}
.template-modal-overlay { display: none; }
.template-modal-overlay.show { display: grid; }
.pi-modal, .template-modal-content { width: min(720px, 100%); max-height: calc(100vh - 44px); overflow: auto; background: #fff; border: 1px solid rgba(255,255,255,.45); border-radius: 14px; box-shadow: 0 28px 80px rgba(17, 22, 40, .25); }
.template-modal-content { width: min(1120px, 100%); padding: 18px; }
.pi-modal > header { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 17px 20px; border-bottom: 1px solid var(--pi-line); }
.pi-modal > header small { display: block; margin-bottom: 3px; color: var(--pi-purple); font-size: var(--font-xs); }
.pi-modal > header h2 { margin: 0; font-size: var(--font-lg); font-weight: 700; }
.pi-modal > header > button { width: 34px; height: 34px; border: 1px solid var(--pi-line); border-radius: 8px; background: #fff; color: #697185; }
.pi-modal form { padding: 18px 20px; }
.pi-modal form > footer, .pi-modal > footer, .pi-modal-print-actions { display: flex; align-items: center; justify-content: flex-end; gap: 8px; padding: 15px 20px; border-top: 1px solid var(--pi-line); }
.pi-modal form > footer { padding: 16px 0 0; margin-top: 18px; }
.pi-modal-summary { display: grid; grid-template-columns: repeat(3, 1fr); gap: 9px; padding: 15px 20px; border-bottom: 1px solid var(--pi-line); }
.pi-form-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 13px; }
.pi-form-grid .wide { grid-column: 1 / -1; }
.pi-form-grid b { color: #d64552; }
.pi-finance-note { margin-top: 14px; }
.si-allocation-preview {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin-top: 14px;
}
.si-allocation-preview > div {
    padding: 11px 13px;
    border: 1px solid var(--pi-line);
    border-radius: 9px;
    background: #fafbfe;
}
.si-allocation-preview span,
.si-allocation-preview strong { display: block; }
.si-allocation-preview span { margin-bottom: 4px; color: var(--pi-muted); font-size: var(--font-xs); }
.si-allocation-preview strong { color: var(--pi-ink); font-size: var(--font-ui); }
.pi-payment-detail-amount { display: flex; align-items: center; gap: 13px; padding: 20px; background: linear-gradient(135deg,#f7f5ff,#fff); border-bottom: 1px solid var(--pi-line); }
.pi-payment-detail-amount small { color: var(--pi-muted); }
.pi-payment-detail-amount strong { color: var(--pi-purple-strong); font-weight:700;font-size:var(--font-2xl); }
.pi-modal > .pi-info-grid { margin: 18px 20px; }
.pi-modal-attachments { padding: 0 20px 18px; }
.pi-modal-attachments h4 { font-size: var(--font-base); }
.pi-modal-attachments a { display: block; font-size: var(--font-sm); }
.pi-return-lines { display: grid; gap: 8px; margin-bottom: 15px; }
.pi-return-lines > label { display: grid; grid-template-columns: auto minmax(140px,1fr) 130px auto; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid var(--pi-line); border-radius: 9px; }
.pi-return-lines input[type="checkbox"] { accent-color: var(--pi-purple); width: 16px; height: 16px; }
.pi-return-lines div strong, .pi-return-lines div small { display: block; }
.pi-return-lines div strong { font-size: var(--font-ui); }
.pi-return-lines div small, .pi-return-lines > label > span { color: var(--pi-muted); font-size: var(--font-sm); }
.pi-return-lines input[type="number"] { width: 100%; min-height: 36px; border: 1px solid var(--pi-line); border-radius: 7px; padding: 5px 8px; }

/* Purchase invoice barcode-label preparation (no invoice or stock mutation). */
.pi-modal--barcode { width: min(1120px, 100%); }
.pi-modal--barcode > header h2 i { color: var(--pi-purple); margin-inline-end: 7px; }
.pi-barcode-settings { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.pi-barcode-settings label, .pi-barcode-add label { min-width: 0; }
.pi-barcode-settings label > span, .pi-barcode-add label > span { display: block; margin-bottom: 5px; color: var(--pi-ink); font-weight: 700; font-size: var(--font-sm); }
.pi-barcode-custom-size { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.pi-barcode-custom-size[hidden] { display: none; }
.pi-barcode-help { display: flex; gap: 7px; align-items: flex-start; margin: 13px 0; color: var(--pi-muted); font-size: var(--font-sm); }
.pi-barcode-help i { margin-top: 3px; color: var(--pi-purple); }
.pi-barcode-table-wrap { max-height: 45vh; overflow: auto; border: 1px solid var(--pi-line); border-radius: 10px; }
.pi-barcode-table { width: 100%; min-width: 750px; border-collapse: collapse; font-size: var(--font-sm); }
.pi-barcode-table thead { position: sticky; top: 0; z-index: 1; background: #f7f8fc; }
.pi-barcode-table th, .pi-barcode-table td { padding: 10px; border-bottom: 1px solid var(--pi-line); text-align: start; vertical-align: middle; }
.pi-barcode-table tr:last-child td { border-bottom: 0; }
.pi-barcode-table td strong, .pi-barcode-table td small { display: block; }
.pi-barcode-table td strong { overflow-wrap: anywhere; }
.pi-barcode-table td small { margin-top: 3px; color: var(--pi-muted); }
.pi-barcode-table td .pi-barcode-warning { color: #ad5e12; }
.pi-barcode-table td select { min-width: 175px; }
.pi-barcode-table td input[type="checkbox"] { width: 17px; height: 17px; accent-color: var(--pi-purple); }
.pi-barcode-table td input[type="number"] { width: 96px; min-height: 37px; padding: 5px 8px; border: 1px solid var(--pi-line); border-radius: 7px; }
.pi-barcode-extra { color: var(--pi-muted); }
.pi-barcode-remove { width: 34px; height: 34px; border: 1px solid #f0d2d6; border-radius: 8px; background: #fff5f6; color: #c43d49; }
.pi-barcode-empty { padding: 30px 12px; text-align: center; color: var(--pi-muted); }
.pi-barcode-add { display: grid; grid-template-columns: minmax(180px, 1fr) minmax(180px, 1fr) auto; align-items: end; gap: 10px; margin-top: 16px; }
.pi-barcode-add button { white-space: nowrap; }
.pi-barcode-bottom { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-top: 17px; padding: 12px 14px; border-radius: 9px; background: var(--pi-purple-soft); }
.pi-barcode-bottom strong { color: var(--pi-purple-strong); }
.pi-barcode-bottom small { color: var(--pi-muted); }
.pi-barcode-status { min-height: 21px; margin: 9px 0 0; color: var(--pi-muted); font-size: var(--font-sm); }
.pi-barcode-status.is-error { color: #b94b29; }
.pi-barcode-ready { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; margin-top: 11px; padding: 12px 14px; border: 1px solid #acd9c4; border-radius: 9px; background: #f0faf5; }
.pi-barcode-ready[hidden] { display: none; }
.pi-barcode-ready strong, .pi-barcode-ready small { display: block; }
.pi-barcode-ready strong { color: #126447; }
.pi-barcode-ready small { color: var(--pi-muted); font-size: var(--font-xs); }
.pi-barcode-ready a { white-space: nowrap; }
.pi-barcode-pdf { background: #158657; border-color: #158657; color: #fff; }
.pi-barcode-pdf:hover:not(:disabled) { background: #0f7149; border-color: #0f7149; color: #fff; }
.pi-barcode-pdf:disabled { opacity: .55; }

/* A4 invoice preview and supplier payment voucher */
.template-preview-stage { padding: 22px; background: #eef0f5; border-radius: 10px; overflow: auto; }
.invoice-paper {
    width: 210mm;
    min-height: 297mm;
    margin: 0 auto;
    padding: 14mm;
    box-sizing: border-box;
    background: #fff;
    color: #1d2330;
    font-family: var(--tpl-font, Tajawal), sans-serif;
    font-size: var(--tpl-size, 12px);
    box-shadow: 0 7px 25px rgba(21, 27, 45, .14);
}
.invoice-head { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.4fr); align-items: center; gap: 12px; padding-bottom: 9mm; border-bottom: 2px solid var(--tpl-primary,#6246e5); }
.invoice-logo { color: var(--tpl-primary,#6246e5); font-size: 1.65rem; font-weight: 900; background: transparent; padding: 0; }
.invoice-logo .document-company-logo { display:block; width:auto; height:auto; max-width:min(100%,var(--document-logo-max-width,140px)); max-height:var(--document-logo-max-height,80px); object-fit:contain; background:transparent; }
.invoice-title { text-align: center; }
.invoice-title span, .invoice-title strong { display: block; }
.invoice-title span { font-size: 1.35rem; font-weight: 800; }
.invoice-title strong { margin-top: 4px; color: var(--tpl-secondary,#626a7c); font-family: Inter,Tajawal,sans-serif; }
.invoice-total-badge { justify-self: end; min-width: 48mm; padding: 4mm; border-radius: 3mm; color: #fff; background: var(--tpl-primary,#6246e5); }
.invoice-total-badge small, .invoice-total-badge strong { display: block; }
.invoice-total-badge strong { margin-top: 2mm; font-size: 1.05rem; }
.invoice-meta { display: grid; grid-template-columns: repeat(3,1fr); gap: 7mm; padding: 8mm 0; }
.invoice-meta h4 { margin: 0 0 2.5mm; color: var(--tpl-primary,#6246e5); font-size: .92rem; }
.invoice-meta p { margin: 1.3mm 0; color: #555d6c; font-size: .77rem; }
.invoice-items { width: 100%; border-collapse: collapse; font-size: .74rem; }
.invoice-items th { padding: 3.2mm 2mm; color: #fff; background: var(--tpl-primary,#6246e5); text-align: start; }
.invoice-items td { padding: 3mm 2mm; border-bottom: 1px solid #e3e5eb; }
.invoice-items tbody tr:nth-child(even) td { background: #fafaff; }
.invoice-bottom { display: grid; grid-template-columns: 1fr 72mm; gap: 8mm; margin-top: 8mm; }
.invoice-side-notes { color: #5a6271; font-size: var(--font-xs); }
.invoice-summary > div { display: flex; justify-content: space-between; gap: 6mm; padding: 2.2mm 0; border-bottom: 1px solid #e7e8ed; font-size: var(--font-sm); }
.invoice-summary .grand { padding: 3mm; margin: 2mm 0; border: 0; border-radius: 2mm; color: var(--tpl-primary,#6246e5); background: #f1efff; font-size: var(--font-base); }
.invoice-signature { display: flex; justify-content: space-around; margin-top: 18mm; color: #596171; }
.invoice-footer { margin-top: 14mm; padding-top: 4mm; border-top: 1px solid #dfe2e9; color: #858c9b; text-align: center; font-size: .68rem; }
.pi-payment-voucher-print { width: 190mm; min-height: 250mm; margin: 18px auto; padding: 16mm; background: #fff; color: #1e2635; }
.pi-payment-voucher-print > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; padding-bottom: 10mm; border-bottom: 2px solid var(--pi-purple); }
.pi-payment-voucher-print header > div:last-child { text-align: end; }
.pi-payment-voucher-print header strong, .pi-payment-voucher-print header small { display: block; }
.pi-payment-voucher-print h1 { margin: 0 0 5px; color: var(--pi-purple); font-size: 1.45rem; }
.pi-payment-voucher-print > section { display: grid; grid-template-columns: repeat(2,1fr); gap: 0; margin: 10mm 0; border: 1px solid var(--pi-line); border-radius: 3mm; overflow: hidden; }
.pi-payment-voucher-print section div { padding: 4mm; border-bottom: 1px solid var(--pi-line); border-inline-end: 1px solid var(--pi-line); }
.pi-payment-voucher-print section span, .pi-payment-voucher-print section strong { display: block; }
.pi-payment-voucher-print section span { color: var(--pi-muted); font-size: .75rem; }
.pi-payment-voucher-print section strong { margin-top: 2mm; }
.pi-payment-voucher-print .amount { padding: 7mm; border-radius: 3mm; color: #fff; background: var(--pi-purple); text-align: center; }
.pi-payment-voucher-print .amount span, .pi-payment-voucher-print .amount strong { display: block; }
.pi-payment-voucher-print .amount strong { margin-top: 2mm; font-size: 1.45rem; }
.pi-payment-voucher-print > footer { display: flex; justify-content: space-between; margin-top: 35mm; padding-top: 12mm; border-top: 1px dashed #b9bdc8; }

/* Sales return invoice form: intentionally scoped so product screens remain unchanged. */
.pi-return-invoice-form { display: grid; gap: 16px; min-width: min(1040px, 86vw); }
.pi-return-document-head { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); overflow: hidden; border: 1px solid var(--pi-line); border-radius: 12px; background: #fafafe; }
.pi-return-document-head > div { padding: 13px 15px; border-inline-end: 1px solid var(--pi-line); }
.pi-return-document-head > div:last-child { border-inline-end: 0; }
.pi-return-document-head span, .pi-return-document-head strong { display: block; }
.pi-return-document-head span { margin-bottom: 4px; color: var(--pi-muted); font-size: var(--font-sm); }
.pi-return-document-head strong { color: #20273a; font-size: var(--font-ui); }
.pi-return-invoice-table { max-height: 330px; overflow: auto; border: 1px solid var(--pi-line); border-radius: 12px; }
.pi-return-invoice-table table { width: 100%; min-width: 820px; border-collapse: collapse; }
.pi-return-invoice-table th, .pi-return-invoice-table td { padding: 10px 11px; border-bottom: 1px solid var(--pi-line); text-align: right; vertical-align: middle; }
.pi-return-invoice-table th { position: sticky; top: 0; z-index: 1; color: #626b80; background: #f6f7fb; font-size: var(--font-ui); }
.pi-return-invoice-table td { font-size: var(--font-ui); }
.pi-return-invoice-table td strong, .pi-return-invoice-table td small { display: block; }
.pi-return-invoice-table td small { margin-top: 3px; color: var(--pi-muted); }
.pi-return-invoice-table input[type="number"] { width: 105px; padding: 8px; border: 1px solid var(--pi-line); border-radius: 8px; }
.pi-return-invoice-table tr:has(input[type="checkbox"]:checked) { background: #faf9ff; }
.pi-return-bottom { display: grid; grid-template-columns: minmax(0, 1fr) 290px; gap: 16px; align-items: start; }
.pi-return-options, .pi-return-totals { padding: 15px; border: 1px solid var(--pi-line); border-radius: 12px; background: #fff; }
.pi-return-settlement { display: grid; gap: 9px; margin-top: 14px; padding: 13px; border: 1px solid #e7e3ff; border-radius: 10px; background: #faf9ff; }
.pi-return-settlement label { display: flex; gap: 8px; align-items: center; cursor: pointer; }
.pi-return-totals > div { display: flex; justify-content: space-between; gap: 12px; padding: 9px 2px; color: var(--pi-muted); }
.pi-return-totals .grand { margin-top: 4px; padding-top: 14px; border-top: 1px solid var(--pi-line); color: var(--pi-purple); font-size: var(--font-md); }
.sw-return-settlement { display: flex; gap: 11px; align-items: center; margin-bottom: 13px; padding: 12px; border-radius: 11px; }
.sw-return-settlement i { font-size: 1.25rem; }
.sw-return-settlement small, .sw-return-settlement strong, .sw-return-settlement span { display: block; }
.sw-return-settlement small, .sw-return-settlement span { font-size: var(--font-xs); }
.sw-return-settlement.paid { color: #08784b; background: #eaf8f1; }
.sw-return-settlement.unpaid { color: #9b5a00; background: #fff7e7; }

@media (max-width: 1450px) {
    .pi-kpi-grid { grid-template-columns: repeat(3, 1fr); }
    .pi-filter-grid { grid-template-columns: repeat(3, 1fr); }
    .pi-invoice-meta-strip { grid-template-columns: repeat(4, 1fr); }
    .pi-info-cell { border-bottom: 1px solid var(--pi-line); }
    #sales-invoice-detail-page .si-payment-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
    .pi-page-head, .pi-detail-head { flex-direction: column; }
    .pi-search-row { flex-wrap: wrap; }
    .pi-search-box { flex-basis: 100%; }
    .pi-kpi-grid { grid-template-columns: repeat(2, 1fr); }
    .pi-filter-grid { grid-template-columns: repeat(2, 1fr); }
    .pi-invoice-meta-strip { grid-template-columns: repeat(2, 1fr); }
    .pi-overview-grid, .pi-detail-columns { grid-template-columns: 1fr; }
    .pi-payment-summary { grid-template-columns: repeat(2, 1fr); }
    .pi-info-grid { grid-template-columns: repeat(2, 1fr); }
    .pi-info-grid .pi-info-cell:nth-child(3n) { border-inline-end: 1px solid var(--pi-line); }
    .pi-info-grid .pi-info-cell:nth-child(2n) { border-inline-end: 0; }
    .template-preview-stage { padding: 8px; }
    .invoice-paper { transform-origin: top right; }
    #sales-invoice-detail-page .si-detail-head { padding: 17px; }
    #sales-invoice-detail-page .si-detail-toolbar { padding: 11px 17px; }
    #sales-invoice-detail-page .si-toolbar-divider { display: none; }
    #sales-invoice-detail-page .si-payment-head { align-items: flex-start; flex-direction: column; }
    #sales-invoice-detail-page .si-payment-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    #sales-invoice-detail-page .si-payment-kpi:last-child { grid-column: 1 / -1; }
    .pi-return-invoice-form { min-width: min(760px, 84vw); }
    .pi-return-document-head { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .pi-return-bottom { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
    .pi-kpi-grid, .pi-filter-grid, .pi-invoice-meta-strip, .pi-payment-summary, .pi-info-grid, .pi-form-grid, .pi-modal-summary { grid-template-columns: 1fr; }
    .pi-page-head h1, .pi-detail-head h1 { font-size: var(--font-2xl); }
    .pi-kpi { min-height: 78px; }
    .pi-pagination { flex-wrap: wrap; justify-content: center; }
    .pi-payment-tab-head { align-items: flex-start; flex-direction: column; }
    .pi-toolbar button.primary { margin-inline-start: 0; }
    .pi-return-lines > label { grid-template-columns: auto 1fr; }
    .pi-return-lines input[type="number"] { grid-column: 2; }
    .pi-modal-overlay, .template-modal-overlay { padding: 8px; }
    .pi-modal, .template-modal-content { max-height: calc(100vh - 16px); }
    #sales-invoice-detail-page .si-detail-identity { align-items: flex-start; }
    #sales-invoice-detail-page .si-title-row { align-items: flex-start; flex-direction: column; }
    #sales-invoice-detail-page .si-detail-subtitle { align-items: flex-start; flex-direction: column; }
    #sales-invoice-detail-page .si-detail-toolbar button { flex: 1 1 calc(50% - 8px); justify-content: center; }
    #sales-invoice-detail-page .si-payment-kpis { grid-template-columns: 1fr; padding-inline: 14px; }
    #sales-invoice-detail-page .si-payment-kpi:last-child { grid-column: auto; }
    #sales-invoice-detail-page .si-payment-panel > .pi-detail-table-wrap { margin-inline: 14px; }
    .si-allocation-preview { grid-template-columns: 1fr; }
    .pi-return-invoice-form { min-width: 0; width: 100%; }
    .pi-return-document-head { grid-template-columns: 1fr; }
    .pi-return-document-head > div { border-inline-end: 0; border-bottom: 1px solid var(--pi-line); }
    .pi-barcode-settings, .pi-barcode-custom-size, .pi-barcode-add { grid-template-columns: 1fr; }
    .pi-barcode-add button { justify-self: start; }
}

/* Payment receipt modals print alone (template documents print through document-print.css). */
@media print {
    body:has(#pi-payment-print-modal) > *:not(#pi-payment-print-modal),
    body:has(#si-payment-print) > *:not(#si-payment-print) { display: none !important; }
    #si-payment-print, #si-payment-print *,
    #pi-payment-print-modal, #pi-payment-print-modal * { visibility: visible !important; }
    #pi-payment-print-modal, #si-payment-print { position: static !important; display: block !important; padding: 0 !important; overflow: visible !important; background: #fff !important; backdrop-filter: none !important; }
    #pi-payment-print-modal .pi-modal, #si-payment-print .pi-modal { width: auto !important; max-height: none !important; padding: 0 !important; overflow: visible !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; }
    #pi-payment-print-modal .no-print, #si-payment-print .no-print, .pi-modal-print-actions { display: none !important; }
    .pi-payment-voucher-print { width: 210mm !important; min-height: 297mm !important; margin: 0 !important; padding: 16mm !important; print-color-adjust: exact; -webkit-print-color-adjust: exact; }
}

/* sales-workspace.css */
/* The windows (.sw-modal) are attached to <body>, outside .sw-root: they share the palette, or their save button
   (background var(--sw-purple)) was transparent with white text -- invisible. */
.sw-root,
.sw-modal {
    --sw-purple: #5f43d6;
    --sw-purple-dark: #4d33bd;
    --sw-purple-soft: #f2efff;
    --sw-ink: #172036;
    --sw-muted: #7b8396;
    --sw-line: #e7e9f1;
    --sw-line-strong: #dfe2eb;
    direction: rtl;
    min-width: 0;
    color: var(--sw-ink);
}

.sw-root button,
.sw-root input,
.sw-root select,
.sw-root textarea,
.sw-modal button,
.sw-modal input,
.sw-modal select,
.sw-modal textarea {
    font-family: inherit;
}

/* Compact page header — matches the approved sales reference. */
.sw-page-head,
.sw-root .pi-page-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 12px;
}

.sw-page-title h1,
.sw-root .pi-page-head h1 {
    display: flex;
    align-items: center;
    gap: 9px;
    margin: 4px 0 2px;
    color: var(--sw-ink);
    font-size: var(--font-2xl);
    font-weight: 700;
}

.sw-page-title p,
.sw-root .pi-page-head p {
    margin: 0;
    color: var(--sw-muted);
    font-size: var(--font-sm);
}

.sw-breadcrumb,
.sw-root .pi-breadcrumb {
    display: flex;
    align-items: center;
    gap: 6px;
    color: #9aa0af;
    font-size: var(--font-xs);
}

.sw-breadcrumb i,
.sw-root .pi-breadcrumb i { font-size: .5rem; }
.sw-breadcrumb strong,
.sw-root .pi-breadcrumb strong { color: var(--sw-purple); }

.sw-title-icon {
    width: 27px;
    height: 27px;
    display: grid;
    place-items: center;
    border: 1px solid #ded8fb;
    border-radius: 7px;
    color: var(--sw-purple);
    background: var(--sw-purple-soft);
    font-size: .76rem;
}

.sw-head-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    padding-top: 18px;
}

.sw-head-actions .btn-primary,
.sw-root .pi-page-head .btn-primary {
    min-height: 36px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 7px 12px;
    border-color: var(--sw-purple);
    border-radius: 7px;
    background: var(--sw-purple);
    box-shadow: 0 4px 10px rgba(95, 67, 214, .13);
    font-size: var(--font-ui);
    font-weight: 700;
}

.sw-head-actions .btn-primary:hover,
.sw-root .pi-page-head .btn-primary:hover {
    border-color: var(--sw-purple-dark);
    background: var(--sw-purple-dark);
}

.sw-branch-chip {
    min-height: 34px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 10px;
    border: 1px solid var(--sw-line);
    border-radius: 7px;
    color: #626a7d;
    background: #fff;
    font-size: var(--font-xs);
    white-space: nowrap;
}

.sw-branch-chip i { color: var(--sw-purple); }

/* Required KPIs, reduced to a slim summary strip instead of large cards. */
.sw-metrics {
    display: flex;
    align-items: stretch;
    margin-bottom: 10px;
    overflow-x: auto;
    border: 1px solid var(--sw-line);
    border-radius: 8px;
    background: #fff;
    scrollbar-width: thin;
}

.sw-metric {
    min-width: 148px;
    flex: 1 0 148px;
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 9px 11px;
    border-left: 1px solid #eff0f5;
}

.sw-metric:last-child { border-left: 0; }

.sw-metric-icon {
    width: 28px;
    height: 28px;
    flex: 0 0 28px;
    display: grid;
    place-items: center;
    border-radius: 7px;
    color: var(--sw-purple);
    background: var(--sw-purple-soft);
    font-size: .7rem;
}

.sw-metric.blue .sw-metric-icon { color: #2f6fc0; background: #eef5ff; }
.sw-metric.green .sw-metric-icon { color: #14875a; background: #eaf8f1; }
.sw-metric.orange .sw-metric-icon { color: #bd6b13; background: #fff4e8; }
.sw-metric.red .sw-metric-icon { color: #c84856; background: #fff0f2; }
.sw-metric.violet .sw-metric-icon { color: #7a43b8; background: #f6effc; }

.sw-metric small {
    display: block;
    margin-bottom: 2px;
    color: var(--sw-muted);
    font-size: var(--font-xs);
    white-space: nowrap;
}

.sw-metric strong {
    display: block;
    color: #293146;
    font-weight:700;font-size:var(--font-sm);line-height:1.25;
    white-space: nowrap;
}

/* Search and filters: a single compact row as in the reference. */
.sw-filter-card {
    padding: 9px;
    margin-bottom: 8px;
    border: 1px solid var(--sw-line);
    border-radius: 8px;
    background: #fff;
}

.sw-filter-primary {
    display: grid;
    grid-template-columns: minmax(250px, 1.2fr) minmax(0, 2fr) auto auto;
    align-items: center;
    gap: 7px;
}

.sw-search-box {
    min-height: 37px;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 0 11px;
    border: 1px solid var(--sw-line-strong);
    border-radius: 7px;
    background: #fff;
    transition: border-color .15s ease, box-shadow .15s ease;
}

.sw-search-box:focus-within {
    border-color: #a99bed;
    box-shadow: 0 0 0 3px rgba(95, 67, 214, .07);
}

.sw-search-box i { color: #9aa0b0; font-size: .72rem; }

.sw-search-box input {
    width: 100%;
    border: 0;
    outline: 0;
    color: var(--sw-ink);
    background: transparent;
    font-size: var(--font-ui);
}

.sw-filter-inline {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 7px;
}

.sw-filter-field {
    min-width: 0;
    margin: 0;
}

.sw-filter-inline .sw-filter-field { flex: 1 1 125px; }

.sw-filter-inline .sw-filter-field > span {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.sw-filter-field .form-control {
    width: 100%;
    min-height: 37px;
    padding: 6px 9px;
    border: 1px solid var(--sw-line-strong);
    border-radius: 7px;
    color: #4c5467;
    background-color: #fff;
    box-shadow: none;
    font-size: var(--font-ui);
}

.sw-filter-field .form-control:focus {
    border-color: #a99bed;
    box-shadow: 0 0 0 3px rgba(95, 67, 214, .07);
}

.sw-filter-field .form-control:disabled { color: #7e8493; background-color: #f5f6f9; }

.sw-filter-button,
.sw-clear-button {
    min-height: 37px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 6px 10px;
    border: 1px solid var(--sw-line-strong);
    border-radius: 7px;
    color: #5b6376;
    background: #fff;
    font-size: var(--font-ui);
    white-space: nowrap;
}

.sw-filter-button:hover,
.sw-clear-button:hover { color: var(--sw-purple); border-color: #bcb1ef; background: #faf9ff; }
.sw-clear-button { width: 37px; padding: 0; }

.sw-advanced-filters {
    display: grid;
    grid-template-columns: repeat(5, minmax(130px, 1fr));
    gap: 8px;
    padding-top: 9px;
    margin-top: 9px;
    border-top: 1px dashed var(--sw-line);
}

.sw-advanced-filters.d-none { display: none !important; }

.sw-advanced-filters .sw-filter-field > span {
    display: block;
    margin-bottom: 4px;
    color: #6d7486;
    font-size: var(--font-ui);
    font-weight: 700;
}

.sw-quick-filters {
    display: flex;
    align-items: center;
    gap: 9px;
    min-height: 31px;
    margin: 0 2px 8px;
    overflow-x: auto;
}

.sw-quick-filters > span { color: #8a91a1; font-size: var(--font-xs); white-space: nowrap; }
.sw-quick-filters > div { display: flex; align-items: center; gap: 4px; }

.sw-quick-filters button {
    padding: 4px 9px;
    border: 1px solid transparent;
    border-radius: 999px;
    color: #737b8d;
    background: transparent;
    font-size: var(--font-ui);
    white-space: nowrap;
}

.sw-quick-filters button:hover { color: var(--sw-purple); background: #f7f5ff; }
.sw-quick-filters button.active { color: var(--sw-purple); border-color: #d7d0f7; background: var(--sw-purple-soft); font-weight: 700; }

/* Compact operational table. */
.sw-table-card {
    position: relative;
    overflow: visible;
    border: 1px solid var(--sw-line);
    border-radius: 8px;
    background: #fff;
}

.sw-table-card .pi-table-scroll { border-radius: 8px 8px 0 0; }
.sw-root .pi-table { min-width: 1120px; font-size: var(--font-ui); }
.sw-root .sw-table-credit-notes,
.sw-root .sw-table-payments { min-width: 1320px; }
.sw-root .sw-table-returns { min-width: 1220px; }
.sw-root .sw-table-quotes { min-width: 1160px; }

.sw-root .pi-table th {
    padding: 9px 10px;
    color: #697184;
    background: #f8f9fb;
    border-bottom-color: var(--sw-line);
    font-size: var(--font-ui);
    font-weight: 700;
}

.sw-root .pi-table td {
    height: 45px;
    padding: 8px 10px;
    color: #3d4558;
    border-bottom-color: #f0f1f5;
    font-size: var(--font-ui);
}

.sw-root .pi-table td small { display: block; margin-top: 2px; color: #969cad; font-size: var(--font-xs); }
.sw-root .pi-table tbody tr:hover td { background: #fcfbff; }

.sw-root .sw-primary-link {
    padding: 0;
    border: 0;
    color: #4e3bc2;
    background: none;
    font-size: var(--font-xs);
    font-weight: 700;
    text-align: right;
}

.sw-root .sw-primary-link:hover { color: var(--sw-purple-dark); text-decoration: underline; }

.sw-root .sw-related-link {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: #5540c8;
    font-size: var(--font-xs);
    font-weight: 700;
    text-decoration: none;
}

.sw-root .pi-badge {
    min-height: 20px;
    padding: 2px 7px;
    border: 1px solid transparent;
    border-radius: 5px;
    font-size: var(--font-xs);
    font-weight: 700;
}

.sw-root .pi-badge.success { color: #13734c; border-color: #d1ecdf; background: #edf8f2; }
.sw-root .pi-badge.warning { color: #9b600f; border-color: #f3dfbe; background: #fff7e9; }
.sw-root .pi-badge.danger { color: #ad3e49; border-color: #f1d2d6; background: #fff2f3; }
.sw-root .pi-badge.info { color: #365fae; border-color: #d5e0f7; background: #eff4ff; }
.sw-root .pi-badge.muted { color: #667085; border-color: #e3e5ea; background: #f4f5f7; }
.sw-root .pi-badge.violet { color: #7041a5; border-color: #e3d6f0; background: #f7f1fc; }

.sw-root .sw-action-menu { position: relative; display: inline-block; }

.sw-root .sw-action-menu > button {
    width: 27px;
    height: 27px;
    padding: 0;
    border: 1px solid var(--sw-line-strong);
    border-radius: 6px;
    color: #6b7282;
    background: #fff;
    font-size: var(--font-ui);
}

.sw-root .sw-action-menu > button:hover { color: var(--sw-purple); border-color: #bcb2ef; }

.sw-root .sw-action-menu > div {
    display: none;
    position: absolute;
    top: 31px;
    left: 0;
    z-index: 50;
    min-width: 175px;
    padding: 5px;
    border: 1px solid var(--sw-line);
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 12px 28px rgba(28, 34, 58, .14);
}

.sw-root .sw-action-menu.open > div { display: grid; }

.sw-root .sw-action-menu button[data-action] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 9px;
    border: 0;
    border-radius: 6px;
    color: #41495c;
    background: #fff;
    font-size: var(--font-ui);
    text-align: right;
}

.sw-root .sw-action-menu button[data-action]:hover { color: var(--sw-purple); background: var(--sw-purple-soft); }
.sw-root .sw-action-menu button.danger { color: #c13e4d; }

.sw-root .pi-pagination {
    min-height: 48px;
    padding: 9px 12px;
    border-top-color: var(--sw-line);
    font-size: var(--font-xs);
}

.sw-root .pi-pagination button { min-width: 27px; height: 27px; border-radius: 6px; font-size: var(--font-ui); }
.sw-root .pi-pagination button.active { border-color: var(--sw-purple); background: var(--sw-purple); }
.sw-root .pi-pagination select { padding: 3px 7px; border-radius: 6px; font-size: var(--font-ui); }

/* Details retain all data but use the same compact visual language. */
.sw-root .sw-detail-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 10px;
}

.sw-root .sw-detail-title { display: flex; gap: 10px; align-items: flex-start; }
.sw-root .sw-detail-title h1 { margin: 3px 0 2px; font-size: var(--font-2xl); font-weight: 700; }
.sw-root .sw-detail-title p { margin: 0; color: var(--sw-muted); font-size: var(--font-sm); }

.sw-root .sw-back {
    width: 34px;
    height: 34px;
    border: 1px solid var(--sw-line);
    border-radius: 7px;
    color: #555e71;
    background: #fff;
}

.sw-root .sw-actions { display: flex; gap: 6px; flex-wrap: wrap; }
.sw-root .sw-actions .btn { min-height: 32px; padding: 5px 9px; border-radius: 7px; font-size: var(--font-ui); }

.sw-root .sw-detail-meta {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(145px, 1fr));
    margin-bottom: 10px;
    overflow: hidden;
    border: 1px solid var(--sw-line);
    border-radius: 8px;
    background: #fff;
}

.sw-root .sw-detail-meta > div { padding: 10px 12px; border-left: 1px solid #eff0f5; }
.sw-root .sw-detail-meta span { display: block; margin-bottom: 3px; color: var(--sw-muted); font-size: var(--font-xs); }
.sw-root .sw-detail-meta strong { font-size: var(--font-xs); }

.sw-root .sw-tabs {
    display: flex;
    gap: 0;
    margin: 0 0 10px;
    overflow-x: auto;
    border-bottom: 1px solid var(--sw-line);
}

.sw-root .sw-tabs button {
    padding: 9px 13px;
    border: 0;
    border-bottom: 2px solid transparent;
    color: #747b8d;
    background: none;
    font-size: var(--font-ui);
    font-weight: 700;
    white-space: nowrap;
}

.sw-root .sw-tabs button.active { color: var(--sw-purple); border-bottom-color: var(--sw-purple); }
.sw-root .sw-detail-grid { display: grid; grid-template-columns: 1.45fr 1fr; gap: 10px; }

.sw-root .sw-card {
    padding: 14px;
    border: 1px solid var(--sw-line);
    border-radius: 8px;
    background: #fff;
}

.sw-root .sw-card h3 { margin: 0 0 10px; font-size: var(--font-ui); }
.sw-root .sw-card p { font-size: var(--font-sm); }
.sw-root .sw-info { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.sw-root .sw-info div { padding: 9px; border: 1px solid #eff0f5; border-radius: 7px; background: #fbfbfd; }
.sw-root .sw-info span { display: block; margin-bottom: 3px; color: var(--sw-muted); font-size: var(--font-xs); }
.sw-root .sw-info strong { font-size: var(--font-sm); }
.sw-root .sw-totals { display: grid; gap: 6px; }
.sw-root .sw-totals div { display: flex; justify-content: space-between; gap: 14px; padding: 6px 0; border-bottom: 1px solid #f0f1f5; font-size: var(--font-ui); }
.sw-root .sw-totals .grand { border-bottom: 0; color: var(--sw-purple); font-size: var(--font-ui); }
.sw-root .sw-activity { display: grid; }
.sw-root .sw-activity > div { display: grid; grid-template-columns: 14px 1fr auto; gap: 8px; padding: 9px 0; border-bottom: 1px solid #eff0f5; font-size: var(--font-sm); }
.sw-root .sw-activity i { color: var(--sw-purple); }
.sw-root .sw-activity small { color: var(--sw-muted); }

.sw-root .sw-support-note {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 10px;
    border: 1px solid #e3def8;
    border-radius: 7px;
    color: #574a8c;
    background: #f8f6ff;
    font-size: var(--font-xs);
}
.sw-root .sw-payment-allocation {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
}
.sw-root .sw-payment-allocation > div {
    padding: 10px 12px;
    border: 1px solid var(--sw-line);
    border-radius: 8px;
    background: #fafbfe;
}
.sw-root .sw-payment-allocation span,
.sw-root .sw-payment-allocation strong { display: block; }
.sw-root .sw-payment-allocation span { margin-bottom: 4px; color: var(--sw-muted); font-size: var(--font-xs); }
.sw-root .sw-payment-allocation strong { color: var(--sw-ink); font-size: var(--font-sm); }

/* Settings — horizontal tabs and a single compact content surface. */
.sw-settings {
    display: block;
    overflow: hidden;
    border: 1px solid var(--sw-line);
    border-radius: 8px;
    background: #fff;
}

.sw-settings-nav {
    position: static;
    display: flex;
    align-items: center;
    gap: 2px;
    padding: 0 12px;
    overflow-x: auto;
    border: 0;
    border-bottom: 1px solid var(--sw-line);
    border-radius: 0;
    background: #fff;
}

.sw-settings-nav button {
    width: auto;
    min-width: max-content;
    padding: 12px 13px 10px;
    border: 0;
    border-bottom: 2px solid transparent;
    border-radius: 0;
    color: #747b8d;
    background: transparent;
    font-size: var(--font-ui);
    font-weight: 700;
    text-align: center;
    white-space: nowrap;
}

.sw-settings-nav button:hover { color: var(--sw-purple); }
.sw-settings-nav button.active { color: var(--sw-purple); border-bottom-color: var(--sw-purple); background: transparent; }
.sw-settings-panel { display: none; }
.sw-settings-panel.active { display: block; }

.sw-settings-section {
    padding: 17px 18px 20px;
    margin: 0;
    border: 0;
    border-radius: 0;
    background: #fff;
}

.sw-settings-section header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding-bottom: 12px;
    margin-bottom: 14px;
    border-bottom: 1px solid #f0f1f5;
}

.sw-settings-section h3 { margin: 0 0 3px; color: var(--sw-ink); font-size: var(--font-base); }
.sw-settings-section p { margin: 0; color: var(--sw-muted); font-size: var(--font-xs); }

.sw-settings-save { display: flex; align-items: center; gap: 9px; }
.sw-settings-save .btn { min-height: 32px; padding: 5px 10px; border-radius: 6px; font-size: var(--font-ui); }
.sw-dirty { display: none; color: #ad6d12; font-size: var(--font-xs); white-space: nowrap; }
.sw-dirty.show { display: inline; }

.sw-settings .sw-form-grid { max-width: 920px; }
.sw-settings .sw-form-grid label { color: #525a6d; font-size: var(--font-sm); font-weight: 700; }
.sw-settings .sw-form-grid .form-control { min-height: 38px; margin-top: 5px; border-color: var(--sw-line-strong); border-radius: 7px; font-size: var(--font-ui); box-shadow: none; }
.sw-settings .sw-form-grid textarea.form-control { min-height: 84px; }

.sw-integration-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 9px; }
.sw-integration { padding: 12px; border: 1px solid var(--sw-line); border-radius: 7px; }
.sw-integration strong { display: block; margin-bottom: 6px; font-size: var(--font-sm); }

/* Modal forms. */
.sw-modal {
    position: fixed;
    inset: 0;
    z-index: 1200;
    display: grid;
    place-items: center;
    padding: 18px;
    direction: rtl;
    background: rgba(18, 22, 38, .48);
}

.sw-modal-box {
    width: min(660px, 100%);
    max-height: 90vh;
    overflow: auto;
    border: 1px solid #e5e7ef;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 22px 60px rgba(21, 26, 47, .24);
}

.sw-modal-head { display: flex; align-items: center; justify-content: space-between; padding: 13px 16px; border-bottom: 1px solid var(--sw-line); }
.sw-modal-head h3 { margin: 0; font-size: var(--font-base); }
.sw-modal-head button { width: 30px; height: 30px; padding: 0; border: 0; border-radius: 6px; color: #596174; background: #f3f4f7; }
.sw-modal-body { padding: 16px; }
.sw-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 11px; }
.sw-form-grid .full { grid-column: 1 / -1; }
.sw-form-grid label { color: #525a6d; font-size: var(--font-sm); font-weight: 700; }
.sw-form-grid .form-control { min-height: 38px; margin-top: 5px; border-color: var(--sw-line-strong); border-radius: 7px; font-size: var(--font-ui); box-shadow: none; }
.sw-modal-actions { display: flex; justify-content: flex-start; gap: 7px; padding: 11px 16px; border-top: 1px solid var(--sw-line); }
.sw-modal-actions .btn { min-height: 34px; padding: 6px 11px; border-radius: 7px; font-size: var(--font-ui); }
.sw-modal-actions .btn-primary { border-color: var(--sw-purple); background: var(--sw-purple); }

/* New credit note form — scoped to avoid changing any other sales modal. */
.sw-credit-note-modal { background: rgba(20, 24, 44, .54); backdrop-filter: blur(3px); }
.sw-credit-note-modal .sw-modal-box {
    width: min(720px, 100%);
    overflow: hidden;
    border-color: #e4e2ef;
    border-radius: 14px;
    box-shadow: 0 24px 70px rgba(27, 25, 53, .24);
}
.sw-credit-note-modal .sw-modal-head {
    min-height: 74px;
    padding: 15px 20px;
    border-bottom-color: #ebe9f4;
    background: linear-gradient(135deg, #fbfaff 0%, #fff 68%);
}
.sw-credit-note-modal .sw-modal-head h3 {
    display: flex;
    align-items: center;
    gap: 11px;
    color: #23243b;
}
.sw-credit-note-modal .sw-modal-head h3 > span:last-child { display: grid; gap: 3px; }
.sw-credit-note-modal .sw-modal-head h3 strong { font-size: var(--font-md); }
.sw-credit-note-modal .sw-modal-head h3 small { color: #85899a; font-size: var(--font-xs); font-weight: 500; }
.sw-credit-note-title-icon {
    display: grid;
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    place-items: center;
    border: 1px solid #ddd7ff;
    border-radius: 10px;
    color: var(--sw-purple);
    background: #f1eeff;
    font-size: 1rem;
}
.sw-credit-note-modal .sw-modal-head button {
    width: 34px;
    height: 34px;
    border: 1px solid #e6e5ed;
    border-radius: 8px;
    background: #fff;
    transition: .18s ease;
}
.sw-credit-note-modal .sw-modal-head button:hover { border-color: #cbc6e9; color: var(--sw-purple); background: #f7f5ff; }
.sw-credit-note-modal .sw-modal-body { padding: 20px; background: #fff; }
.sw-credit-note-form { gap: 16px 14px; }
.sw-credit-note-form label { display: grid; gap: 7px; color: #34384b; }
.sw-credit-note-form .sw-field-label {
    display: flex;
    min-height: 16px;
    align-items: center;
    gap: 4px;
    font-size: var(--font-xs);
    font-weight: 700;
}
.sw-credit-note-form .sw-field-label small { margin-inline-start: auto; color: #999cad; font-size: var(--font-xs); font-weight: 500; }
.sw-credit-note-form .sw-required { color: #d9344e; font-size: var(--font-xs); line-height: 1; }
.sw-credit-note-form .sw-control-wrap { position: relative; display: block; }
/* F138: the credit-note lines (what each invoice line still allows) fit the 720px modal; small screens scroll the table.
   Scoped under the modal so the shared `.table thead th { white-space: nowrap }` does not win. */
.sw-credit-note-modal .sw-cn-lines-table { width: 100%; min-width: 520px; margin: 0; table-layout: fixed; font-size: var(--font-xs); }
.sw-credit-note-modal .sw-cn-lines-table thead th, .sw-credit-note-modal .sw-cn-lines-table tbody td { padding: 8px 6px; vertical-align: middle; white-space: normal; overflow-wrap: anywhere; line-height: 1.35; }
.sw-credit-note-modal .sw-cn-lines-table thead th:first-child { width: 34px; }
.sw-credit-note-modal .sw-cn-lines-table thead th:nth-child(3), .sw-credit-note-modal .sw-cn-lines-table thead th:nth-child(4), .sw-credit-note-modal .sw-cn-lines-table thead th:nth-child(5) { width: 90px; }
.sw-credit-note-modal .sw-cn-lines-table thead th:last-child { width: 110px; }
.sw-credit-note-modal .sw-cn-lines-table td strong, .sw-credit-note-modal .sw-cn-lines-table td small { display: block; overflow-wrap: anywhere; }
.sw-credit-note-modal .sw-cn-lines-table td small { color: #85899a; }
.sw-credit-note-modal .sw-cn-lines-table input.form-control { width: 100%; min-width: 0; padding: 6px 8px; }
.sw-credit-note-form .sw-control-icon {
    position: absolute;
    z-index: 1;
    top: 50%;
    right: 13px;
    color: #9698aa;
    font-size: .72rem;
    pointer-events: none;
    transform: translateY(-50%);
}
.sw-credit-note-form .sw-textarea-wrap .sw-control-icon { top: 16px; transform: none; }
.sw-credit-note-form .form-control {
    width: 100%;
    min-height: 44px;
    margin-top: 0;
    padding-inline: 37px 12px;
    border: 1px solid #dcdde7;
    border-radius: 9px;
    color: #292d40;
    background-color: #fff;
    font-size: var(--font-xs);
    transition: border-color .18s ease, box-shadow .18s ease, background-color .18s ease;
}
.sw-credit-note-form textarea.form-control { min-height: 96px; padding-top: 12px; resize: vertical; }
.sw-credit-note-form .form-control:hover:not(:disabled) { border-color: #c8c4dc; }
.sw-credit-note-form .form-control:focus {
    border-color: #7862e8;
    box-shadow: 0 0 0 3px rgba(93, 64, 219, .1);
}
.sw-credit-note-form .form-control:disabled { color: #989bac; background: #f7f7fa; cursor: not-allowed; }
.sw-credit-note-form .sw-control-wrap:focus-within .sw-control-icon { color: var(--sw-purple); }
.sw-credit-note-modal #sw-modal-error { margin: 15px 0 0; border-radius: 8px; font-size: var(--font-xs); }
.sw-credit-note-modal .sw-modal-actions {
    gap: 9px;
    padding: 13px 20px;
    border-top-color: #ebe9f4;
    background: #fbfbfd;
}
.sw-credit-note-modal .sw-modal-actions .btn { min-height: 40px; padding: 8px 16px; border-radius: 8px; font-size: var(--font-xs); font-weight: 700; }
.sw-credit-note-modal .sw-modal-actions .btn-primary { min-width: 148px; box-shadow: 0 7px 18px rgba(93, 64, 219, .2); }
.sw-credit-note-modal .sw-modal-actions .btn-primary:hover { filter: brightness(.96); transform: translateY(-1px); }
.sw-credit-note-modal .sw-modal-actions .btn-secondary { border-color: #dedee7; color: #555a6d; background: #fff; }

@media (max-width: 640px) {
    .sw-credit-note-modal { align-items: end; padding: 10px; }
    .sw-credit-note-modal .sw-modal-box { max-height: calc(100vh - 20px); border-radius: 14px 14px 10px 10px; }
    .sw-credit-note-modal .sw-modal-head { min-height: 68px; padding: 13px 14px; }
    .sw-credit-note-modal .sw-modal-head h3 small { max-width: 230px; line-height: 1.5; }
    .sw-credit-note-modal .sw-modal-body { padding: 16px 14px; }
    .sw-credit-note-form { grid-template-columns: 1fr; gap: 13px; }
    .sw-credit-note-form .full { grid-column: 1; }
    .sw-credit-note-modal .sw-modal-actions { padding: 12px 14px; }
    .sw-credit-note-modal .sw-modal-actions .btn-primary { min-width: 0; flex: 1; }
}

/* Sales return invoice creation and details. */
.sw-return-create-page { display: grid; gap: 14px; direction: rtl; }
.sw-return-create-head {
    display: flex;
    min-height: 92px;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 18px 20px;
    border: 1px solid var(--sw-line);
    border-radius: 11px;
    background: linear-gradient(135deg, #fff 0%, #faf9ff 100%);
}
.sw-return-create-head h1 { display: flex; align-items: center; gap: 10px; margin: 7px 0 3px; color: var(--sw-ink); font-size: var(--font-lg); }
.sw-return-create-head h1 > span { display: grid; width: 35px; height: 35px; place-items: center; border-radius: 9px; color: var(--sw-purple); background: #f0edff; font-size: var(--font-base); }
.sw-return-create-head p { margin: 0; color: var(--sw-muted); font-size: var(--font-sm); }
.sw-return-create-page form { display: grid; gap: 14px; }
.sw-return-create-page .sw-card { border-radius: 10px; box-shadow: 0 2px 9px rgba(30, 33, 52, .025); }
.sw-card-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 13px; }
.sw-card-heading small { display: block; margin-bottom: 2px; color: var(--sw-muted); font-size: var(--font-xs); }
.sw-card-heading h3 { margin: 0; color: var(--sw-ink); font-size: var(--font-ui); }
.sw-card-heading > i { color: #8a76ec; font-size: 1rem; }
.sw-return-source-fields { display: grid; grid-template-columns: 1.1fr 1.45fr .75fr 1fr; gap: 10px; }
.sw-return-source-fields > label,
.sw-return-notes { display: grid; gap: 5px; color: #50576b; font-size: var(--font-sm); font-weight: 700; }
.sw-return-source-fields .form-control,
.sw-return-notes .form-control { min-height: 39px; border-color: var(--sw-line-strong); border-radius: 7px; font-size: var(--font-xs); box-shadow: none; }
.sw-return-source-fields b { color: #d33b51; }
.sw-return-source-fields .sw-search-box { min-height: 39px; }
.sw-return-source-empty,
.sw-return-source-summary {
    display: grid;
    min-height: 58px;
    margin-top: 12px;
    border: 1px dashed #d9d6e8;
    border-radius: 8px;
    background: #fbfbfd;
}
.sw-return-source-empty { grid-template-columns: auto 1fr; align-items: center; gap: 9px; padding: 12px; color: var(--sw-muted); font-size: var(--font-xs); }
.sw-return-source-empty i { color: #947feb; font-size: 1rem; }
.sw-return-source-empty.error { border-color: #efc8ce; color: #a62e40; background: #fff5f6; }
.sw-return-source-summary { grid-template-columns: repeat(6, minmax(0, 1fr)); overflow: hidden; }
.sw-return-source-summary > div { display: grid; align-content: center; gap: 3px; padding: 10px 12px; border-inline-end: 1px solid var(--sw-line); }
.sw-return-source-summary > div:last-child { border-inline-end: 0; }
.sw-return-source-summary span { color: var(--sw-muted); font-size: var(--font-xs); }
.sw-return-source-summary strong { overflow: hidden; color: var(--sw-ink); font-size: var(--font-xs); text-overflow: ellipsis; white-space: nowrap; }
.sw-return-create-lines { padding: 0 !important; overflow: hidden; }
.sw-return-create-lines > .sw-card-heading { margin: 0; padding: 13px 15px; border-bottom: 1px solid var(--sw-line); }
.sw-return-lines-empty { display: grid; min-height: 170px; place-items: center; align-content: center; gap: 8px; color: var(--sw-muted); text-align: center; }
.sw-return-lines-empty i { color: #b3a8eb; font-size: 1.55rem; }
.sw-return-lines-empty p { margin: 0; font-size: var(--font-xs); }
.sw-return-create-table input[type="checkbox"] { width: 15px; height: 15px; accent-color: var(--sw-purple); }
.sw-return-create-table input[type="number"] { width: 105px; min-height: 34px; margin: 0; padding: 5px 7px; border-radius: 6px; font-size: var(--font-ui); }
.sw-return-create-bottom { display: grid; grid-template-columns: minmax(0, 1fr) 330px; align-items: start; gap: 14px; }
.sw-return-settlement-choice { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; margin-bottom: 12px; }
.sw-return-settlement-choice > label { cursor: pointer; }
.sw-return-settlement-choice > label > input { position: absolute; opacity: 0; pointer-events: none; }
.sw-return-settlement-choice > label > span { display: grid; grid-template-columns: 34px 1fr; gap: 1px 9px; align-items: center; min-height: 62px; padding: 10px; border: 1px solid var(--sw-line-strong); border-radius: 8px; background: #fff; transition: .18s ease; }
.sw-return-settlement-choice > label > span i { grid-row: 1 / 3; display: grid; width: 34px; height: 34px; place-items: center; border-radius: 8px; color: #7b68db; background: #f0edff; }
.sw-return-settlement-choice > label > span strong { color: var(--sw-ink); font-size: var(--font-sm); }
.sw-return-settlement-choice > label > span small { color: var(--sw-muted); font-size: var(--font-sm); }
.sw-return-settlement-choice > label > input:checked + span { border-color: #8069ed; background: #faf9ff; box-shadow: 0 0 0 2px rgba(93, 64, 219, .08); }
.sw-return-create-page #sw-return-payment-fields { margin: 0 0 12px; padding: 12px; border: 1px solid #e2def6; border-radius: 8px; background: #faf9ff; }
.sw-return-notes { margin-bottom: 12px; }
.sw-return-notes textarea { min-height: 74px; resize: vertical; }
.sw-return-create-summary { position: sticky; top: 12px; }
.sw-return-create-summary h3 { margin: 0 0 10px; padding-bottom: 10px; border-bottom: 1px solid var(--sw-line); font-size: var(--font-sm); }
.sw-return-create-summary > div { display: flex; justify-content: space-between; gap: 15px; padding: 8px 0; color: #60677a; font-size: var(--font-xs); }
.sw-return-create-summary > div strong { color: var(--sw-ink); }
.sw-return-create-summary > .grand { margin-top: 5px; padding: 12px 0 2px; border-top: 1px solid var(--sw-line); color: var(--sw-purple); font-weight: 700; }
.sw-return-create-summary > .grand strong { color: var(--sw-purple); font-size: var(--font-base); }
.sw-return-create-actions { display: flex; justify-content: flex-start; gap: 8px; padding: 13px 15px; border: 1px solid var(--sw-line); border-radius: 9px; background: #fff; }
.sw-return-create-actions .btn { min-height: 39px; padding: 7px 15px; border-radius: 7px; font-size: var(--font-ui); }

.sw-return-detail-head { align-items: center; }
.sw-return-detail-head .sw-actions { max-width: 760px; }
.sw-return-meta { grid-template-columns: repeat(6, minmax(0, 1fr)) !important; }
.sw-return-tabs { overflow-x: auto; }
.sw-return-tabs button { flex: 0 0 auto; }
.sw-return-view-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 14px; }
.sw-return-view-grid .sw-card-heading { margin-bottom: 10px; }
.sw-return-lines-card { margin-bottom: 14px; }
.sw-return-lines-card .sw-card-heading > span { padding: 5px 9px; border-radius: 12px; color: #6049d5; background: #f0edff; font-size: var(--font-xs); font-weight: 700; }
.sw-return-document-bottom { display: grid; grid-template-columns: minmax(0, 1fr) 330px; gap: 14px; }
.sw-return-document-bottom p { color: #5f6679; font-size: var(--font-xs); line-height: 1.8; }
.sw-return-summary > div { display: flex; justify-content: space-between; padding: 8px 0; color: #60677a; font-size: var(--font-xs); }
.sw-return-summary .grand { margin-top: 5px; padding-top: 12px; border-top: 1px solid var(--sw-line); color: var(--sw-purple); font-size: var(--font-sm); }
.sw-return-summary .grand strong { font-size: var(--font-base); }
.sw-return-settlement-page { display: grid; gap: 14px; }
.sw-return-settlement-hero { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 14px; padding: 4px; }
.sw-return-settlement-hero > span { display: grid; width: 48px; height: 48px; place-items: center; border-radius: 12px; font-size: var(--font-lg); }
.sw-return-settlement-hero.paid > span { color: #13845a; background: #e8f7f0; }
.sw-return-settlement-hero.unpaid > span { color: #b36b09; background: #fff4df; }
.sw-return-settlement-hero small { color: var(--sw-muted); font-size: var(--font-xs); }
.sw-return-settlement-hero h3 { margin: 3px 0; color: var(--sw-ink); font-size: var(--font-ui); }
.sw-return-settlement-hero p { margin: 0; color: var(--sw-muted); font-size: var(--font-xs); }
.sw-return-settlement-hero > strong { color: var(--sw-ink); font-size: var(--font-2xl); }
.sw-empty-payment { padding: 32px !important; color: var(--sw-muted); text-align: center; }
.sw-empty-payment > i { margin-bottom: 9px; color: #b09eea; font-size: 1.5rem; }
.sw-empty-payment h3 { margin: 0 0 5px; font-size: var(--font-ui); }
.sw-empty-payment p { margin: 0; font-size: var(--font-xs); }
.sw-stock-meta { margin-bottom: 13px; }

.sw-return-payment-dialog .sw-modal-box { width: min(680px, 100%); border-radius: 12px; }
.sw-return-payment-dialog .sw-modal-body { padding: 18px; }
.sw-payment-document { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 11px; margin-bottom: 15px; padding: 12px; border: 1px solid #eee5ce; border-radius: 9px; background: #fffaf0; }
.sw-payment-document.paid { border-color: #d6ecdf; background: #f2fbf6; }
.sw-payment-document > span { display: grid; width: 39px; height: 39px; place-items: center; border-radius: 9px; color: #a9690d; background: #ffedc9; }
.sw-payment-document.paid > span { color: #16805a; background: #dff4e9; }
.sw-payment-document small { display: block; color: var(--sw-muted); font-size: var(--font-xs); }
.sw-payment-document strong { color: var(--sw-ink); font-size: var(--font-ui); }
.sw-payment-document p { margin: 2px 0 0; color: #656d80; font-size: var(--font-xs); }

@media (max-width: 1050px) {
    .sw-return-source-fields { grid-template-columns: 1fr 1fr; }
    .sw-return-source-summary { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .sw-return-source-summary > div:nth-child(3) { border-inline-end: 0; }
    .sw-return-source-summary > div:nth-child(-n+3) { border-bottom: 1px solid var(--sw-line); }
    .sw-return-meta { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
}

@media (max-width: 760px) {
    .sw-return-create-head { align-items: stretch; flex-direction: column; }
    .sw-return-source-fields,
    .sw-return-settlement-choice,
    .sw-return-create-bottom,
    .sw-return-view-grid,
    .sw-return-document-bottom { grid-template-columns: 1fr; }
    .sw-return-source-summary { grid-template-columns: 1fr 1fr; }
    .sw-return-source-summary > div,
    .sw-return-source-summary > div:nth-child(3) { border-inline-end: 1px solid var(--sw-line); border-bottom: 1px solid var(--sw-line); }
    .sw-return-source-summary > div:nth-child(even) { border-inline-end: 0; }
    .sw-return-create-summary { position: static; }
    .sw-return-create-actions .btn-primary { flex: 1; }
    .sw-return-meta { grid-template-columns: 1fr 1fr !important; }
    .sw-return-settlement-hero { grid-template-columns: auto 1fr; }
    .sw-return-settlement-hero > strong { grid-column: 1 / -1; padding-top: 10px; border-top: 1px solid var(--sw-line); text-align: left; }
}

.sw-root .sw-loading {
    display: grid;
    gap: 7px;
    padding: 14px;
    border: 1px solid var(--sw-line);
    border-radius: 8px;
    background: #fff;
}

.sw-root .sw-loading span {
    height: 32px;
    border-radius: 6px;
    background: linear-gradient(90deg, #f1f2f6, #fafafa, #f1f2f6);
    background-size: 200% 100%;
    animation: sw-shimmer 1.2s infinite;
}

.sw-root .sw-empty {
    padding: 44px 18px;
    border: 1px solid var(--sw-line);
    border-radius: 8px;
    color: var(--sw-muted);
    background: #fff;
    text-align: center;
}

.sw-root .sw-empty i { margin-bottom: 10px; color: #aa9ceb; font-size: 1.65rem; }
.sw-root .sw-empty h3 { margin: 0 0 5px; color: var(--sw-ink); font-size: var(--font-base); }
.sw-root .sw-empty p { margin: 0; font-size: var(--font-sm); }

.sw-settings-dashboard { min-width: 0; }
.sw-settings-dashboard-section { margin-top: 28px; }
.sw-settings-dashboard-section h2 {
    margin: 0 0 12px;
    color: var(--sw-ink);
    font-size: var(--font-base);
    font-weight: 700;
}
.sw-settings-dashboard-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}
.sw-settings-dashboard-single > div {
    display: grid;
    grid-template-columns: minmax(0, 360px);
    justify-content: center;
}
.sw-settings-dashboard-card {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) 14px;
    align-items: start;
    gap: 12px;
    min-height: 144px;
    padding: 17px;
    border: 1px solid var(--sw-line);
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 4px 13px rgba(28, 38, 70, .045);
    cursor: pointer;
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.sw-settings-dashboard-card:hover {
    transform: translateY(-3px);
    border-color: #d6d0f5;
    box-shadow: 0 10px 22px rgba(41, 47, 79, .09);
}
.sw-settings-dashboard-card-icon {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    border-radius: 10px;
    font-size: .95rem;
}
.sw-settings-dashboard-card-copy h3 {
    margin: 1px 0 7px;
    color: var(--sw-ink);
    font-size: var(--font-ui);
    font-weight: 700;
    line-height: 1.5;
}
.sw-settings-dashboard-card-copy p {
    margin: 0;
    color: var(--sw-muted);
    font-size: var(--font-xs);
    line-height: 1.7;
}
.sw-settings-dashboard-chevron {
    align-self: center;
    color: #a5abba;
    font-size: var(--font-xs);
    transition: color .18s ease, transform .18s ease;
}
.sw-settings-dashboard-card:hover .sw-settings-dashboard-chevron {
    color: var(--sw-purple);
    transform: translateX(-2px);
}
.sw-settings-dashboard-card.blue .sw-settings-dashboard-card-icon { color: #2866ad; background: #edf5ff; }
.sw-settings-dashboard-card.green .sw-settings-dashboard-card-icon { color: #18845b; background: #edf9f3; }
.sw-settings-dashboard-card.purple .sw-settings-dashboard-card-icon { color: #7041a5; background: #f5effd; }
.sw-settings-dashboard-card.orange .sw-settings-dashboard-card-icon { color: #b56a1c; background: #fff5e9; }
.sw-settings-dashboard-card.red .sw-settings-dashboard-card-icon { color: #b54b57; background: #fff0f2; }

.sw-numbering-page { min-width: 0; }
.sw-numbering-sidebar { display: grid; gap: 13px; position: sticky; top: 14px; }
.sw-numbering-nav,
.sw-numbering-summary,
.sw-numbering-card,
.sw-numbering-preview,
.sw-numbering-facts { border: 1px solid var(--sw-line); border-radius: 12px; background: #fff; box-shadow: 0 4px 13px rgba(28, 38, 70, .045); }
.sw-numbering-nav { padding: 10px; }
.sw-numbering-nav > span { display: block; padding: 5px 8px 9px; color: var(--sw-muted); font-size: var(--font-ui); font-weight: 700; }
.sw-numbering-summary { padding: 15px; }
.sw-numbering-summary h2 { display: flex; align-items: center; gap: 7px; margin: 0 0 11px; color: var(--sw-ink); font-size: var(--font-ui); font-weight: 700; }
.sw-numbering-summary h2 i { color: var(--sw-purple); }
.sw-numbering-summary dl { display: grid; gap: 9px; margin: 0; }
.sw-numbering-summary dl div { padding-bottom: 8px; border-bottom: 1px solid #eff0f5; }
.sw-numbering-summary dl div:last-child { padding-bottom: 0; border-bottom: 0; }
.sw-numbering-summary dt { margin-bottom: 3px; color: var(--sw-muted); font-size: var(--font-ui); }
.sw-numbering-summary dd { margin: 0; color: #3d465b; font-size: var(--font-ui); font-weight: 700; line-height: 1.55; overflow-wrap: anywhere; }
.sw-numbering-summary dl div:nth-child(2) dd,
.sw-numbering-summary dl div:last-child dd { color: var(--sw-purple); }
.sw-numbering-summary p { margin: 12px 0 0; color: var(--sw-muted); font-size: var(--font-ui); line-height: 1.6; }
.sw-numbering-main { display: grid; gap: 14px; min-width: 0; }
.sw-numbering-heading,
.sw-numbering-table-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
.sw-numbering-heading h2,
.sw-numbering-table-head h3 { margin: 0 0 3px; color: var(--sw-ink); font-size: var(--font-md); font-weight: 700; }
.sw-numbering-heading p,
.sw-numbering-table-head p { margin: 0; color: var(--sw-muted); font-size: var(--font-ui); }
.sw-numbering-branch-picker { display: grid; gap: 5px; min-width: 200px; color: var(--sw-muted); font-size: var(--font-ui); font-weight: 700; }
.sw-numbering-branch-picker .form-control { min-height: 36px; border-color: #e1e4ed; border-radius: 7px; font-size: var(--font-ui); box-shadow: none; }
.sw-numbering-card { padding: 16px; }
.sw-numbering-card-title { display: flex; gap: 9px; align-items: flex-start; margin-bottom: 14px; }
.sw-numbering-card-title > i { width: 31px; height: 31px; display: grid; place-items: center; border-radius: 8px; color: var(--sw-purple); background: var(--sw-purple-soft); font-size: .78rem; }
.sw-numbering-card h3 { margin: 0 0 3px; color: var(--sw-ink); font-size: var(--font-ui); font-weight: 700; }
.sw-numbering-card p { margin: 0; color: var(--sw-muted); font-size: var(--font-ui); line-height: 1.7; }
.sw-numbering-form { display: grid; gap: 14px; }
.sw-numbering-preview { display: grid; place-items: center; gap: 9px; padding: 18px; text-align: center; border-color: #d9d1fa; background: linear-gradient(135deg, #f9f7ff, #fff); }
.sw-numbering-preview > span { color: #6d5ba8; font-size: var(--font-ui); font-weight: 700; }
.sw-numbering-preview strong { color: var(--sw-purple); font-size: var(--font-2xl); letter-spacing: .5px; overflow-wrap: anywhere; }
.sw-numbering-preview-meta { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px; color: var(--sw-muted); font-size: var(--font-ui); }
.sw-numbering-preview-meta code { padding: 4px 7px; border-radius: 5px; color: #5842a9; background: #f4f1ff; font-size: var(--font-ui); }
.sw-numbering-preview small { color: #51806c; font-size: var(--font-ui); line-height: 1.6; }
.sw-numbering-preview small i { margin-left: 4px; color: #26935f; }
.sw-numbering-preview.unavailable strong { font-size: var(--font-ui); color: #697386; letter-spacing: 0; }
.sw-numbering-switches { display: grid; gap: 10px; margin-bottom: 14px; }
.sw-numbering-switches .switch-control { align-items: flex-start; gap: 11px; padding: 11px 12px; border: 1px solid #edf0f5; border-radius: 9px; background: #fcfcfe; }
.sw-numbering-switches .switch-control span { flex: 0 0 44px; margin-top: 2px; }
.sw-numbering-switches .switch-control strong { display: block; color: var(--sw-ink); font-size: var(--font-ui); }
.sw-numbering-switches .switch-control small { display: block; margin-top: 2px; color: var(--sw-muted); font-size: var(--font-ui); font-weight: 500; line-height: 1.6; }
.sw-numbering-switches .switch-control input:checked + span { background: var(--primary, #2563eb); }
.sw-numbering-switches .switch-control.is-fixed { cursor: default; }
.sw-numbering-switches .switch-control.is-fixed input:checked + span { background: #a9b4c9; }
.sw-numbering-facts { padding: 16px; background: #fcfbff; }
.sw-numbering-facts h3 { margin: 0 0 10px; color: #493890; font-size: var(--font-ui); }
.sw-numbering-facts h3 i { margin-left: 5px; }
.sw-numbering-facts ol { display: grid; gap: 9px; margin: 0; padding: 0 18px 0 0; color: #5c6476; }
.sw-numbering-facts li { padding-right: 2px; font-size: var(--font-ui); line-height: 1.65; }
.sw-numbering-facts li::marker { color: var(--sw-purple); font-weight: 700; }
.sw-numbering-table code { padding: 4px 6px; border-radius: 5px; color: #5842a9; background: #f4f1ff; font-size: var(--font-ui); }
.sw-numbering-table th,.sw-numbering-table td { white-space: nowrap; }
.sw-numbering-table td { font-size: var(--font-ui); }.sw-numbering-table td:nth-child(4) strong { color: var(--sw-purple); }
.sw-numbering-table tr.is-selected td { background: #faf8ff; }
.sw-numbering-log-button { border: 0; color: var(--sw-purple); background: transparent; font: inherit; font-size: var(--font-ui); cursor: pointer; }.sw-numbering-log-button i { margin-right: 3px; font-size: .5rem; }
.sw-numbering-actions { display: flex; justify-content: flex-end; gap: 8px; }.sw-numbering-actions .btn { min-height: 34px; padding: 6px 11px; border-radius: 7px; font-size: var(--font-ui); }

.sw-root .sw-error {
    padding: 30px;
    border: 1px solid #f0ced3;
    border-radius: 8px;
    color: #9e3441;
    background: #fff4f5;
    text-align: center;
}

.sw-receipt { direction: rtl; color: #17203b; }
.sw-receipt h1 { font-size: var(--font-2xl); }
.sw-receipt table { width: 100%; border-collapse: collapse; }
.sw-receipt td { padding: 8px; border-bottom: 1px solid #e8e8ee; }

@keyframes sw-shimmer { to { background-position: -200% 0; } }

@media (max-width: 1280px) {
    .sw-metrics {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 1px;
        overflow: visible;
        background: #eff0f5;
    }

    .sw-metrics.sw-metrics-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .sw-metrics.sw-metrics-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
    .sw-metrics.sw-metrics-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }

    .sw-metric {
        min-width: 0;
        border: 0;
        background: #fff;
    }

    .sw-filter-primary { grid-template-columns: minmax(240px, 1fr) auto auto; }
    .sw-filter-inline { grid-column: 1 / -1; grid-row: 2; }
    .sw-filter-button { grid-column: 2; grid-row: 1; }
    .sw-clear-button { grid-column: 3; grid-row: 1; }
}

@media (max-width: 900px) {
    .sw-metrics.sw-metrics-4,
    .sw-metrics.sw-metrics-5,
    .sw-metrics.sw-metrics-6 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .sw-page-head,
    .sw-root .pi-page-head { align-items: stretch; }
    .sw-head-actions { padding-top: 16px; }
    .sw-filter-inline { overflow-x: auto; }
    .sw-filter-inline .sw-filter-field { min-width: 150px; }
    .sw-advanced-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .sw-root .sw-detail-grid { grid-template-columns: 1fr; }
    .sw-integration-grid { grid-template-columns: 1fr; }
    .sw-settings-dashboard-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .sw-numbering-sidebar { position: static; grid-template-columns: 210px minmax(0, 1fr); }
    .sw-numbering-facts { columns: 2; }
    .sw-numbering-facts h3 { column-span: all; }
}

@media (max-width: 620px) {
    .sw-metrics.sw-metrics-4,
    .sw-metrics.sw-metrics-5,
    .sw-metrics.sw-metrics-6 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .sw-page-head,
    .sw-root .pi-page-head,
    .sw-root .sw-detail-head { display: block; }
    .sw-head-actions { justify-content: space-between; padding-top: 10px; }
    .sw-head-actions .btn-primary { flex: 1; justify-content: center; }
    .sw-filter-primary { grid-template-columns: 1fr auto auto; }
    .sw-filter-inline { display: grid; grid-template-columns: 1fr 1fr; overflow: visible; }
    .sw-filter-inline .sw-filter-field { min-width: 0; }
    .sw-advanced-filters { grid-template-columns: 1fr; }
    .sw-root .sw-detail-meta,
    .sw-root .sw-info,
    .sw-form-grid { grid-template-columns: 1fr; }
    .sw-form-grid .full { grid-column: auto; }
    .sw-settings-section header { align-items: flex-start; }
    .sw-settings-save { align-items: flex-end; flex-direction: column; }
    .sw-root .pi-pagination { flex-wrap: wrap; justify-content: center; }
    .sw-settings-dashboard-grid,
    .sw-settings-dashboard-single > div { grid-template-columns: 1fr; }
    .sw-settings-dashboard-section { margin-top: 23px; }
    .sw-settings-dashboard-card { min-height: 126px; }
    .sw-numbering-sidebar { grid-template-columns: 1fr; }
    .sw-numbering-facts { columns: auto; }
    .sw-numbering-facts h3 { column-span: none; }
    .sw-numbering-nav { display: grid; grid-template-columns: 1fr 1fr; gap: 3px; }
    .sw-numbering-nav > span { grid-column: 1 / -1; }
    .sw-numbering-nav a { font-size: var(--font-ui); }
}
/* Company tax types */
.sw-tax-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:18px;padding:14px 16px;border:1px solid #dfe7f2;border-radius:12px;background:#f8fbff}.sw-tax-toolbar>div{display:flex;align-items:baseline;gap:8px}.sw-tax-toolbar strong{font-size:var(--font-xl);color:#1d4ed8}.sw-tax-toolbar span{font-size:var(--font-sm);color:#64748b}.sw-tax-table code{direction:ltr;display:inline-block;color:#1e3a8a;background:#eff6ff;padding:3px 7px;border-radius:6px}.sw-table-actions{display:flex;gap:6px}.sw-table-actions button{width:32px;height:32px;border:1px solid #dbe4ef;border-radius:8px;background:#fff;color:#334155}.sw-table-actions button:hover{border-color:#2563eb;color:#2563eb}.sw-table-actions button.danger:hover{border-color:#dc2626;color:#dc2626}.sw-tax-dialog .modal-dialog{max-width:860px}.sw-tax-form{display:grid;gap:14px}.sw-tax-form section{border:1px solid #e2e8f0;border-radius:12px;padding:16px}.sw-tax-form h4{font-size:var(--font-base);margin:0 0 14px;color:#172554}.sw-tax-mode{display:grid;grid-template-columns:1fr 1fr;gap:12px}.sw-tax-mode label{cursor:pointer}.sw-tax-mode input{position:absolute;opacity:0}.sw-tax-mode span{display:flex;flex-direction:column;gap:5px;border:1px solid #dbe4ef;border-radius:10px;padding:13px;background:#fff}.sw-tax-mode input:checked+span{border-color:#2563eb;background:#eff6ff;box-shadow:0 0 0 2px rgba(37,99,235,.08)}.sw-tax-mode small{color:#64748b;font-size:var(--font-xs)}.sw-tax-example{margin-top:12px;padding:11px 13px;border-radius:9px;background:#f0fdf4;color:#166534;font-size:var(--font-sm)}.sw-tax-form .switch-control{display:flex;align-items:center;gap:8px;min-height:42px}
.sw-tax-default{display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,430px);gap:18px;align-items:center;margin-bottom:18px;padding:17px;border:1px solid #d8e4ff;border-radius:13px;background:linear-gradient(135deg,#f8fbff,#f5f3ff)}.sw-tax-default-copy{display:flex;align-items:center;gap:13px}.sw-tax-default-copy h4{margin:0 0 5px;color:#172554;font-size:var(--font-base)}.sw-tax-default-copy p{font-size:var(--font-sm)}.sw-tax-default-icon{width:43px;height:43px;display:grid;place-items:center;border-radius:12px;background:#e8efff;color:#3159b8;font-size:18px}.sw-tax-default-control{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center}.sw-tax-default-control small{grid-column:1/-1;color:#64748b;font-size:var(--font-xs)}.sw-tax-table td:first-child .pi-badge{margin-inline-start:7px}
@media(max-width:700px){.sw-tax-mode,.sw-tax-default{grid-template-columns:1fr}.sw-tax-default-control{grid-template-columns:1fr}.sw-tax-default-control small{grid-column:auto}.sw-tax-toolbar{align-items:stretch;flex-direction:column}.sw-tax-toolbar .btn,.sw-tax-default-control .btn{width:100%}}
.sw-numbering-page{width:min(100%,1440px);margin:0 auto;padding-inline:clamp(12px,2vw,28px)}
.sw-numbering-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.sw-numbering-form-grid label{display:grid;gap:6px;color:var(--sw-muted);font-size:var(--font-ui);font-weight:700}.sw-numbering-form-grid .full{grid-column:1/-1}.sw-numbering-form-grid .form-control{min-height:36px;border-color:#e1e4ed;border-radius:7px;font-size:var(--font-ui);box-shadow:none}.sw-numbering-form-grid small{color:#8790a2;font-weight:500;line-height:1.55}.sw-numbering-inline-error{min-height:18px;margin:8px 0 0;color:#b42318;font-size:var(--font-ui)}.sw-numbering-state{padding:28px 18px;text-align:center;color:var(--sw-muted)}.sw-numbering-state i{display:block;margin-bottom:9px;font-size:1.15rem}.sw-numbering-state p{margin:0;font-size:var(--font-ui)}
@media(max-width:820px){.sw-numbering-form-grid{grid-template-columns:1fr}.sw-numbering-form-grid .full{grid-column:auto}.sw-numbering-sidebar{position:static}.sw-numbering-nav{display:block}.sw-numbering-page{padding-inline:12px}}
.sw-numbering-page{width:min(100%,1580px);padding-inline:clamp(16px,2vw,34px)}
.sw-settings-dashboard-link{color:inherit;text-decoration:none}.sw-settings-dashboard-link:hover{color:inherit}.sw-numbering-nav a{width:100%;display:flex;align-items:center;gap:8px;padding:9px;border:0;border-radius:8px;color:#667085;background:transparent;text-align:right;font-size:var(--font-ui);font-weight:700;text-decoration:none}.sw-numbering-nav a i{width:16px;color:#98a0b2;text-align:center}.sw-numbering-nav a.active{color:var(--sw-purple);background:var(--sw-purple-soft)}.sw-numbering-nav a.active i{color:var(--sw-purple)}.sw-invoice-settings-shell{display:grid;grid-template-columns:230px minmax(0,1fr);gap:18px;align-items:start}.sw-invoice-settings-shell .sw-numbering-main{grid-template-columns:minmax(0,1fr)}
.sw-settings-breadcrumb a{color:inherit;text-decoration:none}.sw-settings-breadcrumb a:hover{color:var(--sw-purple);text-decoration:underline}.sw-settings-breadcrumb a:focus-visible,.sw-numbering-nav a:focus-visible{outline:2px solid var(--sw-purple);outline-offset:2px;border-radius:5px}.sw-settings-breadcrumb strong[aria-current="page"]{font-weight:700}
.sw-numbering-main{grid-template-columns:minmax(0,1fr);gap:16px}.sw-numbering-dirty{display:inline-flex;align-items:center;gap:6px;margin-top:8px;padding:5px 8px;border-radius:999px;color:#9a6700;background:#fff8c5;font-size:var(--font-ui);font-weight:700}.sw-numbering-dirty.d-none{display:none}.sw-numbering-actions{position:sticky;bottom:8px;padding:10px;border:1px solid var(--sw-line);border-radius:10px;background:rgba(255,255,255,.94);box-shadow:0 6px 18px rgba(28,38,70,.07);z-index:2}
@media(max-width:1500px) and (min-width:1241px){.sw-numbering-card{padding:14px}.sw-numbering-summary,.sw-numbering-facts{padding:13px}}
@media(max-width:820px){.sw-numbering-actions{position:static}.sw-numbering-settings-page .sw-numbering-heading{flex-direction:column;align-items:stretch}.sw-numbering-branch-picker{min-width:0}}
.sw-defaults-page .sw-numbering-main{gap:16px}.sw-defaults-form{display:grid;gap:16px}.sw-defaults-summary{margin-top:14px;padding:14px;border:1px solid var(--sw-line);border-radius:10px;background:#fff}.sw-defaults-summary h2{display:flex;align-items:center;gap:7px;margin:0 0 12px;color:var(--sw-ink);font-size:var(--font-sm)}.sw-defaults-summary h2 i{color:var(--sw-purple)}.sw-defaults-summary dl{display:grid;gap:8px;margin:0}.sw-defaults-summary dl>div{display:grid;gap:2px;padding-bottom:7px;border-bottom:1px solid #eef1f5}.sw-defaults-summary dl>div:last-child{padding-bottom:0;border-bottom:0}.sw-defaults-summary dt{color:var(--sw-muted);font-size:var(--font-xs);font-weight:600}.sw-defaults-summary dd{margin:0;color:var(--sw-ink);font-size:var(--font-sm);font-weight:700}.sw-defaults-summary p{margin:12px 0 0;color:var(--sw-muted);font-size:var(--font-xs);line-height:1.6}.sw-defaults-notice{display:flex;align-items:flex-start;gap:8px;padding:11px 13px;border:1px solid #f0d58a;border-radius:9px;background:#fffaf0;color:#8a5a13;font-size:var(--font-sm)}.sw-defaults-notice i{margin-top:2px}.sw-defaults-form output.form-control{display:flex;align-items:center}.sw-defaults-form textarea.form-control{resize:vertical;min-height:96px}
@media(max-width:820px){.sw-invoice-settings-shell{grid-template-columns:1fr}.sw-invoice-settings-shell .sw-numbering-sidebar{position:static}}
.sw-display-page .sw-numbering-main{gap:16px}.sw-display-form{display:grid;gap:16px}.sw-display-summary{margin-top:14px;padding:14px;border:1px solid var(--sw-line);border-radius:10px;background:#fff}.sw-display-summary h2{display:flex;align-items:center;gap:7px;margin:0 0 12px;color:var(--sw-ink);font-size:var(--font-sm)}.sw-display-summary h2 i{color:var(--sw-purple)}.sw-display-summary dl{display:grid;gap:8px;margin:0}.sw-display-summary dl>div{display:grid;gap:2px;padding-bottom:7px;border-bottom:1px solid #eef1f5}.sw-display-summary dl>div:last-child{padding-bottom:0;border-bottom:0}.sw-display-summary dt{color:var(--sw-muted);font-size:var(--font-xs);font-weight:600}.sw-display-summary dd{margin:0;color:var(--sw-ink);font-size:var(--font-sm);font-weight:700;line-height:1.55}.sw-display-summary p{margin:12px 0 0;color:var(--sw-muted);font-size:var(--font-xs);line-height:1.6}.sw-display-notice{display:flex;align-items:flex-start;gap:8px;padding:11px 13px;border:1px solid #f0d58a;border-radius:9px;background:#fffaf0;color:#8a5a13;font-size:var(--font-sm)}.sw-display-notice i{margin-top:2px}.sw-display-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:14px}.sw-display-facts>div{display:grid;gap:4px;padding:11px 12px;border:1px solid #e7ebf2;border-radius:8px;background:#fbfcfe}.sw-display-facts span{color:var(--sw-muted);font-size:var(--font-xs);font-weight:600}.sw-display-facts strong{color:var(--sw-ink);font-size:var(--font-sm);line-height:1.5}.sw-display-protection{display:flex;align-items:flex-start;gap:8px;margin-top:13px;padding:10px 12px;border-radius:8px;background:#eef7ff;color:#1e4c78;font-size:var(--font-xs);line-height:1.65}.sw-display-protection i{margin-top:2px;color:#2563eb}
@media(max-width:620px){.sw-display-facts{grid-template-columns:1fr}.sw-display-page .sw-numbering-heading{gap:10px;align-items:flex-start;flex-direction:column}.sw-display-page .sw-numbering-heading .btn{width:100%;justify-content:center}}
.sw-behavior-page .sw-numbering-main{gap:16px}.sw-behavior-form{display:grid;gap:16px}.sw-behavior-summary{margin-top:14px;padding:14px;border:1px solid var(--sw-line);border-radius:10px;background:#fff}.sw-behavior-summary h2{display:flex;align-items:center;gap:7px;margin:0 0 12px;color:var(--sw-ink);font-size:var(--font-sm)}.sw-behavior-summary h2 i{color:var(--sw-purple)}.sw-behavior-summary dl{display:grid;gap:8px;margin:0}.sw-behavior-summary dl>div{display:grid;gap:2px;padding-bottom:7px;border-bottom:1px solid #eef1f5}.sw-behavior-summary dl>div:last-child{padding-bottom:0;border-bottom:0}.sw-behavior-summary dt{color:var(--sw-muted);font-size:var(--font-xs);font-weight:600}.sw-behavior-summary dd{margin:0;color:var(--sw-ink);font-size:var(--font-sm);font-weight:700;line-height:1.55}.sw-behavior-summary p{margin:12px 0 0;color:var(--sw-muted);font-size:var(--font-xs);line-height:1.6}.sw-behavior-notice{display:flex;align-items:flex-start;gap:8px;padding:11px 13px;border:1px solid #f0d58a;border-radius:9px;background:#fffaf0;color:#8a5a13;font-size:var(--font-sm)}.sw-behavior-notice i{margin-top:2px}.sw-behavior-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:14px}.sw-behavior-facts>div{display:flex;align-items:flex-start;gap:10px;padding:12px;border:1px solid #e7ebf2;border-radius:9px;background:#fbfcfe}.sw-behavior-facts>div>i{width:28px;height:28px;display:grid;place-items:center;flex:0 0 28px;border-radius:8px;background:#f1edff;color:var(--sw-purple)}.sw-behavior-facts span{display:grid;gap:3px}.sw-behavior-facts strong{color:var(--sw-ink);font-size:var(--font-sm)}.sw-behavior-facts small{color:var(--sw-muted);font-size:var(--font-xs);line-height:1.6}.sw-behavior-protected{border-color:#d9e5f6;background:#fbfdff}.sw-behavior-protected ul{display:grid;gap:8px;margin:14px 0 0;padding:0 19px 0 0;color:#294968;font-size:var(--font-xs);line-height:1.65}.sw-behavior-protected li::marker{color:#2563eb}
@media(max-width:620px){.sw-behavior-facts{grid-template-columns:1fr}}

/* F123: the recurring invoice form (full invoice lines) gets a wider window. */
.sw-recurring-modal .sw-modal-box { width: min(980px, 100%); }
.sw-r-lines-table td:first-child { min-width: 220px; }
.sw-r-lines-table td { vertical-align: middle; }
.sw-r-lines-table input[data-l="quantity"], .sw-r-lines-table input[data-l="price"] { min-width: 90px; }
.sw-r-lines-table select { min-width: 150px; }

/* ecommerce-orders.css */
.eo-root {
    --eo-primary: var(--primary);
    --eo-primary-soft: var(--primary-light);
    --eo-surface: var(--bg-surface);
    --eo-page: var(--bg-app);
    --eo-text: var(--text-main);
    --eo-muted: var(--text-muted);
    --eo-border: var(--border-color);
    --eo-success: var(--success);
    --eo-success-soft: var(--success-light);
    --eo-warning: var(--warning);
    --eo-warning-soft: var(--warning-light);
    --eo-danger: var(--danger);
    --eo-danger-soft: var(--danger-light);
    min-width: 0;
    direction: rtl;
    color: var(--eo-text);
}

.eo-root button, .eo-root input, .eo-root select, .eo-root textarea { font-family: inherit; }
.eo-page-head { display:flex; justify-content:space-between; align-items:flex-start; gap:20px; margin-bottom:14px; }
.eo-breadcrumb { display:flex; align-items:center; gap:7px; margin-bottom:5px; color:var(--eo-muted); font-size:var(--font-xs); }
.eo-breadcrumb i { font-size:.5rem; }
.eo-breadcrumb strong { color:var(--eo-primary); }
.eo-page-head h1 { display:flex; align-items:center; gap:9px; margin:0 0 4px; font-size:var(--font-2xl); font-weight:700; }
.eo-page-head h1 > span { width:32px; height:32px; display:grid; place-items:center; border-radius:9px; color:var(--eo-primary); background:var(--eo-primary-soft); font-size:var(--font-ui); }
.eo-page-head p { margin:0; color:var(--eo-muted); font-size:var(--font-sm); }
.eo-phase-chip { display:inline-flex; align-items:center; gap:7px; margin-top:20px; padding:7px 10px; border:1px solid var(--eo-border); border-radius:var(--border-radius); color:var(--eo-primary); background:var(--eo-surface); font-size:var(--font-xs); font-weight:700; white-space:nowrap; }

.eo-summary { display:grid; grid-template-columns:repeat(7,minmax(120px,1fr)); gap:8px; margin-bottom:10px; }
.eo-summary-card { min-width:0; display:flex; align-items:center; gap:9px; padding:11px; border:1px solid var(--eo-border); border-radius:var(--border-radius); background:var(--eo-surface); box-shadow:var(--shadow-sm); }
.eo-summary-icon { width:30px; height:30px; flex:0 0 30px; display:grid; place-items:center; border-radius:8px; color:var(--eo-primary); background:var(--eo-primary-soft); font-size:.75rem; }
.eo-summary-card.orange .eo-summary-icon { color:var(--eo-warning); background:var(--eo-warning-soft); }
.eo-summary-card.green .eo-summary-icon { color:var(--eo-success); background:var(--eo-success-soft); }
.eo-summary-card.red .eo-summary-icon { color:var(--eo-danger); background:var(--eo-danger-soft); }
.eo-summary-card.violet .eo-summary-icon { color:var(--secondary); background:var(--bg-app); }
.eo-summary-card small { display:block; overflow:hidden; color:var(--eo-muted); font-size:var(--font-xs); text-overflow:ellipsis; white-space:nowrap; }
.eo-summary-card strong { display:block; margin-top:2px; overflow:hidden; font-weight:700;font-size:var(--font-ui);line-height:1.3; text-overflow:ellipsis; white-space:nowrap; }

.eo-filter-card { display:grid; grid-template-columns:minmax(240px,2fr) repeat(7,minmax(120px,1fr)) auto; align-items:end; gap:8px; padding:11px; margin-bottom:10px; border:1px solid var(--eo-border); border-radius:var(--border-radius-lg); background:var(--eo-surface); box-shadow:var(--shadow-sm); }
.eo-filter-card label { display:grid; gap:4px; min-width:0; margin:0; }
.eo-filter-card label > span { color:var(--eo-muted); font-size:var(--font-sm); font-weight:600; }
.eo-filter-card .form-control, .eo-search { min-height:37px; border:1px solid var(--eo-border); border-radius:var(--border-radius); background:var(--eo-surface); box-shadow:none; font-size:var(--font-ui); }
.eo-filter-card .form-control { padding:6px 8px; }
.eo-search { display:flex; align-items:center; gap:8px; padding:0 10px; }
.eo-search:focus-within, .eo-filter-card .form-control:focus { border-color:var(--eo-primary); box-shadow:0 0 0 3px color-mix(in srgb,var(--eo-primary) 10%,transparent); }
.eo-search i { color:var(--eo-muted); font-size:.72rem; }
.eo-search input { width:100%; min-width:0; border:0; outline:0; color:var(--eo-text); background:transparent; font-size:var(--font-ui); }
.eo-filter-actions { display:flex; gap:6px; }
.eo-filter-actions .btn { min-height:37px; display:inline-flex; align-items:center; gap:6px; padding:6px 10px; border-radius:var(--border-radius); white-space:nowrap; font-size:var(--font-ui); }

.eo-progress { height:2px; position:relative; overflow:hidden; margin:-3px 0 7px; border-radius:999px; background:var(--eo-primary-soft); }
.eo-progress span { width:35%; height:100%; position:absolute; inset-inline-start:-35%; background:var(--eo-primary); animation:eo-loading 1s infinite ease-in-out; }
@keyframes eo-loading { to { inset-inline-start:100%; } }

.eo-table-card { overflow:hidden; border:1px solid var(--eo-border); border-radius:var(--border-radius-lg); background:var(--eo-surface); box-shadow:var(--shadow-sm); }
.eo-table-title { display:flex; justify-content:space-between; align-items:center; gap:15px; padding:11px 14px; border-bottom:1px solid var(--eo-border); }
.eo-table-title h2 { margin:0; font-size:var(--font-base); font-weight:700; }
.eo-table-title p { margin:2px 0 0; color:var(--eo-muted); font-size:var(--font-xs); }
.eo-table-title > span { padding:5px 8px; border-radius:999px; color:var(--eo-primary); background:var(--eo-primary-soft); font-size:var(--font-xs); font-weight:700; }
.eo-table-scroll { overflow-x:auto; }
.eo-table-card table, .eo-items table { width:100%; min-width:1180px; border-collapse:collapse; }
.eo-table-card th, .eo-table-card td, .eo-items th, .eo-items td { padding:10px 11px; border-bottom:1px solid var(--eo-border); text-align:right; vertical-align:middle; font-size:var(--font-ui); white-space:nowrap; }
.eo-table-card th, .eo-items th { color:var(--eo-muted); background:var(--eo-page); font-size:var(--font-ui); font-weight:700; }
.eo-table-card tbody tr:hover { background:var(--eo-primary-soft); }
.eo-table-card td small, .eo-items td small { display:block; margin-top:3px; color:var(--eo-muted); font-size:var(--font-xs); }
.eo-payment-cell strong { display:block; font-weight:700; }
.eo-payment-cell small { display:flex; align-items:center; gap:4px; }
.eo-payment-cell .eo-payment-unmapped { color:var(--eo-danger); }
.eo-order-link { padding:0; border:0; color:var(--eo-primary); background:none; font-weight:700; }
.eo-invoice-link { display:block; margin-top:4px; padding:0; border:0; color:var(--eo-primary); background:none; font-weight:700;font-size:var(--font-xs);line-height:1.2; }
.eo-invoice-link:hover { text-decoration:underline; }
.eo-view-button { display:inline-flex; align-items:center; gap:5px; padding:5px 8px; border:1px solid var(--eo-border); border-radius:7px; color:var(--eo-primary); background:var(--eo-surface); font-size:var(--font-ui); }
.eo-view-button:hover { border-color:var(--eo-primary); background:var(--eo-primary-soft); }
.eo-badge { display:inline-flex; align-items:center; padding:4px 7px; border:1px solid var(--eo-border); border-radius:999px; color:var(--eo-muted); background:var(--eo-page); font-size:var(--font-xs); font-weight:700; }
.eo-badge.success { color:var(--eo-success); border-color:var(--eo-success-soft); background:var(--eo-success-soft); }
.eo-badge.warning { color:#9b600f; border-color:var(--eo-warning-soft); background:var(--eo-warning-soft); }
.eo-badge.danger { color:var(--eo-danger); border-color:var(--eo-danger-soft); background:var(--eo-danger-soft); }
.eo-badge.info { color:var(--eo-primary); border-color:var(--eo-primary-soft); background:var(--eo-primary-soft); }
.eo-badge.violet { color:var(--secondary); background:var(--eo-page); }
.eo-pagination { display:flex; justify-content:space-between; align-items:center; padding:9px 12px; color:var(--eo-muted); font-size:var(--font-xs); }
.eo-pagination > div { display:flex; align-items:center; gap:6px; }
.eo-pagination button, .eo-pagination strong { width:28px; height:28px; display:grid; place-items:center; border:1px solid var(--eo-border); border-radius:7px; color:var(--eo-text); background:var(--eo-surface); }
.eo-pagination strong { color:#fff; border-color:var(--eo-primary); background:var(--eo-primary); }
.eo-pagination button:disabled { opacity:.4; }

.eo-loading, .eo-error, .eo-empty { min-height:280px; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:9px; padding:30px; text-align:center; }
.eo-loading i, .eo-error i, .eo-empty i { color:var(--eo-primary); font-size:1.7rem; }
.eo-error h2, .eo-empty h2 { margin:0; font-size:var(--font-md); }
.eo-error p, .eo-empty p { max-width:520px; margin:0; color:var(--eo-muted); font-size:var(--font-sm); }

.eo-modal { position:fixed; z-index:1080; inset:0; display:flex; align-items:center; justify-content:center; padding:18px; background:rgb(15 23 42 / .58); backdrop-filter:blur(2px); }
.eo-modal-box { width:min(1220px,100%); max-height:calc(100vh - 36px); display:flex; flex-direction:column; overflow:hidden; border:1px solid var(--eo-border); border-radius:var(--border-radius-lg); background:var(--eo-surface); box-shadow:var(--shadow-lg); }
.eo-modal-loading { min-height:280px; display:flex; align-items:center; justify-content:center; gap:8px; color:var(--eo-muted); }
.eo-modal-head { display:flex; justify-content:space-between; align-items:center; gap:15px; padding:13px 16px; border-bottom:1px solid var(--eo-border); }
.eo-modal-head span, .eo-modal-head small { display:block; color:var(--eo-muted); font-size:var(--font-xs); }
.eo-modal-head h2 { margin:2px 0; font-size:var(--font-md); font-weight:700; }
.eo-modal-head button { width:32px; height:32px; display:grid; place-items:center; border:1px solid var(--eo-border); border-radius:8px; color:var(--eo-muted); background:var(--eo-page); }
.eo-modal-body { min-height:0; overflow-x:hidden; overflow-y:auto; padding:14px 16px; }
.eo-detail-status { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:11px; padding:10px 12px; border:1px solid var(--eo-border); border-radius:var(--border-radius); background:var(--eo-page); }
.eo-detail-status > div { display:flex; flex-wrap:wrap; gap:6px; }
.eo-detail-grid, .eo-notes-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin-bottom:10px; }
.eo-detail-grid section, .eo-items, .eo-notes-grid section { min-width:0; padding:12px; border:1px solid var(--eo-border); border-radius:var(--border-radius); background:var(--eo-surface); }
.eo-detail-grid h3, .eo-items h3, .eo-notes-grid h3 { display:flex; align-items:center; gap:7px; margin:0 0 10px; font-size:var(--font-xs); font-weight:700; }
.eo-detail-grid h3 i, .eo-items h3 i { color:var(--eo-primary); }
.eo-detail-grid dl { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px 14px; margin:0; }
.eo-detail-grid dl > div { min-width:0; }
.eo-detail-grid dt { color:var(--eo-muted); font-size:var(--font-xs); font-weight:500; }
.eo-detail-grid dd { margin:2px 0 0; overflow-wrap:anywhere; font-size:var(--font-sm); font-weight:700; }
.eo-items { margin-bottom:10px; padding:0; overflow:hidden; }
.eo-items h3 { padding:11px 12px; margin:0; border-bottom:1px solid var(--eo-border); }
.eo-items table { min-width:900px; }
.eo-totals { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:8px; margin-bottom:10px; }
.eo-totals > div { display:grid; gap:3px; padding:9px 10px; border:1px solid var(--eo-border); border-radius:var(--border-radius); background:var(--eo-page); }
.eo-totals span { color:var(--eo-muted); font-size:var(--font-ui); }
.eo-totals strong { font-weight:700;font-size:var(--font-ui); }
.eo-totals .total { color:var(--eo-primary); border-color:var(--eo-primary); background:var(--eo-primary-soft); }
.eo-notes-grid { margin-bottom:0; }
.eo-notes-grid p { min-height:48px; margin:0; color:var(--eo-muted); font-size:var(--font-xs); white-space:pre-wrap; }
.eo-notes-grid textarea { resize:vertical; font-size:var(--font-xs); }
.eo-payment-mapping { display:grid; grid-template-columns:minmax(220px,1fr) minmax(260px,1.2fr) auto; align-items:end; gap:12px; margin-bottom:10px; padding:12px; border:1px solid var(--eo-warning); border-radius:var(--border-radius); background:var(--eo-warning-soft); }
.eo-payment-mapping > div { display:flex; align-items:center; gap:9px; }
.eo-payment-mapping > div > i { color:var(--eo-warning); font-size:1rem; }
.eo-payment-mapping strong, .eo-payment-mapping small { display:block; }
.eo-payment-mapping strong { font-size:var(--font-sm); }
.eo-payment-mapping small, .eo-payment-mapping p { margin:2px 0 0; color:var(--eo-muted); font-size:var(--font-xs); }
.eo-payment-mapping label { display:grid; gap:4px; margin:0; }
.eo-payment-mapping label > span { color:var(--eo-muted); font-size:var(--font-sm); font-weight:700; }
.eo-payment-mapping .form-control, .eo-payment-mapping .btn { min-height:38px; font-size:var(--font-ui); }
.eo-payment-mapping.is-locked { grid-template-columns:1fr auto; }
.eo-modal-actions { display:flex; align-items:end; gap:8px; padding:11px 16px; border-top:1px solid var(--eo-border); background:var(--eo-page); }
.eo-modal-actions > label { min-width:220px; display:grid; gap:3px; margin-inline-start:auto; }
.eo-modal-actions > label span { color:var(--eo-muted); font-size:var(--font-ui); }
.eo-modal-actions .form-control, .eo-modal-actions .btn { min-height:36px; border-radius:var(--border-radius); font-size:var(--font-ui); }
.eo-modal-actions .eo-convert, .eo-modal-actions .eo-open-invoice { margin-inline-start:auto; }

.eo-conversion-overlay { z-index:1090; }
.eo-confirm-box { width:min(720px,100%); overflow:hidden; border:1px solid var(--eo-border); border-radius:var(--border-radius-lg); background:var(--eo-surface); box-shadow:var(--shadow-lg); }
.eo-confirm-box > header { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:16px 18px; border-bottom:1px solid var(--eo-border); }
.eo-confirm-box > header small { display:block; color:var(--eo-primary); font-size:var(--font-xs); font-weight:700; }
.eo-confirm-box > header h2 { margin:3px 0 0; font-size:var(--font-md); font-weight:700; }
.eo-confirm-box > header button { width:34px; height:34px; display:grid; place-items:center; border:1px solid var(--eo-border); border-radius:8px; color:var(--eo-muted); background:var(--eo-page); }
.eo-confirm-body { display:grid; gap:12px; padding:16px 18px; }
.eo-confirm-summary { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
.eo-confirm-summary > div { min-width:0; padding:10px; border:1px solid var(--eo-border); border-radius:var(--border-radius); background:var(--eo-page); }
.eo-confirm-summary dt { color:var(--eo-muted); font-size:var(--font-xs); }
.eo-confirm-summary dd { margin:3px 0 0; overflow-wrap:anywhere; font-size:var(--font-sm); font-weight:700; }
.eo-confirm-warehouse { display:grid; gap:5px; margin:0; }
.eo-confirm-warehouse > span { color:var(--eo-muted); font-size:var(--font-xs); font-weight:700; }
.eo-confirm-warehouse .form-control { min-height:40px; border-color:var(--eo-border); border-radius:var(--border-radius); font-size:var(--font-ui); }
.eo-payment-review { padding:12px; border:1px solid var(--eo-border); border-radius:var(--border-radius); background:var(--eo-page); }
.eo-payment-review > header { display:flex; align-items:center; gap:9px; margin-bottom:10px; }
.eo-payment-review > header > i { width:30px; height:30px; display:grid; place-items:center; border-radius:8px; color:var(--eo-primary); background:var(--eo-primary-soft); }
.eo-payment-review strong, .eo-payment-review small { display:block; }
.eo-payment-review strong { font-size:var(--font-sm); }
.eo-payment-review small, .eo-payment-review p { color:var(--eo-muted); font-size:var(--font-xs); }
.eo-payment-review label { display:grid; gap:5px; margin:0; }
.eo-payment-review label > span { color:var(--eo-muted); font-size:var(--font-sm); font-weight:700; }
.eo-payment-review .form-control { min-height:40px; border-color:var(--eo-border); border-radius:var(--border-radius); font-size:var(--font-ui); }
.eo-payment-review p { display:flex; align-items:center; gap:6px; margin:7px 0 0; }
.eo-conversion-check, .eo-finance-note { display:flex; align-items:flex-start; gap:8px; padding:10px 12px; border:1px solid var(--eo-border); border-radius:var(--border-radius); color:var(--eo-muted); background:var(--eo-page); font-size:var(--font-xs); line-height:1.7; }
.eo-conversion-check i, .eo-finance-note i { margin-top:4px; color:var(--eo-primary); }
.eo-conversion-check.loading { color:var(--eo-primary); border-color:var(--eo-primary-soft); background:var(--eo-primary-soft); }
.eo-conversion-check.warning { color:#9b600f; border-color:var(--eo-warning-soft); background:var(--eo-warning-soft); }
.eo-conversion-check.danger { color:var(--eo-danger); border-color:var(--eo-danger-soft); background:var(--eo-danger-soft); }
.eo-conversion-check.success { color:var(--eo-success); border-color:var(--eo-success-soft); background:var(--eo-success-soft); }
.eo-finance-note { color:var(--eo-primary); border-color:var(--eo-primary-soft); background:var(--eo-primary-soft); }
.eo-confirm-box > footer { display:flex; justify-content:flex-end; gap:8px; padding:12px 18px; border-top:1px solid var(--eo-border); background:var(--eo-page); }
.eo-confirm-box > footer .btn { min-height:38px; display:inline-flex; align-items:center; gap:7px; border-radius:var(--border-radius); font-size:var(--font-ui); }

@media (max-width:1400px) {
    .eo-summary { grid-template-columns:repeat(4,minmax(140px,1fr)); }
    .eo-filter-card { grid-template-columns:repeat(4,minmax(0,1fr)); }
    .eo-search { grid-column:span 2; }
}
@media (max-width:768px) {
    .eo-page-head { display:block; }
    .eo-phase-chip { margin-top:10px; }
    .eo-summary { display:flex; overflow-x:auto; }
    .eo-summary-card { min-width:145px; }
    .eo-filter-card { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .eo-search, .eo-filter-actions { grid-column:1/-1; }
    .eo-filter-actions .btn { flex:1; justify-content:center; }
    .eo-detail-grid, .eo-notes-grid, .eo-detail-grid dl { grid-template-columns:1fr; }
    .eo-payment-mapping, .eo-payment-mapping.is-locked { grid-template-columns:1fr; }
    .eo-totals { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .eo-modal { align-items:flex-end; padding:0; }
    .eo-modal-box { max-height:96vh; border-radius:var(--border-radius-lg) var(--border-radius-lg) 0 0; }
    .eo-modal-actions { flex-wrap:wrap; }
    .eo-modal-actions > label { width:100%; order:-1; }
    .eo-modal-actions .eo-convert, .eo-modal-actions .eo-open-invoice { width:100%; justify-content:center; margin-inline-start:0; }
    .eo-confirm-box { border-radius:var(--border-radius-lg) var(--border-radius-lg) 0 0; }
    .eo-confirm-summary { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .eo-confirm-box > footer { flex-wrap:wrap; }
    .eo-confirm-box > footer .btn { flex:1; justify-content:center; }
}

/* customers-workspace.css */
.cw-root {
    --cw-purple: #6446dc;
    --cw-purple-dark: #5034c2;
    --cw-purple-soft: #f3f0ff;
    --cw-ink: #172036;
    --cw-muted: #7b8497;
    --cw-line: #e6e9f1;
    --cw-surface: #fff;
    direction: rtl;
    min-width: 0;
    color: var(--cw-ink);
}

.cw-root button,
.cw-root input,
.cw-root select,
.cw-root textarea,
.cw-modal button { font-family: inherit; }

.cw-page-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 13px;
}

.cw-page-title h1 {
    display: flex;
    align-items: center;
    gap: 9px;
    margin: 4px 0 3px;
    color: var(--cw-ink);
    font-size: var(--font-2xl);
    font-weight: 700;
}

.cw-page-title p { margin: 0; color: var(--cw-muted); font-size: var(--font-sm); }
.cw-breadcrumb { display: flex; align-items: center; gap: 6px; color: #9ba2b2; font-size: var(--font-xs); }
.cw-breadcrumb i { font-size: .48rem; }
.cw-breadcrumb strong { color: var(--cw-purple); }

.cw-title-icon {
    width: 28px;
    height: 28px;
    display: grid;
    place-items: center;
    border: 1px solid #ddd6ff;
    border-radius: 7px;
    color: var(--cw-purple);
    background: var(--cw-purple-soft);
    font-size: .76rem;
}

.cw-head-actions { display: flex; align-items: center; gap: 7px; padding-top: 18px; }
.cw-head-actions .btn,
.cw-form-actions .btn {
    min-height: 35px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 7px 12px;
    border-radius: 7px;
    font-size: var(--font-ui);
    font-weight: 700;
}

.cw-head-actions .btn-primary,
.cw-form-actions .btn-primary {
    border-color: var(--cw-purple);
    background: var(--cw-purple);
    box-shadow: 0 4px 10px rgba(100, 70, 220, .14);
}

.cw-head-actions .btn-primary:hover,
.cw-form-actions .btn-primary:hover { border-color: var(--cw-purple-dark); background: var(--cw-purple-dark); }
.cw-head-actions .btn-secondary { border-color: var(--cw-line); color: #626a7d; background: #fff; }
.cw-head-actions .btn:disabled { opacity: .55; box-shadow: none; }

.cw-metrics {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 9px;
    margin-bottom: 11px;
}

.cw-metric {
    min-width: 0;
    min-height: 64px;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border: 1px solid var(--cw-line);
    border-radius: 8px;
    background: var(--cw-surface);
    box-shadow: 0 2px 8px rgba(28, 37, 55, .025);
}

.cw-metric-icon {
    width: 32px;
    height: 32px;
    flex: 0 0 32px;
    display: grid;
    place-items: center;
    border-radius: 8px;
    color: var(--cw-purple);
    background: var(--cw-purple-soft);
    font-size: .75rem;
}

.cw-metric.green .cw-metric-icon { color: #18855a; background: #eaf8f1; }
.cw-metric.blue .cw-metric-icon { color: #4670dc; background: #eef3ff; }
.cw-metric.orange .cw-metric-icon { color: #c77719; background: #fff4e7; }
.cw-metric small { display: block; margin-bottom: 2px; color: var(--cw-muted); font-size: var(--font-xs); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cw-metric strong { display: block; color: #273047; font-weight:750;font-size:var(--font-ui);line-height:1.3; white-space: nowrap; }

.cw-filter-card {
    display: flex;
    align-items: end;
    gap: 8px;
    padding: 9px;
    margin-bottom: 10px;
    border: 1px solid var(--cw-line);
    border-radius: 8px;
    background: #fff;
}

.cw-search {
    min-height: 37px;
    flex: 1;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 0 11px;
    border: 1px solid #dfe3ec;
    border-radius: 7px;
    color: #9aa1b0;
    background: #fff;
}

.cw-search:focus-within { border-color: #a99bee; box-shadow: 0 0 0 3px rgba(100, 70, 220, .07); }
.cw-search input { width: 100%; min-width: 0; border: 0; outline: 0; color: var(--cw-ink); background: transparent; font-size: var(--font-ui); }
.cw-search input::placeholder { color: #a0a7b5; }

.cw-filter-action {
    min-height: 37px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 11px;
    border: 1px solid var(--cw-line);
    border-radius: 7px;
    color: #666e80;
    background: #fff;
    font-size: var(--font-ui);
    font-weight: 700;
    white-space: nowrap;
}

.cw-filter-action:hover:not(:disabled) { color: var(--cw-purple); border-color: #cfc6f7; background: #faf9ff; }
.cw-filter-action:disabled,
.cw-search input:disabled,
.cw-inline-select select:disabled { cursor: not-allowed; opacity: .62; }

.cw-inline-select { min-width: 160px; margin: 0; }
.cw-inline-select span,
.cw-inline-select select {
    width: 100%;
    min-height: 37px;
    padding: 5px 9px;
    border: 1px solid #dfe3ec;
    border-radius: 7px;
    color: #525b6f;
    background: #fff;
    font-size: var(--font-ui);
}

.cw-table-card {
    position: relative;
    border: 1px solid var(--cw-line);
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 2px 9px rgba(26, 35, 54, .025);
}

.cw-table-scroll { width: 100%; overflow-x: auto; scrollbar-width: thin; }
.cw-table { width: 100%; min-width: 820px; border-collapse: collapse; }
.cw-table th {
    padding: 9px 11px;
    border-bottom: 1px solid var(--cw-line);
    color: #626b80;
    background: #fafbfe;
    font-size: var(--font-ui);
    font-weight: 700;
    text-align: right;
    white-space: nowrap;
}

.cw-table td {
    padding: 9px 11px;
    border-bottom: 1px solid #eef0f5;
    color: #4f586d;
    font-size: var(--font-ui);
    vertical-align: middle;
    white-space: nowrap;
}

.cw-table tbody tr:last-child td { border-bottom: 0; }
.cw-table tbody tr:hover td { background: #fcfbff; }
.cw-table td strong { color: #323c53; font-weight: 750; }
.cw-description { max-width: 310px; overflow: hidden; text-overflow: ellipsis; }

.cw-customer-link { display: inline-flex; align-items: center; gap: 8px; padding: 0; border: 0; color: var(--cw-ink); background: transparent; }
.cw-customer-link:hover strong { color: var(--cw-purple); }
.cw-avatar { width: 27px; height: 27px; display: grid; place-items: center; border-radius: 50%; color: var(--cw-purple); background: var(--cw-purple-soft); font-size: .7rem; font-weight: 800; }
.cw-more { width: 28px; height: 27px; display: grid; place-items: center; padding: 0; border: 1px solid var(--cw-line); border-radius: 6px; color: #667085; background: #fff; }
.cw-more:hover { color: var(--cw-purple); border-color: #cec4f8; background: #faf9ff; }
.cw-actions-menu { min-width: 175px; padding: 5px; border-color: var(--cw-line); border-radius: 8px; box-shadow: 0 10px 28px rgba(25, 33, 50, .12); }
.cw-actions-menu .dropdown-item { display: flex; align-items: center; gap: 8px; padding: 7px 9px; border-radius: 5px; font-size: var(--font-ui); }
.cw-actions-menu .dropdown-item i { width: 15px; color: var(--cw-purple); text-align: center; }

.cw-pagination { min-height: 47px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 8px 11px; border-top: 1px solid var(--cw-line); color: #858c9d; font-size: var(--font-xs); }
.cw-pagination > div { display: flex; align-items: center; gap: 4px; }
.cw-pagination button { min-width: 28px; height: 28px; padding: 0 7px; border: 1px solid transparent; border-radius: 6px; color: #747c8e; background: #fff; font-size: var(--font-ui); }
.cw-pagination button:hover:not(:disabled) { border-color: #d7d0f8; color: var(--cw-purple); }
.cw-pagination button.active { color: #fff; background: var(--cw-purple); }
.cw-pagination button:disabled { opacity: .35; }

.cw-form-card {
    margin-bottom: 11px;
    padding: 14px;
    border: 1px solid #ded8f7;
    border-radius: 8px;
    background: #fff;
}

.cw-form-card > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 12px; padding-bottom: 10px; border-bottom: 1px solid var(--cw-line); }
.cw-form-card h2 { margin: 0 0 3px; font-size: var(--font-base); font-weight: 700; }
.cw-form-card p { margin: 0; color: var(--cw-muted); font-size: var(--font-xs); }
.cw-icon-button { width: 29px; height: 29px; display: grid; place-items: center; padding: 0; border: 0; border-radius: 6px; color: #667085; background: #f4f5f8; }
.cw-form-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.cw-form-grid label { color: #596174; font-size: var(--font-sm); font-weight: 700; }
.cw-form-grid label em { color: #d74758; font-style: normal; }
.cw-form-grid .form-control { min-height: 37px; margin-top: 5px; border-color: #dfe3ec; border-radius: 7px; box-shadow: none; font-size: var(--font-ui); }
.cw-form-grid textarea.form-control { min-height: 66px; }
.cw-form-actions { display: flex; gap: 7px; margin-top: 12px; padding-top: 11px; border-top: 1px solid var(--cw-line); }
.cw-inline-error { margin-bottom: 10px; padding: 8px 10px; border: 1px solid #f0cdd2; border-radius: 7px; color: #a23b47; background: #fff4f5; font-size: var(--font-xs); }


.cw-empty { min-height: 180px; display: flex; align-items: center; justify-content: center; flex-direction: column; padding: 28px; color: var(--cw-muted); text-align: center; }
.cw-empty > i { margin-bottom: 10px; color: #aa9ce9; font-size: 1.65rem; }
.cw-empty h3 { margin: 0 0 4px; color: var(--cw-ink); font-size: var(--font-ui); }
.cw-empty p { max-width: 500px; margin: 0; font-size: var(--font-xs); line-height: 1.7; }
.cw-loading { min-height: 90px; display: flex; align-items: center; justify-content: center; gap: 8px; color: #858da0; font-size: var(--font-sm); }
.cw-error { min-height: 140px; display: flex; align-items: center; justify-content: center; gap: 7px; flex-direction: column; padding: 20px; color: #a13b47; text-align: center; }
.cw-error i { font-size: 1.35rem; }
.cw-error strong { font-size: var(--font-sm); }
.cw-error span { font-size: var(--font-xs); }
.cw-error .btn { margin-top: 6px; font-size: var(--font-ui); }
.cw-architecture-note { display: flex; align-items: center; justify-content: center; gap: 7px; margin: 0 12px 12px; padding: 8px 10px; border: 1px solid #e3def7; border-radius: 7px; color: #71698c; background: #faf9ff; font-size: var(--font-xs); }
.cw-architecture-note i { color: var(--cw-purple); }

.cw-settings { overflow: hidden; border: 1px solid var(--cw-line); border-radius: 8px; background: #fff; }
.cw-settings-tabs { display: flex; align-items: center; gap: 22px; padding: 0 15px; overflow-x: auto; border-bottom: 1px solid var(--cw-line); }
.cw-settings-tabs button { min-height: 46px; display: inline-flex; align-items: center; gap: 6px; padding: 0 2px; border: 0; border-bottom: 2px solid transparent; color: #747c8e; background: transparent; font-size: var(--font-ui); font-weight: 750; white-space: nowrap; }
.cw-settings-tabs button i { color: #939aad; }
.cw-settings-tabs button.active { color: var(--cw-purple); border-bottom-color: var(--cw-purple); }
.cw-settings-tabs button.active i { color: var(--cw-purple); }
.cw-settings-panel { display: none; padding: 16px; }
.cw-settings-panel.active { display: block; }
.cw-settings-panel > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 12px; padding-bottom: 11px; border-bottom: 1px solid var(--cw-line); }
.cw-settings-panel h2 { margin: 0 0 3px; font-size: var(--font-base); font-weight: 700; }
.cw-settings-panel p { margin: 0; color: var(--cw-muted); font-size: var(--font-xs); }
.cw-readonly-badge { display: inline-flex; align-items: center; gap: 5px; padding: 5px 8px; border-radius: 999px; color: #7865b6; background: var(--cw-purple-soft); font-size: var(--font-xs); font-weight: 750; }
.cw-settings-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.cw-settings-grid > label { color: #5b6376; font-size: var(--font-sm); font-weight: 700; }
.cw-settings-grid > label > span { display: block; margin-bottom: 5px; }
.cw-settings-grid .form-control { min-height: 38px; border-color: #dfe3ec; border-radius: 7px; font-size: var(--font-ui); }
.cw-setting-toggle { min-height: 60px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 12px; border: 1px solid var(--cw-line); border-radius: 8px; }
.cw-setting-toggle strong { display: block; margin-bottom: 2px; font-size: var(--font-sm); }
.cw-setting-toggle small { display: block; color: var(--cw-muted); font-size: var(--font-xs); }
.cw-setting-toggle input { width: 32px; height: 17px; accent-color: var(--cw-purple); }

.cw-modal { position: fixed; inset: 0; z-index: 9999; display: grid; place-items: center; padding: 20px; background: rgba(18, 26, 43, .48); }
.cw-modal-box { width: min(720px, 96vw); max-height: 90vh; overflow: auto; border-radius: 10px; background: #fff; box-shadow: 0 22px 70px rgba(18, 26, 43, .25); }
.cw-modal-box > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 14px 16px; border-bottom: 1px solid var(--cw-line); }
.cw-modal-box h2 { margin: 0 0 2px; font-size: var(--font-base); }
.cw-modal-box p { margin: 0; color: var(--cw-muted); font-size: var(--font-xs); }
.cw-modal-box > header button { width: 29px; height: 29px; padding: 0; border: 0; border-radius: 6px; color: #5f687a; background: #f3f4f7; }
.cw-modal-body { padding: 15px; }
.cw-detail-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
.cw-detail-grid > div { padding: 10px; border: 1px solid var(--cw-line); border-radius: 7px; }
.cw-detail-grid small { display: block; margin-bottom: 3px; color: var(--cw-muted); font-size: var(--font-xs); }
.cw-detail-grid strong { display: block; color: #3c465c; font-size: var(--font-sm); overflow-wrap: anywhere; }
.cw-modal-box > footer { display: flex; gap: 7px; padding: 11px 15px; border-top: 1px solid var(--cw-line); }
.cw-modal-box > footer .btn { min-height: 34px; display: inline-flex; align-items: center; gap: 6px; border-radius: 7px; font-size: var(--font-ui); }
/* The import dialog is attached to <body>, outside .cw-root where --cw-purple is defined: keep a fallback so its confirm button is never white-on-white. */
.cw-modal-box > footer .btn-primary { border-color: var(--cw-purple, #6446dc); background: var(--cw-purple, #6446dc); }

@media (max-width: 1120px) {
    .cw-form-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
    .cw-page-head { display: block; }
    .cw-head-actions { padding-top: 10px; overflow-x: auto; }
    .cw-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .cw-filter-card { align-items: stretch; flex-wrap: wrap; }
    .cw-search { min-width: 100%; }
    .cw-inline-select { flex: 1; }
    .cw-settings-grid,
    .cw-detail-grid { grid-template-columns: 1fr; }
}

@media (max-width: 520px) {
    .cw-form-grid,
    .cw-pagination { align-items: flex-start; flex-direction: column; }
}

/* Customer management only: statement/settings and global navigation stay intact. */
.cw-management {
    --cw-line: #e5eaf2;
    --cw-ink: #172033;
    --cw-muted: #66748a;
    background: #f7f9fc;
}
.cw-management [hidden] { display: none !important; }
.cw-management .cw-page-head { align-items: center; gap: 20px; margin-bottom: 22px; }
.cw-management .cw-breadcrumb { gap: 8px; color: #66748a; font-size: var(--font-xs); }
.cw-management .cw-page-title h1 { margin: 10px 0 6px; gap: 11px; font-size: var(--font-2xl); }
.cw-management .cw-title-icon { width: 36px; height: 36px; border-radius: 10px; font-size: .95rem; }
.cw-management .cw-page-title p { font-size: var(--font-base); line-height: 1.7; }
.cw-management .cw-head-actions { flex-shrink: 0; padding-top: 0; }
.cw-management .cw-head-actions .btn { min-height: 44px; padding: 10px 18px; border-radius: 10px; font-size: var(--font-ui); gap: 9px; }
.cw-management .btn-primary { background: linear-gradient(110deg, #6446dc, #5269db); border: 0; box-shadow: 0 3px 8px #6446dc1c; }
.cw-management .btn-primary:hover { background: linear-gradient(110deg, #5638cc, #4057c5); }
.cw-management .btn-primary:active { transform: translateY(1px); box-shadow: none; }
.cw-management .cw-metrics { gap: 14px; margin-bottom: 18px; }
.cw-management .cw-metric { min-height: 104px; padding: 18px; gap: 14px; border-radius: 14px; box-shadow: 0 2px 6px #17203303; }
.cw-management .cw-metric-icon { width: 44px; height: 44px; flex-basis: 44px; border-radius: 12px; font-size: 1rem; }
.cw-management .cw-metric > div { min-width: 0; }
.cw-management .cw-metric small { margin-bottom: 6px; font-size: var(--font-ui); color: var(--cw-muted); }
.cw-management .cw-metric strong { font-size: var(--font-2xl); line-height: 1.15; font-variant-numeric: tabular-nums; }
.cw-management .cw-filter-card { align-items: center; gap: 12px; padding: 12px; margin-bottom: 16px; border-radius: 13px; }
.cw-management .cw-search { min-height: 44px; margin: 0; gap: 12px; padding: 0 14px; border-radius: 9px; background: #fafbfe; color: #7c879d; }
.cw-management .cw-search input { height: 42px; font-size: var(--font-ui); }
.cw-management .cw-search input::placeholder { color: #77849a; }
.cw-management .cw-filter-action { min-height: 44px; justify-content: center; padding: 8px 15px; border-radius: 9px; font-size: var(--font-ui); gap: 8px; }
.cw-management .cw-table-card { border-radius: 14px; box-shadow: 0 2px 6px #17203303; }
.cw-management .cw-table-heading { min-height: 62px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 18px; }
.cw-management .cw-table-heading h2 { display: flex; align-items: center; gap: 9px; margin: 0; font-size: var(--font-md); font-weight: 700; }
.cw-management .cw-table-heading h2 span { display: inline-flex; align-items: center; justify-content: center; min-width: 29px; padding: 3px 9px; border-radius: 6px; color: #6042cc; background: #f1edfc; font-weight:600;font-size:var(--font-sm);line-height:1.5; }
.cw-management .cw-table-heading > span { color: var(--cw-muted); font-size: var(--font-sm); }
.cw-management .cw-table { min-width: 1080px; table-layout: fixed; }
.cw-management .cw-table th { height: 46px; padding: 10px 16px; border-top: 1px solid var(--cw-line); color: #5e6b80; background: #f8fafd; font-size: var(--font-ui); }
.cw-management .cw-table td { height: 64px; padding: 10px 16px; font-size: var(--font-ui); color: #526078; }
.cw-management .cw-table th:nth-child(1) { width: 24%; }
.cw-management .cw-table th:nth-child(2) { width: 13%; }
.cw-management .cw-table th:nth-child(3) { width: 19%; }
.cw-management .cw-table th:nth-child(4) { width: 15%; }
.cw-management .cw-table th:nth-child(5) { width: 11%; }
.cw-management .cw-table th:nth-child(6) { width: 11%; }
.cw-management .cw-table th:nth-child(7) { width: 7%; }
.cw-management .cw-table :is(th, td):last-child { text-align: center; }
.cw-management .cw-table tbody tr:hover td { background: #faf9ff; }
.cw-management .cw-customer-link { width: 100%; min-width: 0; text-align: start; gap: 11px; border-radius: 8px; }
.cw-management .cw-avatar { width: 36px; height: 36px; flex: 0 0 36px; font-size: .95rem; }
/* Table-cell leading (variables.css): at 1.6 the 14.5px name + 12.5px caption stack is 46px and pushes the 64px row to 67px. */
.cw-management .cw-customer-copy { min-width: 0; line-height: var(--line-height-tight); }
.cw-management .cw-customer-copy strong { display: block; overflow: hidden; text-overflow: ellipsis; color: #263148; font-size: var(--font-ui); }
.cw-management .cw-customer-copy small { display: block; margin-top: 3px; font-size: var(--font-xs); color: #718096; }
.cw-management .cw-ltr { display: inline-block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; vertical-align: middle; direction: ltr; unicode-bidi: isolate; font-variant-numeric: tabular-nums; }
.cw-management .cw-more { width: 34px; height: 34px; margin: auto; border-radius: 8px; }
.cw-management .cw-actions-menu { min-width: 190px; padding: 6px; border-radius: 11px; text-align: right; }
.cw-management .cw-actions-menu .dropdown-item { min-height: 38px; padding: 9px 11px; border-radius: 7px; font-size: var(--font-ui); }
.cw-management .cw-actions-menu .dropdown-item:hover,
.cw-management .cw-actions-menu .dropdown-item:focus { color: #5334be; background: #f4f1fe; }
.cw-management .cw-actions-menu .text-danger,
.cw-management .cw-actions-menu .text-danger i { color: #c13a4c !important; }
.cw-management .cw-actions-menu .text-danger:hover { background: #fff2f3; }
.cw-management .cw-pagination { min-height: 62px; padding: 12px 18px; color: #66748a; font-size: var(--font-ui); }
.cw-management .cw-pagination > div { gap: 5px; }
.cw-management .cw-pagination button { min-width: 34px; height: 34px; border-color: #e5eaf2; border-radius: 8px; font-size: var(--font-ui); }
.cw-management .cw-pagination button.active { border-color: var(--cw-purple); }
.cw-management .cw-pagination button:disabled { opacity: .45; cursor: not-allowed; background: #f7f9fc; }
.cw-management .cw-empty { min-height: 190px; padding: 28px 18px 18px; white-space: normal; }
.cw-management .cw-empty > i { width: 56px; height: 56px; display: grid; place-items: center; margin-bottom: 14px; border-radius: 16px; background: #f3f0ff; color: #7859d7; }
.cw-management .cw-empty h3 { font-size: var(--font-md); }
.cw-management .cw-empty p { margin-top: 5px; font-size: var(--font-ui); }
.cw-management .cw-empty-add { margin: 0 auto 24px; color: var(--cw-purple); }
.cw-management .cw-error { min-height: 210px; white-space: normal; }
.cw-management .cw-error strong { font-size: var(--font-md); }
.cw-management .cw-error span, .cw-management .cw-error .btn { font-size: var(--font-ui); }
.cw-management .cw-form-card { border-radius: 13px; padding: 20px; margin-bottom: 18px; }
.cw-management .cw-form-card h2 { font-size: var(--font-md); }
.cw-management .cw-form-card p, .cw-management .cw-form-grid label { font-size: var(--font-sm); }
.cw-management .cw-form-grid { gap: 16px; }
.cw-management .cw-form-grid .form-control { min-height: 42px; font-size: var(--font-ui); }
.cw-management .cw-form-actions .btn { min-height: 40px; border-radius: 8px; font-size: var(--font-ui); }
.cw-management .cw-inline-error, .cw-management .cw-success { padding: 11px 14px; border-radius: 10px; font-size: var(--font-ui); }
.cw-management .cw-success { margin-bottom: 16px; border: 1px solid #cce9dc; background: #effaf5; color: #20744d; }
.cw-management .cw-skeleton { display: block; width: 75%; height: 10px; border-radius: 5px; background: linear-gradient(90deg, #edf0f6 25%, #f7f9fc 50%, #edf0f6 75%); background-size: 200% 100%; animation: cw-shimmer 1.5s ease-in-out infinite; }
.cw-management .cw-skeleton-name { width: 85%; height: 30px; border-radius: 8px; }
@keyframes cw-shimmer { to { background-position: -200% 0; } }
.cw-management :is(button, a, input, .cw-table-scroll):focus-visible,
.cw-management-modal :is(button, a):focus-visible { outline: 3px solid #8b78e4; outline-offset: 3px; }
.cw-management-modal { --cw-line: #e5eaf2; --cw-muted: #66748a; --cw-purple: #6446dc; }
.cw-management-modal .cw-modal-box { border-radius: 16px; }
.cw-management-modal .cw-modal-box > header, .cw-management-modal .cw-modal-body { padding: 20px; }
.cw-management-modal .cw-modal-box h2 { font-size: var(--font-lg); }
.cw-management-modal .cw-modal-box p, .cw-management-modal .cw-detail-grid small { font-size: var(--font-xs); }
.cw-management-modal .cw-detail-grid strong { font-size: var(--font-base); unicode-bidi: plaintext; }
.cw-management-modal .cw-modal-box > footer .btn { min-height: 40px; font-size: var(--font-ui); }
@media (max-width: 1100px) {
    .cw-management .cw-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
    .cw-management .cw-page-head { display: flex; flex-wrap: wrap; gap: 14px; }
    .cw-management .cw-head-actions { padding: 0; }
    .cw-management .cw-page-title h1 { font-size: var(--font-2xl); }
    .cw-management .cw-filter-card { gap: 10px; }
    .cw-management .cw-search { min-width: 100%; }
    .cw-management .cw-filter-action { margin-inline-start: auto; }
}
@media (max-width: 520px) {
    .cw-management .cw-metrics { grid-template-columns: 1fr; gap: 10px; }
    .cw-management .cw-metric { min-height: 88px; padding: 15px 18px; }
    .cw-management .cw-metric strong { font-size: var(--font-2xl); }
    .cw-management .cw-head-actions, .cw-management .cw-head-actions .btn { width: 100%; }
    .cw-management .cw-table-heading { flex-wrap: wrap; gap: 7px; padding: 14px; }
    .cw-management .cw-table-heading > span { width: 100%; }
    .cw-management .cw-pagination { gap: 12px; padding: 14px; }
    .cw-management-modal .cw-detail-grid { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
    .cw-management .cw-skeleton { animation: none; }
    .cw-management .btn-primary:active { transform: none; }
}

@media print {
    .cw-page-head .cw-head-actions,
    .cw-filter-card,
    .sidebar,
    .topbar { display: none !important; }
    .cw-table-card { border: 0; box-shadow: none; }
    .cw-table { min-width: 0; }
}

/* inventory-workspace.css */
.iw-page{--iw-purple:#5b3fd8;--iw-purple-soft:#f2efff;--iw-border:#e4e8f1;--iw-text:#172033;--iw-muted:#788296;direction:rtl;color:var(--iw-text);padding:2px 0 28px}.iw-page *{box-sizing:border-box}.iw-page-loader{min-height:280px;display:grid;place-content:center;gap:12px;color:var(--iw-muted);text-align:center}.iw-header{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:22px}.iw-heading{display:flex;align-items:center;gap:14px}.iw-heading__icon{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;background:var(--iw-purple-soft);color:var(--iw-purple);font-size:20px}.iw-eyebrow{display:block;color:var(--iw-purple);font-size:var(--font-xs);font-weight:700;margin-bottom:2px}.iw-heading h1{font-size:var(--font-2xl);line-height:1.25;margin:0 0 4px;font-weight:700}.iw-heading p{margin:0;color:var(--iw-muted);font-size:var(--font-ui)}.iw-header__actions{display:flex;gap:8px;flex-wrap:wrap}.iw-header__actions .btn{min-height:40px;border-radius:9px;font-size:var(--font-ui);font-weight:700}.iw-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:16px}.iw-metric{position:relative;min-height:96px;padding:17px;border:1px solid var(--iw-border);border-radius:13px;background:#fff;display:flex;align-items:center;gap:13px;box-shadow:0 3px 14px rgba(15,23,42,.035);overflow:hidden}.iw-metric:after{content:"";position:absolute;inset-inline-start:0;top:17px;bottom:17px;width:3px;border-radius:4px;background:#6c4cf1}.iw-metric__icon{width:42px;height:42px;border-radius:11px;display:grid;place-items:center;background:#f2efff;color:#6246dc;font-size:17px}.iw-metric small,.iw-metric em{display:block;color:var(--iw-muted);font-size:var(--font-sm);font-style:normal}.iw-metric strong{display:block;font-weight:700;font-size:var(--font-2xl);line-height:1.4;color:var(--iw-text);direction:rtl}.iw-metric--green:after{background:#18a66b}.iw-metric--green .iw-metric__icon{background:#eaf9f2;color:#138959}.iw-metric--red:after{background:#dc4c64}.iw-metric--red .iw-metric__icon{background:#fff0f2;color:#c93952}.iw-metric--orange:after{background:#ed9b2e}.iw-metric--orange .iw-metric__icon{background:#fff7e9;color:#d88314}.iw-metric--blue:after{background:#3a82e4}.iw-metric--blue .iw-metric__icon{background:#edf5ff;color:#2f72cc}.iw-filter-card{display:flex;align-items:center;gap:9px;flex-wrap:wrap;background:#fff;border:1px solid var(--iw-border);border-radius:12px;padding:12px;margin-bottom:16px;box-shadow:0 3px 12px rgba(15,23,42,.025)}.iw-search{position:relative;flex:1 1 300px}.iw-search i{position:absolute;right:13px;top:50%;transform:translateY(-50%);color:#9aa4b6;font-size:13px}.iw-search input{width:100%;padding-right:37px!important}.iw-filter-card input,.iw-filter-card select,.iw-form-grid input,.iw-form-grid select,.iw-form-table input,.iw-form-table select,.iw-ledger-filters input,.iw-ledger-filters select{height:39px;border:1px solid #dde2ec;border-radius:8px;background:#fff;color:var(--iw-text);padding:0 11px;font-weight:500;font-size:var(--font-ui);outline:none;min-width:145px}.iw-filter-card input:focus,.iw-filter-card select:focus,.iw-form-grid input:focus,.iw-form-grid select:focus{border-color:#8b78e8;box-shadow:0 0 0 3px rgba(91,63,216,.09)}.iw-clear{border:0;background:transparent;color:var(--iw-purple);font-size:var(--font-sm);font-weight:700;padding:8px}.iw-table-card{background:#fff;border:1px solid var(--iw-border);border-radius:13px;overflow:hidden;box-shadow:0 3px 14px rgba(15,23,42,.03);margin-bottom:18px}.iw-table-card>header{min-height:58px;padding:13px 16px;border-bottom:1px solid #edf0f5;display:flex;align-items:center;justify-content:space-between;gap:12px}.iw-table-card>header strong{display:block;font-size:var(--font-base)}.iw-table-card>header span,.iw-table-card>header small{display:block;color:var(--iw-muted);font-size:var(--font-xs);margin-top:2px}.iw-source-note{display:flex!important;align-items:center;gap:6px;background:#f7f5ff;color:var(--iw-purple)!important;border-radius:20px;padding:6px 10px}.iw-table-scroll{overflow:auto}.iw-table{width:100%;border-collapse:collapse;min-width:840px;margin:0}.iw-table thead th{height:42px;padding:9px 12px;background:#f7f8fc;color:#667085;font-size:var(--font-ui);font-weight:700;white-space:nowrap;border-bottom:1px solid #e8ebf2}.iw-table tbody td{padding:11px 12px;border-bottom:1px solid #edf0f5;font-size:var(--font-ui);vertical-align:middle;color:#344054}.iw-table tbody tr:last-child td{border-bottom:0}.iw-table tbody tr:hover{background:#fbfaff}.iw-table td strong{display:block;color:#222b3c;font-size:var(--font-ui)}.iw-table td small{display:block;color:#8b95a7;font-size:var(--font-xs);margin-top:3px}.iw-primary-link{border:0;background:transparent;padding:0;color:var(--iw-purple);font-weight:700;font-size:var(--font-sm)}.iw-more{width:31px;height:29px;border:1px solid #dfe4ed;border-radius:7px;background:#fff;color:#667085;display:inline-grid;place-items:center;text-decoration:none}.iw-more:hover{border-color:#9a89eb;color:var(--iw-purple);background:#f7f5ff}.iw-code{font-weight:600;font-size:var(--font-sm);background:#f1f3f7;border-radius:5px;padding:4px 7px;color:#475467}.iw-money{;font-weight:700;white-space:nowrap}.iw-positive{color:#138959!important;font-weight:700}.iw-negative{color:#c93952!important;font-weight:700}.iw-badge{display:inline-flex;align-items:center;justify-content:center;min-height:23px;padding:3px 9px;border-radius:20px;font-size:var(--font-xs);font-weight:700;white-space:nowrap}.iw-badge--green{background:#e9f8f1;color:#16875a;border:1px solid #c9ebdc}.iw-badge--red{background:#fff0f2;color:#c53c54;border:1px solid #f4ccd3}.iw-badge--orange{background:#fff7e8;color:#c77712;border:1px solid #f6dfb9}.iw-badge--blue{background:#edf5ff;color:#2f72cc;border:1px solid #d3e6ff}.iw-badge--purple{background:#f2efff;color:#5b3fd8;border:1px solid #dfd8ff}.iw-badge--gray{background:#f1f3f6;color:#687386;border:1px solid #e1e5eb}.iw-pagination{min-height:54px;padding:10px 15px;border-top:1px solid #edf0f5;display:flex;align-items:center;justify-content:space-between;gap:12px}.iw-pagination small{color:var(--iw-muted);font-size:var(--font-xs)}.iw-pagination>div{display:flex;align-items:center;gap:4px;direction:rtl}.iw-pagination button{width:30px;height:30px;border:1px solid #e1e5ed;border-radius:7px;background:#fff;color:#566176;font-weight:600;font-size:var(--font-ui)}.iw-pagination button.active{background:var(--iw-purple);border-color:var(--iw-purple);color:#fff}.iw-pagination button:disabled{opacity:.4}.iw-pagination span{padding:0 3px;color:#98a2b3}.iw-loading{height:130px;display:grid;place-content:center;gap:8px}.iw-loading span{display:block;width:210px;height:10px;background:linear-gradient(90deg,#f0f2f6,#fafbfc,#f0f2f6);background-size:200% 100%;animation:iw-shimmer 1.4s infinite;border-radius:5px}.iw-loading span:nth-child(2){width:150px}.iw-loading span:nth-child(3){width:180px}@keyframes iw-shimmer{to{background-position:-200% 0}}.iw-empty,.iw-error{min-height:190px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:var(--iw-muted);gap:6px;padding:20px}.iw-empty i,.iw-error i{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:#f3f1ff;color:var(--iw-purple);font-size:18px}.iw-empty strong,.iw-error strong{color:#344054;font-size:var(--font-base)}.iw-empty span,.iw-error span{font-size:var(--font-sm)}.iw-error i{background:#fff0f2;color:#c93952}.iw-error button{border:0;border-radius:7px;background:#f2efff;color:var(--iw-purple);padding:6px 12px;font-weight:700}.iw-ledger-card{margin-top:18px}.iw-ledger-filters{display:flex;gap:8px;flex-wrap:wrap;padding:12px 16px;border-bottom:1px solid #edf0f5;background:#fbfcfe}.iw-modal-host:empty{display:none}.iw-modal-backdrop{position:fixed;inset:0;background:rgba(15,23,42,.52);z-index:10030;display:flex;align-items:center;justify-content:center;padding:20px;backdrop-filter:blur(2px)}.iw-modal{width:min(680px,96vw);max-height:92vh;overflow:auto;border-radius:15px;background:#fff;box-shadow:0 24px 80px rgba(15,23,42,.24)}.iw-modal--wide{width:min(980px,97vw)}.iw-modal__header{padding:17px 20px;border-bottom:1px solid #e9edf3;display:flex;align-items:center;justify-content:space-between;gap:14px;position:sticky;top:0;background:#fff;z-index:2}.iw-modal__header small{display:block;color:var(--iw-purple);font-size:var(--font-xs);font-weight:700}.iw-modal__header h2{margin:2px 0 0;font-size:var(--font-lg);font-weight:700}.iw-modal__header>button{width:34px;height:34px;border:1px solid #e0e5ed;border-radius:9px;background:#fff;color:#667085}.iw-detail-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:#e8ecf2;margin:18px;border:1px solid #e8ecf2;border-radius:10px;overflow:hidden}.iw-detail-grid>div{background:#fff;padding:13px}.iw-detail-grid span{display:block;color:var(--iw-muted);font-size:var(--font-xs);margin-bottom:4px}.iw-detail-grid strong{font-size:var(--font-sm)}.iw-note{margin:0 18px 18px;padding:13px;border:1px solid #e7eaf1;border-radius:9px;background:#fafbfc}.iw-note span{color:var(--iw-muted);font-size:var(--font-xs)}.iw-note p{margin:4px 0 0;font-size:var(--font-xs)}.iw-modal form{padding:18px 20px}.iw-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px;margin-bottom:17px}.iw-form-grid label,.iw-form-table label{display:flex;flex-direction:column;gap:5px}.iw-form-grid label>span{font-size:var(--font-sm);font-weight:700;color:#566176}.iw-form-grid input,.iw-form-grid select{width:100%;min-width:0}.iw-field-wide{grid-column:1/-1}.iw-form-table{border:1px solid #e4e8ef;border-radius:10px;overflow:hidden}.iw-form-table>header{min-height:52px;padding:10px 13px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #e8ecf2}.iw-form-table>header strong{display:block;font-size:var(--font-ui)}.iw-form-table>header small{display:block;font-size:var(--font-xs);color:var(--iw-muted)}.iw-form-table .iw-table{min-width:680px}.iw-form-table input,.iw-form-table select{width:100%;min-width:100px}.iw-row-remove{width:31px;height:31px;border:1px solid #f0cdd4;border-radius:7px;background:#fff5f6;color:#c43e55}.iw-form-alert{display:flex;align-items:center;gap:9px;padding:11px 13px;margin-top:14px;border-radius:9px;background:#eef7ff;color:#316ba9;font-size:var(--font-sm)}.iw-form-alert--warning{background:#fff7e8;color:#a9630f}.iw-modal__footer{display:flex;justify-content:flex-end;gap:8px;padding:14px 18px;border-top:1px solid #e9edf3;margin-top:18px}.iw-modal form>.iw-modal__footer{margin:18px -20px -18px}.iw-modal__footer .btn{min-width:110px;border-radius:8px;font-size:var(--font-ui)}.iw-page .btn-primary{background:#5b3fd8;border-color:#5b3fd8}.iw-page .btn-primary:hover{background:#4d32c5;border-color:#4d32c5}

.iw-count-form-table .iw-table{min-width:850px}.iw-count-form-table th:first-child,.iw-count-form-table td:first-child{min-width:270px}.iw-count-form-table th:nth-child(2),.iw-count-form-table td:nth-child(2){min-width:150px}.iw-count-form-table th:nth-child(3),.iw-count-form-table td:nth-child(3){min-width:145px}.iw-count-preview{display:block!important;margin-top:5px!important;color:var(--iw-purple)!important;font-size:var(--font-xs) !important;font-weight:700}.iw-count-detail-table{margin:0 18px 18px}.iw-count-detail-table .iw-table{min-width:780px}
.iw-opening-items{margin:0 18px 18px}.iw-opening-items .iw-table{min-width:760px}.iw-opening-reason{margin-top:16px}.iw-opening-reason input{width:100%}.iw-modal [data-opening-delete]{color:#b4233b;border-color:#efc7cf}.iw-modal [data-opening-delete]:hover{background:#fff1f3}

/* Inventory settings and waste reuse the same visual language without touching products. */
.iw-settings-page .iw-settings-shell{background:#fff;border:1px solid #e4e8f1;border-radius:13px;overflow:hidden}.iw-settings-tabs{display:flex;gap:3px;padding:10px;border-bottom:1px solid #e7ebf2;overflow:auto}.iw-settings-tabs button{border:0;background:transparent;color:#707b8e;font-size:var(--font-ui);font-weight:700;padding:10px 14px;border-radius:8px;white-space:nowrap}.iw-settings-tabs button.active{background:#f1edff;color:#5b3fd8}.iw-settings-panel{display:none;padding:18px}.iw-settings-panel.active{display:block}.iw-settings-panel>.card{border:0!important;box-shadow:none!important;padding:0!important;margin:0!important}.iw-settings-panel .inventory-settings-grid{display:block}.iw-settings-panel .section-title{display:flex;justify-content:space-between;gap:14px;align-items:center}.iw-settings-panel .section-title h3{font-size:var(--font-md);margin:0}.iw-settings-panel .table{font-size:var(--font-ui)}.iw-settings-panel .settings-inline-form{border:1px solid #e5e9f0;background:#fafbfe;border-radius:10px;padding:14px}
#waste-root{direction:rtl;color:#172033}#waste-root>.d-flex{padding:2px 0}#waste-root h2{font-size:var(--font-2xl);font-weight:700}#waste-root .stat-card{border:1px solid #e4e8f1;border-radius:13px;background:#fff;box-shadow:0 3px 14px rgba(15,23,42,.035);padding:17px}#waste-root>.card{border:1px solid #e4e8f1;border-radius:13px;box-shadow:0 3px 14px rgba(15,23,42,.03)}#waste-root>.card>.d-flex{padding:12px;background:#fafbfe;border:1px solid #edf0f5;border-radius:10px}#waste-root .table{font-size:var(--font-ui)}#waste-root .table thead th{background:#f7f8fc;color:#667085;font-size:var(--font-ui);border-bottom:1px solid #e8ebf2}#waste-root .table td{border-color:#edf0f5;vertical-align:middle}#waste-root .form-control{min-height:38px;border-radius:8px;border-color:#dde2ec;font-size:var(--font-ui)}#waste-root .status-pill{border-radius:20px;font-size:var(--font-xs);padding:4px 9px}
@media(max-width:1050px){.iw-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.iw-detail-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:680px){.iw-page{padding-bottom:18px}.iw-header{align-items:flex-start;flex-direction:column}.iw-header__actions{width:100%}.iw-header__actions .btn{width:100%}.iw-heading__icon{width:42px;height:42px}.iw-heading h1{font-size:var(--font-2xl)}.iw-metrics{grid-template-columns:1fr 1fr;gap:9px}.iw-metric{min-height:82px;padding:12px;gap:9px}.iw-metric__icon{width:35px;height:35px}.iw-metric strong{font-size:var(--font-2xl)}.iw-filter-card{align-items:stretch}.iw-filter-card>*{flex:1 1 45%;min-width:0!important}.iw-search{flex-basis:100%}.iw-pagination{align-items:flex-start;flex-direction:column}.iw-detail-grid{grid-template-columns:1fr}.iw-form-grid{grid-template-columns:1fr}.iw-field-wide{grid-column:auto}.iw-modal-backdrop{padding:8px;align-items:flex-end}.iw-modal{width:100%;max-height:94vh;border-radius:15px 15px 0 0}.iw-modal__footer{position:sticky;bottom:0;background:#fff;z-index:2}.iw-settings-tabs{padding:7px}.iw-settings-panel{padding:13px}}

/* purchase-workspace.css */
.pw-page{position:relative}.pw-page a{color:#5b3fd8;text-decoration:none;font-weight:700}.pw-page .iw-table{min-width:980px}.pw-actions{position:relative;display:inline-block}.pw-action-menu{display:none;position:absolute;inset-inline-end:0;top:34px;width:185px;padding:5px;background:#fff;border:1px solid #e1e6ef;border-radius:9px;box-shadow:0 14px 35px rgba(15,23,42,.16);z-index:15}.pw-action-menu.open{display:block}.pw-action-menu button{width:100%;border:0;background:#fff;border-radius:6px;padding:8px 9px;display:flex;align-items:center;gap:8px;color:#475467;font-weight:600;font-size:var(--font-ui);text-align:right}.pw-action-menu button:hover{background:#f5f2ff;color:#5b3fd8}.pw-action-menu button.danger{color:#c43e55}.pw-action-menu button.danger:hover{background:#fff1f3}.pw-toast{position:fixed;left:24px;bottom:24px;z-index:10060;display:flex;align-items:center;gap:8px;min-width:260px;max-width:430px;padding:12px 15px;border-radius:10px;background:#167d57;color:#fff;box-shadow:0 14px 42px rgba(15,23,42,.22);font-size:var(--font-sm);font-weight:700;opacity:0;transform:translateY(15px);pointer-events:none;transition:.2s}.pw-toast.show{opacity:1;transform:translateY(0)}.pw-toast--error{background:#b9364d}.pw-modal-table{margin:16px 18px;border:1px solid #e4e8ef;border-radius:10px;overflow:auto}.pw-modal-table .iw-table{min-width:760px}.pw-form-summary{margin:14px 0 0;padding:12px 15px;display:flex;justify-content:space-between;align-items:center;background:#f5f2ff;border:1px solid #e4ddff;border-radius:9px}.pw-form-summary span{font-size:var(--font-sm);color:#6e628f}.pw-form-summary strong{font-weight:700;font-size:var(--font-2xl);color:#5b3fd8}.pw-party-head{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;margin:18px;background:#e8ecf2;border:1px solid #e8ecf2;border-radius:10px;overflow:hidden}.pw-party-head>div{background:#fff;padding:12px}.pw-party-head span{display:block;color:#7d8799;font-size:var(--font-xs);margin-bottom:4px}.pw-party-head strong{font-size:var(--font-sm)}.pw-tabs{display:flex;align-items:center;gap:3px;padding:9px 12px;border-bottom:1px solid #e5e9f0;overflow:auto;background:#fff}.pw-tabs button{border:0;background:transparent;color:#737e91;border-radius:8px;padding:9px 13px;font-weight:700;font-size:var(--font-ui);white-space:nowrap}.pw-tabs button.active{background:#f0ecff;color:#5b3fd8}.pw-settings{background:#fff;border:1px solid #e3e7ef;border-radius:13px;overflow:hidden;box-shadow:0 3px 14px rgba(15,23,42,.03)}.pw-setting-panel{min-height:350px;padding:20px}.pw-setting-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.pw-setting-card{min-height:112px;padding:17px;border:1px solid #e4e8ef;border-radius:11px;background:#fff;display:flex;align-items:flex-start;gap:13px}.pw-setting-icon{flex:0 0 42px;height:42px;border-radius:10px;display:grid;place-items:center;background:#f1edff;color:#5b3fd8}.pw-setting-card h3{font-size:var(--font-base);margin:2px 0 6px}.pw-setting-card p{font-size:var(--font-sm);line-height:1.8;color:#788296;margin:0}.pw-setting-section{border:1px solid #e4e8ef;border-radius:11px;overflow:hidden}.pw-setting-section>header{padding:16px;border-bottom:1px solid #e8ebf2}.pw-setting-section h3{font-size:var(--font-base);margin:0 0 5px}.pw-setting-section p{font-size:var(--font-sm);color:#788296;margin:0}.pw-template-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:14px}.pw-template{display:flex;align-items:center;gap:10px;border:1px solid #e2e6ee;border-radius:10px;padding:12px;cursor:pointer}.pw-template.selected{border-color:#927ff0;background:#f7f5ff}.pw-template>span{flex:1}.pw-template strong,.pw-template small{display:block}.pw-template strong{font-size:var(--font-sm)}.pw-template small{font-size:var(--font-xs);color:#7b8598;margin-top:3px}.pw-template b{font-size:var(--font-xs);color:#5b3fd8;background:#eae4ff;border-radius:12px;padding:4px 7px}.pw-setting-section .pw-modal-table{margin:0;border:0;border-radius:0}.pw-page .iw-form-table tbody input[type=checkbox]{width:17px;height:17px;min-width:17px;accent-color:#5b3fd8}.pw-page .iw-form-table tbody input:disabled{background:#f2f4f7;color:#98a2b3}.pw-page .iw-table tbody td{position:relative}.pw-page .iw-header__actions:empty{display:none}
@media(max-width:900px){.pw-party-head{grid-template-columns:repeat(2,minmax(0,1fr))}.pw-setting-grid,.pw-template-list{grid-template-columns:1fr}}
@media(max-width:600px){.pw-toast{left:10px;right:10px;bottom:10px;min-width:0}.pw-party-head{grid-template-columns:1fr 1fr;margin:12px}.pw-setting-panel{padding:12px}.pw-page .iw-table{min-width:900px}}
@media print{.sidebar,.topbar,.iw-header,.iw-filter-card,.pw-tabs,.iw-modal__footer{display:none!important}.pw-page{padding:0}.iw-table-card,.pw-settings{border:0;box-shadow:none}}
.pw-page>.iw-table-card .iw-table{min-width:800px}
.pw-action-menu.pw-action-menu--floating{position:fixed;inset:auto;margin:0;width:200px;max-width:calc(100vw - 16px);overflow:auto;overscroll-behavior:contain;z-index:10025;box-sizing:border-box}
.pw-action-menu--floating button{min-height:36px;cursor:pointer}
.pw-action-menu--floating button:focus-visible{outline:2px solid #5b3fd8;outline-offset:-2px;background:#f5f2ff}

/* party-statement.css */
/* Customer Statement (/customers/statement) and Supplier Statement (/purchases/suppliers/statement).
   One presentation layer for both account statements (party_statement.js); the accounting stays
   separate on the backend. Typography is one step above the dense workspace tables: page title 26px,
   section titles 18px, criteria labels 14.5px, controls 15px, table 15px, summary values 24px. */
.ps-root {
    --ps-primary: #2563eb; --ps-ink: #1b2a44; --ps-muted: #6b7a92; --ps-line: #e2e8f0; --ps-soft: #f6f8fb;
    --ps-green: #15803d; --ps-red: #c2414c; --ps-amber: #b45309; --ps-purple: #6d4fc9;
    max-width: 1680px; margin: 0 auto; padding-bottom: 28px; color: var(--ps-ink); font-size: 15px; direction: rtl;
}
.ps-root button, .ps-root input, .ps-root select { font-family: inherit; }

/* ---- page header */
.ps-page-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin: 4px 0 14px; }
.ps-breadcrumb { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-bottom: 6px; color: #94a3b8; font-size: 13px; }
.ps-breadcrumb a { color: #94a3b8; text-decoration: none; }
.ps-breadcrumb a:hover { color: var(--ps-primary); }
.ps-breadcrumb i { font-size: .55rem; }
.ps-breadcrumb strong { color: #475569; font-weight: 700; }
.ps-page-title h1 { display: flex; align-items: center; gap: 12px; margin: 0; font-size: 26px; font-weight: 800; color: var(--ps-ink); }
.ps-title-icon { display: grid; width: 46px; height: 46px; place-items: center; border-radius: 12px; color: #fff; background: linear-gradient(145deg, #3b82f6, var(--ps-primary)); box-shadow: 0 8px 18px rgba(37, 99, 235, .22); font-size: 1.05rem; }
.ps-page-title p { margin: 6px 0 0; color: var(--ps-muted); font-size: 14px; }
.ps-head-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.ps-head-actions .btn { display: inline-flex; align-items: center; gap: 7px; min-height: 40px; padding: 0 15px; border-radius: 9px; font-size: 15px; font-weight: 700; }
.ps-export-wrap { position: relative; }
.ps-export-menu { position: absolute; top: calc(100% + 6px); inset-inline-start: 0; z-index: 30; min-width: 200px; padding: 6px; border: 1px solid var(--ps-line); border-radius: 10px; background: #fff; box-shadow: 0 12px 30px rgba(15, 23, 42, .14); }
.ps-export-menu button { display: block; width: 100%; padding: 9px 12px; border: 0; border-radius: 7px; background: none; color: var(--ps-ink); text-align: start; font-size: 14.5px; }
.ps-export-menu button:hover { background: var(--ps-soft); }

/* ---- cards */
.ps-card { background: #fff; border: 1px solid var(--ps-line); border-radius: 14px; box-shadow: 0 4px 16px rgba(15, 23, 42, .04); }
.ps-criteria { padding: 18px 20px; margin-bottom: 16px; }
.ps-criteria h2 { display: flex; align-items: center; gap: 9px; margin: 0 0 14px; font-size: 18px; font-weight: 800; color: var(--ps-ink); }
.ps-criteria h2 i { color: var(--ps-primary); }
.ps-criteria-grid { display: grid; grid-template-columns: minmax(260px, 1.6fr) repeat(4, minmax(150px, 1fr)); gap: 14px; }
.ps-field { display: flex; flex-direction: column; gap: 7px; margin: 0; }
.ps-field > span { color: #5b6b85; font-size: 14.5px; font-weight: 700; }
.ps-field > span b { color: var(--ps-red); }
.ps-field .form-control { min-height: 42px; border: 1px solid #d5dde8; border-radius: 9px; box-shadow: none; color: #22314d; font-size: 15.5px; }
.ps-field .form-control:focus { border-color: var(--ps-primary); box-shadow: 0 0 0 3px rgba(37, 99, 235, .1); }
.ps-field .form-control[readonly] { background: var(--ps-soft); color: #64748b; }
.ps-criteria-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--ps-line); }
.ps-criteria-actions .btn { display: inline-flex; align-items: center; gap: 8px; min-height: 42px; padding: 0 20px; border-radius: 9px; font-size: 15.5px; font-weight: 800; }
.ps-criteria-hint { display: inline-flex; align-items: center; gap: 7px; padding: 8px 12px; border-radius: 8px; color: #92400e; background: #fff7e6; font-size: 14px; }
.ps-criteria-hint[hidden] { display: none; }

/* ---- states */
.ps-state { padding: 58px 24px; text-align: center; border-style: dashed; }
.ps-state i { font-size: 2.3rem; color: #94a3b8; }
.ps-state h3 { margin: 14px 0 6px; font-size: 19px; font-weight: 800; color: var(--ps-ink); }
.ps-state p { margin: 0; color: var(--ps-muted); font-size: 14.5px; }
.ps-state-error { border-color: #f3b9be; background: #fffafa; }
.ps-state-error i { color: var(--ps-red); }
.ps-state-inline { padding: 34px 16px; border: 0; box-shadow: none; }
.ps-state-inline h3 { font-size: 16.5px; }

/* ---- party information */
.ps-party { display: grid; grid-template-columns: minmax(240px, .9fr) minmax(0, 2fr); gap: 20px; padding: 18px 20px; margin-bottom: 14px; }
.ps-party-identity { display: flex; align-items: center; gap: 14px; }
.ps-avatar { display: grid; width: 60px; height: 60px; flex: 0 0 auto; place-items: center; border-radius: 50%; background: #eef2ff; color: var(--ps-primary); font-size: 1.5rem; font-weight: 800; }
.ps-party-identity h2 { margin: 0 0 6px; font-size: 19px; font-weight: 800; }
.ps-party-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.ps-tag { display: inline-flex; padding: 3px 10px; border-radius: 999px; background: #eef2ff; color: var(--ps-primary); font-size: 13px; font-weight: 700; direction: ltr; }
.ps-tag-kind { background: #ecfdf3; color: var(--ps-green); }
.ps-party-facts h3 { margin: 0 0 10px; font-size: 15px; font-weight: 800; color: var(--ps-primary); }
.ps-party-facts dl { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 8px 22px; margin: 0; }
.ps-party-facts dl > div { display: flex; justify-content: space-between; gap: 10px; padding: 6px 0; border-bottom: 1px dashed #eef2f6; }
.ps-party-facts dt { margin: 0; color: var(--ps-muted); font-size: 14px; font-weight: 600; white-space: nowrap; }
.ps-party-facts dd { margin: 0; color: var(--ps-ink); font-size: 14.5px; font-weight: 700; text-align: end; overflow-wrap: anywhere; }

/* ---- tabs */
.ps-tabs { display: flex; gap: 8px; margin-bottom: 14px; }
.ps-tabs button { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 0 16px; border: 1px solid var(--ps-line); border-radius: 9px; background: #fff; color: #4b5b75; font-size: 15px; font-weight: 700; }
.ps-tabs button.active { border-color: var(--ps-primary); color: var(--ps-primary); background: #eef4ff; }
.ps-count { display: inline-grid; min-width: 22px; height: 22px; place-items: center; padding: 0 6px; border-radius: 999px; background: var(--ps-primary); color: #fff; font-size: 12.5px; }
.ps-tabs button.active .ps-count { background: var(--ps-primary); }

/* ---- summary */
.ps-summary { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; margin-bottom: 14px; }
.ps-summary-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.ps-metric { display: flex; align-items: center; gap: 13px; padding: 15px 16px; border: 1px solid var(--ps-line); border-radius: 13px; background: #fff; }
.ps-metric-icon { display: grid; width: 44px; height: 44px; flex: 0 0 auto; place-items: center; border-radius: 12px; font-size: 1.05rem; }
.ps-metric div { display: flex; min-width: 0; flex-direction: column; gap: 3px; }
.ps-metric small { color: var(--ps-muted); font-size: 13.5px; font-weight: 600; white-space: nowrap; }
.ps-metric strong { font-size: 24px; font-weight: 800; letter-spacing: -.01em; white-space: nowrap; font-variant-numeric: tabular-nums; }
.ps-metric em { color: #94a3b8; font-size: 12.5px; font-style: normal; }
.ps-metric-neutral .ps-metric-icon { background: #f1f5f9; color: #475569; }
.ps-metric-primary .ps-metric-icon { background: #eef2ff; color: var(--ps-primary); }
.ps-metric-success .ps-metric-icon { background: #ecfdf3; color: var(--ps-green); }
.ps-metric-muted .ps-metric-icon { background: #f5f3ff; color: var(--ps-purple); }
.ps-metric-accent { border-color: #bfd3ff; background: linear-gradient(180deg, #f7faff, #fff); }
.ps-metric-accent .ps-metric-icon { background: var(--ps-primary); color: #fff; }
.ps-negative { color: var(--ps-red) !important; }

/* ---- table card */
.ps-table-card { overflow: hidden; margin-bottom: 14px; }
.ps-table-tools { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; padding: 12px 16px; border-bottom: 1px solid var(--ps-line); background: #fbfcfe; }
.ps-search { display: flex; flex: 1; min-width: 260px; align-items: center; gap: 9px; min-height: 40px; padding: 0 12px; border: 1px solid #d5dde8; border-radius: 9px; background: #fff; color: #94a3b8; }
.ps-search input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; color: var(--ps-ink); font-size: 15px; }
.ps-inline-select { display: flex; align-items: center; gap: 8px; margin: 0; color: #5b6b85; font-size: 14.5px; font-weight: 700; }
.ps-inline-select select { min-height: 40px; padding: 0 10px; border: 1px solid #d5dde8; border-radius: 9px; background: #fff; color: var(--ps-ink); font-size: 15px; }
.ps-result-count { margin-inline-start: auto; color: var(--ps-muted); font-size: 14px; }
.ps-table-scroll { overflow: auto; }
.ps-table { width: 100%; min-width: 1180px; border-collapse: collapse; font-size: 15px; }
.ps-table th { padding: 13px 14px; border-bottom: 1px solid var(--ps-line); background: var(--ps-soft); color: #556579; font-size: 15px; font-weight: 800; text-align: start; white-space: nowrap; }
.ps-table td { padding: 12px 14px; border-bottom: 1px solid #eef2f6; color: var(--ps-ink); vertical-align: middle; line-height: 1.5; }
.ps-table tbody tr:hover td { background: #fafbfe; }
.ps-table tfoot td { padding: 13px 14px; background: #f1f5f9; font-size: 16px; font-weight: 800; }
.ps-table tfoot td small { color: var(--ps-muted); font-size: 13px; font-weight: 600; }
.ps-table td[dir="ltr"], .ps-table th[dir="ltr"] { text-align: end; font-variant-numeric: tabular-nums; }
.ps-description { max-width: 360px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* Debit / credit are accounting directions: blue vs. red accents (owner's choice), navy running balance,
   red only for a genuinely negative balance, gray for zero. Same semantics in the totals row and print. */
.ps-table .ps-debit, .ps-table .amount-debit { color: #1d4ed8; font-weight: 700; }
.ps-table .ps-credit, .ps-table .amount-credit { color: #c2414c; font-weight: 700; }
.ps-table .ps-balance, .ps-table .amount-balance { color: #17305e; font-weight: 800; white-space: nowrap; font-size: 15.5px; background: rgba(23, 48, 94, 0.035); }
.ps-table .ps-zero { color: #98a3b5; font-weight: 500; }
.ps-table th.ps-th-debit, .ps-table th.ps-th-credit, .ps-table th.ps-th-balance { text-align: end; }
.ps-table th.ps-th-debit { color: #1d4ed8; box-shadow: inset 0 3px 0 #1d4ed8; }
.ps-table th.ps-th-credit { color: #c2414c; box-shadow: inset 0 3px 0 #c2414c; }
.ps-table th.ps-th-balance { color: #17305e; box-shadow: inset 0 3px 0 #17305e; }
.ps-table th.ps-th-debit i, .ps-table th.ps-th-credit i, .ps-table th.ps-th-balance i { margin-inline-end: 6px; font-size: 12px; opacity: 0.85; }
.ps-table tfoot .ps-totals-row td { background: #eef2f8; border-top: 2px solid #cbd5e1; vertical-align: top; }
.ps-table tfoot .ps-totals-row td small { display: block; margin-bottom: 2px; color: var(--ps-muted); font-size: 12.5px; font-weight: 700; }
.ps-table tfoot .ps-totals-row .ps-debit small { color: #1d4ed8; }
.ps-table tfoot .ps-totals-row .ps-credit small { color: #c2414c; }
.ps-table tfoot .ps-totals-row .ps-balance { font-size: 17px; }
.ps-type { display: inline-flex; padding: 4px 10px; border-radius: 999px; background: #f1f5f9; color: #475569; font-size: 13.5px; font-weight: 700; white-space: nowrap; }
.ps-type-sales_invoice, .ps-type-purchase_invoice { background: #eef2ff; color: var(--ps-primary); }
.ps-type-receipt_voucher, .ps-type-customer_payment, .ps-type-payment_voucher, .ps-type-supplier_payment { background: #ecfdf3; color: var(--ps-green); }
.ps-type-credit_note, .ps-type-sales_return, .ps-type-debit_note, .ps-type-purchase_return { background: #fff7ed; color: var(--ps-amber); }
.ps-type-manual, .ps-type-manual_journal_reversal, .ps-type-opening_balance { background: #f5f3ff; color: var(--ps-purple); }
.ps-doc-link { color: var(--ps-primary); font-weight: 700; text-decoration: none; white-space: nowrap; }
.ps-doc-link:hover { text-decoration: underline; }
.ps-doc-plain { color: #64748b; white-space: nowrap; }
.ps-row-actions { display: flex; align-items: center; gap: 6px; }
.ps-icon-link { display: grid; width: 32px; height: 32px; place-items: center; border: 1px solid var(--ps-line); border-radius: 8px; color: #64748b; text-decoration: none; }
.ps-icon-link:hover { border-color: #bfd3ff; color: var(--ps-primary); background: #eef4ff; }
.ps-status { display: inline-flex; padding: 4px 10px; border-radius: 999px; font-size: 13.5px; font-weight: 700; }
.ps-status-overdue { background: #fef2f2; color: var(--ps-red); }
.ps-status-partial { background: #fff7ed; color: var(--ps-amber); }
.ps-status-unpaid { background: #f1f5f9; color: #475569; }

/* ---- pagination */
.ps-pagination { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 16px; border-top: 1px solid var(--ps-line); background: #fbfcfe; }
.ps-pages { display: flex; align-items: center; gap: 4px; direction: ltr; }
.ps-pages button { min-width: 34px; height: 34px; padding: 0 8px; border: 1px solid var(--ps-line); border-radius: 8px; background: #fff; color: #4b5b75; font-size: 14.5px; font-weight: 700; }
.ps-pages button.active { border-color: var(--ps-primary); background: var(--ps-primary); color: #fff; }
.ps-pages button:disabled { opacity: .45; }
.ps-pages span { padding: 0 4px; color: #94a3b8; }
.ps-page-size { display: flex; align-items: center; gap: 8px; margin: 0; color: var(--ps-muted); font-size: 14px; }
.ps-page-size select { min-height: 34px; padding: 0 8px; border: 1px solid var(--ps-line); border-radius: 8px; background: #fff; font-size: 14.5px; }

/* ---- "Back to statement" bar on drill-down pages (rendered by app.js) */
.statement-return-bar { display: flex; align-items: center; margin: 0 0 12px; padding: 8px 12px; border: 1px solid #bfd3ff; border-radius: 10px; background: #eef4ff; }
.statement-return-bar .btn { display: inline-flex; align-items: center; gap: 7px; font-size: 14.5px; font-weight: 700; }

@media (max-width: 1280px) { .ps-criteria-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } .ps-field-party { grid-column: 1 / -1; } .ps-summary { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 900px) { .ps-page-head, .ps-party { flex-direction: column; align-items: stretch; grid-template-columns: 1fr; } .ps-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); } .ps-criteria-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) { .ps-criteria-grid, .ps-summary { grid-template-columns: 1fr; } .ps-head-actions .btn { flex: 1; } .ps-page-title h1 { font-size: 22px; } }
@media print { .ps-page-head .ps-head-actions, .ps-criteria, .ps-tabs, .ps-table-tools, .ps-pagination, .statement-return-bar { display: none !important; } .ps-card { border: 0; box-shadow: none; } .ps-table { min-width: 0; } }

/* inventory-reports.css */
.inventory-reports-page {
    --primary: #0f8f68;
    --primary-light: #ecfdf5;
}

.inventory-reports-hero .sales-reports-hero-icon,
.inventory-report-view-header .sales-report-view-title > span {
    background: linear-gradient(145deg, #10b981, #047857);
    box-shadow: 0 12px 24px rgb(5 150 105 / 20%);
}

.inventory-report-groups {
    grid-template-columns: minmax(0, 1fr);
}

.inventory-report-note-list {
    display: grid;
    gap: 8px;
    margin: 0 0 14px;
}

.inventory-report-note {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    padding: 11px 13px;
    border: 1px solid #fde68a;
    border-radius: 11px;
    color: #854d0e;
    background: #fffbeb;
    font-size: var(--font-xs);
    line-height: 1.7;
}

.inventory-report-guidance > i {
    animation: none;
    color: #047857;
}

@media print {
    .inventory-reports-page .sales-report-view-header,
    .inventory-reports-page .sales-report-filters-card,
    .inventory-reports-page .sales-report-search,
    .inventory-reports-page .sales-report-export-actions,
    .inventory-reports-page .sales-report-pagination,
    .inventory-reports-page .inventory-report-note-list {
        display: none !important;
    }
}

/* ---- Redesigned inventory reports (قيمة المخزون، ورقة الجرد، ملخص رصيد المخازن، الحركة التفصيلية، ميزان مراجعة منتجات،
   ملخص عمليات المخزون، أعمار المخزون، معدل دوران المخزون، حركات الصنف،
   مطابقة المخزون والأستاذ): compact header, one filter bar, KPI cards, sortable table */
.inventory-modern-page {
    --primary: #185adb;
    --primary-light: #eaf2ff;
    display: grid;
    gap: 14px;
}

/* Grid children never grow to the table's width: the table scrolls inside its own card. */
.inventory-modern-page > * { min-width: 0; }

.ivr-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
}

.ivr-title h1 {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0;
    font-size: var(--font-xl);
    font-weight: 700;
    color: #0f172a;
}

.ivr-title-icon {
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    border-radius: 10px;
    background: var(--primary);
    color: #fff;
    font-size: var(--font-md);
}

.ivr-breadcrumbs {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin: 6px 0 2px;
    font-size: var(--font-sm);
    color: #64748b;
}

.ivr-breadcrumbs a { color: #475569; text-decoration: none; }
.ivr-breadcrumbs a:hover { color: var(--primary); text-decoration: underline; }
.ivr-breadcrumbs i { font-size: 10px; color: #94a3b8; }
.ivr-breadcrumbs [aria-current] { color: #0f172a; font-weight: 600; }
.ivr-title p { margin: 0; font-size: var(--font-sm); color: #64748b; }

.ivr-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}

.ivr-actions .btn {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 38px;
    border-radius: 9px;
    font-size: var(--font-sm);
    font-weight: 600;
}

.ivr-actions .btn-light { border: 1px solid #dbe5f1; background: #fff; color: #334155; }
.ivr-actions .ivr-action-excel { background: #15803d; border-color: #15803d; color: #fff; }
.ivr-actions .ivr-action-excel:hover { background: #166534; color: #fff; }
.ivr-actions .is-report-blocked { opacity: .55; }

.ivr-filters-card {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    padding: 14px 16px;
}

.ivr-filter-form {
    display: grid;
    grid-template-columns: repeat(4, minmax(140px, 1fr)) minmax(220px, 1.5fr) auto;
    align-items: end;
    gap: 12px;
}

/* Compact bar (trial balance, operations summary, aging): the report's criteria (--ivr-fields), then the search and View
   Report — one row on a wide screen, two on a laptop. */
.ivr-filter-form.is-compact-filters { grid-template-columns: repeat(var(--ivr-fields, 5), minmax(120px, 1fr)) minmax(200px, 1.5fr) auto; }

.ivr-field { display: grid; gap: 6px; min-width: 0; margin: 0; }
.ivr-field > span { display: flex; align-items: center; gap: 6px; font-size: var(--font-sm); font-weight: 600; color: #1e293b; }
.ivr-field > span i { color: var(--primary); font-size: var(--font-xs); }
.ivr-field .form-control, .ivr-field .form-select { height: 40px; border-radius: 9px; font-size: var(--font-sm); }
.ivr-filter-submit .btn { display: inline-flex; align-items: center; gap: 7px; height: 40px; padding-inline: 18px; border-radius: 9px; font-weight: 600; white-space: nowrap; }
.ivr-filters-card .report-pending-note { margin-top: 10px; }

.ivr-kpis {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.ivr-kpi {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 16px 18px;
    border: 1px solid;
    border-radius: 14px;
    min-width: 0;
}

.ivr-kpi > div { display: grid; gap: 2px; min-width: 0; }
.ivr-kpi small { font-size: var(--font-sm); font-weight: 600; color: #334155; }
.ivr-kpi strong { font-size: var(--font-2xl); font-weight: 700; line-height: 1.25; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.ivr-kpi > div > span { font-size: var(--font-xs); color: #64748b; }
.ivr-kpi em { font-style: normal; font-size: var(--font-xs); color: #64748b; }
.ivr-kpi-icon { display: grid; place-items: center; flex: 0 0 auto; width: 52px; height: 52px; border-radius: 14px; font-size: 22px; }
.ivr-kpi.is-value { background: #fffaf2; border-color: #fde7c2; }
.ivr-kpi.is-value strong { color: #7c2d12; }
.ivr-kpi.is-value .ivr-kpi-icon { background: #fde7c7; color: #d97706; }
.ivr-kpi.is-quantity { background: #f1fcf6; border-color: #c9f0dc; }
.ivr-kpi.is-quantity strong { color: #14532d; }
.ivr-kpi.is-quantity .ivr-kpi-icon { background: #d8f5e6; color: #16a34a; }
.ivr-kpi.is-count { background: #f4f8ff; border-color: #d9e5ff; }
.ivr-kpi.is-count strong { color: #1e3a8a; }
.ivr-kpi.is-count .ivr-kpi-icon { background: #dde8ff; color: #2563eb; }
.ivr-kpi.is-items { background: #f6f4ff; border-color: #e2dcff; }
.ivr-kpi.is-items strong { color: #3b2a8a; }
.ivr-kpi.is-items .ivr-kpi-icon { background: #e7e2ff; color: #6d4fe0; }
.ivr-kpi.is-out { background: #fff5f5; border-color: #fbd5d5; }
.ivr-kpi.is-out strong { color: #991b1b; }
.ivr-kpi.is-out .ivr-kpi-icon { background: #fee2e2; color: #dc2626; }
.ivr-kpi.is-net { background: #f0fdfa; border-color: #c6efe7; }
.ivr-kpi.is-net strong { color: #115e59; }
.ivr-kpi.is-net .ivr-kpi-icon { background: #ccfbf1; color: #0d9488; }
.ivr-kpis.is-four { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.ivr-kpis.is-five { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.ivr-kpis.is-four .ivr-kpi, .ivr-kpis.is-five .ivr-kpi { padding: 14px 16px; }
/* Four or five cards in a row: a total is never cut or ellipsised (it would read as another number). The figure's size
   follows its card (container query) and its own length (--chars, set by kpiCard); a figure too long even at the
   smallest size wraps instead of hiding digits. */
.ivr-kpis.is-four .ivr-kpi > div, .ivr-kpis.is-five .ivr-kpi > div { flex: 1 1 0; container-type: inline-size; }
.ivr-kpis.is-four .ivr-kpi strong, .ivr-kpis.is-five .ivr-kpi strong { display: block; font-size: clamp(12px, min(13cqi, calc(155cqi / var(--chars, 12))), var(--font-xl)); overflow-wrap: anywhere; }
.ivr-kpis.is-four .ivr-kpi-icon, .ivr-kpis.is-five .ivr-kpi-icon { width: 46px; height: 46px; font-size: 19px; }
.ivr-kpis.is-five .ivr-kpi { gap: 10px; padding: 12px 14px; }
.ivr-kpis.is-five .ivr-kpi-icon { width: 40px; height: 40px; font-size: 17px; }
.ivr-notes { display: grid; gap: 8px; }
.ivr-link-button { padding: 0; border: 0; background: none; color: #92400e; font-weight: 700; text-decoration: underline; }

.ivr-note {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 9px 12px;
    border: 1px solid #fde68a;
    border-radius: 10px;
    background: #fffbeb;
    color: #854d0e;
    font-size: var(--font-xs);
    line-height: 1.7;
}

.ivr-note a { color: #92400e; font-weight: 700; }
/* A date in a note never breaks at its hyphens. */
.ivr-note bdi { white-space: nowrap; }

.ivr-table-card { background: #fff; border: 1px solid #e2e8f0; border-radius: 14px; overflow: hidden; }
/* The header (and the totals row) stay visible while a long page scrolls inside the card. */
/* Positioned so absolutely positioned descendants (e.g. the spoken badge labels) stay inside the scrolling box. */
/* scroll-padding keeps a focused field clear of the sticky header and totals row. */
.ivr-table-wrap { position: relative; max-height: min(70vh, 760px); overflow: auto; scroll-padding-block: 52px 56px; }
.ivr-table { width: 100%; min-width: 900px; border-collapse: separate; border-spacing: 0; font-size: var(--font-ui); }
.ivr-table th {
    position: sticky;
    top: 0;
    z-index: 2;
    padding: 0;
    background: #f1f5f9;
    border-bottom: 1px solid #dbe5f1;
    color: #334155;
    font-weight: 700;
    text-align: start;
    vertical-align: bottom;
    white-space: normal;
}

.ivr-table th > button {
    display: flex;
    align-items: center;
    gap: 6px;
    width: 100%;
    padding: 10px;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    text-align: start;
    white-space: normal;
}

.ivr-table th.is-index, .ivr-table th.is-image { padding: 10px; }
.ivr-table th > button i { flex: 0 0 auto; color: #94a3b8; font-size: 11px; }
.ivr-table th.is-numeric { min-width: 96px; }
.ivr-table th > button.is-active, .ivr-table th > button.is-active i { color: var(--primary); }
.ivr-table th.is-numeric > button { justify-content: flex-end; }
.ivr-table td { padding: 8px 10px; border-bottom: 1px solid #edf1f6; vertical-align: middle; color: #1e293b; }
.ivr-table tbody tr:hover td { background: #f8fbff; }
.ivr-table .is-index { width: 44px; color: #94a3b8; font-size: var(--font-xs); }
.ivr-table .is-code { font-variant-numeric: tabular-nums; white-space: nowrap; }
/* An unusually long code wraps inside its left-to-right isolate (the text itself is unchanged) instead of widening the table. */
.ivr-table td.is-code bdi { display: inline-block; max-width: 220px; white-space: normal; overflow-wrap: break-word; }
.ivr-table .is-image { width: 52px; }
.ivr-table .is-numeric { text-align: end; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ivr-table .is-value { font-weight: 700; color: #0f172a; }
.ivr-table .is-product { min-width: 170px; max-width: 280px; }
.ivr-table .is-warehouse, .ivr-table .is-category { white-space: nowrap; }
.ivr-table .is-product a { color: #0f172a; font-weight: 600; text-decoration: none; }
.ivr-table .is-product a:hover { color: var(--primary); text-decoration: underline; }
.ivr-table .is-unit { max-width: 180px; color: #475569; overflow-wrap: anywhere; }
/* A table cell, whatever a global `.is-actions { display: flex }` (income-statement.css) says. */
.ivr-table td.is-actions, .ivr-table th.is-actions { display: table-cell; width: 84px; text-align: center; }
.ivr-view { display: inline-flex; align-items: center; gap: 5px; padding: 3px 10px; border: 1px solid #cfe0ff; border-radius: 999px; background: #f1f6ff; color: #1d4ed8; font-size: var(--font-xs); font-weight: 600; text-decoration: none; white-space: nowrap; }
.ivr-view:hover, .ivr-view:focus-visible { background: #e2ecff; color: #1e40af; }
/* Warehouse balances: current is neutral, reserved soft orange, available a soft green badge (the number is always shown). */
.ivr-table td.is-current { color: #1e3a8a; font-weight: 600; }
.ivr-table td.is-reserved { color: #b45309; }
.ivr-qty { display: inline-flex; justify-content: center; min-width: 64px; padding: 3px 10px; border-radius: 8px; font-weight: 700; font-variant-numeric: tabular-nums; }
.ivr-qty.is-available { background: #dcfce7; color: #166534; }
.ivr-qty.is-negative { background: #fee2e2; color: #b91c1c; }
.ivr-qty.is-none { min-width: 44px; background: #f1f5f9; color: #94a3b8; font-weight: 400; }
/* Detailed movements: the document opens the stock voucher; the movement type is tinted by direction (in / out). */
.ivr-table .is-date { white-space: nowrap; font-variant-numeric: tabular-nums; }
.ivr-doc-link { display: inline-flex; align-items: center; gap: 5px; color: #1d4ed8; font-weight: 600; text-decoration: none; white-space: nowrap; }
.ivr-doc-link i { font-size: 10px; opacity: .75; }
.ivr-doc-link:hover, .ivr-doc-link:focus-visible { text-decoration: underline; }
.ivr-type { display: inline-block; padding: 3px 10px; border-radius: 999px; font-size: var(--font-xs); font-weight: 600; white-space: nowrap; }
.ivr-type.is-in { background: #dcfce7; color: #166534; }
.ivr-type.is-out { background: #fee2e2; color: #b91c1c; }
.ivr-table td.is-balance { font-weight: 700; color: #1e3a8a; }
/* Product movement ledger: a transfer is neither a receipt nor an issue of the item (neutral tone, direction still written);
   the balance after a movement is a badge (red when negative); the source document number sits under the voucher. */
.ivr-type.is-transfer { background: #e0e7ff; color: #3730a3; }
.ivr-type i { margin-inline-end: 4px; font-size: 10px; }
.ivr-qty.is-balance { background: #eaf2ff; color: #1e3a8a; }
.ivr-source-number { display: block; margin-top: 2px; font-size: var(--font-xs); color: #64748b; }
.ivr-table td.is-document bdi { max-width: none; white-space: nowrap; }
.ivr-source-na { font-size: var(--font-xs); white-space: nowrap; }
/* Inventory vs general ledger: the status says it in words (matched / difference); a difference within the rounding
   tolerance is amber, a real difference red; the diagnostics open below the table. */
.ivr-status { display: inline-flex; align-items: center; gap: 5px; padding: 3px 10px; border-radius: 999px; font-size: var(--font-xs); font-weight: 700; white-space: nowrap; }
.ivr-status.is-matched { background: #dcfce7; color: #166534; }
.ivr-status.is-different { background: #fee2e2; color: #b91c1c; }
.ivr-diff-amount { display: inline-flex; justify-content: center; min-width: 64px; padding: 3px 10px; border-radius: 8px; font-weight: 700; }
.ivr-diff-amount.is-matched { background: #dcfce7; color: #166534; }
.ivr-diff-amount.is-tolerance { background: #fef3c7; color: #92400e; }
.ivr-diff-amount.is-different { background: #fee2e2; color: #b91c1c; }
.ivr-table td.is-actions button.ivr-view { cursor: pointer; }
.ivr-recon-details { display: grid; gap: 10px; padding: 14px 16px; border: 1px solid #e2e8f0; border-radius: 14px; background: #fff; }
.ivr-recon-details[hidden] { display: none; }
.ivr-recon-details header h3 { margin: 0; font-size: var(--font-lg); }
.ivr-recon-details header p, .ivr-recon-details p { margin: 0; font-size: var(--font-sm); color: #475569; }
.ivr-recon-details h4 { margin: 4px 0 0; font-size: var(--font-md); color: #0f172a; }
.ivr-recon-sides { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.ivr-recon-sides > div { display: grid; gap: 6px; align-content: start; padding: 12px; border: 1px solid #edf1f6; border-radius: 10px; background: #f8fafc; }
.ivr-recon-table { min-width: 0; }
.ivr-recon-table th { position: static; padding: 8px 10px; }
@media (max-width: 760px) { .ivr-recon-sides { grid-template-columns: minmax(0, 1fr); } .ivr-recon-details { overflow-x: auto; } }
/* Inventory aging: the age and its bucket share one tone per bucket (the label is always written, never colour alone). */
.ivr-age, .ivr-age-bucket { display: inline-flex; justify-content: center; padding: 3px 10px; border-radius: 999px; font-size: var(--font-xs); font-weight: 700; white-space: nowrap; font-variant-numeric: tabular-nums; }
.ivr-age { min-width: 44px; }
.ivr-age.is-fresh, .ivr-age-bucket.is-fresh { background: #dcfce7; color: #166534; }
.ivr-age.is-aging, .ivr-age-bucket.is-aging { background: #fef3c7; color: #92400e; }
.ivr-age.is-old, .ivr-age-bucket.is-old { background: #ffedd5; color: #c2410c; }
.ivr-age.is-stale, .ivr-age-bucket.is-stale { background: #fee2e2; color: #b91c1c; }
.ivr-age.is-unknown, .ivr-age-bucket.is-unknown { background: #f1f5f9; color: #475569; }
.ivr-table td.is-bucket { white-space: nowrap; }
/* Product trial balance: a period movement is tinted by direction (zero is muted); a negative balance is red. */
.ivr-flow { font-weight: 600; }
.ivr-flow.is-in { color: #15803d; }
.ivr-flow.is-out { color: #b91c1c; }
.ivr-table .ivr-negative { color: #b91c1c; font-weight: 700; }
/* Eleven columns (detailed movements, operations summary, aging, turnover): the document number stays on one line, and
   the product and numeric columns are a little narrower so the last figures stay in view at a laptop width (the table still scrolls
   in its card when needed). */
.ivr-table td.is-code .ivr-doc-link bdi { display: inline; white-space: nowrap; }
.inventory-movements-page .ivr-table .is-product, .inventory-operations-page .ivr-table .is-product, .inventory-aging-page .ivr-table .is-product,
.inventory-turnover-page .ivr-table .is-product { min-width: 120px; }
.inventory-movements-page .ivr-table th.is-numeric, .inventory-operations-page .ivr-table th.is-numeric, .inventory-aging-page .ivr-table th.is-numeric,
.inventory-turnover-page .ivr-table th.is-numeric { min-width: 78px; }
.inventory-movements-page .ivr-table td, .inventory-operations-page .ivr-table td, .inventory-aging-page .ivr-table td,
.inventory-turnover-page .ivr-table td { padding-inline: 6px; }
.inventory-movements-page .ivr-table th > button, .inventory-movements-page .ivr-table .ivr-th-label,
.inventory-operations-page .ivr-table th > button, .inventory-operations-page .ivr-table .ivr-th-label,
.inventory-aging-page .ivr-table th > button, .inventory-aging-page .ivr-table .ivr-th-label,
.inventory-turnover-page .ivr-table th > button, .inventory-turnover-page .ivr-table .ivr-th-label { padding-inline: 6px; }
.inventory-movements-page .ivr-table .is-warehouse, .inventory-operations-page .ivr-table .is-warehouse, .inventory-aging-page .ivr-table .is-warehouse { min-width: 90px; white-space: normal; }
.inventory-operations-page .ivr-table td.is-code bdi, .inventory-aging-page .ivr-table td.is-code bdi, .inventory-turnover-page .ivr-table td.is-code bdi { max-width: 170px; }
.ivr-foot-label { display: block; font-size: var(--font-xs); }
.ivr-th-label { display: block; padding: 10px; }
.ivr-table th.is-numeric .ivr-th-label { text-align: end; }
/* Stocktake: the counted quantity is typed in the row; the difference badge carries its sign in text, not only colour. */
.ivr-table .is-count { width: 132px; }
.ivr-count-input { width: 112px; height: 34px; padding: 0 10px; border: 1px solid #cbd5e1; border-radius: 8px; background: #fff; text-align: end; font-variant-numeric: tabular-nums; direction: ltr; }
.ivr-count-input:focus { outline: 2px solid var(--primary); outline-offset: 1px; border-color: var(--primary); }
.ivr-count-input.is-invalid { border-color: #dc2626; background: #fff5f5; }
.ivr-diff { display: inline-flex; justify-content: center; min-width: 44px; padding: 3px 10px; border-radius: 8px; font-weight: 700; font-variant-numeric: tabular-nums; direction: ltr; }
.ivr-diff.is-zero { background: #eef2f6; color: #475569; }
.ivr-diff.is-positive { background: #dcfce7; color: #166534; }
.ivr-diff.is-negative { background: #fee2e2; color: #b91c1c; }
.ivr-diff.is-empty { color: #94a3b8; font-weight: 400; }
.ivr-thumb { display: grid; place-items: center; width: 36px; height: 36px; border: 1px solid #e2e8f0; border-radius: 8px; background: #f8fafc; color: #94a3b8; overflow: hidden; }
.ivr-thumb img { width: 100%; height: 100%; object-fit: contain; }
.ivr-chip { display: inline-block; max-width: 130px; overflow: hidden; text-overflow: ellipsis; vertical-align: middle; padding: 3px 10px; border: 1px solid #d6e2f5; border-radius: 999px; background: #f1f6ff; color: #1e4e9e; font-size: var(--font-xs); font-weight: 600; white-space: nowrap; }
.ivr-muted { color: #94a3b8; font-weight: 400; }
.ivr-table tfoot td { position: sticky; bottom: 0; z-index: 1; background: #eef4ff; border-top: 1px solid #cfe0ff; border-bottom: 0; font-weight: 700; color: #0f172a; }

.ivr-pagination {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 10px;
    padding: 12px 14px;
    border-top: 1px solid #e2e8f0;
    font-size: var(--font-sm);
    color: #475569;
}

.ivr-pages { display: flex; align-items: center; gap: 6px; }
.ivr-pages button { min-width: 34px; height: 34px; padding: 0 8px; border: 1px solid #dbe5f1; border-radius: 8px; background: #fff; color: #334155; font-variant-numeric: tabular-nums; }
.ivr-pages button.is-active { background: var(--primary); border-color: var(--primary); color: #fff; font-weight: 700; }
.ivr-pages button:disabled { opacity: .45; }
.ivr-gap { padding: 0 2px; color: #94a3b8; }
.ivr-page-size { display: flex; align-items: center; gap: 8px; margin: 0; }
.ivr-page-size select { height: 34px; border: 1px solid #dbe5f1; border-radius: 8px; padding-inline: 8px; background: #fff; }

@media (max-width: 1440px) {
    .ivr-filter-form { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .ivr-search-field { grid-column: span 2; }
    .ivr-filter-form.is-period { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .ivr-filter-form.is-period .ivr-search-field { grid-column: span 3; }
}

/* The compact bar needs about 160px per date field: below ~1620px it takes the four-column layout. */
@media (max-width: 1620px) {
    .ivr-filter-form.is-compact-filters { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .ivr-filter-form.is-compact-filters .ivr-search-field { grid-column: span 2; }
}

@media (max-width: 1280px) {
    .ivr-kpis.is-four { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .ivr-kpis.is-five { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
    .ivr-header { flex-direction: column; }
    .ivr-actions { width: 100%; }
    .ivr-actions .btn { flex: 1 1 auto; justify-content: center; }
    .ivr-filter-form, .ivr-filter-form.is-period, .ivr-filter-form.is-compact-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .ivr-search-field, .ivr-filter-submit, .ivr-filter-form.is-period .ivr-search-field, .ivr-filter-form.is-compact-filters .ivr-search-field { grid-column: 1 / -1; }
    .ivr-filter-submit .btn { width: 100%; justify-content: center; }
    .ivr-kpis, .ivr-kpis.is-four, .ivr-kpis.is-five { grid-template-columns: minmax(0, 1fr); }
    .ivr-pagination { justify-content: center; }
    .ivr-range { width: 100%; text-align: center; }
}

@media (max-width: 420px) {
    .ivr-filter-form, .ivr-filter-form.is-period, .ivr-filter-form.is-compact-filters { grid-template-columns: minmax(0, 1fr); }
}

/* Print / PDF of the redesigned reports: only the generated print source (full result, criteria, totals), on its own
   named page so the size, margins and page numbers never leak into other screens' prints. */
.ivr-print { display: none; }

/* A template document print sets `@page { size: …; margin: 0 }` while it prints (style#accman-active-print-page, app.js) and
   layout.css has a global print `@page`; the report page keeps its own margins (and with them the page-number box). */
@page ivr-report {
    size: A4 landscape;
    margin: 12mm 10mm 14mm !important;
    @bottom-center { content: counter(page) " / " counter(pages); font-size: 10px; color: #444; }
}

@media print {
    body.ivr-printing > *:not(.ivr-print) { display: none !important; }
    body.ivr-printing .ivr-print {
        display: block;
        position: static !important;
        page: ivr-report;
        color: #000;
        font-size: 11.5px;
    }

    .ivr-print-head { display: flex; justify-content: space-between; gap: 16px; margin-bottom: 8px; border-bottom: 2px solid #000; padding-bottom: 6px; }
    .ivr-print-head h1 { margin: 2px 0; font-size: 18px; }
    .ivr-print-head p { margin: 0; color: #333; }
    .ivr-print-head dl { display: grid; grid-template-columns: repeat(2, auto); gap: 2px 14px; margin: 0; }
    .ivr-print-head dl div { display: flex; gap: 6px; }
    .ivr-print-head dt { font-weight: 700; }
    .ivr-print-head dd { margin: 0; }
    .ivr-print-kpis { display: flex; gap: 18px; margin: 6px 0 8px; }
    .ivr-print-kpis span { display: block; color: #333; }
    .ivr-print-kpis strong { font-size: 13px; }
    .ivr-print-table { width: 100%; border-collapse: collapse; }
    .ivr-print-table thead { display: table-header-group; }
    .ivr-print-table tfoot { display: table-footer-group; }
    .ivr-print-table th, .ivr-print-table td { border: 1px solid #999; padding: 3px 5px; text-align: start; }
    .ivr-print-table th { background: #eee; }
    .ivr-print-table .is-numeric { text-align: end; white-space: nowrap; }
    .ivr-print-table tr { break-inside: avoid; }
    .ivr-print-table tfoot td { font-weight: 700; background: #f3f3f3; }
    .ivr-print-table td { height: 24px; }
    .ivr-print-table .ivr-print-opening td { font-weight: 700; background: #f7f7f7; }
    .ivr-recon-details.is-print { margin-top: 12px; display: block; }
    .ivr-recon-details.is-print .ivr-recon-sides { display: flex; gap: 16px; margin: 6px 0; }
    .ivr-recon-details.is-print h3, .ivr-recon-details.is-print h4 { margin: 8px 0 4px; font-size: 13px; }
    .ivr-write-box { display: inline-block; width: 80px; height: 16px; border-bottom: 1px solid #555; }
    .ivr-print-signatures { display: flex; justify-content: space-between; gap: 24px; margin-top: 22px; break-inside: avoid; }
    .ivr-print-signatures div { flex: 1; display: grid; gap: 26px; }
    .ivr-print-signatures i { display: block; border-bottom: 1px solid #000; }
}

/* general-accounts-reports.css */
.ga-page{--ga-blue:var(--primary,#2563eb);--ga-ink:var(--text-main,#172033);--ga-muted:var(--text-muted,#64748b);--ga-line:var(--border-color,#e2e8f0);--ga-surface:var(--bg-surface,#fff);display:grid;gap:18px;max-width:1560px;margin:0 auto;color:var(--ga-ink);}.ga-hero,.ga-report-head{display:flex;align-items:center;justify-content:space-between;gap:22px;padding:25px;border:1px solid var(--ga-line);border-radius:17px;background:linear-gradient(135deg,var(--ga-surface),#eef5ff);box-shadow:var(--shadow-sm,0 3px 12px rgba(15,23,42,.05))}.ga-hero h1,.ga-report-head h1{margin:3px 0 7px;font-size:var(--font-2xl);font-weight:700}.ga-hero p,.ga-report-head p{max-width:780px;margin:0;color:var(--ga-muted);font-size:var(--font-base);line-height:1.8}.ga-eyebrow,.ga-hero .ga-eyebrow{color:var(--ga-blue);font-size:var(--font-xs);font-weight:700}.ga-hero-icon{display:grid;width:74px;height:74px;flex:0 0 auto;place-items:center;border-radius:21px;color:#fff;background:linear-gradient(135deg,var(--ga-blue),#0ea5e9);box-shadow:0 13px 28px rgba(37,99,235,.24);font-size:1.75rem}.ga-dashboard-filters{display:grid;grid-template-columns:repeat(3,minmax(160px,1fr)) auto;align-items:end;gap:12px;padding:15px;border:1px solid var(--ga-line);border-radius:14px;background:var(--ga-surface)}.ga-dashboard-filters label,.ga-field,.ga-modal-field{display:flex;min-width:0;flex-direction:column;gap:6px}.ga-dashboard-filters label span,.ga-field>span,.ga-modal-field span{color:#475569;font-size:var(--font-ui);font-weight:700}.ga-dashboard-filters input,.ga-dashboard-filters select,.ga-field input,.ga-field select,.ga-modal-field input{width:100%;height:42px;padding:7px 11px;border:1px solid #d5deea;border-radius:9px;outline:none;color:var(--ga-ink);background:var(--ga-surface);font-size:var(--font-ui)}.ga-dashboard-filters input:focus,.ga-dashboard-filters select:focus,.ga-field input:focus,.ga-field select:focus,.ga-modal-field input:focus{border-color:var(--ga-blue);box-shadow:0 0 0 3px color-mix(in srgb,var(--ga-blue) 12%,transparent)}.ga-btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:40px;padding:8px 14px;border:1px solid transparent;border-radius:9px;cursor:pointer;text-decoration:none;font-size:var(--font-ui);font-weight:850;transition:.18s}.ga-btn-primary{color:#fff;background:var(--ga-blue)}.ga-btn-primary:hover{color:#fff;filter:brightness(.96);transform:translateY(-1px)}.ga-btn-outline{border-color:var(--ga-line);color:#334155;background:var(--ga-surface)}.ga-btn-outline:hover{border-color:#a9b7ca;color:var(--ga-blue);background:#f8fafc}.ga-btn:disabled{opacity:.5;cursor:not-allowed}.ga-dashboard{display:grid;gap:15px}.ga-dashboard-heading,.ga-chart-grid article>header{display:flex;align-items:center;justify-content:space-between;gap:14px}.ga-dashboard-heading span:first-child,.ga-chart-grid article header small{color:var(--ga-muted);font-size:var(--font-xs)}.ga-dashboard-heading h2,.ga-chart-grid h3{margin:2px 0 0;font-size:var(--font-md);font-weight:700}.ga-integrity{display:inline-flex;align-items:center;gap:7px;padding:7px 10px;border-radius:999px;font-size:var(--font-sm);font-weight:700}.ga-integrity.is-ok{color:#047857;background:#dcfce7}.ga-integrity.is-warning{color:#b45309;background:#fef3c7}.ga-kpi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px}.ga-kpi{position:relative;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:11px;min-width:0;padding:15px;border:1px solid var(--ga-line);border-radius:13px;color:var(--ga-ink);background:var(--ga-surface);box-shadow:var(--shadow-sm,0 3px 10px rgba(15,23,42,.04));text-decoration:none;overflow:hidden;transition:.18s}.ga-kpi:before{position:absolute;inset:0 0 0 auto;width:3px;background:var(--kpi,#2563eb);content:""}.ga-kpi:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--kpi,#2563eb) 35%,var(--ga-line));color:var(--ga-ink);box-shadow:0 10px 25px rgba(15,23,42,.08)}.ga-kpi.is-primary{--kpi:#2563eb}.ga-kpi.is-success{--kpi:#059669}.ga-kpi.is-warning{--kpi:#d97706}.ga-kpi.is-danger{--kpi:#dc2626}.ga-kpi.is-info{--kpi:#0891b2}.ga-kpi-icon{display:grid;width:42px;height:42px;place-items:center;border-radius:11px;color:var(--kpi);background:color-mix(in srgb,var(--kpi) 11%,white)}.ga-kpi>span:nth-child(2){display:flex;min-width:0;flex-direction:column}.ga-kpi small{color:var(--ga-muted);font-size:var(--font-xs)}.ga-kpi strong{margin-top:2px;font-size:var(--font-2xl)}.ga-kpi em{color:var(--ga-muted);font-size:var(--font-xs);font-style:normal}.ga-kpi>i{color:#94a3b8;font-size:.65rem}.ga-chart-grid{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(300px,1fr);gap:14px}.ga-chart-grid article{min-height:265px;padding:17px;border:1px solid var(--ga-line);border-radius:14px;background:var(--ga-surface)}.ga-chart-grid article header>i{color:#94a3b8}.ga-bars{display:flex;height:175px;align-items:flex-end;gap:8px;padding-top:20px;border-bottom:1px solid var(--ga-line)}.ga-bar-item{display:flex;min-width:28px;flex:1;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;gap:5px}.ga-bar-pair{display:flex;width:100%;height:calc(100% - 20px);align-items:flex-end;justify-content:center;gap:2px}.ga-bar-pair span{display:block;width:min(13px,42%);min-height:3px;border-radius:4px 4px 0 0}.ga-bar-pair .is-revenue,.ga-chart-legend .is-revenue{background:#16a34a}.ga-bar-pair .is-expense,.ga-chart-legend .is-expense{background:#f59e0b}.ga-bar-item small{direction:ltr;color:var(--ga-muted);font-weight:600;font-size:var(--font-xs);white-space:nowrap;transform:rotate(-35deg);transform-origin:center}.ga-chart-legend{display:flex;justify-content:center;gap:16px;margin-top:13px;color:var(--ga-muted);font-size:var(--font-sm)}.ga-chart-legend span{display:flex;align-items:center;gap:5px}.ga-chart-legend i{width:8px;height:8px;border-radius:50%}.ga-rank-list{display:grid;gap:10px;margin-top:17px}.ga-rank-list a{position:relative;display:flex;justify-content:space-between;gap:12px;padding:7px 0;color:var(--ga-ink);text-decoration:none;font-size:var(--font-sm)}.ga-rank-list a span,.ga-rank-list a strong{position:relative;z-index:1}.ga-rank-list a i{position:absolute;right:0;bottom:0;height:3px;border-radius:999px;background:#f59e0b}.ga-personal{display:grid;grid-template-columns:1fr 1fr;gap:14px}.ga-personal>div{display:flex;align-items:center;gap:8px;min-width:0;padding:13px;border:1px solid var(--ga-line);border-radius:12px;background:var(--ga-surface);overflow:auto}.ga-personal h2{display:flex;align-items:center;gap:6px;margin:0 0 0 10px;font-size:var(--font-sm);white-space:nowrap}.ga-personal h2 i{color:#f59e0b}.ga-personal a,.ga-personal>div>span{padding:6px 9px;border-radius:999px;color:#334155;background:#f1f5f9;text-decoration:none;font-size:var(--font-xs);white-space:nowrap}.ga-category-tabs{display:flex;gap:6px;padding:5px;border:1px solid var(--ga-line);border-radius:12px;background:var(--ga-surface);overflow:auto}.ga-category-tabs button{display:inline-flex;flex:1;align-items:center;justify-content:center;gap:7px;min-width:max-content;padding:10px 12px;border:0;border-radius:8px;color:var(--ga-muted);background:transparent;cursor:pointer;font-size:var(--font-ui);font-weight:850}.ga-category-tabs button span{display:grid;min-width:20px;height:20px;place-items:center;border-radius:999px;background:#f1f5f9;font-weight:700;font-size:var(--font-ui)}.ga-category-tabs button.active{color:var(--ga-blue);background:#eff6ff}.ga-category-panel{display:none;padding:20px;border:1px solid var(--ga-line);border-radius:15px;background:var(--ga-surface)}.ga-category-panel.active{display:block}.ga-category-panel>header{display:flex;align-items:center;gap:11px;margin-bottom:16px}.ga-category-panel>header>span{display:grid;width:43px;height:43px;place-items:center;border-radius:11px;color:var(--ga-blue);background:#eff6ff}.ga-category-panel header small{color:var(--ga-muted);font-size:var(--font-xs)}.ga-category-panel h2{margin:1px 0 0;font-size:var(--font-md);font-weight:700}.ga-report-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:11px}.ga-report-card{display:grid;grid-template-columns:auto 1fr;gap:11px;min-height:155px;padding:15px;border:1px solid var(--ga-line);border-radius:12px;background:var(--ga-surface);transition:.18s}.ga-report-card:hover{transform:translateY(-2px);border-color:#bfdbfe;box-shadow:0 9px 24px rgba(15,23,42,.07)}.ga-report-icon{display:grid;width:40px;height:40px;place-items:center;border-radius:10px;color:var(--ga-blue);background:#eff6ff}.ga-report-card h3{margin:2px 0 5px;font-size:var(--font-ui);font-weight:700}.ga-report-card p{margin:0;color:var(--ga-muted);font-size:var(--font-xs);line-height:1.65}.ga-report-card footer{display:flex;grid-column:1/-1;align-self:end;gap:7px}.ga-card-link{display:inline-flex;align-items:center;justify-content:center;min-height:31px;flex:1;border-radius:7px;color:#fff;background:var(--ga-blue);text-decoration:none;font-size:var(--font-xs);font-weight:850}.ga-card-link.is-soft{color:var(--ga-blue);background:#eff6ff}.ga-loading{display:flex;min-height:420px;align-items:center;justify-content:center;flex-direction:column;gap:10px;color:var(--ga-muted);text-align:center}.ga-loading>i{color:var(--ga-blue);font-size:1.6rem}.ga-loading strong{color:var(--ga-ink);font-size:var(--font-md)}.ga-loading span{font-size:var(--font-sm)}.ga-loading.is-error>i{color:#dc2626}.ga-dashboard-loading,.ga-inline-error{display:flex;min-height:110px;align-items:center;justify-content:center;gap:9px;padding:20px;border:1px solid var(--ga-line);border-radius:13px;color:var(--ga-muted);background:var(--ga-surface);font-size:var(--font-sm)}.ga-dashboard-loading i{color:var(--ga-blue)}.ga-inline-error{color:#b91c1c;border-color:#fecaca;background:#fff1f2}.ga-empty-mini{display:grid;height:190px;place-items:center;color:var(--ga-muted);font-size:var(--font-sm)}.ga-report-head{padding:18px 20px;background:var(--ga-surface)}.ga-report-title{display:flex;align-items:center;gap:14px}.ga-report-title>span{display:grid;width:52px;height:52px;flex:0 0 auto;place-items:center;border-radius:13px;color:#fff;background:var(--ga-blue);font-size:var(--font-lg)}.ga-report-title a{display:inline-flex;align-items:center;gap:5px;color:var(--ga-muted);text-decoration:none;font-size:var(--font-xs);font-weight:700}.ga-report-head h1{font-size:var(--font-2xl)}.ga-report-actions{display:flex;flex-wrap:wrap;gap:7px}.ga-filter-card,.ga-results{border:1px solid var(--ga-line);border-radius:14px;background:var(--ga-surface);box-shadow:var(--shadow-sm,0 3px 12px rgba(15,23,42,.04));overflow:hidden}.ga-filter-heading{display:flex;align-items:center;justify-content:space-between;padding:13px 16px;border-bottom:1px solid var(--ga-line)}.ga-filter-heading>div{display:flex;align-items:center;gap:9px}.ga-filter-heading>div>i{color:var(--ga-blue)}.ga-filter-heading span{display:flex;flex-direction:column}.ga-filter-heading strong{font-size:var(--font-ui)}.ga-filter-heading small{color:var(--ga-muted);font-size:var(--font-xs)}.ga-filter-heading button{width:30px;height:30px;border:0;border-radius:7px;color:var(--ga-muted);background:#f8fafc;cursor:pointer}.ga-filter-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(185px,1fr));gap:11px;padding:16px}.ga-check{display:flex;align-items:center;gap:7px;color:#475569;font-size:var(--font-sm);font-weight:750}.ga-check input{accent-color:var(--ga-blue)}.ga-filter-card>footer{display:flex;align-items:center;justify-content:flex-end;gap:8px;padding:12px 16px;border-top:1px solid var(--ga-line);background:#fbfcfe}.ga-view-switch{display:flex;margin-inline-end:auto;padding:3px;border:1px solid var(--ga-line);border-radius:8px;background:#fff}.ga-view-switch label{cursor:pointer}.ga-view-switch input{position:absolute;opacity:0}.ga-view-switch span{display:block;padding:6px 10px;border-radius:6px;color:var(--ga-muted);font-size:var(--font-xs);font-weight:850}.ga-view-switch input:checked+span{color:var(--ga-blue);background:#eff6ff}.ga-filter-card.is-collapsed .ga-filter-grid,.ga-filter-card.is-collapsed>footer{display:none}.ga-filter-card.is-collapsed .ga-filter-heading button{transform:rotate(180deg)}.ga-results-tools{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;border-bottom:1px solid var(--ga-line)}.ga-search{display:flex;max-width:430px;flex:1;align-items:center;gap:8px;padding:0 11px;border:1px solid var(--ga-line);border-radius:9px}.ga-search i{color:#94a3b8}.ga-search input{width:100%;height:39px;border:0;outline:0;background:transparent;font-size:var(--font-ui)}.ga-tool-btn{display:inline-flex;align-items:center;gap:6px;min-height:38px;padding:7px 11px;border:1px solid var(--ga-line);border-radius:8px;color:#475569;background:#fff;cursor:pointer;font-size:var(--font-ui);font-weight:700}.ga-document-head{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:15px 16px;background:#fbfcfe}.ga-document-head>div{display:flex;flex-direction:column}.ga-document-head strong{font-size:var(--font-base)}.ga-document-head span{color:var(--ga-blue);font-size:var(--font-sm);font-weight:700}.ga-document-head dl{display:flex;flex-wrap:wrap;gap:14px;margin:0}.ga-document-head dl div{display:flex;flex-direction:column}.ga-document-head dt{color:var(--ga-muted);font-size:var(--font-xs)}.ga-document-head dd{margin:0;font-size:var(--font-xs);font-weight:700}.ga-table-wrap{overflow:auto;border-block:1px solid var(--ga-line)}.ga-table{width:100%;min-width:980px;border-collapse:collapse}.ga-table th{position:sticky;top:0;z-index:2;padding:0;background:#f4f7fb;white-space:nowrap}.ga-table th button{display:flex;width:100%;align-items:center;justify-content:space-between;gap:7px;padding:11px 12px;border:0;color:#475569;background:transparent;text-align:right;font-size:var(--font-ui);font-weight:700}.ga-table th button i{color:#a3afc0;font-size:var(--font-ui)}.ga-table td{padding:11px 12px;border-top:1px solid #edf1f5;color:#334155;font-size:var(--font-ui);vertical-align:middle}.ga-table tbody tr:hover{background:#f9fbfe}.ga-table .is-number{direction:ltr;text-align:right;font-weight:700;white-space:nowrap}.ga-table tfoot td{position:sticky;bottom:0;color:var(--ga-ink);background:#edf3fa;border-top:2px solid #cbd5e1;font-weight:700}.ga-row-action{width:78px;text-align:center!important}.ga-row-action a{display:inline-grid;width:27px;height:27px;margin:1px;place-items:center;border-radius:7px;color:var(--ga-blue);background:#eff6ff;text-decoration:none}.ga-empty{display:flex;min-height:180px;align-items:center;justify-content:center;flex-direction:column;gap:7px;color:var(--ga-muted)}.ga-empty i{font-size:1.35rem}.ga-empty strong{color:var(--ga-ink)}.ga-pagination{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px}.ga-pagination>div{display:flex;align-items:center;gap:5px;font-size:var(--font-xs)}.ga-pagination nav{display:flex;gap:4px}.ga-pagination button{display:grid;min-width:31px;height:31px;place-items:center;border:1px solid var(--ga-line);border-radius:7px;color:#475569;background:#fff;cursor:pointer;font-size:var(--font-ui)}.ga-pagination button.active{border-color:var(--ga-blue);color:#fff;background:var(--ga-blue)}.ga-pagination button:disabled{opacity:.4}.ga-pagination label{display:flex;align-items:center;gap:6px;color:var(--ga-muted);font-size:var(--font-sm)}.ga-pagination select{height:32px;border:1px solid var(--ga-line);border-radius:7px}.ga-overlay{position:fixed;inset:0;z-index:12000;display:flex;align-items:center;justify-content:center;padding:18px;background:rgba(15,23,42,.55);backdrop-filter:blur(2px)}.ga-modal{width:min(500px,100%);border-radius:14px;background:#fff;box-shadow:0 24px 65px rgba(0,0,0,.25);overflow:hidden}.ga-modal>header,.ga-modal>footer{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:14px 17px;border-bottom:1px solid var(--ga-line)}.ga-modal>header h3{margin:0;font-size:var(--font-base);font-weight:700}.ga-modal>header button{width:30px;height:30px;border:1px solid var(--ga-line);border-radius:7px;background:#fff;cursor:pointer}.ga-modal-body{display:grid;gap:13px;padding:17px}.ga-modal>footer{justify-content:flex-start;border-top:1px solid var(--ga-line);border-bottom:0}.ga-modal-note{margin:0;color:var(--ga-muted);font-size:var(--font-xs);line-height:1.7}.ga-column-list{display:grid;grid-template-columns:1fr 1fr;gap:8px}.ga-column-list label{display:flex;align-items:center;gap:7px;padding:8px;border:1px solid var(--ga-line);border-radius:8px;font-size:var(--font-sm)}.ga-column-list input{accent-color:var(--ga-blue)}.ga-toast-host{position:fixed;top:20px;left:20px;z-index:13000;display:grid;gap:8px}.ga-toast{display:flex;align-items:center;gap:8px;max-width:390px;padding:11px 14px;border-right:4px solid #059669;border-radius:9px;color:#fff;background:#12304f;box-shadow:0 10px 28px rgba(15,23,42,.25);font-size:var(--font-sm)}.ga-toast.is-error{border-right-color:#ef4444;background:#881337}
@media(max-width:980px){.ga-dashboard-filters{grid-template-columns:1fr 1fr}.ga-chart-grid{grid-template-columns:1fr}.ga-report-head,.ga-document-head{align-items:stretch;flex-direction:column}.ga-report-actions{width:100%}.ga-report-actions .ga-btn{flex:1}.ga-document-head dl{justify-content:space-between}}
@media(max-width:700px){.ga-hero{align-items:flex-start;flex-direction:column-reverse}.ga-dashboard-filters,.ga-personal{grid-template-columns:1fr}.ga-category-panel{padding:14px}.ga-report-grid{grid-template-columns:1fr}.ga-report-title{align-items:flex-start}.ga-report-title>span{width:44px;height:44px}.ga-filter-grid{grid-template-columns:1fr}.ga-filter-card>footer,.ga-results-tools,.ga-pagination{align-items:stretch;flex-direction:column}.ga-view-switch{width:100%;margin:0}.ga-view-switch label{flex:1;text-align:center}.ga-search{max-width:none;width:100%}.ga-pagination nav{justify-content:center}.ga-column-list{grid-template-columns:1fr}.ga-category-tabs button{flex:0 0 auto}}
@media print{body{background:#fff!important}.sidebar,.topbar,.ga-report-head,.ga-filter-card,.ga-results-tools,.ga-pagination,.ga-toast-host{display:none!important}.main-content,#app-content{margin:0!important;padding:0!important}.ga-page{display:block;max-width:none}.ga-results{border:0;box-shadow:none}.ga-table-wrap{overflow:visible;border:0}.ga-table{min-width:0;font-size:9pt}.ga-table th,.ga-table td{padding:6px;border:1px solid #ccd3dc}.ga-row-action{display:none!important}.ga-document-head{display:flex!important;padding:10px;border-bottom:2px solid #1f2937}.ga-table tfoot td{position:static}.ga-report-document{direction:rtl}}
.ga-tie-out,
.ga-comparison-period {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 14px 18px 0;
    padding: 11px 14px;
    border: 1px solid var(--border-color);
    border-radius: 12px;
    background: var(--bg-surface);
    font-size: var(--font-sm);
}

.ga-tie-out span {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.ga-tie-out small {
    color: var(--text-muted);
}

.ga-tie-out.is-balanced {
    border-color: #bbf7d0;
    color: #166534;
    background: #f0fdf4;
}

.ga-tie-out.is-unbalanced {
    border-color: #fecaca;
    color: #991b1b;
    background: #fef2f2;
}

.ga-comparison-period {
    color: #1e40af;
    background: #eff6ff;
}

/* General accounts reports home — grouped RTL dashboard */
.ga-home-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 22px 24px;
    border: 1px solid var(--ga-line);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 5px 18px rgba(15, 23, 42, .045);
}

.ga-home-header h1 {
    margin: 4px 0 6px;
    color: var(--ga-ink);
    font-size: var(--font-2xl);
    font-weight: 700;
}

.ga-home-header p {
    margin: 0;
    color: var(--ga-muted);
    font-size: var(--font-ui);
    line-height: 1.75;
}

.ga-home-header-icon {
    display: grid;
    width: 58px;
    height: 58px;
    flex: 0 0 auto;
    place-items: center;
    border-radius: 16px;
    color: var(--ga-blue);
    background: color-mix(in srgb, var(--ga-blue) 9%, white);
    font-size: 1.35rem;
}

.ga-home-tools {
    display: grid;
    grid-template-columns: minmax(260px, 1.35fr) auto minmax(165px, .65fr) minmax(190px, .75fr);
    align-items: end;
    gap: 10px;
    padding: 13px;
    border: 1px solid var(--ga-line);
    border-radius: 15px;
    background: #fff;
    box-shadow: 0 3px 14px rgba(15, 23, 42, .035);
}

.ga-home-search {
    display: flex;
    min-width: 0;
    height: 43px;
    align-items: center;
    gap: 9px;
    padding: 0 13px;
    border: 1px solid #d7e0ea;
    border-radius: 10px;
    background: #f9fbfd;
}

.ga-home-search:focus-within {
    border-color: var(--ga-blue);
    background: #fff;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--ga-blue) 10%, transparent);
}

.ga-home-search i { color: #94a3b8; }
.ga-home-search input { width: 100%; min-width: 0; border: 0; outline: 0; color: var(--ga-ink); background: transparent; font-size: var(--font-ui); }

.ga-home-actions { display: flex; gap: 7px; }
.ga-top-action {
    display: inline-flex;
    height: 43px;
    align-items: center;
    gap: 7px;
    padding: 0 12px;
    border: 1px solid var(--ga-line);
    border-radius: 10px;
    color: #475569;
    background: #fff;
    cursor: pointer;
    font-size: var(--font-ui);
    font-weight: 850;
}
.ga-top-action:hover,.ga-top-action[aria-expanded="true"] { border-color: #bfdbfe; color: var(--ga-blue); background: #f4f8ff; }
.ga-top-action:first-child i { color: #f59e0b; }
.ga-top-action b { display: grid; min-width: 20px; height: 20px; place-items: center; border-radius: 999px; color: var(--ga-blue); background: #eaf2ff; font-weight:700;font-size:var(--font-ui); }

.ga-home-select,.ga-home-advanced label { display: flex; min-width: 0; flex-direction: column; gap: 5px; }
.ga-home-select>span,.ga-home-advanced label>span { color: #64748b; font-size: var(--font-ui); font-weight: 700; }
.ga-home-select select,.ga-home-advanced input {
    width: 100%;
    height: 43px;
    padding: 7px 10px;
    border: 1px solid #d7e0ea;
    border-radius: 10px;
    outline: 0;
    color: var(--ga-ink);
    background: #fff;
    font-size: var(--font-ui);
}
.ga-home-select select:focus,.ga-home-advanced input:focus { border-color: var(--ga-blue); box-shadow: 0 0 0 3px color-mix(in srgb, var(--ga-blue) 10%, transparent); }
.ga-home-advanced { display: none; grid-column: 1/-1; grid-template-columns: repeat(2,minmax(170px,1fr)) auto; align-items: end; gap: 10px; padding-top: 12px; border-top: 1px solid #edf1f5; }
.ga-home-advanced.is-open { display: grid; }

.ga-home-personal { padding: 0; }
.ga-home-personal[hidden] { display: none; }

#ga-dashboard>.ga-dashboard {
    padding: 17px;
    border: 1px solid var(--ga-line);
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 4px 16px rgba(15,23,42,.035);
}

.ga-groups-section {
    display: grid;
    gap: 13px;
    padding: 18px;
    border: 1px solid var(--ga-line);
    border-radius: 17px;
    background: #fff;
    box-shadow: 0 5px 18px rgba(15,23,42,.04);
}

.ga-groups-section>header { display: flex; align-items: end; justify-content: space-between; gap: 16px; }
.ga-groups-section>header span { color: var(--ga-blue); font-size: var(--font-xs); font-weight: 700; }
.ga-groups-section>header h2 { margin: 3px 0 0; font-size: var(--font-md); font-weight: 700; }
.ga-groups-section>header small { color: var(--ga-muted); font-size: var(--font-xs); }
.ga-groups-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 13px; }

.ga-group-card {
    --group-color: #2563eb;
    --group-soft: #eff6ff;
    display: flex;
    min-width: 0;
    min-height: 340px;
    flex-direction: column;
    border: 1px solid #e1e7ef;
    border-radius: 15px;
    background: #fff;
    box-shadow: 0 3px 12px rgba(15,23,42,.035);
    overflow: hidden;
    transition: transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}
.ga-group-card:hover { transform: translateY(-2px); border-color: color-mix(in srgb,var(--group-color) 28%,#e1e7ef); box-shadow: 0 12px 27px rgba(15,23,42,.07); }
.ga-group-card.is-violet { --group-color:#7c3aed; --group-soft:#f5f3ff; }
.ga-group-card.is-amber { --group-color:#d97706; --group-soft:#fffbeb; }
.ga-group-card.is-rose { --group-color:#e11d48; --group-soft:#fff1f2; }
.ga-group-card.is-green { --group-color:#059669; --group-soft:#ecfdf5; }
.ga-group-card.is-cyan { --group-color:#0891b2; --group-soft:#ecfeff; }
.ga-group-card[hidden],.ga-group-report[hidden] { display: none; }

.ga-group-head { position: relative; display: grid; grid-template-columns: auto 1fr auto; align-items: start; gap: 11px; padding: 16px 16px 13px; border-bottom: 1px solid #eef2f6; }
.ga-group-head:before { position: absolute; top: 0; right: 0; left: 0; height: 3px; background: var(--group-color); content: ""; }
.ga-group-icon { display: grid; width: 42px; height: 42px; place-items: center; border-radius: 11px; color: var(--group-color); background: var(--group-soft); font-size: .98rem; }
.ga-group-head h2 { margin: 1px 0 4px; color: #1e293b; font-size: var(--font-base); font-weight: 700; }
.ga-group-head p { margin: 0; color: #7a8799; font-size: var(--font-xs); line-height: 1.65; }
.ga-group-head>b { display: grid; min-width: 25px; height: 25px; place-items: center; border-radius: 8px; color: var(--group-color); background: var(--group-soft); font-weight:850;font-size:var(--font-xs); }

.ga-group-reports { display: grid; flex: 1; align-content: start; padding: 6px 14px; }
.ga-group-report { display: flex; min-width: 0; align-items: center; gap: 8px; min-height: 42px; border-bottom: 1px solid #f0f3f7; }
.ga-group-report:before { width: 5px; height: 5px; flex: 0 0 auto; border-radius: 50%; background: color-mix(in srgb,var(--group-color) 60%,white); content: ""; }
.ga-group-report>a:first-of-type { min-width: 0; flex: 1; color: #334155; text-decoration: none; font-size: var(--font-sm); font-weight: 700; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }
.ga-group-report>a:first-of-type:hover { color: var(--group-color); }
.ga-report-view { display: grid; width: 28px; height: 28px; flex: 0 0 auto; place-items: center; border-radius: 8px; color: #8290a3; background: #f6f8fb; text-decoration: none; font-size: var(--font-xs); transition: .16s ease; }
.ga-report-view:hover { color: #fff; background: var(--group-color); }
.ga-group-card:not(.is-expanded):not(.is-searching) .ga-group-report.is-extra { display: none; }
.ga-group-card footer { display: flex; min-height: 46px; align-items: center; padding: 8px 14px; border-top: 1px solid #eef2f6; background: #fbfcfe; }
.ga-group-card footer button { display: flex; width: 100%; align-items: center; justify-content: space-between; border: 0; color: var(--group-color); background: transparent; cursor: pointer; font-size: var(--font-ui); font-weight: 700; }
.ga-group-card footer>span { color: #94a3b8; font-size: var(--font-xs); }
.ga-group-card.is-searching footer { visibility: hidden; }

.ga-no-search-results { min-height: 180px; place-items: center; align-content: center; gap: 6px; color: var(--ga-muted); text-align: center; }
.ga-no-search-results:not([hidden]) { display: grid; }
.ga-no-search-results i { color: #94a3b8; font-size: 1.25rem; }
.ga-no-search-results strong { color: var(--ga-ink); font-size: var(--font-ui); }
.ga-no-search-results span { font-size: var(--font-sm); }

@media(max-width:1180px) {
    .ga-home-tools { grid-template-columns: minmax(240px,1fr) auto minmax(170px,.7fr); }
    .ga-home-select:last-of-type { grid-column: auto; }
    .ga-groups-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}

@media(max-width:820px) {
    .ga-home-tools { grid-template-columns: 1fr 1fr; }
    .ga-home-search { grid-column: 1/-1; }
    .ga-home-actions { justify-content: flex-start; }
    .ga-home-advanced { grid-template-columns: 1fr 1fr; }
    .ga-home-advanced .ga-btn { grid-column: 1/-1; }
}

@media(max-width:620px) {
    .ga-page { gap: 12px; }
    .ga-home-header { align-items: flex-start; padding: 18px; }
    .ga-home-header-icon { width: 48px; height: 48px; }
    .ga-home-tools { grid-template-columns: 1fr; }
    .ga-home-search,.ga-home-select:last-of-type { grid-column: auto; }
    .ga-home-actions { display: grid; grid-template-columns: 1fr 1fr; }
    .ga-top-action { justify-content: center; }
    .ga-home-advanced { grid-template-columns: 1fr; }
    .ga-home-advanced .ga-btn { grid-column: auto; }
    .ga-groups-section { padding: 13px; }
    .ga-groups-section>header { align-items: flex-start; flex-direction: column; gap: 5px; }
    .ga-groups-grid { grid-template-columns: 1fr; }
    .ga-group-card { min-height: 0; }
}

/* Tax Report and VAT Return — scoped layout matching the supplied references */
.ga-tax-page {
    max-width: 1680px;
    --tax-green: #24a866;
    --tax-blue: #2563eb;
    --tax-purple: #8b5cf6;
    --tax-orange: #f28b30;
    --tax-line: #e2e8f0;
    --tax-muted: #74839a;
}

.ga-tax-layout {
    display: grid;
    grid-template-columns: 250px minmax(0,1fr);
    grid-template-areas: "aside main";
    align-items: start;
    gap: 18px;
    direction: ltr;
}

.ga-tax-aside { grid-area: aside; direction: rtl; }
.ga-tax-main { display: grid; grid-area: main; min-width: 0; gap: 13px; direction: rtl; }

.ga-tax-filter-card {
    position: sticky;
    top: 14px;
    display: grid;
    border: 1px solid var(--tax-line);
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 3px 14px rgba(15,23,42,.035);
    overflow: hidden;
}

.ga-tax-filter-card>header {
    display: flex;
    min-height: 56px;
    align-items: center;
    gap: 10px;
    padding: 13px 15px;
    border-bottom: 1px solid var(--tax-line);
    color: #1d2d4b;
}

.ga-tax-filter-card>header i { margin-inline-start: auto; color: var(--tax-blue); }
.ga-tax-filter-card>header strong { font-size: var(--font-base); font-weight: 700; }
.ga-tax-filter-grid { display: grid; }
.ga-tax-filter-grid>.ga-field { gap: 6px; padding: 11px 14px; border-bottom: 1px solid #eef2f6; }
.ga-tax-filter-grid>.ga-field>span { color: #64748b; font-size: var(--font-ui); }
.ga-tax-filter-grid>.ga-field input,
.ga-tax-filter-grid>.ga-field select { height: 37px; border-color: #dce3ec; border-radius: 7px; background: #fff; font-size: var(--font-ui); }
.ga-tax-filter-grid>.ga-field input:focus,
.ga-tax-filter-grid>.ga-field select:focus { border-color: var(--tax-blue); box-shadow: 0 0 0 3px rgba(37,99,235,.09); }

.ga-tax-view-switch {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4px;
    margin: 12px 14px 0;
    padding: 3px;
    border: 1px solid var(--tax-line);
    border-radius: 8px;
    background: #f8fafc;
}

.ga-tax-view-switch label { cursor: pointer; }
.ga-tax-view-switch input { position: absolute; opacity: 0; }
.ga-tax-view-switch span { display: block; padding: 7px; border-radius: 6px; color: #64748b; text-align: center; font-size: var(--font-xs); font-weight: 850; }
.ga-tax-view-switch input:checked+span { color: #fff; background: var(--tax-blue); box-shadow: 0 4px 10px rgba(37,99,235,.2); }

.ga-tax-filter-card>footer { display: grid; gap: 8px; padding: 13px 14px 14px; }
.ga-tax-filter-card>footer .ga-btn { width: 100%; min-height: 39px; border-radius: 7px; }

.ga-tax-header {
    display: flex;
    min-height: 92px;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 4px 2px 8px;
}

.ga-tax-title { display: flex; min-width: 0; align-items: center; gap: 13px; }
.ga-tax-title>span { display: grid; width: 48px; height: 48px; flex: 0 0 auto; place-items: center; border-radius: 10px; color: #fff; background: linear-gradient(145deg,#56c983,var(--tax-green)); box-shadow: 0 8px 18px rgba(36,168,102,.2); font-size: var(--font-lg); }
.ga-tax-title a { color: #718096; text-decoration: none; font-size: var(--font-xs); font-weight: 750; }
.ga-tax-title a i { margin-inline: 4px; font-size: .52rem; }
.ga-tax-title h1 { margin: 6px 0 4px; color: #17233e; font-size: var(--font-2xl); font-weight: 700; }
.ga-tax-title p { max-width: 760px; margin: 0; color: var(--tax-muted); font-size: var(--font-sm); line-height: 1.65; }
.ga-tax-header-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 7px; }
.ga-tax-header-actions .ga-btn { min-height: 36px; padding: 7px 13px; border-radius: 7px; background: #fff; font-size: var(--font-ui); }

.ga-tax-results-tools { display: flex; align-items: center; justify-content: flex-end; gap: 8px; }
.ga-tax-results-tools .ga-search { display: flex; margin-inline-end: auto; background: #fff; }
.ga-tax-results-tools .ga-tool-btn { min-height: 34px; }

.ga-tax-dashboard { display: grid; gap: 13px; }
.ga-tax-metrics { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 12px; }
.ga-tax-metric {
    --metric: var(--tax-blue);
    display: flex;
    min-width: 0;
    min-height: 105px;
    align-items: flex-start;
    gap: 10px;
    padding: 15px;
    border: 1px solid var(--tax-line);
    border-radius: 11px;
    background: linear-gradient(145deg,#fff,#fbfdff);
    box-shadow: 0 3px 10px rgba(15,23,42,.025);
}
.ga-tax-metric.is-green,.ga-tax-metric.is-credit,.ga-tax-metric.is-clear { --metric: var(--tax-green); }
.ga-tax-metric.is-blue { --metric: var(--tax-blue); }
.ga-tax-metric.is-purple { --metric: var(--tax-purple); }
.ga-tax-metric.is-orange,.ga-tax-metric.is-due { --metric: var(--tax-orange); }
.ga-tax-metric-icon { display: grid; width: 34px; height: 34px; flex: 0 0 auto; place-items: center; border-radius: 8px; color: #fff; background: var(--metric); box-shadow: 0 6px 13px color-mix(in srgb,var(--metric) 22%,transparent); font-size: .78rem; }
.ga-tax-metric>div { display: flex; min-width: 0; flex: 1; flex-direction: column; }
.ga-tax-metric small { min-height: 28px; color: #6c7a90; font-size: var(--font-xs); line-height: 1.45; }
.ga-tax-metric strong { margin-top: 4px; color: #213251; font-weight:850;font-size:var(--font-2xl); white-space: normal; }
.ga-tax-metric:first-child strong,.ga-tax-metric.is-due strong,.ga-tax-metric.is-credit strong { color: var(--metric); }
.ga-tax-metric em { margin-top: 3px; color: var(--tax-muted); font-size: var(--font-xs); font-style: normal; }

.ga-tax-content-card,.ga-vat-section,.ga-vat-position {
    border: 1px solid var(--tax-line);
    border-radius: 11px;
    background: #fff;
    box-shadow: 0 3px 12px rgba(15,23,42,.025);
    overflow: hidden;
}
.ga-tax-tabs { display: flex; padding: 0 14px; border-bottom: 1px solid var(--tax-line); overflow-x: auto; }
.ga-tax-tabs button { min-width: max-content; padding: 13px 18px 11px; border: 0; border-bottom: 2px solid transparent; color: #53637d; background: transparent; cursor: pointer; font-size: var(--font-ui); font-weight: 850; }
.ga-tax-tabs button:hover { color: var(--tax-blue); }
.ga-tax-tabs button.active { border-bottom-color: var(--tax-blue); color: var(--tax-blue); }
.ga-tax-table-title { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 11px 14px; border-bottom: 1px solid #edf1f5; }
.ga-tax-table-title>div { display: flex; align-items: center; gap: 7px; color: #233655; font-size: var(--font-sm); }
.ga-tax-table-title>div i { color: var(--tax-blue); }
.ga-tax-table-title small { color: var(--tax-muted); font-size: var(--font-xs); }
.ga-tax-table-wrap { overflow: auto; }
.ga-tax-table { width: 100%; min-width: 880px; border-collapse: collapse; }
.ga-tax-table th { padding: 0; background: #f8fafc; white-space: nowrap; }
.ga-tax-table th button { display: flex; width: 100%; align-items: center; justify-content: space-between; gap: 6px; padding: 10px 11px; border: 0; color: #40516d; background: transparent; font-size: var(--font-ui); font-weight: 700; }
.ga-tax-table th button i { color: #a3afc0; font-size: var(--font-ui); }
.ga-tax-table td { padding: 10px 11px; border-top: 1px solid #edf1f5; color: #34455f; font-size: var(--font-ui); }
.ga-tax-table tbody tr:hover { background: #fbfdff; }
.ga-tax-table .is-number,.ga-vat-section .is-number { direction: ltr; text-align: right; font-weight: 700; white-space: nowrap; }
.ga-tax-table .is-negative,.ga-vat-section .is-negative { color: #e5484d; }
.ga-tax-table tfoot td { color: #153b88; background: #eef4ff; border-top: 1px solid #dbe7ff; font-weight: 700; }
.ga-tax-table .ga-row-action a { color: #53637d; border: 1px solid #dbe3ed; background: #fff; }
.ga-tax-content-card>.ga-pagination { border-top: 1px solid var(--tax-line); }

.ga-tax-summary-panel { display: grid; grid-template-columns: 210px 1fr; align-items: stretch; gap: 0; margin: 14px; border: 1px solid #dfe7f2; border-radius: 10px; background: #fbfdff; overflow: hidden; }
.ga-tax-summary-panel>header { display: flex; align-items: center; gap: 10px; padding: 18px; background: #f5f8fd; }
.ga-tax-summary-panel>header>span { display: grid; width: 36px; height: 36px; place-items: center; border-radius: 9px; color: #fff; background: var(--tax-blue); }
.ga-tax-summary-panel>header small,.ga-tax-equation small { color: var(--tax-muted); font-size: var(--font-xs); }
.ga-tax-summary-panel h3 { margin: 3px 0 0; color: #1d3152; font-size: var(--font-ui); }
.ga-tax-equation { display: flex; align-items: center; justify-content: space-around; gap: 13px; padding: 17px; direction: rtl; }
.ga-tax-equation>div { display: flex; flex-direction: column; gap: 5px; text-align: center; }
.ga-tax-equation strong { color: #243b66; font-weight:850;font-size:var(--font-base); }
.ga-tax-equation b { color: #1c3764; font-size: var(--font-md); }
.ga-tax-equation .is-net strong { color: var(--tax-green); }

.ga-tax-reconciliation { display: flex; align-items: center; gap: 9px; padding: 10px 13px; border: 1px solid #cddcff; border-radius: 9px; color: #3159aa; background: #f1f5ff; font-size: var(--font-xs); }
.ga-tax-reconciliation>span { display: flex; min-width: 0; flex-direction: column; gap: 2px; }
.ga-tax-reconciliation small { color: #5871a7; font-size: var(--font-xs); line-height: 1.5; }
.ga-tax-reconciliation.is-balanced { border-color: #bdebd0; color: #18774a; background: #f0fbf5; }
.ga-tax-reconciliation.is-balanced small { color: #4d8467; }

.ga-vat-metrics { grid-template-columns: repeat(4,minmax(0,1fr)); }
.ga-vat-section>header { padding: 10px 14px; border-bottom: 1px solid var(--tax-line); background: #fbfcfe; }
.ga-vat-section h3,.ga-vat-position h3 { margin: 0; color: #192c4b; font-size: var(--font-sm); font-weight: 700; }
.ga-vat-table-wrap { overflow: auto; }
.ga-vat-section table { width: 100%; min-width: 650px; border-collapse: collapse; }
.ga-vat-section th,.ga-vat-section td { padding: 8px 12px; border-top: 1px solid #edf1f5; color: #34455f; font-size: var(--font-ui); }
.ga-vat-section th { color: #344660; background: #f8fafc; font-weight: 700; text-align: right; }
.ga-vat-section tr.is-total td { color: #087a4c; background: #effaf4; font-weight: 700; }
.ga-vat-position>h3 { padding: 11px 14px; border-bottom: 1px solid var(--tax-line); }
.ga-vat-position-equation { display: flex; align-items: stretch; gap: 0; margin: 12px; border: 1px solid #e1e8f2; border-radius: 9px; overflow: hidden; }
.ga-vat-position-equation>div:not(.ga-vat-position-status) { display: flex; min-width: 0; flex: 1; align-items: center; justify-content: center; flex-direction: column; gap: 4px; padding: 16px 10px; }
.ga-vat-position-equation>b { display: grid; width: 38px; place-items: center; color: #263e68; font-size: var(--font-lg); }
.ga-vat-position-equation small { color: var(--tax-muted); font-size: var(--font-xs); }
.ga-vat-position-equation strong { color: #223a65; font-weight:700;font-size:var(--font-md); }
.ga-vat-position-equation em { color: var(--tax-muted); font-size: var(--font-xs); font-style: normal; }
.ga-vat-position-status { display: flex; min-width: 175px; align-items: center; justify-content: center; flex-direction: column; gap: 4px; padding: 14px; color: #d96b19; background: #fff7ed; }
.ga-vat-position-status>i { font-size: 1rem; }
.ga-vat-position-status.is-credit,.ga-vat-position-status.is-clear { color: #138354; background: #effbf5; }
.ga-vat-position-status strong { color: currentColor; font-size: var(--font-sm); }

@media(max-width:1200px) {
    .ga-tax-metrics { grid-template-columns: repeat(3,minmax(0,1fr)); }
    .ga-vat-metrics { grid-template-columns: repeat(2,minmax(0,1fr)); }
}

@media(max-width:900px) {
    .ga-tax-layout { grid-template-columns: 1fr; grid-template-areas: "aside" "main"; }
    .ga-tax-aside { grid-area: aside; }
    .ga-tax-main { grid-area: main; }
    .ga-tax-filter-card { position: static; }
    .ga-tax-filter-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .ga-tax-filter-grid>.ga-field { border-inline-start: 1px solid #eef2f6; }
    .ga-tax-filter-card>footer { grid-template-columns: 1fr 1fr; }
    .ga-tax-header { align-items: flex-start; flex-direction: column; }
    .ga-tax-header-actions { width: 100%; }
    .ga-tax-header-actions .ga-btn { flex: 1; }
    .ga-vat-position-equation { flex-wrap: wrap; }
    .ga-vat-position-status { width: 100%; }
}

@media(max-width:620px) {
    .ga-tax-filter-grid,.ga-tax-metrics,.ga-vat-metrics { grid-template-columns: 1fr; }
    .ga-tax-filter-card>footer { grid-template-columns: 1fr; }
    .ga-tax-title { align-items: flex-start; }
    .ga-tax-title>span { width: 42px; height: 42px; }
    .ga-tax-title h1 { font-size: var(--font-lg); }
    .ga-tax-header-actions { display: grid; grid-template-columns: 1fr 1fr; }
    .ga-tax-summary-panel { grid-template-columns: 1fr; }
    .ga-tax-equation { flex-wrap: wrap; }
    .ga-vat-position-equation>div:not(.ga-vat-position-status) { min-width: calc(50% - 38px); }
}

@media print {
    .ga-tax-layout { display: block; }
    .ga-tax-aside,.ga-tax-results-tools,.ga-tax-header-actions,.ga-tax-tabs,.ga-tax-content-card>.ga-pagination { display: none!important; }
    .ga-tax-header { display: flex!important; min-height: 0; padding: 8px 0 14px; border-bottom: 1px solid #cbd5e1; }
    .ga-tax-metrics { grid-template-columns: repeat(5,1fr); }
    .ga-vat-metrics { grid-template-columns: repeat(4,1fr); }
    .ga-tax-metric { min-height: 0; padding: 9px; box-shadow: none; }
    .ga-tax-table,.ga-vat-section table { min-width: 0; }
}

/* income-statement.css */
.income-statement-page{--is-ink:#18212f;--is-muted:#667085;--is-line:#e7eaf0;--is-soft:#f7f8fb;color:var(--is-ink);padding-bottom:32px}.is-page-header{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:20px}.is-page-header h1{font-size:var(--font-2xl);font-weight:700;margin:.25rem 0}.is-page-header p{color:var(--is-muted);margin:0}.is-eyebrow{font-size:var(--font-xs);color:#7557d3;font-weight:700;letter-spacing:.04em}.is-actions{display:flex;flex-wrap:wrap;gap:8px}.is-actions .btn{display:inline-flex;align-items:center;gap:7px}.is-filter-card,.is-table-card,.is-unclassified,.is-structure-card{background:#fff;border:1px solid var(--is-line);border-radius:16px;box-shadow:0 7px 25px rgba(15,23,42,.045)}.is-filter-card{padding:18px;margin-bottom:20px}.is-filter-grid{display:grid;grid-template-columns:repeat(6,minmax(140px,1fr));gap:12px}.is-filter-grid label{font-size:var(--font-sm);font-weight:700;color:var(--is-muted)}.is-filter-grid :is(input,select){margin-top:6px}.is-filter-footer{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-top:16px;padding-top:15px;border-top:1px solid var(--is-line)}.is-switches{display:flex;flex-wrap:wrap;gap:18px}.is-switches label{font-size:var(--font-sm);color:var(--is-muted);display:flex;gap:7px;align-items:center}.is-report-meta{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:15px 18px;border-radius:14px;background:linear-gradient(135deg,#211b44,#5a3ca2);color:#fff;margin-bottom:16px}.is-report-meta>div{display:flex;gap:13px;flex-wrap:wrap}.is-report-meta>div:first-child{flex-direction:column;gap:2px}.is-report-meta span{font-size:var(--font-xs);opacity:.85}.is-kpi-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:16px}.is-kpi{background:#fff;border:1px solid var(--is-line);border-radius:14px;padding:16px;display:flex;align-items:center;gap:13px}.is-kpi>span{width:42px;height:42px;border-radius:12px;display:grid;place-items:center}.is-kpi div{display:flex;flex-direction:column;gap:4px;min-width:0}.is-kpi small{color:var(--is-muted)}.is-kpi strong{font-size:var(--font-2xl);white-space:nowrap}.is-tone-green>span{background:#e7f8ef;color:#128557}.is-tone-orange>span{background:#fff1dc;color:#bd6a0e}.is-tone-blue>span{background:#e7f1ff;color:#2763be}.is-tone-purple>span{background:#eee9ff;color:#6f4bc6}.is-tone-red>span{background:#ffebeb;color:#c23d43}.is-warning-panel{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:14px 16px;background:#fff8e5;border:1px solid #f2d58a;border-radius:14px;margin-bottom:16px}.is-warning-panel>div{display:grid;grid-template-columns:auto auto;gap:3px 8px}.is-warning-panel i{grid-row:1/3;color:#b87800;font-size:1.3rem}.is-warning-panel span{grid-column:2;color:#7c621d;font-size:var(--font-ui)}.is-unclassified{padding:16px;margin-bottom:16px;border-color:#f1ce76}.is-unclassified h3{font-size:var(--font-md);margin-bottom:12px}.is-report-table{margin:0}.is-report-table thead th{background:#f7f8fb;color:#606a78;font-size:var(--font-ui);padding:13px;white-space:nowrap}.is-report-table td,.is-report-table tbody th,.is-report-table tfoot th{padding:11px 13px;vertical-align:middle}.is-report-table .is-section-row th{background:#f2f0f9;color:#32265c;font-weight:700;border-top:7px solid #fff}.is-number{text-align:left!important;font-variant-numeric:tabular-nums;direction:ltr;white-space:nowrap}.is-account-row td:first-child,.is-structure-card tbody td:first-child{padding-right:calc(13px + var(--is-level,0)*25px)}.is-account-name{border:0;background:none;color:inherit;text-align:right;padding:0;font-weight:500}.is-account-name.is-clickable{color:#573bb1;text-decoration:underline;text-decoration-style:dotted;cursor:pointer}.is-account-name:disabled{opacity:1}.is-report-table code,.is-structure-card code{color:#7c8490;margin-left:8px;font-size:var(--font-ui)}.is-tree-toggle{border:0;background:none;color:#7a8290;padding:2px 0 2px 8px}.is-tree-toggle i{transition:transform .18s}.is-tree-toggle.is-collapsed i{transform:rotate(90deg)}.is-tree-space{display:inline-block;width:18px}.is-group-row{font-weight:700;background:#fbfbfd}.is-positive{color:#13875c!important}.is-negative{color:#c33e4a!important}.is-report-table tfoot th{background:#211b44;color:#fff;font-size:var(--font-md)}.is-margin-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:12px}.is-margin-grid span{display:flex;justify-content:space-between;gap:10px;background:#fff;border:1px solid var(--is-line);border-radius:12px;padding:12px;color:var(--is-muted)}.is-margin-grid strong{color:var(--is-ink)}.is-state{padding:55px 24px;text-align:center;background:#fff;border:1px dashed #d8dde6;border-radius:16px}.is-state i{font-size:2rem;color:#8791a1}.is-state h3{font-size:var(--font-2xl);margin:13px 0 6px}.is-state p{color:var(--is-muted)}.is-state-error{border-color:#f0b9bd;background:#fffafa}.is-state-error i{color:#ce4651}.is-loading-card{padding:30px;background:#fff;border:1px solid var(--is-line);border-radius:16px}.is-skeleton{display:block;height:16px;border-radius:8px;background:linear-gradient(90deg,#eef0f4,#f8f9fb,#eef0f4);background-size:200% 100%;animation:is-shimmer 1.2s infinite;margin:13px 0}.is-skeleton-title{width:38%;height:25px}@keyframes is-shimmer{to{background-position:-200% 0}}.is-drawer-backdrop{position:fixed;inset:0;background:rgba(15,23,42,.34);z-index:1080}.is-drawer{position:fixed;top:0;bottom:0;left:0;width:min(860px,92vw);background:#fff;z-index:1081;padding:24px;overflow:auto;box-shadow:18px 0 50px rgba(15,23,42,.25)}.is-drawer-close{position:absolute;left:18px;top:14px;border:0;background:#f1f3f6;width:36px;height:36px;border-radius:50%;font-size:var(--font-xl)}.is-drawer-title{padding-bottom:17px;margin-bottom:15px;border-bottom:1px solid var(--is-line)}.is-drawer-title small,.is-drawer-title span{color:var(--is-muted)}.is-drawer-title h2{font-size:var(--font-lg);margin:4px 0}.is-drawer td small{display:block;color:var(--is-muted)}.is-pagination{display:flex;justify-content:center;align-items:center;gap:15px;margin-top:15px}.is-pagination button{border:1px solid var(--is-line);background:#fff;border-radius:8px;padding:6px 14px}.is-report-tabs{display:flex;gap:8px;border-bottom:1px solid var(--is-line);margin-bottom:16px}.is-report-tabs button{border:0;background:none;padding:12px 16px;color:var(--is-muted)}.is-report-tabs button.active{color:#5a3ca2;border-bottom:2px solid #5a3ca2;font-weight:700}.is-structure-note{display:flex;gap:10px;padding:13px 15px;border-radius:12px;background:#edf5ff;color:#285d9b;margin-bottom:16px}.is-structure-card{overflow:hidden}.is-structure-card table{margin:0}.is-structure-card thead th{background:#f7f8fb;color:var(--is-muted);font-size:var(--font-ui);padding:13px}.is-structure-card td{vertical-align:middle}.is-structure-card td:first-child strong{margin-left:7px}.is-structure-card td:first-child small{display:inline-block;background:#f0f2f5;color:#697282;border-radius:12px;padding:2px 7px;font-size:var(--font-xs)}.is-map-order{width:90px}.is-map-section{min-width:210px}
.is-report-table .is-result-row th{background:#eef7f4;color:#185f4c;font-weight:700;border-top:1px solid #cde5dd;border-bottom:1px solid #cde5dd}
@media(max-width:1200px){.is-filter-grid{grid-template-columns:repeat(3,1fr)}.is-kpi-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:760px){.is-page-header,.is-filter-footer,.is-report-meta,.is-warning-panel{align-items:stretch;flex-direction:column}.is-filter-grid{grid-template-columns:1fr 1fr}.is-kpi-grid,.is-margin-grid{grid-template-columns:1fr}.is-actions .btn{flex:1}.is-report-meta>div{flex-direction:column}.income-statement-page{font-size:var(--font-base)}}@media(max-width:480px){.is-filter-grid{grid-template-columns:1fr}}
@media print{.is-filter-card,.is-actions,.is-tree-toggle,.is-drawer{display:none!important}.is-table-card{box-shadow:none}}

/* Income Statement report — scoped reference layout; structure settings stay unchanged. */
.is-income-report-page{--is-blue:#2563eb;--is-green:#18a663;--is-red:#dc4c59;--is-orange:#f28b30;--is-ink:#1b2a44;--is-muted:#74839a;--is-line:#e1e7ef;max-width:1680px;margin:0 auto;padding-bottom:26px;color:var(--is-ink);}
.is-income-report-page .is-report-layout{display:grid;grid-template-columns:225px minmax(0,1fr);grid-template-areas:"filters report";align-items:start;gap:14px;direction:ltr}
.is-income-report-page .is-report-sidebar{grid-area:filters;direction:rtl}
.is-income-report-page .is-report-main{display:grid;grid-area:report;min-width:0;gap:13px;direction:rtl}
.is-income-report-page .is-filter-card{position:sticky;top:14px;margin:0;padding:0;border:1px solid var(--is-line);border-radius:12px;box-shadow:0 3px 14px rgba(15,23,42,.035);overflow:hidden}
.is-income-report-page .is-filter-card>header{display:flex;min-height:56px;align-items:center;gap:10px;padding:13px 15px;border-bottom:1px solid var(--is-line);color:#1d2d4b}
.is-income-report-page .is-filter-card>header i{margin-inline-start:auto;color:var(--is-blue)}
.is-income-report-page .is-filter-card>header strong{font-size:var(--font-base);font-weight:700}
.is-income-report-page .is-filter-grid{display:grid;grid-template-columns:1fr;gap:0}
.is-income-report-page .is-filter-grid label{display:flex;flex-direction:column;gap:6px;padding:11px 14px;border-bottom:1px solid #eef2f6;color:#64748b;font-size:var(--font-sm);font-weight:700}
.is-income-report-page .is-filter-grid :is(input,select){height:38px;margin:0;border:1px solid #dce3ec;border-radius:7px;color:#253653;background:#fff;font-size:var(--font-ui);box-shadow:none}
.is-income-report-page .is-filter-grid :is(input,select):focus{border-color:var(--is-blue);box-shadow:0 0 0 3px rgba(37,99,235,.09)}
.is-income-report-page .is-detail-switch{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:13px 14px;border-bottom:1px solid #eef2f6;cursor:pointer}
.is-income-report-page .is-detail-switch>span{display:flex;flex-direction:column;gap:2px}
.is-income-report-page .is-detail-switch strong{color:#34445e;font-size:var(--font-sm)}
.is-income-report-page .is-detail-switch small{color:#8995a6;font-size:var(--font-xs)}
.is-income-report-page .is-detail-switch input{position:absolute;opacity:0}
.is-income-report-page .is-detail-switch>i{position:relative;width:35px;height:20px;flex:0 0 auto;border-radius:999px;background:#cbd5e1;transition:.18s}
.is-income-report-page .is-detail-switch>i:after{position:absolute;top:3px;right:3px;width:14px;height:14px;border-radius:50%;background:#fff;box-shadow:0 1px 4px rgba(15,23,42,.2);content:"";transition:.18s}
.is-income-report-page .is-detail-switch input:checked+i{background:var(--is-blue)}
.is-income-report-page .is-detail-switch input:checked+i:after{right:18px}
.is-income-report-page .is-detail-switch input:disabled+i{opacity:.45}
.is-income-report-page .is-filter-card>footer{display:grid;gap:8px;padding:13px 14px}
.is-income-report-page .is-filter-card>footer .btn{display:inline-flex;width:100%;min-height:39px;align-items:center;justify-content:center;gap:7px;border-radius:7px;font-size:var(--font-ui);font-weight:850}
.is-income-report-page .is-filter-info{display:flex;gap:9px;margin:0 13px 13px;padding:11px;border:1px solid #cfe0ff;border-radius:8px;color:#3760a8;background:#f3f7ff}
.is-income-report-page .is-filter-info>i{margin-top:2px;color:var(--is-blue)}
.is-income-report-page .is-filter-info>div{display:flex;min-width:0;flex-direction:column;gap:3px}
.is-income-report-page .is-filter-info strong{font-size:var(--font-xs)}
.is-income-report-page .is-filter-info span{position:relative;padding-right:8px;color:#657ba5;font-size:var(--font-xs);line-height:1.45}
.is-income-report-page .is-filter-info span:before{position:absolute;top:.48em;right:0;width:3px;height:3px;border-radius:50%;background:#8ba5d4;content:""}

.is-income-report-page .is-page-header{display:flex;min-height:94px;align-items:stretch;flex-direction:column;justify-content:center;gap:9px;margin:0;padding:3px 2px 8px}
.is-income-report-page .is-title-wrap{display:flex;width:100%;min-width:0;align-items:center;gap:13px}
.is-income-report-page .is-title-icon{display:grid;width:48px;height:48px;flex:0 0 auto;place-items:center;border-radius:10px;color:#fff;background:linear-gradient(145deg,#53c883,var(--is-green));box-shadow:0 8px 18px rgba(24,166,99,.2);font-size:1.08rem}
.is-income-report-page .is-title-wrap nav{color:#718096;font-size:var(--font-xs);font-weight:750}
.is-income-report-page .is-title-wrap nav i{margin:0 5px;font-size:.5rem}
.is-income-report-page .is-page-header h1{margin:6px 0 4px;color:#17233e;font-size:var(--font-2xl);font-weight:700}
.is-income-report-page .is-page-header p{max-width:700px;margin:0;color:var(--is-muted);font-size:var(--font-xs);line-height:1.65}
.is-income-report-page .is-actions{display:flex;width:100%;flex-wrap:wrap;justify-content:flex-start;gap:7px}
.is-income-report-page .is-actions .btn{min-height:36px;padding:7px 13px;border-radius:7px;font-size:var(--font-ui);font-weight:850;white-space:nowrap}
.is-income-report-page .is-export-wrap{position:relative}
.is-income-report-page .is-export-menu{position:absolute;top:calc(100% + 5px);left:0;z-index:20;min-width:125px;padding:5px;border:1px solid var(--is-line);border-radius:8px;background:#fff;box-shadow:0 12px 25px rgba(15,23,42,.14)}
.is-income-report-page .is-export-menu[hidden]{display:none}
.is-income-report-page .is-export-menu button{display:flex;width:100%;align-items:center;gap:7px;padding:8px;border:0;border-radius:6px;color:#34445e;background:transparent;text-align:right;font-size:var(--font-ui)}
.is-income-report-page .is-export-menu button:hover{color:var(--is-blue);background:#f3f7ff}

.is-income-report-page #is-report{display:grid;gap:13px}
.is-income-report-page .is-kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:0}
.is-income-report-page .is-kpi{--kpi:var(--is-blue);display:flex;min-width:0;min-height:86px;align-items:flex-start;gap:10px;padding:12px;border:1px solid var(--is-line);border-radius:9px;background:#fff;box-shadow:0 2px 8px rgba(15,23,42,.025)}
.is-income-report-page .is-kpi.is-tone-green{--kpi:var(--is-green)}
.is-income-report-page .is-kpi.is-tone-red{--kpi:var(--is-red)}
.is-income-report-page .is-kpi.is-tone-orange{--kpi:var(--is-orange)}
.is-income-report-page .is-kpi.is-tone-neutral{--kpi:#64748b}
.is-income-report-page .is-kpi.is-tone-blue{--kpi:var(--is-blue)}
.is-income-report-page .is-kpi>span{display:grid;width:35px;height:35px;flex:0 0 auto;place-items:center;border-radius:8px;color:#fff;background:var(--kpi);box-shadow:0 6px 13px color-mix(in srgb,var(--kpi) 22%,transparent);font-size:var(--font-ui)}
.is-income-report-page .is-kpi>div{display:flex;min-width:0;flex:1;flex-direction:column;gap:2px}
.is-income-report-page .is-kpi small{min-height:27px;color:#6c7a90;font-size:var(--font-xs);line-height:1.45}
.is-income-report-page .is-kpi strong{margin-top:3px;color:#213251;font-weight:850;font-size:var(--font-2xl);white-space:normal}
.is-income-report-page .is-kpi.is-tone-green strong{color:var(--is-green)}
.is-income-report-page .is-kpi.is-tone-red strong{color:var(--is-red)}
.is-income-report-page .is-kpi-expense strong,.is-income-report-page .is-kpi-cost strong{color:var(--is-red)}
.is-income-report-page .is-kpi-revenue strong{color:#213251}
.is-income-report-page .is-kpi em{color:var(--is-muted);font-size:var(--font-xs);font-style:normal}

.is-income-report-page .is-warning-panel{margin:0;padding:11px 13px;border-color:#f4d38b;border-radius:9px;box-shadow:none}
.is-income-report-page .is-warning-panel strong{font-size:var(--font-sm)}
.is-income-report-page .is-warning-panel span{font-size:var(--font-xs)}
.is-income-report-page .is-unclassified{margin:0;padding:12px;border-radius:9px;box-shadow:none}
.is-income-report-page .is-unclassified h3{margin:0 0 8px;font-size:var(--font-sm)}

.is-income-report-page .is-table-card{border:1px solid var(--is-line);border-radius:11px;background:#fff;box-shadow:0 3px 12px rgba(15,23,42,.025);overflow:hidden}
.is-income-report-page .is-table-card>header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 14px;border-bottom:1px solid var(--is-line);background:#fff}
.is-income-report-page .is-table-card>header>div{display:flex;flex-direction:column;gap:2px}
.is-income-report-page .is-table-card>header strong{color:#203452;font-size:var(--font-sm)}
.is-income-report-page .is-table-card>header span,.is-income-report-page .is-table-card>header small{color:var(--is-muted);font-size:var(--font-xs)}
.is-income-report-page .is-report-table{width:100%;min-width:540px;margin:0;border-collapse:collapse;table-layout:fixed}
.is-income-report-page .is-report-table thead th:first-child{width:52%}
.is-income-report-page .is-report-table thead th:nth-child(2),.is-income-report-page .is-report-table thead th:nth-child(3){width:24%}
.is-income-report-page .is-report-table thead th{padding:11px 13px;border-bottom:1px solid #102d5a;color:#fff;background:#183b73;font-size:var(--font-ui);font-weight:700;text-align:right}
.is-income-report-page .is-report-table thead th:not(:first-child){text-align:left}
.is-income-report-page .is-report-table .is-number,.is-income-report-page .is-report-table thead th:not(:first-child){text-align:center!important}
.is-income-report-page .is-report-table td,.is-income-report-page .is-report-table tbody th,.is-income-report-page .is-report-table tfoot th{height:35px;padding:7px 13px;border-top:1px solid #edf1f5;color:#34455f;font-size:var(--font-ui);vertical-align:middle}
.is-income-report-page .is-report-table .is-section-row th{height:36px;border-top:1px solid #dce8e2;color:#183356;background:#edf8f1;font-weight:700}
.is-income-report-page .is-section-body[data-section="cost_of_sales"] .is-section-row th,.is-income-report-page .is-section-body[data-section="operating_expense"] .is-section-row th,.is-income-report-page .is-section-body[data-section="other_expense"] .is-section-row th{border-color:#f2d9dc;background:#fff4f5}
.is-income-report-page .is-section-row th:first-child{display:flex;align-items:center;gap:7px}
.is-income-report-page .is-section-toggle{display:grid;width:24px;height:24px;place-items:center;border:0;border-radius:6px;color:var(--is-blue);background:#e9f1ff;font-size:var(--font-xs)}
.is-income-report-page .is-section-toggle i{transition:.18s}
.is-income-report-page .is-section-toggle.is-collapsed i{transform:rotate(90deg)}
.is-income-report-page .is-section-space{display:inline-block;width:24px}
.is-income-report-page .is-section-body.is-collapsed .is-account-row{display:none}
.is-income-report-page .is-account-row td:first-child{padding-right:calc(13px + var(--is-level,0)*22px)}
.is-income-report-page .is-account-name{color:#34455f;font-size:var(--font-xs);text-decoration:none}
.is-income-report-page .is-account-name.is-clickable{color:#274e91;text-decoration:underline;text-decoration-style:dotted;text-underline-offset:3px}
.is-income-report-page .is-tree-toggle{color:#71839e}
.is-income-report-page .is-group-row{background:#fbfcfe;font-weight:750}
.is-income-report-page .is-section-total th{color:#1e4c3b;background:#eef8f3;font-weight:700}
.is-income-report-page .is-section-body[data-section="cost_of_sales"] .is-section-total th,.is-income-report-page .is-section-body[data-section="operating_expense"] .is-section-total th,.is-income-report-page .is-section-body[data-section="other_expense"] .is-section-total th{color:#8b3f45;background:#fff3f4}
.is-income-report-page .is-report-table .is-result-row th{height:44px;border-top:1px solid #bfe4d2;border-bottom:1px solid #bfe4d2;color:#126b47;background:#eaf8f1;font-size:var(--font-ui);font-weight:700}
.is-income-report-page .is-report-table .is-result-red th{color:#a4323c;background:#fff0f1;border-color:#f2c9cd}
.is-income-report-page .is-report-table tfoot th{height:42px;color:#147149;background:#eaf8f0;border-top:1px solid #c4e7d3;font-size:var(--font-ui);font-weight:700}
.is-income-report-page .is-report-table tfoot.is-final-loss th{color:#b23743;background:#fff0f1;border-color:#f0c8cc}

.is-income-report-page .is-report-footer{display:grid;gap:9px;padding:12px 14px;border:1px solid var(--is-line);border-radius:10px;color:#65758e;background:#fff;font-size:var(--font-xs)}
.is-income-report-page .is-report-footer>div{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.is-income-report-page .is-report-footer span{display:inline-flex;align-items:center;gap:5px}
.is-income-report-page .is-report-footer i{color:var(--is-blue)}
.is-income-report-page .is-report-footer strong{color:#3d5f96;font-size:var(--font-xs)}

@media(max-width:1180px){.is-income-report-page .is-kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:900px){.is-income-report-page .is-report-layout{grid-template-columns:1fr;grid-template-areas:"filters" "report"}.is-income-report-page .is-filter-card{position:static}.is-income-report-page .is-filter-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.is-income-report-page .is-filter-grid label{border-inline-start:1px solid #eef2f6}.is-income-report-page .is-filter-card>footer{grid-template-columns:1fr 1fr}.is-income-report-page .is-page-header{align-items:flex-start;flex-direction:column}.is-income-report-page .is-actions{width:100%}.is-income-report-page .is-actions>.btn,.is-income-report-page .is-export-wrap{flex:1}.is-income-report-page .is-export-wrap>.btn{width:100%}}
@media(max-width:620px){.is-income-report-page .is-filter-grid,.is-income-report-page .is-kpi-grid{grid-template-columns:1fr}.is-income-report-page .is-filter-card>footer{grid-template-columns:1fr}.is-income-report-page .is-title-wrap{align-items:flex-start}.is-income-report-page .is-title-icon{width:42px;height:42px}.is-income-report-page .is-page-header h1{font-size:var(--font-lg)}.is-income-report-page .is-actions{display:grid;grid-template-columns:1fr 1fr}.is-income-report-page .is-actions>#is-header-apply{grid-column:1/-1}.is-income-report-page .is-report-footer>div{align-items:flex-start;flex-direction:column}}
@media print{.is-income-report-page .is-report-layout{display:block}.is-income-report-page .is-report-sidebar,.is-income-report-page .is-actions,.is-income-report-page .is-warning-panel a,.is-income-report-page .is-tree-toggle,.is-income-report-page .is-section-toggle,.is-income-report-page .is-drawer{display:none!important}.is-income-report-page .is-page-header{display:flex!important;min-height:0;padding:8px 0 14px;border-bottom:1px solid #cbd5e1}.is-income-report-page .is-kpi-grid{grid-template-columns:repeat(4,1fr)}.is-income-report-page .is-kpi{min-height:0;padding:9px;box-shadow:none}.is-income-report-page .is-report-table{min-width:0}.is-income-report-page .is-table-card{border:0;box-shadow:none}}

/* 2026-09-20 upgrade: readable financial-statement typography (title 26px, sections 18px, table 15.5px,
   results 17px, KPI values 24px), comparison columns, hierarchy emphasis, drill-down drawer navigation. */
.is-income-report-page{--is-fs-title:26px;--is-fs-section:18px;--is-fs-table:15.5px;--is-fs-total:17px;--is-fs-kpi:24px;--is-fs-label:14.5px;--is-fs-button:15.5px}
.is-income-report-page .is-page-header h1{font-size:var(--is-fs-title)}
.is-income-report-page .is-page-header p{font-size:var(--is-fs-label)}
.is-income-report-page .is-title-wrap nav{font-size:13.5px}
.is-income-report-page .is-filter-card>header strong{font-size:var(--is-fs-section)}
.is-income-report-page .is-filter-grid label{font-size:var(--is-fs-label)}
.is-income-report-page .is-filter-grid :is(input,select){height:42px;font-size:var(--is-fs-label)}
.is-income-report-page .is-detail-switch strong{font-size:var(--is-fs-label)}
.is-income-report-page .is-detail-switch small,.is-income-report-page .is-filter-info span{font-size:13px}
.is-income-report-page .is-filter-card>footer .btn,.is-income-report-page .is-actions .btn{min-height:42px;font-size:var(--is-fs-button);font-weight:800}
.is-income-report-page .is-compare{display:grid;gap:6px;margin:0;padding:12px 14px;border:0;border-bottom:1px solid #eef2f6}
.is-income-report-page .is-compare legend{float:none;width:auto;margin:0 0 4px;padding:0;color:#64748b;font-size:var(--is-fs-label);font-weight:700}
.is-income-report-page .is-compare label{display:flex;align-items:center;gap:9px;margin:0;padding:8px 10px;border:1px solid #e4e9f1;border-radius:8px;color:#34445e;font-size:var(--is-fs-label);cursor:pointer}
.is-income-report-page .is-compare label:has(input:checked){border-color:var(--is-blue);background:#f3f7ff;color:#1d4ed8;font-weight:700}
.is-income-report-page .is-compare input{width:16px;height:16px;margin:0;accent-color:var(--is-blue)}
.is-income-report-page .is-state{display:grid;gap:10px;justify-items:center;padding:56px 24px;border:1px dashed #cfd8e6;border-radius:12px;background:#fff;text-align:center;color:#4b5b74}
.is-income-report-page .is-state>i{font-size:34px;color:var(--is-blue)}
.is-income-report-page .is-state h3{margin:0;font-size:var(--is-fs-section);font-weight:800;color:#1f2f4d}
.is-income-report-page .is-state p{margin:0;font-size:var(--is-fs-label);color:var(--is-muted)}
.is-income-report-page .is-state .btn{margin-top:6px;min-height:42px;font-size:var(--is-fs-button);font-weight:800}
.is-income-report-page .is-state-error>i{color:var(--is-red)}
.is-income-report-page .is-pending-note{display:flex;align-items:center;gap:9px;padding:10px 14px;border:1px solid #f4d38b;border-radius:9px;background:#fff9e8;color:#8a5a00;font-size:var(--is-fs-label);font-weight:700}
.is-income-report-page .is-pending-note[hidden]{display:none}
.is-income-report-page .is-kpi-grid{grid-template-columns:repeat(5,minmax(0,1fr))}
.is-income-report-page .is-kpi{min-height:112px;padding:14px}
.is-income-report-page .is-kpi small{min-height:auto;font-size:var(--is-fs-label)}
.is-income-report-page .is-kpi strong{font-size:var(--is-fs-kpi);line-height:1.15}
.is-income-report-page .is-kpi em{font-size:13px}
.is-income-report-page .is-kpi-placeholder strong{color:#a5b0c2}
.is-income-report-page .is-kpi-compare{display:flex;align-items:center;gap:8px;margin-top:4px;font-size:13px;color:var(--is-muted)}
.is-income-report-page .is-trend{display:inline-flex;align-items:center;gap:3px;padding:2px 7px;border-radius:999px;background:#eef1f5;color:#526175;font-size:13px;font-weight:800}
.is-income-report-page .is-trend.is-up{background:#e8f8f0;color:#0f7a4d}
.is-income-report-page .is-trend.is-down{background:#ffebee;color:#b42336}
.is-income-report-page .is-warning-list{display:grid;gap:8px;width:100%}
.is-income-report-page .is-warning-list>strong{display:flex;align-items:center;gap:8px;font-size:var(--is-fs-label);color:#7c4a00}
.is-income-report-page .is-warning-item{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:8px 10px;border-radius:8px;background:#fff;color:#4b5b74;font-size:var(--is-fs-label)}
.is-income-report-page .is-warning-item>i{color:#d88116}
.is-income-report-page .is-warning-item>span{flex:1;min-width:220px}
.is-income-report-page .is-table-scroll{overflow:auto;max-height:calc(100vh - 140px)}
.is-income-report-page .is-report-table{min-width:640px;table-layout:auto}
.is-income-report-page .is-report-table th:not(:first-child),.is-income-report-page .is-report-table td:not(:first-child){width:1%;white-space:nowrap}
.is-income-report-page .is-report-table thead th{position:sticky;top:0;z-index:3;padding:13px 14px;font-size:var(--is-fs-table)}
.is-income-report-page .is-report-table thead th:first-child{width:auto;min-width:300px}
.is-income-report-page .is-report-table thead th:nth-child(2),.is-income-report-page .is-report-table thead th:nth-child(3){width:auto}
.is-income-report-page .is-report-table thead th:not(:first-child){min-width:108px}
.is-income-report-page .is-report-table td,.is-income-report-page .is-report-table tbody th{height:42px;padding:9px 12px;font-size:var(--is-fs-table)}
.is-income-report-page .is-report-table th:first-child,.is-income-report-page .is-report-table td:first-child{position:sticky;right:0;z-index:2;background:#fff;box-shadow:-1px 0 0 #edf1f5 inset}
.is-income-report-page .is-report-table thead th:first-child{z-index:4;background:#183b73}
.is-income-report-page .is-report-table .is-section-row th{height:46px;font-size:var(--is-fs-section);color:#1b2f4f;background:#f1f4f9;border-top:2px solid #d7dfea}
.is-income-report-page .is-section-body[data-section="cost_of_sales"] .is-section-row th,.is-income-report-page .is-section-body[data-section="operating_expense"] .is-section-row th,.is-income-report-page .is-section-body[data-section="other_expense"] .is-section-row th,.is-income-report-page .is-section-body[data-section="zakat_tax"] .is-section-row th{background:#f1f4f9;border-color:#d7dfea}
.is-income-report-page .is-section-body.is-collapsed .is-subsection-row,.is-income-report-page .is-section-body.is-collapsed .is-subtotal-minor{display:none}
.is-income-report-page .is-subsection-row th{padding-right:calc(14px + 22px);color:#34445e;background:#f8fafc;font-size:var(--is-fs-table);font-weight:800;border-top:1px solid #e6ebf2}
.is-income-report-page .is-account-row td:first-child{padding-right:calc(14px + 22px + var(--is-level,0)*22px)}
.is-income-report-page .is-section-body:not(:has(.is-subsection-row)) .is-account-row td:first-child{padding-right:calc(14px + var(--is-level,0)*22px)}
.is-income-report-page .is-account-name{display:inline-flex;align-items:center;gap:8px;font-size:var(--is-fs-table)}
.is-income-report-page .is-account-name code{color:#8a97ab;font-size:13px;font-family:inherit;direction:ltr}
.is-income-report-page .is-account-name.is-clickable:hover{color:#1d4ed8}
.is-income-report-page .is-group-row{background:#fbfcfe;font-weight:800}
.is-income-report-page .is-group-row td:first-child{background:#fbfcfe}
.is-income-report-page .is-tree-toggle{display:inline-grid;width:24px;height:24px;place-items:center;border:0;border-radius:6px;background:transparent;color:#71839e;margin-inline-end:4px}
.is-income-report-page .is-tree-toggle.is-collapsed i{transform:rotate(90deg)}
.is-income-report-page .is-section-total th,.is-income-report-page .is-subtotal-minor th{height:44px;color:#1b2f4f;background:#f3f6fa;font-size:var(--is-fs-total);font-weight:800;border-top:1px solid #d7dfea}
.is-income-report-page .is-subtotal-minor th{height:40px;font-size:var(--is-fs-table);background:#f8fafc;color:#34445e}
.is-income-report-page .is-section-body[data-section="cost_of_sales"] .is-section-total th,.is-income-report-page .is-section-body[data-section="operating_expense"] .is-section-total th,.is-income-report-page .is-section-body[data-section="other_expense"] .is-section-total th{color:#1b2f4f;background:#f3f6fa}
.is-income-report-page .is-report-table .is-result-row th{height:50px;font-size:var(--is-fs-total);font-weight:800;color:#0f5c3f;background:#eaf8f1;border-top:2px solid #b7e2cc;border-bottom:2px solid #b7e2cc}
.is-income-report-page .is-report-table .is-result-row.is-loss th{color:#a4323c;background:#fff0f1;border-color:#f0c8cc}
.is-income-report-page .is-report-table .is-result-net_profit th{height:58px;font-size:20px;color:#fff;background:#0f7a4d;border-color:#0f7a4d}
.is-income-report-page .is-report-table .is-result-net_profit.is-loss th{background:#b42336;border-color:#b42336}
.is-income-report-page .is-report-table .is-result-net_profit th .is-trend{background:rgba(255,255,255,.2);color:#fff}
.is-income-report-page .is-report-table .is-number{font-variant-numeric:tabular-nums}
.is-income-report-page .is-report-table .is-negative{color:#b42336}
.is-income-report-page .is-report-table .is-result-row .is-positive{color:#0f7a4d}
.is-income-report-page .is-report-table .is-result-net_profit th.is-negative,.is-income-report-page .is-report-table .is-result-net_profit th.is-positive{color:#fff}
.is-income-report-page .is-unclassified-body .is-section-row th{background:#fff8e6;color:#7c4a00;border-color:#f4d38b}
.is-income-report-page .is-report-footer,.is-income-report-page .is-report-footer strong{font-size:13.5px}
.is-income-report-page .is-drawer{display:flex;flex-direction:column;gap:12px;padding:16px 18px}
.is-income-report-page .is-drawer-nav{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}
.is-income-report-page .is-drawer-nav .btn{min-height:38px;font-size:var(--is-fs-label);font-weight:800}
.is-income-report-page .is-drawer-title h2{font-size:var(--is-fs-section);margin:4px 0}
.is-income-report-page .is-drawer-title h2 code{color:#8a97ab;font-size:14px;margin-inline-end:6px;font-family:inherit}
.is-income-report-page .is-drawer-title small,.is-income-report-page .is-drawer-title span{color:var(--is-muted);font-size:13.5px}
.is-income-report-page .is-drawer-table th,.is-income-report-page .is-drawer-table td{font-size:var(--is-fs-label);white-space:nowrap;vertical-align:middle}
.is-income-report-page .is-drawer-table td small{display:block;color:var(--is-muted);font-size:12.5px}
.is-income-report-page .is-drill-links{display:flex;gap:6px}
.is-income-report-page .is-drill-links .btn{white-space:nowrap;font-size:13px}
.is-income-report-page .is-pagination{display:flex;align-items:center;justify-content:center;gap:12px;font-size:var(--is-fs-label)}
.is-income-report-page .is-pagination button{min-height:36px;padding:0 14px;border:1px solid #dce3ec;border-radius:8px;background:#fff;font-size:var(--is-fs-label)}
.is-income-report-page .is-export-menu button{font-size:var(--is-fs-label)}
@media(max-width:1400px){.is-income-report-page .is-kpi-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:1180px){.is-income-report-page .is-kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.is-income-report-page .is-report-table th:first-child,.is-income-report-page .is-report-table td:first-child{position:static;box-shadow:none}}
@media(max-width:620px){.is-income-report-page .is-kpi-grid{grid-template-columns:1fr}.is-income-report-page{--is-fs-title:22px;--is-fs-kpi:22px}}

/* balance-sheet.css */
/* Statement of Financial Position (قائمة المركز المالي) — screen layout on the shared report design (is-*).
   Typography is one step larger than the dense operational scale: this is a statement read line by line. */
.bs-report-page{--bs-blue:#2563eb;--bs-navy:#1e3a8a;--bs-ink:#1b2a44;--bs-muted:#64748b;--bs-line:#e2e8f0;--bs-assets:#1d5aa8;--bs-liabilities:#b45309;--bs-equity:#0f766e;--bs-green:#15803d;--bs-red:#b91c1c;
    --bs-font-title:26px;--bs-font-section:18px;--bs-font-label:14.5px;--bs-font-value:15.5px;--bs-font-table:15.5px;--bs-font-part:17px;--bs-font-subtotal:16.5px;--bs-font-total:18px;--bs-font-button:15.5px}
.bs-report-page .bs-main{min-width:0}
.bs-report-page #bs-report{display:grid;gap:16px}
.bs-report-page.bs-options-hidden .bs-sidebar{display:none}
.bs-report-page.bs-options-hidden .is-report-layout{grid-template-columns:minmax(0,1fr);grid-template-areas:"report"}
.bs-report-page .is-report-layout{grid-template-columns:250px minmax(0,1fr)}
/* The shared statement layout is RTL by default; follow the interface language. */
html[dir="ltr"] .bs-report-page .is-report-sidebar,html[dir="ltr"] .bs-report-page .is-report-main{direction:ltr}
html[dir="ltr"] .bs-report-page .bs-back-link i{transform:scaleX(-1)}
/* Breadcrumb + header */
.bs-report-page .bs-breadcrumb{display:flex;align-items:center;gap:8px;margin-bottom:8px;color:var(--bs-muted);font-size:var(--bs-font-label)}
.bs-report-page .bs-breadcrumb a{color:var(--bs-muted);text-decoration:none}
.bs-report-page .bs-breadcrumb a:hover{color:var(--bs-blue)}
.bs-report-page .bs-breadcrumb>i{font-size:10px;color:#94a3b8}
.bs-report-page .bs-breadcrumb>span{color:var(--bs-ink);font-weight:600}
html[dir="ltr"] .bs-report-page .bs-breadcrumb>i{transform:scaleX(-1)}
.bs-report-page .bs-page-header{min-height:0;margin-bottom:6px}
.bs-report-page .is-title-icon{width:52px;height:52px;background:linear-gradient(145deg,#4b8cf0,var(--bs-blue));box-shadow:0 8px 18px rgba(37,99,235,.2);font-size:22px}
.bs-report-page .is-page-header h1{font-size:var(--bs-font-title);font-weight:800;letter-spacing:-.01em}
.bs-report-page .is-page-header p{font-size:var(--bs-font-label);max-width:760px}
.bs-report-page .bs-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.bs-report-page .bs-actions .btn{min-height:40px;padding:8px 16px;font-size:var(--bs-font-button);font-weight:700}
.bs-report-page .bs-actions .btn:disabled{opacity:.5}
.bs-report-page .bs-back-link{margin-inline-start:auto;color:var(--bs-muted);text-decoration:none;font-weight:600}
.bs-report-page .bs-back-link:hover{color:var(--bs-blue)}
/* Filter panel */
.bs-report-page .bs-filter-card>header strong{font-size:var(--bs-font-section)}
.bs-report-page .bs-filter-grid{display:grid;grid-template-columns:1fr;gap:0}
.bs-report-page .bs-filter-grid>label{display:flex;flex-direction:column;gap:6px;padding:11px 14px;border-bottom:1px solid #eef2f6;color:#475569;font-size:var(--bs-font-label);font-weight:700}
.bs-report-page .bs-filter-grid>label[hidden]{display:none}
.bs-report-page .bs-filter-grid :is(input,select){height:40px;margin:0;border:1px solid #d5dce6;border-radius:8px;color:#1e293b;background:#fff;font-size:var(--bs-font-value);box-shadow:none}
.bs-report-page .bs-filter-grid :is(input,select):focus{border-color:var(--bs-blue);box-shadow:0 0 0 3px rgba(37,99,235,.1)}
.bs-report-page .bs-filter-grid select:disabled{background:#f8fafc;color:#94a3b8}
.bs-report-page .bs-view-switch{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:6px;padding:11px 14px;border-bottom:1px solid #eef2f6}
.bs-report-page .bs-view-switch label{position:relative;display:flex;align-items:center;justify-content:center;min-height:38px;border:1px solid #d5dce6;border-radius:8px;color:#475569;background:#fff;font-size:var(--bs-font-label);font-weight:700;cursor:pointer}
.bs-report-page .bs-view-switch input{position:absolute;opacity:0}
.bs-report-page .bs-view-switch input:checked+span{color:#fff}
.bs-report-page .bs-view-switch label:has(input:checked){border-color:var(--bs-blue);background:var(--bs-blue);color:#fff}
.bs-report-page .bs-switch{padding:12px 14px}
.bs-report-page .bs-switch strong{font-size:var(--bs-font-label)}
.bs-report-page .bs-filter-actions{display:grid;gap:8px;padding:14px}
.bs-report-page .bs-filter-actions .btn{display:inline-flex;min-height:42px;align-items:center;justify-content:center;gap:8px;border-radius:8px;font-size:var(--bs-font-button);font-weight:700}
.bs-report-page .bs-info{margin:0 14px 14px;padding:12px;border:1px solid #cfe0ff;border-radius:10px;background:#f3f7ff;color:#33538f}
.bs-report-page .bs-info header{display:flex;align-items:center;gap:8px;margin-bottom:6px;font-size:var(--bs-font-label)}
.bs-report-page .bs-info ul{margin:0;padding-inline-start:18px;font-size:13.5px;line-height:1.7;color:#4b6390}
/* Empty state (no auto-run) */
.bs-report-page .bs-empty-state{display:flex;flex-direction:column;align-items:center;gap:12px;padding:56px 24px;border:1px dashed #c7d2e2;border-radius:16px;background:#fff;text-align:center}
.bs-report-page .bs-empty-icon{display:grid;width:72px;height:72px;place-items:center;border-radius:20px;color:var(--bs-blue);background:#eaf2ff;font-size:30px}
.bs-report-page .bs-empty-state h2{margin:4px 0 0;color:var(--bs-ink);font-size:22px;font-weight:800}
.bs-report-page .bs-empty-state p{max-width:560px;margin:0;color:var(--bs-muted);font-size:var(--bs-font-value);line-height:1.7}
.bs-report-page .bs-empty-state .btn{min-height:42px;padding:8px 22px;font-size:var(--bs-font-button);font-weight:700}
/* Stale criteria banner */
.bs-report-page .bs-stale{display:flex;align-items:center;gap:12px;padding:12px 16px;border:1px solid #f5d38a;border-radius:12px;background:#fff8e6;color:#8a5a00;font-size:var(--bs-font-value);font-weight:600}
.bs-report-page .bs-stale[hidden]{display:none}
.bs-report-page .bs-stale>i{font-size:18px;color:#d97706}
.bs-report-page .bs-stale>span{flex:1}
.bs-report-page #bs-report.is-stale .bs-kpis,.bs-report-page #bs-report.is-stale .bs-table-card,.bs-report-page #bs-report.is-stale .bs-status{opacity:.72}
/* Applied criteria */
.bs-report-page .bs-criteria{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:10px 14px;border:1px solid var(--bs-line);border-radius:12px;background:#fff}
.bs-report-page .bs-chip{display:inline-flex;align-items:center;gap:7px;padding:6px 12px;border-radius:999px;background:#f1f5f9;color:#334155;font-size:var(--bs-font-label);font-weight:600}
.bs-report-page .bs-chip i{color:var(--bs-blue);font-size:13px}
/* Summary cards */
.bs-report-page .bs-kpis{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
.bs-report-page .bs-kpi{--kpi:var(--bs-blue);display:flex;min-width:0;align-items:flex-start;gap:12px;padding:16px;border:1px solid var(--bs-line);border-radius:14px;background:#fff;box-shadow:0 1px 2px rgba(15,23,42,.03),0 8px 24px rgba(15,23,42,.04)}
.bs-report-page .bs-kpi--assets{--kpi:var(--bs-assets)}
.bs-report-page .bs-kpi--liabilities{--kpi:var(--bs-liabilities)}
.bs-report-page .bs-kpi--equity{--kpi:var(--bs-equity)}
.bs-report-page .bs-kpi--sum{--kpi:#475569}
.bs-report-page .bs-kpi--balanced{--kpi:var(--bs-green)}
.bs-report-page .bs-kpi--unbalanced{--kpi:var(--bs-red);border-color:#fecaca;background:#fff7f7}
.bs-report-page .bs-kpi__icon{display:grid;width:44px;height:44px;flex:0 0 auto;place-items:center;border-radius:12px;background:var(--kpi);color:#fff;font-size:18px}
.bs-report-page .bs-kpi__body{display:flex;min-width:0;flex-direction:column;gap:5px}
.bs-report-page .bs-kpi__body small{color:var(--bs-muted);font-size:var(--bs-font-label);font-weight:600;line-height:1.35}
.bs-report-page .bs-kpi__body strong{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px;color:var(--bs-ink);font-size:22px;font-weight:800;font-variant-numeric:tabular-nums}
.bs-report-page .bs-kpi__body strong em{color:var(--bs-muted);font-size:13px;font-style:normal;font-weight:600}
.bs-report-page .bs-kpi__caption,.bs-report-page .bs-kpi__delta{color:#8291a7;font-size:13px;line-height:1.4}
.bs-report-page .bs-kpi__delta{display:inline-flex;align-items:center;gap:5px;font-weight:600}
.bs-report-page .bs-kpi__delta.is-up{color:var(--bs-green)}
.bs-report-page .bs-kpi__delta.is-down{color:var(--bs-red)}
/* Balance status */
.bs-report-page .bs-status{display:flex;align-items:flex-start;gap:14px;padding:14px 18px;border:1px solid;border-radius:12px}
.bs-report-page .bs-status.is-balanced{border-color:#bbf7d0;background:#f0fdf4;color:#166534}
.bs-report-page .bs-status.is-unbalanced{border-color:#fecaca;background:#fef2f2;color:#991b1b}
.bs-report-page .bs-status>i{margin-top:2px;font-size:22px}
.bs-report-page .bs-status strong{display:block;font-size:var(--bs-font-section);font-weight:800}
.bs-report-page .bs-status span{display:block;margin-top:4px;font-size:var(--bs-font-value);font-variant-numeric:tabular-nums}
.bs-report-page .bs-status-notes{margin:8px 0 0;padding-inline-start:18px;font-size:var(--bs-font-label);line-height:1.6}
.bs-report-page .bs-unclassified{display:flex;gap:12px;padding:14px 18px;border:1px solid #fcd34d;border-radius:12px;background:#fffbeb;color:#92400e}
.bs-report-page .bs-unclassified>i{margin-top:3px;font-size:20px}
.bs-report-page .bs-unclassified strong{display:block;font-size:var(--bs-font-value);font-weight:800}
.bs-report-page .bs-unclassified ul{margin:6px 0 0;padding-inline-start:18px;font-size:var(--bs-font-label);line-height:1.6}
/* Statement table */
.bs-report-page .bs-table-card{border:1px solid var(--bs-line);border-radius:14px;background:#fff;box-shadow:0 1px 2px rgba(15,23,42,.03);overflow:hidden}
.bs-report-page .bs-table-card>header{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;padding:12px 16px;border-bottom:1px solid var(--bs-line);background:#fbfcfe}
.bs-report-page .bs-table-tools{display:flex;gap:8px}
.bs-report-page .bs-tool{display:inline-flex;align-items:center;gap:7px;min-height:36px;padding:6px 12px;border:1px solid #d5dce6;border-radius:8px;color:#334155;background:#fff;font-size:var(--bs-font-label);font-weight:600}
.bs-report-page .bs-tool:hover{border-color:var(--bs-blue);color:var(--bs-blue)}
.bs-report-page .bs-search{display:flex;align-items:center;gap:8px;min-width:280px;padding:0 12px;border:1px solid #d5dce6;border-radius:8px;background:#fff}
.bs-report-page .bs-search i{color:#94a3b8}
.bs-report-page .bs-search input{flex:1;height:36px;border:0;outline:0;background:transparent;font-size:var(--bs-font-value)}
.bs-report-page .bs-search span{color:var(--bs-muted);font-size:13px;white-space:nowrap}
.bs-report-page .bs-table-wrap{overflow:auto;max-height:min(78vh,1100px)}
.bs-report-page .bs-table{width:100%;min-width:720px;margin:0;border-collapse:separate;border-spacing:0;color:var(--bs-ink);font-size:var(--bs-font-table)}
.bs-report-page .bs-table th,.bs-report-page .bs-table td{padding:11px 14px;border-bottom:1px solid #edf1f5;vertical-align:middle;text-align:start}
.bs-report-page .bs-table thead th{position:sticky;top:0;z-index:3;padding:12px 14px;color:#fff;background:#183b73;font-size:var(--bs-font-value);font-weight:700;white-space:nowrap}
.bs-report-page .bs-table thead th.bs-name{width:40%;min-width:280px}
.bs-report-page .bs-table .is-number,.bs-report-page .bs-table thead th.is-number{text-align:end;white-space:nowrap;font-variant-numeric:tabular-nums;min-width:112px}
.bs-report-page .bs-table .bs-percent,.bs-report-page .bs-table thead th.bs-percent{min-width:84px}
.bs-report-page .bs-table .bs-actions-cell{width:48px;min-width:48px;padding-inline:6px;text-align:center}
.bs-report-page .bs-table .bs-name{position:sticky;inset-inline-start:0;z-index:2;background:#fff}
.bs-report-page .bs-table thead th.bs-name{z-index:4;background:#183b73}
.bs-report-page .bs-part th{padding:13px 14px;border-top:2px solid #cbd5e1;color:#0f172a;background:#e8eef7;font-size:var(--bs-font-part);font-weight:800;position:sticky;inset-inline-start:0}
.bs-report-page .bs-part th i{margin-inline-end:9px;color:var(--bs-blue)}
.bs-report-page .bs-part--assets th{background:#e9f1ff;color:#153c7a}
.bs-report-page .bs-part--assets th i{color:var(--bs-assets)}
.bs-report-page .bs-part--liabilities th{background:#fff4e6;color:#7c3d0c}
.bs-report-page .bs-part--liabilities th i{color:var(--bs-liabilities)}
.bs-report-page .bs-part--equity th{background:#e8f6f3;color:#0b5c53}
.bs-report-page .bs-part--equity th i{color:var(--bs-equity)}
.bs-report-page .bs-section th{padding:10px 14px;color:#1e3a5f;background:#f5f8fc;font-size:var(--bs-font-section);font-weight:700;position:sticky;inset-inline-start:0}
.bs-report-page .bs-section th span{margin-inline-start:8px}
.bs-report-page .bs-section-toggle,.bs-report-page .bs-tree-toggle{display:inline-grid;width:24px;height:24px;flex:0 0 24px;place-items:center;padding:0;border:0;border-radius:6px;color:#53709e;background:rgba(37,99,235,.08);font-size:12px;transition:transform .18s ease,background .18s ease;vertical-align:middle}
.bs-report-page .bs-section-toggle:hover,.bs-report-page .bs-tree-toggle:hover{background:rgba(37,99,235,.18)}
.bs-report-page .bs-section-toggle.is-collapsed i,.bs-report-page .bs-tree-toggle.is-collapsed i{transform:rotate(90deg)}
html[dir="ltr"] .bs-report-page .bs-section-toggle.is-collapsed i,html[dir="ltr"] .bs-report-page .bs-tree-toggle.is-collapsed i{transform:rotate(-90deg)}
.bs-report-page .bs-tree-space{display:inline-block;width:24px;flex:0 0 24px}
.bs-report-page .bs-row td.bs-name{padding-inline-start:calc(14px + var(--bs-depth,0) * 22px)}
.bs-report-page .bs-name-cell{display:flex;align-items:center;gap:8px;min-width:0}
.bs-report-page .bs-code{color:#64748b;background:transparent;font-size:13.5px;font-weight:600;font-family:var(--font-family)}
.bs-report-page .bs-account-name{color:#26344e}
.bs-report-page .bs-account-link{color:#1d4ed8;text-decoration:underline;text-decoration-style:dotted;text-underline-offset:4px}
.bs-report-page .bs-account-link:hover{text-decoration-style:solid}
.bs-report-page .bs-more,.bs-report-page .bs-inactive{padding:2px 7px;border-radius:999px;background:#f1f5f9;color:#64748b;font-size:12px;font-weight:600}
.bs-report-page .bs-inactive{background:#fff1f2;color:#b91c1c}
.bs-report-page .bs-row.is-parent td{background:#fbfcfe;font-weight:700}
.bs-report-page .bs-row.is-parent td.bs-name{background:#fbfcfe}
.bs-report-page .bs-row.is-leaf td{background:#fff;font-weight:500}
.bs-report-page .bs-row.is-result td{background:#f8fafc;font-style:italic}
.bs-report-page .bs-row.is-match td{background:#fffbea}
.bs-report-page .bs-row[hidden]{display:none}
.bs-report-page .bs-subtotal th,.bs-report-page .bs-subtotal td{color:#1e3a5f;background:#eef3fa;font-size:var(--bs-font-subtotal);font-weight:700;border-top:1px solid #d9e2ee}
.bs-report-page .bs-subtotal th{position:sticky;inset-inline-start:0}
.bs-report-page .bs-subtotal th span{padding-inline-start:32px}
.bs-report-page .bs-total th,.bs-report-page .bs-total td{padding:13px 14px;color:#fff;background:#1d4d85;font-size:var(--bs-font-total);font-weight:800;border-top:2px solid #163d6a}
.bs-report-page .bs-total th{position:sticky;inset-inline-start:0;background:#1d4d85}
.bs-report-page .bs-total--assets th,.bs-report-page .bs-total--assets td{background:var(--bs-assets)}
.bs-report-page .bs-total--liabilities th,.bs-report-page .bs-total--liabilities td{background:var(--bs-liabilities)}
.bs-report-page .bs-total--equity th,.bs-report-page .bs-total--equity td{background:var(--bs-equity)}
.bs-report-page .bs-total--sum th,.bs-report-page .bs-total--sum td{background:#0f172a}
.bs-report-page .bs-total .bs-amount.is-negative,.bs-report-page .bs-total .is-negative{color:#fecaca}
.bs-report-page .bs-difference th,.bs-report-page .bs-difference td{padding:13px 14px;font-size:var(--bs-font-subtotal);font-weight:800;border-bottom:0}
.bs-report-page .bs-difference th{position:sticky;inset-inline-start:0}
.bs-report-page .bs-difference.is-balanced th,.bs-report-page .bs-difference.is-balanced td{color:#166534;background:#f0fdf4}
.bs-report-page .bs-difference.is-unbalanced th,.bs-report-page .bs-difference.is-unbalanced td{color:#991b1b;background:#fef2f2}
.bs-report-page .bs-table .bs-empty-row td{padding:16px;text-align:center;color:#94a3b8;background:#fff}
.bs-report-page .bs-amount.is-negative{color:var(--bs-red)}
.bs-report-page .bs-percent{color:#64748b;font-size:14px}
.bs-report-page .bs-blank{color:#cbd5e1}
/* Row actions */
.bs-report-page .bs-row-actions{position:relative;display:inline-block}
.bs-report-page .bs-row-menu{display:inline-grid;width:32px;height:32px;place-items:center;border:1px solid transparent;border-radius:8px;color:#64748b;background:transparent}
.bs-report-page .bs-row-menu:hover,.bs-report-page .bs-row-menu[aria-expanded="true"]{border-color:#d5dce6;color:var(--bs-blue);background:#fff}
.bs-report-page .bs-row-menu-list{position:absolute;top:calc(100% + 4px);inset-inline-end:0;z-index:6;min-width:220px;padding:6px;border:1px solid var(--bs-line);border-radius:10px;background:#fff;box-shadow:0 12px 32px rgba(15,23,42,.14)}
.bs-report-page .bs-row-menu-list[hidden]{display:none}
.bs-report-page .bs-row-menu-list a{display:flex;align-items:center;gap:9px;padding:9px 10px;border-radius:7px;color:#26344e;text-decoration:none;font-size:var(--bs-font-label);font-weight:600;white-space:nowrap}
.bs-report-page .bs-row-menu-list a:hover{color:var(--bs-blue);background:#f3f7ff}
.bs-report-page .bs-row-menu-list a i{width:16px;color:#7c8da6;text-align:center}
/* Footer */
.bs-report-page .bs-footer{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;padding:12px 16px;border:1px solid var(--bs-line);border-radius:12px;background:#fff;color:var(--bs-muted);font-size:var(--bs-font-label)}
.bs-report-page .bs-footer i{margin-inline-end:6px;color:var(--bs-blue)}
.bs-report-page .bs-footer__brand b{color:#1e3a8a;letter-spacing:.06em}
/* Responsive */
@media(max-width:1500px){.bs-report-page .bs-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:1180px){.bs-report-page .bs-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.bs-report-page .bs-table thead th.bs-name{min-width:260px}}
@media(max-width:900px){.bs-report-page .is-report-layout{grid-template-columns:1fr}.bs-report-page .bs-back-link{margin-inline-start:0}.bs-report-page .bs-search{min-width:0;width:100%}}
@media(max-width:620px){.bs-report-page .bs-kpis{grid-template-columns:1fr}.bs-report-page{--bs-font-title:22px;--bs-font-table:14.5px;--bs-font-total:16px}.bs-report-page .bs-table .bs-name{position:static}}
@media print{.bs-report-page .bs-sidebar,.bs-report-page .bs-actions,.bs-report-page .bs-breadcrumb,.bs-report-page .bs-table-card>header,.bs-report-page .bs-actions-cell,.bs-report-page .bs-stale{display:none}.bs-report-page .is-report-layout{display:block}.bs-report-page .bs-table-wrap{max-height:none;overflow:visible}}

/* cash-flow-statement.css */
.cf-report-page #cf-report{display:grid;gap:13px}
.cf-report-page .cf-method-strip{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 13px;border:1px solid #cfe4da;border-radius:9px;color:#557065;background:#f5fbf8}
.cf-report-page .cf-method-strip span{display:inline-flex;align-items:center;gap:7px;color:#128156;font-size:var(--font-sm);font-weight:700}
.cf-report-page .cf-method-strip small{color:#718196;font-size:var(--font-xs)}
.cf-report-page .cf-section-card>header>div{display:flex;flex-direction:column;gap:2px}
.cf-report-page .cf-section-toggle{display:grid;width:28px;height:28px;place-items:center;border:1px solid #dbe4ef;border-radius:7px;color:var(--is-blue);background:#f5f8fd;font-size:var(--font-xs)}
.cf-report-page .cf-section-content{display:block}
.cf-report-page .cf-section-card.is-collapsed .cf-section-content{display:none}
.cf-report-page .cf-flow-row td:first-child small{display:block;margin-top:2px;color:#8a96a7;font-size:var(--font-xs)}
.cf-report-page .cf-account-row{background:#fbfcfe}
.cf-report-page .cf-account-row td:first-child{padding-right:32px}
.cf-report-page .cf-indent{display:inline-block;width:13px;height:9px;margin-left:7px;border-right:1px solid #c8d3e1;border-bottom:1px solid #c8d3e1}
.cf-report-page .cf-empty-row{height:64px!important;color:#8a96a7!important;text-align:center!important}
.cf-report-page .is-report-table tfoot th{height:43px;color:#20466f;background:#eef5ff;font-size:var(--font-ui)}
.cf-report-page .is-report-table tfoot .is-positive{color:#16875c!important}.cf-report-page .is-report-table tfoot .is-negative{color:#c54450!important}
.cf-report-page .cf-final-summary{overflow:hidden;border:1px solid #d9e4f2;border-radius:11px;background:#fff;box-shadow:0 3px 12px rgba(15,23,42,.03)}
.cf-report-page .cf-final-summary>header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 15px;border-bottom:1px solid #e5ebf3;background:linear-gradient(90deg,#f9fbff,#fff)}
.cf-report-page .cf-final-summary>header>div{display:flex;align-items:center;gap:10px}
.cf-report-page .cf-final-summary>header>div>i{display:grid;width:34px;height:34px;place-items:center;border-radius:8px;color:#fff;background:#2c68cf}
.cf-report-page .cf-final-summary>header span span,.cf-report-page .cf-final-summary>header>div>span{display:flex;flex-direction:column}
.cf-report-page .cf-final-summary header strong{font-size:var(--font-sm)}.cf-report-page .cf-final-summary header small{margin-top:2px;color:#7c899d;font-size:var(--font-xs)}
.cf-report-page .cf-reconcile{display:inline-flex!important;flex-direction:row!important;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;font-size:var(--font-xs);font-weight:850}
.cf-report-page .cf-reconcile.is-ok{color:#117b52;background:#e9f8f1}.cf-report-page .cf-reconcile.is-warning{color:#a56a12;background:#fff6df}
.cf-report-page .cf-summary-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;padding:9px 14px}
.cf-report-page .cf-summary-grid>div{display:flex;min-height:66px;flex-direction:column;justify-content:center;gap:5px;padding:11px 14px;border-bottom:1px solid #edf1f6;border-left:1px solid #edf1f6}
.cf-report-page .cf-summary-grid>div:nth-child(3n){border-left:0}.cf-report-page .cf-summary-grid>div:nth-last-child(-n+3){border-bottom:0}
.cf-report-page .cf-summary-grid span{color:#69788e;font-size:var(--font-xs)}.cf-report-page .cf-summary-grid strong{color:#243a59;font-weight:850;font-size:var(--font-ui)}
.cf-report-page .cf-summary-grid .cf-closing{margin:5px;border:1px solid #bcd6ff;border-radius:8px;background:#eef5ff}
.cf-report-page .cf-summary-grid .cf-closing span{color:#315e9e;font-weight:700}.cf-report-page .cf-summary-grid .cf-closing strong{color:#185dc4;font-size:var(--font-2xl)}
.cf-report-page .cf-final-summary>footer{display:flex;align-items:center;justify-content:center;gap:25px;padding:9px 14px;border-top:1px solid #e5ebf3;color:#77869a;background:#f8fafc;font-size:var(--font-xs)}
.cf-report-page .cf-final-summary>footer strong{margin-right:4px;color:#334b6b}
.cf-report-page .is-drawer{width:min(1080px,95vw)}.cf-report-page .is-drawer-table{min-width:980px}
.cf-report-page .is-drawer-table td small{display:block;margin-top:3px;color:#8793a4;font-size:var(--font-xs)}
.cf-report-page .cf-manual-badge{width:max-content;padding:2px 6px;border-radius:8px;color:#6750a4!important;background:#f0ebff}
@media(max-width:900px){.cf-report-page .cf-summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.cf-report-page .cf-summary-grid>div{border-left:1px solid #edf1f6!important;border-bottom:1px solid #edf1f6!important}.cf-report-page .cf-summary-grid>div:nth-child(2n){border-left:0!important}.cf-report-page .cf-final-summary>footer{align-items:flex-start;flex-direction:column;gap:5px}.cf-report-page .cf-method-strip{align-items:flex-start;flex-direction:column}}
@media(max-width:620px){.cf-report-page .cf-summary-grid{grid-template-columns:1fr}.cf-report-page .cf-summary-grid>div{border-left:0!important}.cf-report-page .cf-final-summary>header{align-items:flex-start;flex-direction:column}}
@media print{.cf-report-page .cf-method-strip{break-inside:avoid}.cf-report-page .cf-section-card,.cf-report-page .cf-final-summary{break-inside:avoid;box-shadow:none}.cf-report-page .cf-section-content{display:block!important}.cf-report-page .cf-summary-grid{grid-template-columns:repeat(3,1fr)}}

/* revenues-expenses-report.css */
/* Revenues & Expenses report — isolated approved RTL layout. */
.re-report-page #re-report{display:grid;gap:13px}
.re-report-page .re-columns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px;direction:rtl}
.re-report-page .re-side-card{--re-accent:var(--is-green);--re-soft:#eefaf4;display:flex;min-width:0;flex-direction:column;border:1px solid var(--is-line);border-radius:12px;background:#fff;box-shadow:0 4px 15px rgba(15,23,42,.035);overflow:hidden}
.re-report-page .re-side-card.is-expense{--re-accent:var(--is-red);--re-soft:#fff2f3}
.re-report-page .re-side-card>header{display:flex;min-height:76px;align-items:center;justify-content:space-between;gap:12px;padding:13px 15px;border-bottom:1px solid var(--is-line);background:linear-gradient(145deg,#fff,var(--re-soft))}
.re-report-page .re-side-card>header>div{display:flex;min-width:0;align-items:center;gap:10px}
.re-report-page .re-side-card>header>div>span{display:grid;width:36px;height:36px;flex:0 0 auto;place-items:center;border-radius:9px;color:#fff;background:var(--re-accent);box-shadow:0 6px 13px color-mix(in srgb,var(--re-accent) 22%,transparent)}
.re-report-page .re-side-card>header div div{display:flex;min-width:0;flex-direction:column;gap:3px}
.re-report-page .re-side-card>header div strong{color:#223451;font-size:var(--font-ui);font-weight:700}
.re-report-page .re-side-card>header div small{color:var(--is-muted);font-size:var(--font-xs)}
.re-report-page .re-side-card>header>strong{color:var(--re-accent);font-weight:700;font-size:var(--font-base);white-space:nowrap}
.re-report-page .re-side-body{display:flex;flex:1;flex-direction:column}
.re-report-page .re-group{border-bottom:1px solid #edf1f5}
.re-report-page .re-group>header{display:flex;min-height:43px;align-items:center;justify-content:space-between;gap:10px;padding:8px 12px;background:#fbfcfe}
.re-report-page .re-group-toggle{display:flex;min-width:0;align-items:center;gap:7px;border:0;color:#263a58;background:transparent;font-size:var(--font-xs);font-weight:700;text-align:right}
.re-report-page .re-group-toggle i{display:grid;width:22px;height:22px;place-items:center;border-radius:6px;color:var(--re-accent);background:var(--re-soft);font-size:.52rem}
.re-report-page .re-group>header>span{color:var(--re-accent);font-weight:850;font-size:var(--font-xs);white-space:nowrap}
.re-report-page .re-group>header>span small{display:inline-block;margin-right:6px;padding:2px 6px;border-radius:99px;color:#67758b;background:#edf1f6;font-size:var(--font-xs)}
.re-report-page .re-group.is-collapsed .re-group-content{display:none}
.re-report-page .re-group-content{overflow-x:auto}
.re-report-page .is-report-table{min-width:480px}
.re-report-page .is-report-table td:first-child{padding-right:calc(13px + var(--re-level,0)*19px)}
.re-report-page .is-account-name{display:inline-flex;align-items:center;gap:6px;text-align:right}
.re-report-page .is-account-name code{margin:0;color:#8792a3;font-size:var(--font-xs)}
.re-report-page .re-tree-line{display:none}
.re-report-page .re-classification-row{font-weight:850;background:#fff}
.re-report-page .re-empty{text-align:center!important;color:#8b96a7!important}
.re-report-page .re-total-only{display:flex;min-height:130px;align-items:center;justify-content:center;gap:14px;flex-direction:column;color:#65758b}
.re-report-page .re-total-only strong{color:var(--re-accent);font-size:var(--font-2xl)}
.re-report-page .re-side-card>footer{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:auto;padding:12px 15px;color:#23405e;background:var(--re-soft);font-size:var(--font-sm);font-weight:700}
.re-report-page .re-side-card>footer strong{color:var(--re-accent);font-weight:700;font-size:var(--font-ui)}
.re-report-page .re-warning{display:flex;align-items:center;gap:10px;padding:11px 13px;border:1px solid #f2d48c;border-radius:9px;color:#785d19;background:#fff9e9}
.re-report-page .re-warning i{color:#bd8208}
.re-report-page .re-warning span{display:flex;flex-direction:column;gap:2px;font-size:var(--font-xs)}
.re-report-page .re-warning strong{font-size:var(--font-sm)}
.re-report-page .re-final-summary{border:1px solid var(--is-line);border-radius:12px;background:#fff;box-shadow:0 4px 15px rgba(15,23,42,.035);overflow:hidden}
.re-report-page .re-final-summary>header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 15px;border-bottom:1px solid var(--is-line);background:#fbfcff}
.re-report-page .re-final-summary>header>div{display:flex;align-items:center;gap:9px}
.re-report-page .re-final-summary>header>div>i{display:grid;width:34px;height:34px;place-items:center;border-radius:8px;color:#fff;background:#5b55c9}
.re-report-page .re-final-summary>header span span,.re-report-page .re-final-summary>header>div>span{display:flex;flex-direction:column;gap:2px}
.re-report-page .re-final-summary>header strong{font-size:var(--font-sm)}
.re-report-page .re-final-summary>header small{color:var(--is-muted);font-size:var(--font-xs)}
.re-report-page .re-reconcile{display:inline-flex!important;align-items:center;gap:6px;padding:6px 9px;border-radius:99px;font-size:var(--font-xs);font-weight:850}
.re-report-page .re-reconcile.is-ok{color:#08734b;background:#e8f8f0}
.re-report-page .re-reconcile.is-warning{color:#9a6700;background:#fff4d7}
.re-report-page .re-summary-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0}
.re-report-page .re-summary-grid>div{display:flex;min-width:0;min-height:92px;align-items:center;justify-content:center;gap:6px;flex-direction:column;padding:13px;border-inline-start:1px solid #edf1f5}
.re-report-page .re-summary-grid>div:first-child{border-inline-start:0}
.re-report-page .re-summary-grid span{color:#718097;font-size:var(--font-xs)}
.re-report-page .re-summary-grid strong{font-weight:700;font-size:var(--font-base)}
.re-report-page .re-summary-grid .re-net{background:#f6f7ff}
.re-report-page .re-final-summary>footer{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:9px 14px;border-top:1px solid var(--is-line);color:#718097;background:#fbfcfe;font-size:var(--font-xs)}
.re-report-page .re-final-summary>footer strong{color:#354a68}
.re-report-page .re-drawer-table{min-width:900px}
.re-report-page .re-drawer-table td small{display:block;margin-top:3px;color:#8793a4;font-size:var(--font-xs)}
.re-report-page .re-manual{color:#6c4bc2!important;font-weight:850}
@media(max-width:1180px){.re-report-page .re-columns{grid-template-columns:1fr}.re-report-page .re-summary-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.re-report-page .re-summary-grid{grid-template-columns:1fr}.re-report-page .re-summary-grid>div{min-height:72px;border-inline-start:0;border-top:1px solid #edf1f5}.re-report-page .re-final-summary>header{align-items:flex-start;flex-direction:column}.re-report-page .re-side-card>header{align-items:flex-start;flex-direction:column}.re-report-page .is-actions>#re-header-apply{grid-column:1/-1}}
@media print{.re-report-page .re-columns{grid-template-columns:repeat(2,1fr)}.re-report-page .re-group-content{overflow:visible}.re-report-page .is-report-table{min-width:0}.re-report-page .re-final-summary,.re-report-page .re-side-card{box-shadow:none}.re-report-page .re-warning{break-inside:avoid}}

/* trial-balance-report.css */
/* Trial Balance — screen layout on the shared report design (is-*) and the central typography tokens. */
.tb-report-page{--tb-blue:#2563eb;--tb-navy:#1e3a8a;--tb-red:#dc2626;--tb-green:#16a34a;--tb-purple:#7c3aed;--tb-line:#e2e8f0;--tb-muted:#64748b;--tb-ink:#1e293b}
.tb-report-page .tb-main{min-width:0}
.tb-report-page #tb-report{display:grid;gap:14px}
.tb-report-page.tb-options-hidden .tb-sidebar{display:none}
.tb-report-page.tb-options-hidden .is-report-layout{grid-template-columns:minmax(0,1fr);grid-template-areas:"report"}
/* Breadcrumb + header */
.tb-report-page .tb-breadcrumb{display:flex;align-items:center;gap:8px;margin-bottom:10px;color:var(--tb-muted);font-size:var(--font-sm)}
.tb-report-page .tb-breadcrumb a{color:var(--tb-muted);text-decoration:none}
.tb-report-page .tb-breadcrumb a:hover{color:var(--tb-blue)}
.tb-report-page .tb-breadcrumb>i{font-size:10px;color:#94a3b8}
.tb-report-page .tb-breadcrumb>span{color:var(--tb-ink);font-weight:600}
html[dir="ltr"] .tb-report-page .tb-breadcrumb>i{transform:scaleX(-1)}
.tb-report-page .tb-page-header{margin-bottom:14px}
.tb-report-page .is-title-icon{background:linear-gradient(145deg,#4b8cf0,var(--tb-blue));box-shadow:0 8px 18px rgba(37,99,235,.2)}
.tb-report-page .tb-actions{display:flex;flex-wrap:wrap;gap:8px}
.tb-report-page .tb-actions .btn-danger{background:var(--tb-red);border-color:var(--tb-red);color:#fff}
.tb-report-page .tb-actions .btn-success{background:var(--tb-green);border-color:var(--tb-green);color:#fff}
/* Applied criteria strip */
.tb-report-page .tb-criteria{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:10px 14px;border:1px solid var(--tb-line);border-radius:12px;background:#fff}
.tb-report-page .tb-chip{display:inline-flex;align-items:center;gap:7px;padding:5px 11px;border-radius:999px;background:#f1f5f9;color:#334155;font-size:var(--font-sm);font-weight:500}
.tb-report-page .tb-chip i{color:var(--tb-blue);font-size:var(--font-xs)}
/* KPI cards */
.tb-report-page .tb-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.tb-report-page .tb-kpi{--kpi:var(--tb-blue);display:flex;align-items:flex-start;gap:12px;padding:16px;border:1px solid var(--tb-line);border-radius:14px;background:#fff;box-shadow:0 1px 2px rgba(15,23,42,.03),0 8px 24px rgba(15,23,42,.04)}
.tb-report-page .tb-kpi--credit{--kpi:var(--tb-red)}
.tb-report-page .tb-kpi--opening-debit{--kpi:var(--tb-green)}
.tb-report-page .tb-kpi--opening-credit{--kpi:var(--tb-purple)}
.tb-report-page .tb-kpi__icon{display:grid;width:42px;height:42px;flex:0 0 auto;place-items:center;border-radius:11px;background:var(--kpi);color:#fff;font-size:var(--font-md)}
.tb-report-page .tb-kpi__body{display:flex;flex-direction:column;gap:4px;min-width:0}
.tb-report-page .tb-kpi__body small{color:var(--tb-muted);font-size:var(--font-sm);font-weight:500}
.tb-report-page .tb-kpi__body strong{display:flex;align-items:baseline;gap:6px;color:var(--kpi);font-size:var(--font-xl);font-weight:700;line-height:1.2;white-space:nowrap;font-variant-numeric:tabular-nums}
.tb-report-page .tb-kpi__body strong em{color:var(--tb-muted);font-size:var(--font-xs);font-style:normal;font-weight:500}
.tb-report-page .tb-kpi__caption{color:#94a3b8;font-size:var(--font-xs)}
/* Balance status */
.tb-report-page .tb-status{display:flex;align-items:flex-start;gap:10px;padding:11px 16px;border:1px solid;border-radius:12px}
.tb-report-page .tb-status>i{margin-top:2px;font-size:var(--font-md)}
.tb-report-page .tb-status p{margin:0;font-size:var(--font-ui)}
.tb-report-page .tb-status strong{font-weight:700}
.tb-report-page .tb-status__difference{font-variant-numeric:tabular-nums}
.tb-report-page .tb-status small{display:block;margin-top:4px;font-size:var(--font-xs);opacity:.85}
.tb-report-page .tb-status.is-balanced{color:#166534;background:#f0fdf4;border-color:#bbf7d0}
.tb-report-page .tb-status.is-unbalanced{color:#991b1b;background:#fef2f2;border-color:#fecaca}
/* Table card */
.tb-report-page .tb-table-card{border:1px solid var(--tb-line);border-radius:12px;background:#fff;box-shadow:0 1px 2px rgba(15,23,42,.03),0 8px 24px rgba(15,23,42,.04);overflow:hidden}
.tb-report-page .tb-table-card>header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 14px;border-bottom:1px solid #eef2f6}
.tb-report-page .tb-toggle-all{display:grid;width:30px;height:30px;place-items:center;border:1px solid var(--tb-line);border-radius:8px;background:#fff;color:var(--tb-muted);cursor:pointer;transition:transform .18s}
.tb-report-page .tb-toggle-all.is-collapsed{transform:rotate(180deg)}
.tb-report-page .tb-search{display:flex;align-items:center;gap:8px;width:min(300px,100%);padding:0 12px;border:1px solid #d6deea;border-radius:8px;background:#fff;color:#94a3b8}
.tb-report-page .tb-search input{width:100%;min-height:34px;border:0;background:transparent;font-size:var(--font-ui);outline:none}
.tb-report-page .tb-table-wrap{overflow:auto}
.tb-report-page .tb-table{width:100%;min-width:1080px;margin:0;border-collapse:collapse;table-layout:auto}
.tb-report-page .tb-table th,.tb-report-page .tb-table td{padding:10px 12px;border-bottom:1px solid #eef2f6;vertical-align:middle;font-size:var(--font-ui)}
.tb-report-page .tb-table thead th{background:#f8fafc;color:#475569;font-weight:600;white-space:nowrap}
.tb-report-page .tb-table th.is-number,.tb-report-page .tb-table td.is-number,html[dir="ltr"] .tb-report-page .tb-table th.is-number,html[dir="ltr"] .tb-report-page .tb-table td.is-number{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums;min-width:118px}
.tb-report-page .tb-table .tb-index{width:44px;color:#94a3b8;text-align:center}
.tb-report-page .tb-table th.tb-index{text-align:center}
.tb-report-page .tb-table .tb-code{width:104px;color:var(--tb-blue);font-weight:600;font-variant-numeric:tabular-nums;text-align:start}
.tb-report-page .tb-table .tb-name{min-width:260px}
.tb-report-page .tb-table td.tb-name{padding-inline-start:calc(12px + var(--tb-level,0)*20px)}
.tb-report-page .tb-table tbody tr.is-parent td{background:#fbfcfe}
.tb-report-page .tb-table tbody tr.is-parent .tb-account-name{color:var(--tb-navy);font-weight:700}
.tb-report-page .tb-table tbody tr.tb-level-1 td{background:#f5f8ff}
.tb-report-page .tb-table tbody tr:hover td{background:#f1f5fb}
.tb-report-page .tb-account-cell{display:flex;align-items:center;gap:8px;min-width:0}
.tb-report-page .tb-account-name,.tb-report-page .tb-account-link{min-width:0;color:var(--tb-ink);text-decoration:none}
.tb-report-page .tb-account-link:hover{color:var(--tb-blue);text-decoration:underline}
.tb-report-page .tb-tree-toggle{display:grid;width:22px;height:22px;flex:0 0 auto;place-items:center;border:1px solid var(--tb-line);border-radius:6px;background:#fff;color:var(--tb-muted);font-size:10px;cursor:pointer;transition:transform .18s}
.tb-report-page .tb-tree-toggle.is-collapsed{transform:rotate(-90deg)}
html[dir="ltr"] .tb-report-page .tb-tree-toggle.is-collapsed{transform:rotate(90deg)}
.tb-report-page .tb-table .tb-debit,.tb-report-page .tb-table .tb-credit{color:var(--tb-ink);font-weight:600}
.tb-report-page .tb-table .tb-zero{color:#94a3b8}
.tb-report-page .tb-table tfoot th{padding:12px;background:#f1f5f9;color:var(--tb-navy);font-size:var(--font-ui);font-weight:700;white-space:nowrap;border-top:2px solid var(--tb-line)}
.tb-report-page .tb-table tfoot th:first-child{text-align:start}
.tb-report-page .tb-empty{padding:36px;text-align:center;color:#8793a5;font-size:var(--font-sm)}
/* Pagination */
.tb-report-page .tb-pagination{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;padding:10px 14px;border-top:1px solid #eef2f6;background:#fff}
.tb-report-page .tb-pagination__summary{display:flex;align-items:center;gap:14px;color:var(--tb-muted);font-size:var(--font-sm)}
.tb-report-page .tb-pagination__summary b{color:var(--tb-ink)}
.tb-report-page .tb-pagination__summary label{display:flex;align-items:center;gap:6px}
.tb-report-page .tb-pagination__summary select{min-height:32px;padding:3px 8px;border:1px solid var(--tb-line);border-radius:8px;background:#fff;color:var(--tb-ink);font-size:var(--font-sm)}
.tb-report-page .tb-pagination__pages{display:flex;align-items:center;gap:6px}
.tb-report-page .tb-page{display:grid;min-width:32px;height:32px;place-items:center;padding:0 8px;border:1px solid var(--tb-line);border-radius:8px;background:#fff;color:var(--tb-ink);font-size:var(--font-sm);font-weight:600;cursor:pointer}
.tb-report-page .tb-page.is-active{border-color:var(--tb-blue);background:var(--tb-blue);color:#fff}
.tb-report-page .tb-page:disabled{color:#cbd5e1;cursor:default}
.tb-report-page .tb-page-gap{color:#94a3b8;padding:0 2px}
html[dir="ltr"] .tb-report-page .tb-page--nav i{transform:scaleX(-1)}
/* Footer */
.tb-report-page .tb-footer{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;padding:4px 6px;color:var(--tb-muted);font-size:var(--font-xs)}
.tb-report-page .tb-footer bdi{unicode-bidi:isolate}
.tb-report-page .tb-footer__brand{display:flex;align-items:center;gap:8px}
.tb-report-page .tb-footer__brand b{color:#475569;letter-spacing:.02em}
.tb-report-page .tb-footer__brand em{font-style:normal}
/* Sidebar */
.tb-report-page .tb-filter-card>header i{margin-inline-start:auto;color:var(--tb-blue)}
.tb-report-page .tb-filter-grid{display:grid;gap:12px;padding:14px}
.tb-report-page .tb-filter-grid>label{display:flex;flex-direction:column;gap:6px;color:#334155;font-size:var(--font-sm);font-weight:600}
.tb-report-page .tb-filter-grid .form-control,.tb-report-page .tb-filter-grid .form-select{min-height:40px;font-size:var(--font-ui);font-weight:400}
.tb-report-page .tb-switches{display:grid;gap:4px;padding-top:4px;border-top:1px solid #eef2f6}
.tb-report-page .tb-switch{justify-content:flex-start;padding:9px 0;border:0;font-weight:500}
.tb-report-page .tb-switch strong{color:#334155;font-size:var(--font-sm);font-weight:600}
.tb-report-page .tb-filter-actions{display:grid;gap:8px;padding-top:4px}
.tb-report-page .tb-filter-actions .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;width:100%}
.tb-report-page .tb-info{margin:0 14px 14px;padding:12px 14px;border:1px solid #dbeafe;border-radius:10px;background:#eff6ff;color:#1e3a8a}
.tb-report-page .tb-info header{display:flex;align-items:center;gap:8px;margin-bottom:6px;font-size:var(--font-sm);font-weight:700}
.tb-report-page .tb-info ul{margin:0;padding-inline-start:16px;color:#475569;font-size:var(--font-xs);line-height:1.7}
/* Responsive */
@media(max-width:1500px){.tb-report-page:not(.tb-options-hidden) .tb-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:1180px){.tb-report-page .tb-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:940px){.tb-report-page .tb-actions .btn{flex:1 1 140px}}
@media(max-width:620px){.tb-report-page .tb-kpis,.tb-report-page:not(.tb-options-hidden) .tb-kpis{grid-template-columns:1fr}.tb-report-page .tb-table-card>header{flex-direction:column;align-items:stretch}.tb-report-page .tb-search{width:100%}.tb-report-page .tb-pagination{flex-direction:column;align-items:stretch}}

/* general-ledger-report.css */
/* General Ledger (دفتر الأستاذ العام). Builds on the shared financial-report shell in
   income-statement.css (layout, filter card, KPI cards, states, footer); this file only adds the
   ledger-specific pieces: account groups, running-balance table, results tools, totals and pagination.
   Typography follows the 2026-09-20 report scale: title 26px, section 18px, labels 14.5px,
   table 15.5px, group headers 17px, subtotals 16.5px, KPI values 24px, buttons 15.5px. */
.gl-report-page{--gl-blue:#1d4ed8;--gl-navy:#183b73;--gl-red:#b42336;--gl-green:#0f7a4d;--gl-amber:#b45309;--gl-line:#e3e8f0;--gl-soft:#f6f8fb;--gl-ink:#1f2f4d;--gl-muted:#66758c;--gl-fs-group:17px;--gl-fs-subtotal:16.5px}
.gl-report-page .is-report-layout{grid-template-columns:320px minmax(0,1fr);width:100%;max-width:100%}
/* Layout flow contract: every block of the report column is a normal-flow block that may shrink to the
   column (grid items default to min-width:auto, which let the nowrap ledger table's min-content width
   push the whole column past the viewport). Horizontal overflow lives only in the table wrapper. */
.gl-report-page .gl-main,.gl-report-page .gl-main>*,.gl-report-page #gl-report>*,.gl-report-page .gl-results>*,.gl-report-page #gl-groups>*{min-width:0;max-width:100%}
.gl-report-page #gl-report{display:grid;gap:14px;height:auto;overflow:visible}
/* The criteria panel is part of the page flow (never sticky, never clipped): it pushes the report down
   when it grows and its account dropdown may extend past its bottom edge. */
.gl-report-page .is-filter-card.gl-filter-card{position:static;top:auto;height:auto;overflow:visible}
.gl-report-page .gl-filter-card>header{border-radius:12px 12px 0 0}
.gl-report-page .gl-filter-card>.is-filter-info{border-radius:0 0 12px 12px}
/* The shared shell pins both columns to RTL; the ledger follows the document direction so English runs LTR (column order, alignment, dropdown side). */
html[dir="ltr"] .gl-report-page .is-report-sidebar,html[dir="ltr"] .gl-report-page .is-report-main{direction:ltr}
.gl-report-page .is-kpi-grid.gl-kpi-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.gl-report-page .gl-kpi strong{direction:ltr;unicode-bidi:isolate}
.gl-report-page .gl-kpi em{display:flex;flex-wrap:wrap;align-items:center;gap:4px}

/* Account selector (search by code or name). */
.gl-report-page .gl-account-field{position:relative}
.gl-report-page .gl-account-box{position:relative;display:block}
.gl-report-page .gl-account-box input{width:100%;padding-inline-end:36px}
.gl-report-page .gl-account-clear{position:absolute;inset-inline-end:8px;top:50%;display:grid;width:24px;height:24px;place-items:center;border:0;border-radius:6px;background:#eef2f7;color:#5b6b85;transform:translateY(-50%);cursor:pointer}
.gl-report-page .gl-account-clear[hidden]{display:none}
.gl-report-page .gl-account-list{position:absolute;inset-inline:14px;top:calc(100% - 26px);z-index:30;max-height:300px;overflow:auto;padding:6px;border:1px solid #d3dbe7;border-radius:10px;background:#fff;box-shadow:0 16px 36px rgba(15,23,42,.16)}
.gl-report-page .gl-account-list[hidden]{display:none}
.gl-report-page .gl-account-option{display:grid;width:100%;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:10px;padding:8px 10px;padding-inline-start:calc(10px + var(--gl-depth,0) * 12px);border:0;border-radius:8px;background:transparent;color:var(--gl-ink);font-size:14.5px;text-align:start;cursor:pointer}
.gl-report-page .gl-account-option:hover,.gl-report-page .gl-account-option:focus-visible{background:#f0f5ff;outline:none}
.gl-report-page .gl-account-option code{color:var(--gl-blue);font-size:13.5px;font-weight:700;direction:ltr}
.gl-report-page .gl-account-option span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gl-report-page .gl-account-option.is-parent span{font-weight:700}
.gl-report-page .gl-account-option small{color:var(--gl-muted);font-size:12px}
.gl-report-page .gl-account-empty{padding:12px;color:var(--gl-muted);font-size:14px;text-align:center}
.gl-report-page .gl-account-field>small{color:#8995a6;font-size:13px}
.gl-report-page .gl-switches{display:grid}
.gl-report-page .gl-switches .is-detail-switch{border-bottom:1px solid #eef2f6}

/* Applied criteria chips. */
.gl-report-page .gl-criteria{display:flex;flex-wrap:wrap;gap:8px}
.gl-report-page .gl-criteria span{display:inline-flex;align-items:center;gap:7px;padding:6px 12px;border:1px solid var(--gl-line);border-radius:999px;background:#fff;color:#3b4a66;font-size:14px;font-weight:700}
.gl-report-page .gl-criteria i{color:var(--gl-blue);font-size:12px}

/* Results toolbar: search inside the generated results + expand/collapse all. */
.gl-report-page .gl-results{display:grid;gap:14px}
.gl-report-page .gl-results-tools{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;padding:12px 14px;border:1px solid var(--gl-line);border-radius:12px;background:#fff}
.gl-report-page .gl-search{position:relative;display:flex;flex:1 1 380px;align-items:center;margin:0}
.gl-report-page .gl-search i{position:absolute;inset-inline-start:13px;color:#8a97ab;font-size:14px}
.gl-report-page .gl-search input{width:100%;height:42px;padding:0 40px;border:1px solid #d3dbe7;border-radius:9px;background:var(--gl-soft);color:var(--gl-ink);font-size:15px}
.gl-report-page .gl-search input:focus{border-color:var(--gl-blue);background:#fff;box-shadow:0 0 0 3px rgba(29,78,216,.12);outline:none}
.gl-report-page .gl-tools-actions{display:flex;align-items:center;gap:12px}
.gl-report-page .gl-tools-actions .btn{min-height:40px;padding:6px 14px;font-size:15px;font-weight:800}
.gl-report-page .gl-results-count{color:var(--gl-muted);font-size:14px;font-weight:700}

/* One account group: header summary + movements table. */
.gl-report-page .gl-account{display:block;position:relative;width:100%;height:auto;clear:both;margin:0 0 14px;border:1px solid var(--gl-line);border-radius:14px;background:#fff;box-shadow:0 8px 24px rgba(15,23,42,.04);overflow:hidden}
.gl-report-page .gl-account:last-child{margin-bottom:0}
.gl-report-page .gl-account-head{display:grid;grid-template-columns:auto minmax(220px,1.1fr) minmax(0,2.4fr) auto;align-items:center;gap:14px;padding:14px 16px;background:linear-gradient(180deg,#f7f9fd,#eef3fb);border-bottom:1px solid var(--gl-line)}
.gl-report-page .gl-account.is-collapsed .gl-account-head{border-bottom:0}
.gl-report-page .gl-toggle,.gl-report-page .gl-toggle-space{display:grid;width:34px;height:34px;flex:0 0 auto;place-items:center;border:1px solid #cfdaeb;border-radius:9px;background:#fff;color:var(--gl-blue);cursor:pointer;transition:transform .18s}
.gl-report-page .gl-toggle-space{visibility:hidden}
.gl-report-page .gl-account.is-collapsed .gl-toggle i{transform:rotate(-90deg)}
.gl-report-page .gl-account-title h2{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0;color:var(--gl-navy);font-size:var(--gl-fs-group);font-weight:800;line-height:1.3}
.gl-report-page .gl-account-title code{padding:2px 8px;border-radius:6px;background:#dfe9fb;color:var(--gl-blue);font-size:15px;font-weight:800}
.gl-report-page .gl-account-title span{display:block;margin-top:3px;color:var(--gl-muted);font-size:13.5px}
.gl-report-page .gl-account-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:0}
.gl-report-page .gl-account-summary>div{display:grid;gap:3px;padding:8px 12px;border:1px solid #dbe4f1;border-radius:10px;background:#fff}
.gl-report-page .gl-account-summary>div.is-closing{border-color:#bcd3f5;background:#f2f7ff}
.gl-report-page .gl-account-summary dt{color:var(--gl-muted);font-size:13px;font-weight:700}
.gl-report-page .gl-account-summary dd{display:flex;align-items:center;justify-content:flex-start;gap:6px;margin:0;color:var(--gl-ink);font-size:var(--gl-fs-subtotal);font-weight:800;direction:ltr;unicode-bidi:isolate}
.gl-report-page .gl-account-summary dd.is-negative{color:var(--gl-red)}
.gl-report-page .gl-side{display:inline-block;padding:1px 7px;border-radius:999px;font-size:12px;font-weight:800;line-height:1.5;direction:rtl;unicode-bidi:isolate}
html[lang="en"] .gl-report-page .gl-side{direction:ltr}
.gl-report-page .gl-side-debit{background:#e6effc;color:var(--gl-blue)}
.gl-report-page .gl-side-credit{background:#fdeaea;color:var(--gl-red)}
.gl-report-page .gl-side-balanced{background:#e9f7ef;color:var(--gl-green)}
.gl-report-page .gl-statement-link{display:inline-flex;align-items:center;gap:6px;padding:8px 12px;border:1px solid #cfdaeb;border-radius:9px;background:#fff;color:var(--gl-blue);font-size:14px;font-weight:800;text-decoration:none;white-space:nowrap}
.gl-report-page .gl-statement-link:hover{background:#eef4ff}
.gl-report-page .gl-account.is-collapsed .gl-table-scroll{display:none}

/* Movements table: sticky header, readable 15.5px rows, running balance emphasised. */
/* Each account owns its horizontal scroll context; vertical growth is natural page flow. */
.gl-report-page .gl-table-scroll{width:100%;max-width:100%;overflow-x:auto;overflow-y:visible;height:auto}
.gl-report-page .is-report-table.gl-table{min-width:1180px;margin:0}
/* The shared statement table sizes its first column as a 300px statement name and forces every other
   column to nowrap 1% — an income-statement shape. The ledger has its own columns: a narrow index,
   wrapping description/source cells, nowrap dates/amounts, so the table fits its wrapper at 1180px. */
.gl-report-page .gl-table thead th:first-child,.gl-report-page .gl-table th.gl-index,.gl-report-page .gl-table td.gl-index{width:44px;min-width:44px}
.gl-report-page .gl-table th:not(:first-child),.gl-report-page .gl-table td:not(:first-child){width:auto;min-width:0;white-space:normal}
.gl-report-page .gl-table thead th:not(:first-child){min-width:0}
.gl-report-page .gl-table thead th{text-align:start!important}
.gl-report-page .gl-table thead th.is-number{text-align:end!important}
.gl-report-page .gl-table td.gl-desc{white-space:normal}
.gl-report-page .gl-table td:not(:first-child).gl-date,.gl-report-page .gl-table td:not(:first-child).gl-ref,.gl-report-page .gl-table td:not(:first-child).is-number,.gl-report-page .gl-table td:not(:first-child).gl-actions{white-space:nowrap}
.gl-report-page .gl-table thead th{position:sticky;top:0;z-index:2;padding:12px 12px;font-size:15px;white-space:nowrap}
/* The shared statement table pins its first column to the right edge (RTL-only); the ledger keeps every column in flow so LTR and RTL behave the same. */
.gl-report-page .gl-table th:first-child,.gl-report-page .gl-table td:first-child{position:static;box-shadow:none}
.gl-report-page .gl-table thead th.is-number,.gl-report-page .gl-table td.is-number,.gl-report-page .gl-table th.is-number{text-align:end}
.gl-report-page .gl-table td{height:auto;padding:10px 12px;font-size:15.5px;line-height:1.45;vertical-align:middle}
.gl-report-page .gl-table tbody tr:nth-child(even) td{background:#fbfcfe}
.gl-report-page .gl-table tbody tr:hover td{background:#f2f6fd}
.gl-report-page .gl-table .gl-index{width:44px;color:var(--gl-muted);font-size:13.5px}
.gl-report-page .gl-table .gl-date{white-space:nowrap}
.gl-report-page .gl-table .gl-ref{white-space:nowrap;font-weight:700}
.gl-report-page .gl-journal-link{color:var(--gl-blue);text-decoration:none;border-bottom:1px dashed rgba(29,78,216,.45)}
.gl-report-page .gl-journal-link:hover{border-bottom-style:solid}
.gl-report-page .gl-account-cell{color:#45556f;font-size:14px;white-space:nowrap}
.gl-report-page .gl-account-cell code{color:var(--gl-blue);font-size:13.5px;font-weight:700}
.gl-report-page .gl-desc{min-width:260px;max-width:460px;color:var(--gl-ink)}
.gl-report-page .gl-desc small{display:block;margin-top:2px;color:var(--gl-muted);font-size:13px}
.gl-report-page .gl-source{white-space:nowrap}
.gl-report-page .gl-source-link{display:inline-flex;align-items:center;gap:6px;color:var(--gl-blue);font-weight:700;text-decoration:none}
.gl-report-page .gl-source-link i{font-size:13px}
.gl-report-page .gl-source-link:hover{text-decoration:underline}
.gl-report-page .gl-source-text{color:#55637a}
.gl-report-page .gl-source-text.is-cross-branch{color:var(--gl-amber)}
.gl-report-page .gl-user{color:#55637a;font-size:14px;white-space:nowrap}
.gl-report-page .gl-table td.is-number{font-variant-numeric:tabular-nums;white-space:nowrap}
.gl-report-page .gl-zero{color:#a9b3c3}
.gl-report-page .gl-debit{color:#1e3a8a}
.gl-report-page .gl-credit{color:#8a1c2b}
.gl-report-page .gl-running{font-weight:800;background:rgba(29,78,216,.04)}
.gl-report-page tr.is-against-nature .gl-running,.gl-report-page .gl-running.is-negative,.gl-report-page .gl-table th.is-negative{color:var(--gl-red)}
.gl-report-page .gl-opening-row td{color:#3b4a66;background:#f4f7fc!important;font-weight:700}
.gl-report-page .gl-opening-row small{color:var(--gl-muted);font-weight:600}
.gl-report-page .gl-no-lines td{padding:18px 12px;color:var(--gl-muted);text-align:center;font-size:14.5px}
.gl-report-page .gl-row-actions{display:inline-flex;gap:4px}
.gl-report-page .gl-action{display:grid;width:32px;height:32px;place-items:center;border:1px solid #d9e2ee;border-radius:8px;background:#fff;color:#4b5d7a;font-size:13px;text-decoration:none;transition:background .15s,color .15s}
.gl-report-page .gl-action:hover{background:var(--gl-blue);border-color:var(--gl-blue);color:#fff}
.gl-report-page .gl-table tfoot th{height:auto;padding:11px 12px;font-size:var(--gl-fs-subtotal);font-weight:800;white-space:nowrap}
.gl-report-page .gl-table .gl-total-row th{color:#1f2f4d;background:#f1f4f9;border-top:2px solid #cbd5e1}
.gl-report-page .gl-table .gl-closing-row th{color:var(--gl-navy);background:#e8effc;border-top:1px solid #bcd3f5;border-bottom:0}
.gl-report-page .gl-table .gl-closing-row small{color:var(--gl-muted);font-size:13px;font-weight:600}

/* Report-wide totals (accounting-valid only). */
.gl-report-page .gl-grand-totals{display:grid;gap:12px;padding:16px 18px;border:1px solid #c9d8ef;border-radius:14px;background:linear-gradient(180deg,#f5f8fe,#eef3fb)}
.gl-report-page .gl-grand-totals h3{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px;margin:0;color:var(--gl-navy);font-size:18px;font-weight:800}
.gl-report-page .gl-grand-totals h3 i{color:var(--gl-blue);font-size:15px}
.gl-report-page .gl-grand-totals h3 small{color:var(--gl-muted);font-size:13.5px;font-weight:600}
.gl-report-page .gl-grand-totals dl{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:0}
.gl-report-page .gl-grand-totals dl>div{display:grid;gap:4px;padding:12px 14px;border:1px solid #d5e0f0;border-radius:10px;background:#fff}
.gl-report-page .gl-grand-totals dt{color:var(--gl-muted);font-size:14px;font-weight:700}
.gl-report-page .gl-grand-totals dd{display:flex;align-items:center;gap:6px;margin:0;color:var(--gl-ink);font-size:var(--gl-fs-group);font-weight:800;direction:ltr;unicode-bidi:isolate}
.gl-report-page .gl-grand-totals dl>div.is-closing{border-color:#bcd3f5;background:#eef4ff}
.gl-report-page .gl-grand-totals dl>div.is-difference{border-color:#f3c9c9;background:#fff5f5}
.gl-report-page .gl-grand-totals dl>div.is-difference dd{color:var(--gl-red)}
.gl-report-page .gl-equation{display:flex;align-items:center;gap:8px;margin:0;font-size:14.5px;font-weight:700}
.gl-report-page .gl-equation.is-ok{color:var(--gl-green)}
.gl-report-page .gl-equation.is-warning{color:var(--gl-red)}

/* Pagination by account. */
.gl-report-page .gl-pagination{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;border:1px solid var(--gl-line);border-radius:12px;background:#fff}
.gl-report-page .gl-pagination-summary{display:flex;flex-wrap:wrap;align-items:center;gap:16px;color:#3b4a66;font-size:14.5px}
.gl-report-page .gl-pagination-summary label{display:flex;align-items:center;gap:8px;margin:0;font-weight:700}
.gl-report-page .gl-pagination-summary select{height:36px;padding:0 10px;border:1px solid #d3dbe7;border-radius:8px;background:#fff;color:var(--gl-ink);font-size:14.5px}
.gl-report-page .gl-pagination-pages{display:flex;align-items:center;gap:4px}
.gl-report-page .gl-page{display:grid;min-width:36px;height:36px;place-items:center;padding:0 10px;border:1px solid #d3dbe7;border-radius:8px;background:#fff;color:#3b4a66;font-size:14.5px;font-weight:700;cursor:pointer}
.gl-report-page .gl-page.is-active{border-color:var(--gl-blue);background:var(--gl-blue);color:#fff}
.gl-report-page .gl-page:disabled{opacity:.45;cursor:default}
.gl-report-page .gl-page-gap{padding:0 4px;color:var(--gl-muted)}

/* Empty / no-results states keep the shell's look; the first-open state carries no figures. */
.gl-report-page .gl-empty h3{max-width:640px;line-height:1.6}
.gl-report-page .gl-no-results>i{color:#8a97ab}

@media(max-width:1400px){.gl-report-page .gl-account-head{grid-template-columns:auto minmax(0,1fr) auto}.gl-report-page .gl-account-summary{grid-column:1/-1;grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:1200px){.gl-report-page .is-report-layout{grid-template-columns:1fr;grid-template-areas:"filters" "report"}.gl-report-page .is-kpi-grid.gl-kpi-grid,.gl-report-page .gl-grand-totals dl{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.gl-report-page .gl-account-summary{grid-template-columns:repeat(2,minmax(0,1fr))}.gl-report-page .is-kpi-grid.gl-kpi-grid,.gl-report-page .gl-grand-totals dl{grid-template-columns:1fr}.gl-report-page .gl-statement-link span{display:none}}

/* accounting-report-system.css */
/* Shared visual system for the seven General Accounting reports only. */
.is-income-report-page,
.ga-tax-page {
    --ar-blue: #2563eb;
    --ar-green: #18a663;
    --ar-red: #dc4c59;
    --ar-purple: #7c57d9;
    --ar-orange: #f28b30;
    --ar-ink: #17233e;
    --ar-muted: #74839a;
    --ar-line: #e1e7ef;
    --ar-soft: #f7f9fc;
    max-width: 1680px;
    margin-inline: auto;
    color: var(--ar-ink);
}

.is-income-report-page .is-report-layout,
.ga-tax-page .ga-tax-layout {
    grid-template-columns: 270px minmax(0, 1fr);
    gap: 18px;
}

.is-income-report-page .is-filter-card,
.ga-tax-page .ga-tax-filter-card {
    border-color: var(--ar-line);
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 3px 14px rgba(15, 23, 42, .035);
}

.is-income-report-page .is-filter-grid label,
.ga-tax-page .ga-tax-filter-grid > .ga-field {
    gap: 7px;
    padding: 12px 14px;
}

.is-income-report-page .is-filter-grid :is(input, select),
.ga-tax-page .ga-tax-filter-grid > .ga-field :is(input, select) {
    height: 42px;
    border-color: #d8e0ea;
    border-radius: 8px;
    color: #253653;
    background: #fff;
    font-size: var(--font-ui);
}

.is-income-report-page .is-filter-card > footer .btn,
.ga-tax-page .ga-tax-filter-card > footer .ga-btn {
    min-height: 42px;
    border-radius: 8px;
}

.ga-tax-page .ga-tax-filter-info {
    display: flex;
    gap: 9px;
    margin: 0 13px 13px;
    padding: 11px;
    border: 1px solid #cfe0ff;
    border-radius: 8px;
    color: #3760a8;
    background: #f3f7ff;
}

.ga-tax-page .ga-tax-filter-info > i { margin-top: 2px; color: var(--ar-blue); }
.ga-tax-page .ga-tax-filter-info > div { display: flex; min-width: 0; flex-direction: column; gap: 3px; }
.ga-tax-page .ga-tax-filter-info strong { font-size: var(--font-xs); }
.ga-tax-page .ga-tax-filter-info span { position: relative; padding-right: 8px; color: #657ba5; font-size: var(--font-xs); line-height: 1.45; }
.ga-tax-page .ga-tax-filter-info span::before { position: absolute; top: .48em; right: 0; width: 3px; height: 3px; border-radius: 50%; background: #8ba5d4; content: ""; }

.is-income-report-page .is-page-header,
.ga-tax-page .ga-tax-header {
    min-height: 94px;
    margin: 0;
    padding: 3px 2px 8px;
}

.is-income-report-page .is-page-header h1,
.ga-tax-page .ga-tax-title h1 {
    margin: 6px 0 4px;
    color: var(--ar-ink);
    font-size: var(--font-2xl);
    font-weight: 700;
}

.is-income-report-page .is-page-header p,
.ga-tax-page .ga-tax-title p {
    color: var(--ar-muted);
    font-size: var(--font-sm);
    line-height: 1.65;
}

.is-income-report-page .is-actions .btn,
.ga-tax-page .ga-tax-header-actions .ga-btn {
    min-height: 38px;
    padding: 8px 13px;
    border-radius: 8px;
    font-size: var(--font-ui);
    font-weight: 850;
}

.ga-tax-page .ga-tax-header-actions .ga-btn-primary { color: #fff; background: var(--ar-blue); }

.is-income-report-page .is-kpi,
.ga-tax-page .ga-tax-metric {
    min-height: 112px;
    padding: 15px;
    border-color: var(--ar-line);
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 3px 10px rgba(15, 23, 42, .025);
}

.is-income-report-page .is-kpi > span,
.ga-tax-page .ga-tax-metric-icon {
    width: 36px;
    height: 36px;
    border-radius: 9px;
    box-shadow: none;
}

.is-income-report-page .is-kpi strong,
.ga-tax-page .ga-tax-metric strong {
    margin-top: 4px;
    font-size: var(--font-2xl);
    line-height: 1.3;
    font-variant-numeric: tabular-nums;
}

.ga-tax-page .ga-tax-metric.is-red { --metric: var(--ar-red); }
.ga-tax-page .ga-tax-metric.is-red strong { color: var(--ar-red); }

.is-income-report-page .is-table-card,
.ga-tax-page :is(.ga-tax-content-card, .ga-vat-section, .ga-vat-position) {
    border-color: var(--ar-line);
    border-radius: 11px;
    background: #fff;
    box-shadow: 0 3px 12px rgba(15, 23, 42, .025);
}

.is-income-report-page .is-report-table thead th,
.ga-tax-page :is(.ga-tax-table, .ga-vat-section table) thead th {
    min-height: 42px;
    padding: 11px 13px;
    color: #40516d;
    background: #f7f9fc;
    font-size: var(--font-ui);
    font-weight: 700;
    vertical-align: middle;
}

.ga-tax-page .ga-tax-table th button { padding: 0; }
.ga-tax-page .ga-tax-summary-table th { white-space: nowrap; }
.ga-tax-page .ga-tax-summary-table td { height: 44px; }

.is-income-report-page .is-report-table td,
.is-income-report-page .is-report-table tbody th,
.ga-tax-page :is(.ga-tax-table, .ga-vat-section table) tbody td {
    height: 44px;
    padding: 9px 13px;
    border-top: 1px solid #edf1f5;
    vertical-align: middle;
}

.ga-tax-page .ga-tax-report-footer {
    display: grid;
    gap: 9px;
    padding: 12px 14px;
    border: 1px solid var(--ar-line);
    border-radius: 10px;
    color: #65758e;
    background: #fff;
    font-size: var(--font-xs);
}

.ga-tax-page .ga-tax-report-footer > div { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.ga-tax-page .ga-tax-report-footer span { display: inline-flex; align-items: center; gap: 5px; }
.ga-tax-page .ga-tax-report-footer i { color: var(--ar-blue); }
.ga-tax-page .ga-tax-report-footer strong { color: #3d5f96; font-size: var(--font-xs); }

@media (min-width: 901px) {
    .is-income-report-page .is-kpi-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .ga-tax-page .ga-tax-metrics { grid-template-columns: repeat(5, minmax(0, 1fr)); }
    .ga-tax-page .ga-vat-metrics { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .bs-report-page .bs-statement-grid,
    .re-report-page .re-columns { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 900px) {
    .is-income-report-page .is-report-layout,
    .ga-tax-page .ga-tax-layout { grid-template-columns: 1fr; }
}

@media (max-width: 620px) {
    .is-income-report-page .is-page-header h1,
    .ga-tax-page .ga-tax-title h1 { font-size: var(--font-lg); }
    .is-income-report-page .is-kpi strong,
    .ga-tax-page .ga-tax-metric strong { font-size: var(--font-2xl); }
    .ga-tax-page .ga-tax-header-actions [data-ga-action="generate"] { grid-column: 1 / -1; }
    .ga-tax-page .ga-tax-report-footer > div { align-items: flex-start; flex-direction: column; }
}

@media print {
    body > #app-wrapper > .sidebar,
    body > #app-wrapper > main > header,
    .is-income-report-page .is-report-sidebar,
    .ga-tax-page .ga-tax-aside,
    .is-income-report-page .is-actions,
    .ga-tax-page .ga-tax-header-actions,
    .ga-tax-page .ga-tax-results-tools,
    .ga-tax-page .ga-tax-tabs { display: none !important; }
    .is-income-report-page,
    .ga-tax-page { max-width: none; padding: 0; }
}

/* journal-workspace.css */
.jw-page{padding:2px 0 24px}
.jw-page *{box-sizing:border-box}
.jw-header{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:18px}
.jw-heading{display:flex;align-items:center;gap:13px}
.jw-heading h1{line-height:1.2;margin:0 0 4px;font-weight:700;color:#172036}
.jw-heading p{margin:0;color:#7d8698;font-size:var(--font-sm)}
.jw-header__actions{display:flex;gap:8px}
.jw-kpis{display:grid}
.jw-kpi{position:relative;background:#fff;box-shadow:0 3px 13px rgba(21,32,54,.025)}
.jw-kpi>i{width:37px;height:37px;border-radius:10px;display:grid;place-items:center;background:currentColor;font-size:15px}
.jw-kpi>i:before{color:#fff}
.jw-kpi span,.jw-kpi b,.jw-kpi small{display:block}
.jw-kpi span{font-size:var(--font-xs);color:#7d8698;margin-bottom:6px}
.jw-kpi b{font-weight:700;font-size:var(--font-2xl);color:#202a40;white-space:nowrap}
.jw-kpi small{margin-top:4px}
.jw-kpi--purple{color:#6546e8}
.jw-kpi--blue{color:#3b77d8}
.jw-kpi--orange{color:#ef9b32}
.jw-kpi--green{color:#25a36f}
.jw-kpi--gray{color:#7d8495}
.jw-kpi--loading i,.jw-kpi--loading span,.jw-kpi--loading b{display:block;background:linear-gradient(90deg,#edf0f5,#f8f9fb,#edf0f5);background-size:200% 100%;animation:jwShimmer 1.15s infinite;border-radius:6px}
.jw-kpi--loading i{width:36px;height:36px}
.jw-kpi--loading span{width:80px;height:9px}
.jw-kpi--loading b{width:105px;height:18px}
.jw-filter{grid-template-columns:minmax(220px,1.7fr) repeat(5,minmax(120px,.75fr)) auto;box-shadow:0 3px 12px rgba(21,32,54,.02)}
.jw-filter label,.jw-edit-meta label{display:block}
.jw-filter label>span,.jw-edit-meta label>span{display:block;color:#7c8597;font-size:var(--font-sm);font-weight:700;margin:0 3px 5px}
.jw-filter input,.jw-filter select,.jw-edit-meta input,.jw-lines input,.jw-lines select{width:100%;height:35px;border:1px solid #dfe4ed;border-radius:7px;background:#fff;color:#334057;padding:6px 9px;font-weight:600;font-size:var(--font-xs);outline:none}
.jw-filter input:focus,.jw-filter select:focus,.jw-edit-meta input:focus,.jw-lines input:focus,.jw-lines select:focus{border-color:#9a87ee;box-shadow:0 0 0 3px rgba(101,70,232,.08)}
.jw-search{position:relative}
.jw-search i{position:absolute;right:11px;bottom:10px;color:#a3aaba;font-size:11px}
.jw-search input{padding-right:31px}
.jw-reset{border:1px solid #e0e5ed;border-radius:7px;background:#f8f9fb;color:#707a8d;padding:0 11px;font-weight:700;font-size:var(--font-xs);white-space:nowrap}
.jw-reset:hover{color:#6546e8;border-color:#cfc5fa;background:#f5f2ff}
.jw-table-card{border:1px solid var(--jw-border);border-radius:12px;box-shadow:0 4px 17px rgba(21,32,54,.03)}
.jw-table-head{padding:13px 15px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #e8ebf1}
.jw-table-head h2{font-size:var(--font-base);font-weight:700;margin:0 0 3px}
.jw-table-head p{font-size:var(--font-xs);color:#8a93a4;margin:0}
.jw-table th{height:39px;padding:9px 11px;background:#f7f8fb;color:#6e788b;font-size:var(--font-ui);font-weight:700;white-space:nowrap;border-bottom:1px solid #e3e7ef}
.jw-table td{height:49px;padding:8px 11px;color:#475268;border-bottom:1px solid #edf0f4;vertical-align:middle}
.jw-table tbody tr:hover td{background:#fbfaff}
.jw-table tbody tr:last-child td{border-bottom:0}
.jw-reference{border:0;background:none;padding:0;font-weight:700;font-size:var(--font-ui);cursor:pointer;white-space:nowrap}
.jw-reference:hover{text-decoration:underline}
.jw-description{text-overflow:ellipsis;overflow:hidden}
.jw-source-ref{font-weight:700;font-size:var(--font-xs);color:#69758a;background:#f2f4f7;border-radius:5px;padding:4px 6px}
.jw-source-ref--link{border:0;cursor:pointer;color:#5d3fdf;background:#f3f0ff;display:inline-flex;align-items:center;gap:4px;font-family:inherit}
.jw-source-ref--link:hover{background:#e6e0ff}
.jw-source-ref--cross{color:#b45309;background:#fff7ed;display:inline-flex;align-items:center;gap:4px}
.jw-modal .jw-source-ref--link,.jw-modal .jw-source-ref--cross{font-size:var(--font-sm)}
.jw-type{display:inline-flex;padding:5px 8px;border-radius:6px;font-weight:700}
.jw-debit{color:#16855d!important;font-weight:700;font-size:var(--font-ui);white-space:nowrap}
.jw-credit{color:#d45b43!important;font-weight:700;font-size:var(--font-ui);white-space:nowrap}
.jw-status{display:inline-flex;align-items:center;gap:5px;padding:5px 8px;border-radius:15px;font-size:var(--font-xs);font-weight:700;white-space:nowrap}
.jw-status--approved{color:#16805a;background:#eaf8f2;border:1px solid #c9eddd}
.jw-actions{position:relative;display:inline-flex}
.jw-actions__trigger{width:30px;height:28px;border:1px solid #dfe4ed;border-radius:7px;background:#fff;color:#667187}
.jw-actions__menu{display:none;position:absolute;inset-inline-end:0;top:33px;width:205px;padding:5px;background:#fff;border:1px solid #dfe4ec;border-radius:9px;box-shadow:0 16px 38px rgba(21,32,54,.17);z-index:40}
.jw-actions__menu.open{display:block}
.jw-actions__menu button{width:100%;height:32px;border:0;border-radius:6px;background:#fff;color:#4f5a6f;padding:6px 8px;display:flex;align-items:center;gap:9px;font-weight:700;font-size:var(--font-ui);cursor:pointer}
.jw-actions__menu button i{width:15px}
.jw-actions__menu button:hover{background:#f4f1ff;color:#5e40d9}
.jw-actions__menu button.warning,.jw-actions__menu button.warning i{color:#a86717}
.jw-actions__menu button.danger,.jw-actions__menu button.danger i{color:#c23f54}
.jw-pagination{min-height:49px;padding:9px 13px;display:flex;align-items:center;justify-content:space-between;color:#7c8596;font-size:var(--font-xs);border-top:1px solid #e8ebf1}
.jw-pagination>div{display:flex;gap:4px}
.jw-pagination button{min-width:28px;height:28px;border:1px solid #e0e4ec;border-radius:6px;background:#fff;color:#5f697b;font-weight:700;font-size:var(--font-ui)}
.jw-pagination button:disabled{opacity:.4}
.jw-empty i{width:48px;height:48px;display:grid;place-items:center;border-radius:14px;background:#f3f0ff;color:#6546e8;font-size:19px;margin-bottom:10px}
.jw-empty strong{font-size:var(--font-ui);color:#404b60;margin-bottom:5px}
.jw-empty span{font-size:var(--font-xs)}
.jw-page-error button{margin-top:12px;border:0;border-radius:7px;padding:8px 14px;background:#6546e8;color:#fff;font-weight:700;font-size:var(--font-ui)}
.jw-skeleton i{display:block;width:75%;height:9px;border-radius:5px;background:linear-gradient(90deg,#edf0f5,#f8f9fb,#edf0f5);background-size:200% 100%;animation:jwShimmer 1.15s infinite}
.jw-modal{position:fixed;inset:0;z-index:10040;display:flex;align-items:center;justify-content:center;padding:22px}
.jw-modal__backdrop{position:absolute;inset:0;background:rgba(17,25,42,.56);backdrop-filter:blur(2px)}
.jw-modal__panel{position:relative;width:min(650px,96vw);max-height:92vh;overflow:auto;border-radius:14px;background:#fff;box-shadow:0 24px 75px rgba(15,23,42,.27);animation:jwModalIn .18s ease}
.jw-modal__panel--wide{width:min(930px,96vw)}
.jw-modal__head{position:sticky;top:0;z-index:3;display:flex;align-items:center;justify-content:space-between;padding:16px 18px;background:#fff;border-bottom:1px solid #e4e8ef}
.jw-modal__head span{display:block;color:#7d8698;font-size:var(--font-xs);margin-bottom:3px}
.jw-modal__head h2{font-weight:700;font-size:var(--font-lg);margin:0;color:#202a40}
.jw-modal__head button{width:30px;height:30px;border:1px solid #e0e5ed;border-radius:8px;background:#fff;color:#707b8d}
.jw-modal__body{padding:17px 18px}
.jw-detail-status{display:flex;align-items:center;gap:8px;margin-bottom:13px}
.jw-detail-status>span:last-child{font-size:var(--font-xs);color:#6f798b;background:#f3f5f8;border-radius:6px;padding:5px 8px}
.jw-info-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;border:1px solid #e2e7ef;background:#e2e7ef;border-radius:10px;overflow:hidden}
.jw-info{min-height:65px;background:#fff;padding:11px}
.jw-info span,.jw-info strong{display:block}
.jw-info span{font-size:var(--font-xs);color:#8790a1;margin-bottom:5px}
.jw-info strong{font-size:var(--font-sm);color:#303a50;line-height:1.55}
.jw-mono{}
.jw-summary-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-top:14px}
.jw-summary-strip>div{border:1px solid #e1e6ee;border-radius:9px;padding:12px;background:#fafbfc}
.jw-summary-strip span,.jw-summary-strip strong{display:block}
.jw-summary-strip span{font-size:var(--font-xs);color:#828b9d;margin-bottom:5px}
.jw-summary-strip strong{font-size:var(--font-ui)}
.jw-lines-wrap{border:1px solid #e0e5ed;border-radius:10px;overflow:auto;margin-top:15px}
.jw-source-items{margin-top:16px;padding:13px;border:1px solid #dce8fb;border-radius:11px;background:#f8fbff}.jw-source-items>header{display:flex;align-items:center;justify-content:space-between;gap:12px}.jw-source-items>header div{display:flex;align-items:center;gap:7px;color:#2458a7}.jw-source-items>header span{color:#738097;font-size:var(--font-xs)}.jw-source-items .jw-lines-wrap{margin-top:10px;background:#fff}.jw-source-items td small{display:block;color:#8791a4;margin-top:3px}
.jw-lines{width:100%;min-width:650px;border-collapse:collapse;font-size:var(--font-xs)}
.jw-lines th,.jw-lines td{padding:9px 10px;border-bottom:1px solid #e8ebf1}
.jw-lines th{background:#f7f8fb;color:#687386;font-size:var(--font-ui)}
.jw-lines td strong,.jw-lines td small{display:block}
.jw-lines td small{color:#8992a3;font-size:var(--font-xs);margin-top:2px}
.jw-lines tfoot td{background:#fafbfc;font-weight:700}
.jw-lines .jw-difference td{border-bottom:0}
.jw-difference.balanced td{background:#eefaf5;color:#137a57}
.jw-difference.unbalanced td{background:#fff0f2;color:#bd3f54}
.jw-modal__foot{position:sticky;bottom:0;display:flex;align-items:center;justify-content:flex-end;gap:7px;padding:12px 18px;background:#fff;border-top:1px solid #e4e8ef}
.jw-edit-meta{display:grid;grid-template-columns:180px 1fr;gap:10px}
.jw-edit-lines select,.jw-edit-lines input{height:32px;min-width:105px}
.jw-edit-lines .jw-line-account{min-width:210px}
.jw-edit-lines .jw-line-center{margin-top:5px;min-width:210px}
.jw-remove-line{width:28px;height:28px;border:1px solid #efd0d5;border-radius:6px;background:#fff5f6;color:#c54155}
.jw-add-line{margin-top:9px;border:1px dashed #b8aaf2;border-radius:7px;background:#f7f5ff;color:#6546e8;padding:7px 11px;font-weight:700;font-size:var(--font-xs)}
.jw-edit-totals{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:13px}
.jw-edit-totals>div{padding:10px;border:1px solid #e1e6ee;border-radius:8px;background:#fafbfc}
.jw-edit-totals span,.jw-edit-totals strong{display:block}
.jw-edit-totals span{font-size:var(--font-ui);color:#818a9b;margin-bottom:4px}
.jw-edit-totals strong{font-weight:700;font-size:var(--font-ui)}
.jw-edit-totals .balanced{color:#16805a}
.jw-edit-totals .unbalanced{color:#c23f54}
.jw-page-error{min-height:480px;display:flex;align-items:center;justify-content:center;flex-direction:column;background:#fff;border:1px solid #e1e6ee;border-radius:12px;text-align:center}
.jw-page-error>i{font-size:28px;color:#c34055}
.jw-page-error h2{font-size:var(--font-lg);margin:12px 0 5px}
.jw-page-error p{color:#7e8798;font-size:var(--font-sm)}
.jw-actions__menu.drop-up{top:auto;bottom:33px}
.jw-modal__head h2,.jw-mono{text-align:right}
@keyframes jwShimmer{
to{background-position:-200% 0}
}
@keyframes jwModalIn{
from{opacity:0;transform:translateY(12px) scale(.985)}to{opacity:1;transform:none}
}
@media(max-width:1280px){
    .jw-kpis{grid-template-columns:repeat(3,1fr)}
    .jw-filter{grid-template-columns:minmax(220px,1.5fr) repeat(3,minmax(130px,1fr))}
    .jw-reset{grid-column:auto}
    .jw-table{min-width:1120px}
}
@media(max-width:820px){
    .jw-header{align-items:flex-start;flex-direction:column}
    .jw-header__actions{width:100%}
    .jw-kpis{grid-template-columns:repeat(2,1fr)}
    .jw-filter{grid-template-columns:1fr 1fr}
    .jw-search{grid-column:1/-1}
    .jw-info-grid{grid-template-columns:repeat(2,1fr)}
    .jw-summary-strip,.jw-edit-totals{grid-template-columns:1fr}
    .jw-edit-meta{grid-template-columns:1fr}
    .jw-modal{padding:8px}
    .jw-modal__panel{max-height:96vh}
}
@media(max-width:500px){
    .jw-kpis{grid-template-columns:1fr}
    .jw-filter{grid-template-columns:1fr}
    .jw-info-grid{grid-template-columns:1fr}
    .jw-heading h1{font-size:var(--font-2xl)}
    .jw-kpi{min-height:84px}
    .jw-pagination{align-items:flex-start;gap:8px;flex-direction:column}
}
@media print{
    .sidebar,.topbar,.jw-header,.jw-kpis,.jw-filter,.jw-table-head,.jw-pagination{display:none!important}
    .jw-table-card{border:0;box-shadow:none}
    .jw-table{min-width:0}
    .jw-actions{display:none}
}
.je-form-container .je-table,.je-form-container .je-table td{overflow:visible!important}
.je-account-picker{position:relative;min-width:220px}
.je-account-picker .account-search{padding-inline-start:31px!important}
.je-account-search-icon{position:absolute;inset-inline-start:11px;top:50%;transform:translateY(-50%);color:#98a2b3;font-size:11px;z-index:2;pointer-events:none}
.account-search-results{position:absolute;top:calc(100% + 4px);right:0;left:0;z-index:120;max-height:260px;overflow:auto;background:#fff;border:1px solid #cfd8e5;border-radius:8px;box-shadow:0 14px 32px rgba(15,23,42,.16);padding:4px}
.account-search-option{width:100%;min-height:38px;border:0;border-bottom:1px solid #eef1f5;border-radius:5px;background:#fff;padding:7px 9px;display:flex;align-items:center;gap:9px;text-align:right;color:#344054;font-weight:700;font-size:var(--font-ui)}
.account-search-option:last-child{border-bottom:0}
.account-search-option:hover,.account-search-option.active{background:#f2efff;color:#5b3fd8}
.account-search-option code{direction:ltr;min-width:70px;padding:3px 6px;border-radius:5px;background:#f3f5f8;color:#657086;font-weight:700;font-size:var(--font-ui);font-family:var(--font-family-mono);text-align:center}
.account-search-option:hover code,.account-search-option.active code{background:#e7e1ff;color:#5b3fd8}
.account-search-empty{padding:14px;text-align:center;color:#8a94a6;font-size:var(--font-sm)}
.account-search-results[hidden]{display:none!important}
@media(max-width:720px){
    .je-account-picker{min-width:190px}
}
.jce-page{--jce-purple:#6546e8;--jce-purple-dark:#5637d3;--jce-purple-soft:#f4f1ff;--jce-border:#e2e7f0;--jce-text:#1b2539;--jce-muted:#7c8698;direction:rtl;color:var(--jce-text);max-width:1500px;margin:0 auto;padding:2px 0 28px;}
.jce-page *{box-sizing:border-box}
.jce-page-header{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:17px}
.jce-heading{display:flex;align-items:center;gap:13px}
.jce-heading-icon{width:48px;height:48px;display:grid;place-items:center;flex:0 0 auto;border-radius:13px;color:#fff;background:linear-gradient(145deg,#7358ec,#5b39d7);font-size:19px;box-shadow:0 8px 21px rgba(101,70,232,.2)}
.jce-breadcrumb{display:flex;align-items:center;gap:7px;margin-bottom:4px;color:#929aac;font-size:var(--font-xs)}
.jce-breadcrumb a{color:#7d8699;text-decoration:none}
.jce-breadcrumb strong{color:var(--jce-purple)}
.jce-breadcrumb i{font-size:7px}
.jce-heading h1{margin:0 0 4px;font-size:var(--font-2xl);line-height:1.2;font-weight:700;color:#172036}
.jce-heading p{margin:0;color:#7d8698;font-size:var(--font-sm)}
.jce-btn{min-height:36px;padding:8px 14px;border:1px solid transparent;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;gap:7px;font-weight:700;font-size:var(--font-ui);text-decoration:none!important;cursor:pointer;transition:.17s ease;white-space:nowrap}
.jce-btn:focus-visible{outline:3px solid rgba(101,70,232,.18);outline-offset:2px}
.jce-btn-secondary{border-color:#dfe4ec;background:#fff;color:#536075!important}
.jce-btn-secondary:hover{border-color:#c7bcf7;background:#f7f5ff;color:#5d3fdb!important}
.jce-btn-primary{min-width:122px;background:var(--jce-purple);color:#fff;box-shadow:0 6px 15px rgba(101,70,232,.2)}
.jce-btn-primary:hover{background:var(--jce-purple-dark);transform:translateY(-1px)}
.jce-btn-primary:disabled{opacity:.6;cursor:not-allowed;transform:none}
.jce-btn-cancel{border-color:#dfe4ec;background:#fff;color:#687286!important}
.jce-btn-cancel:hover{border-color:#edc8cf;background:#fff7f8;color:#bf4055!important}
.jce-btn-add{border-color:#d5ccfb;background:var(--jce-purple-soft);color:var(--jce-purple)}
.jce-btn-add:hover{border-color:#b7a9f2;background:#ebe6ff}
.jce-card{background:#fff;border:1px solid var(--jce-border);border-radius:12px;box-shadow:0 4px 17px rgba(21,32,54,.035)}
.jce-entry-card,.jce-lines-card{margin-bottom:13px}
.jce-card-header{min-height:61px;padding:13px 16px;display:flex;align-items:center;justify-content:space-between;gap:14px;border-bottom:1px solid #e9ecf2}
.jce-card-header>div{display:flex;align-items:center;gap:10px}
.jce-card-icon{width:35px;height:35px;display:grid;place-items:center;flex:0 0 auto;border-radius:9px;background:var(--jce-purple);color:#fff;font-size:13px}
.jce-card-icon-soft{background:var(--jce-purple-soft);color:var(--jce-purple)}
.jce-card-header h2{margin:0 0 3px;font-size:var(--font-base);font-weight:700;color:#202a40}
.jce-card-header p{margin:0;color:#8992a3;font-size:var(--font-xs)}
.jce-status{min-height:27px;padding:5px 9px;border-radius:15px;display:inline-flex;align-items:center;gap:6px;font-size:var(--font-xs);font-weight:700;white-space:nowrap}
.jce-status i{font-size:7px}
.jce-status-neutral{background:#f3f5f8;border:1px solid #e1e5ec;color:#788294}
.jce-status-balanced{background:#eaf8f2;border:1px solid #c8ebdc;color:#16805a}
.jce-status-unbalanced{background:#fff0f2;border:1px solid #f2ccd3;color:#bd4054}
.jce-form-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px;padding:16px}
.jce-field{display:block;margin:0}
.jce-field>span{display:block;margin:0 2px 6px;color:#59657a;font-size:var(--font-ui);font-weight:700}
.jce-field>span b,.jce-table .req{color:#ce455b}
.jce-field>small{display:block;margin:5px 3px 0;color:#9aa2b1;font-size:var(--font-xs)}
.jce-field-wide{grid-column:1/-1}
.jce-control{position:relative}
.jce-control>i{position:absolute;inset-inline-start:11px;top:50%;transform:translateY(-50%);z-index:2;color:#9ca5b5;font-size:11px;pointer-events:none}
.jce-control input,.jce-control select,.jce-control textarea{width:100%;min-height:37px;border:1px solid #dfe4ec;border-radius:8px;background:#fff;color:#334057;padding:7px 32px 7px 10px;font-weight:600;font-size:var(--font-ui);outline:none;transition:.15s}
.jce-control textarea{min-height:60px;resize:vertical;line-height:1.65;padding-top:10px}
.jce-control-textarea>i{top:18px}
.jce-control input:focus,.jce-control select:focus,.jce-control textarea:focus{border-color:#9c89ef;box-shadow:0 0 0 3px rgba(101,70,232,.08)}
.jce-control-disabled input{background:#f7f8fa;color:#778195}
.jce-options{margin:0 16px 16px;border:1px solid #e6e9ef;border-radius:9px;background:#fafbfc}
.jce-options summary{height:38px;padding:0 12px;display:flex;align-items:center;justify-content:space-between;list-style:none;color:#697488;font-size:var(--font-ui);font-weight:700;cursor:pointer}
.jce-options summary::-webkit-details-marker{display:none}
.jce-options summary span{display:flex;align-items:center;gap:7px}
.jce-options summary span i{color:var(--jce-purple)}
.jce-options summary>i{font-size:8px;transition:.17s}
.jce-options[open] summary>i{transform:rotate(180deg)}
.jce-options-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding:12px;border-top:1px solid #e9ecf1;background:#fff;border-radius:0 0 9px 9px}
.jce-lines-card{overflow:visible}
.jce-lines-header{border-bottom:0}
.jce-table-scroll{overflow-x:auto;overflow-y:visible;border-top:1px solid #e9ecf2;border-bottom:1px solid #e9ecf2}
.jce-table th{height:38px;padding:8px 10px!important;background:#f7f8fb!important;color:#6f798c!important;border:0!important;border-bottom:1px solid #e3e7ef!important;font-size:var(--font-ui) !important;font-weight:700 !important;text-align:right!important;white-space:nowrap}
.jce-table th:first-child{text-align:center!important}
.jce-table th:nth-child(2){width:31%}
.jce-table th:nth-child(4),.jce-table th:nth-child(5){width:15%}
.jce-table td{border:0!important;border-bottom:1px solid #edf0f4!important}
.jce-table tbody tr:last-child td{border-bottom:0!important}
.jce-table tbody tr:hover td{background:#fcfbff}
.jce-row-number{text-align:center!important;color:#8992a4;font-weight:700;font-size:var(--font-ui)}
.jce-page .je-account-picker{min-width:0}
.jce-page .je-cell-input{width:100%;min-height:34px;border:1px solid #dfe4ec;border-radius:7px;background:#fff;color:#354158;padding:6px 9px;font-weight:600;font-size:var(--font-ui);outline:none}
.jce-page .je-cell-input:focus{border-color:#9985ed;box-shadow:0 0 0 3px rgba(101,70,232,.07)}
.jce-line-center{position:relative;margin-top:5px}
.jce-line-center>i{position:absolute;right:9px;top:50%;transform:translateY(-50%);color:#9ba4b4;font-size:8px;pointer-events:none}
.jce-line-center select{height:27px!important;min-height:27px!important;padding:3px 24px 3px 7px!important;background:#fafbfc!important;color:#7c8596!important;font-size:var(--font-ui) !important}
.jce-amount{position:relative}
.jce-amount input{direction:ltr;text-align:right;font-weight:700;font-size:var(--font-ui)!important}
.jce-amount-debit input{color:#17845d}
.jce-amount-credit input{color:#c74b5e}
.jce-row-actions{text-align:center}
.jce-page .je-icon-btn{width:30px;height:30px;border:1px solid #ead3d8;border-radius:7px;background:#fff7f8;color:#bf4054;font-size:10px;cursor:pointer}
.jce-page .je-icon-btn:hover{border-color:#dfadb6;background:#ffeff2;color:#ad3045}
.jce-line-hint{padding:9px 15px;display:flex;align-items:center;gap:6px;color:#8b94a4;font-size:var(--font-xs)}
.jce-line-hint i{color:#7963df}
.jce-attachment-card,.jce-summary-section{min-width:0}
.jce-upload{min-height:83px;margin:13px;padding:13px;border:1px dashed #c9bdf7;border-radius:9px;background:#faf9ff;display:flex;align-items:center;justify-content:center;gap:11px;color:#6350c9;cursor:pointer;transition:.15s}
.jce-upload:hover{border-color:#9b88ed;background:#f5f2ff}
.jce-upload>i{width:36px;height:36px;border-radius:9px;background:#ece7ff;display:grid;place-items:center;font-size:14px}
.jce-upload span,.jce-upload strong,.jce-upload small{display:block}
.jce-upload strong{font-size:var(--font-xs);color:#5244a9;margin-bottom:3px}
.jce-upload small{font-size:var(--font-xs);color:#9299a8}
.jce-upload input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.jce-summary-section{padding:13px}
.jce-summary-box{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;height:100%}
.jce-summary-card{min-height:105px;padding:13px;border:1px solid #e2e6ee;border-radius:10px;background:#fbfcfd;display:flex;align-items:center;gap:10px}
.jce-summary-icon{width:37px;height:37px;display:grid;place-items:center;flex:0 0 auto;border-radius:9px;font-size:12px}
.jce-summary-icon.debit{background:#eaf8f2;color:#17845d}
.jce-summary-icon.credit{background:#fff1f2;color:#c74b5e}
.jce-summary-icon.difference{background:#f0edff;color:#6546e8}
.jce-summary-card span,.jce-summary-card strong,.jce-summary-card small{display:block}
.jce-summary-card>div>span{margin-bottom:4px;color:#818a9b;font-size:var(--font-xs)}
.jce-summary-card strong{display:inline;font-weight:700;font-size:var(--font-2xl);color:#263147}
.jce-summary-card small{display:inline;margin-inline-start:3px;color:#9aa2b0;font-size:var(--font-xs)}
.jce-summary-card.is-balanced{border-color:#c8eadb;background:#f3fbf7}
.jce-summary-card.is-balanced strong,.jce-summary-card.is-balanced small{color:#16805a}
.jce-summary-card.is-unbalanced{border-color:#f0ccd2;background:#fff7f8}
.jce-summary-card.is-unbalanced strong,.jce-summary-card.is-unbalanced small{color:#bd4054}
.jce-actions{min-height:65px;padding:12px 15px;border:1px solid var(--jce-border);border-radius:12px;background:#fff;box-shadow:0 4px 17px rgba(21,32,54,.035);display:flex;align-items:center;justify-content:space-between;gap:14px}
.jce-actions-right{display:flex;align-items:center;gap:8px}
.jce-actions-note{display:flex;align-items:center;gap:7px;color:#7d8798;font-size:var(--font-xs)}
.jce-actions-note i{color:#6546e8}
.jce-page .account-search-results{top:calc(100% + 5px);border-color:#d7ddec;border-radius:9px;box-shadow:0 15px 38px rgba(25,32,51,.16)}
.jce-page .account-search-option:hover,.jce-page .account-search-option.active{background:#f3f0ff;color:#5c3ed8}
@media(max-width:1100px){
    .jce-form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
    .jce-bottom-grid{grid-template-columns:1fr}
    .jce-summary-card{min-height:90px}
}
@media(max-width:720px){
    .jce-page-header{align-items:flex-start;flex-direction:column}
    .jce-page-header>.jce-btn{width:100%}
    .jce-heading{align-items:flex-start}
    .jce-heading-icon{width:43px;height:43px}
    .jce-heading h1{font-size:var(--font-lg)}
    .jce-form-grid,.jce-options-grid{grid-template-columns:1fr}
    .jce-field-wide{grid-column:auto}
    .jce-card-header{align-items:flex-start}
    .jce-lines-header{flex-direction:column}
    .jce-lines-header>.jce-btn{width:100%}
    .jce-summary-box{grid-template-columns:1fr}
    .jce-summary-card{min-height:76px}
    .jce-actions{align-items:stretch;flex-direction:column}
    .jce-actions-right{width:100%}
    .jce-actions-right .jce-btn{flex:1}
    .jce-actions-note{justify-content:center}
    .jce-breadcrumb{flex-wrap:wrap}
}
@media(max-width:440px){
    .jce-form-grid{padding:12px}
    .jce-card-header{padding:12px}
    .jce-status{white-space:normal}
    .jce-actions-right{flex-direction:column}
    .jce-actions-right .jce-btn{width:100%}
    .jce-upload{margin:10px}
}
.jce-table{min-width:780px;width:100%;border:0!important;border-radius:0!important;border-collapse:collapse!important;overflow:visible!important}
.jce-table th:first-child{width:38px}
.jce-table th:nth-child(3){width:25%}
.jce-table th:last-child{width:58px;text-align:center!important}
.jce-table td{padding:8px!important;height:64px;vertical-align:middle}
.jce-account-cell{min-width:240px;position:relative}
.jce-bottom-grid{grid-template-columns:minmax(0,.72fr) minmax(0,1.28fr);display:grid;gap:13px;margin-bottom:13px}
@media(max-width:1280px){
    .jce-form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
    .jce-bottom-grid{grid-template-columns:1fr}
    .jce-summary-card{min-height:90px}
}
.jce-notice{min-height:44px;margin:0 0 13px;padding:10px 13px;border:1px solid;border-radius:10px;display:flex;align-items:center;gap:9px;font-size:var(--font-sm);font-weight:700;box-shadow:0 4px 15px rgba(21,32,54,.04)}
.jce-notice[hidden]{display:none}
.jce-notice-error{color:#a9364a;background:#fff3f5;border-color:#efc7ce}
.jce-notice-success{color:#137452;background:#eefaf5;border-color:#c3ead9}
.jce-notice i{font-size:14px;flex:0 0 auto}
.jw-linked-party{display:flex;align-items:center;gap:4px;margin-top:5px;color:#8a6221;font-size:var(--font-xs);font-weight:700;white-space:normal}
.jw-linked-party i{color:#b88632}
.jw-page{--jw-primary:var(--primary,#2563eb);--jw-primary-dark:#1d4ed8;--jw-primary-soft:#eff6ff;--jw-border:#dce5f0;--jw-text:#14213d;direction:inherit;max-width:1540px;margin:0 auto;color:var(--jw-text);}
.jw-heading__icon{width:48px;height:48px;display:grid;place-items:center;flex:0 0 auto;border-radius:13px;background:var(--jw-primary);color:#fff;font-size:19px;box-shadow:0 8px 20px rgba(37,99,235,.18)}
.jw-heading nav{display:flex;align-items:center;gap:7px;color:#8a96a9;font-size:var(--font-xs);margin-bottom:4px}
.jw-heading nav i{font-size:7px;color:#a6afbc}
.jw-heading h1{font-size:var(--font-2xl)}
.jw-header__actions{flex-wrap:wrap}
.jw-btn{min-height:37px;border:1px solid transparent;border-radius:8px;padding:8px 13px;display:inline-flex;align-items:center;justify-content:center;gap:7px;color:#3e4b62;background:#fff;font-weight:700;font-size:var(--font-ui);text-decoration:none!important;cursor:pointer;white-space:nowrap;transition:.15s}
.jw-btn:disabled{opacity:.55;cursor:not-allowed}
.jw-btn--primary{background:var(--jw-primary);border-color:var(--jw-primary);color:#fff!important;box-shadow:0 5px 14px rgba(37,99,235,.18)}
.jw-btn--primary:hover{background:var(--jw-primary-dark);border-color:var(--jw-primary-dark)}
.jw-btn--outline{border-color:#d9e2ed;color:#415069!important}
.jw-btn--outline:hover{border-color:#a9c6f7;color:var(--jw-primary)!important;background:#f8fbff}
.jw-btn--ghost{border-color:#e1e7ef;background:#f8fafc;color:#657289}
.jw-btn--filter{height:35px;border-color:#c9d9f2;color:var(--jw-primary);background:var(--jw-primary-soft)}
.jw-btn--filter.is-open{color:#fff;background:var(--jw-primary);border-color:var(--jw-primary)}
.jw-btn--filter b{min-width:18px;height:18px;display:grid;place-items:center;border-radius:9px;background:#fff;color:var(--jw-primary);font-weight:700;font-size:var(--font-ui)}
.jw-btn--danger{background:#dc2626;border-color:#dc2626;color:#fff}
.jw-btn--warning{background:#d97706;border-color:#d97706;color:#fff}
.jw-kpis{grid-template-columns:repeat(4,minmax(0,1fr));gap:11px;margin-bottom:13px}
.jw-kpi{justify-content:flex-start;min-height:91px;color:#2563eb;padding:15px;border:1px solid var(--jw-border);border-radius:11px;display:flex;align-items:center;gap:10px;overflow:hidden}
.jw-kpi:before{width:3px;content:"";position:absolute;inset-inline-start:0;top:0;bottom:0;background:currentColor;opacity:.8}
.jw-kpi__icon{width:39px;height:39px;display:grid!important;place-items:center;flex:0 0 auto;border-radius:10px;background:var(--jw-primary-soft);color:var(--jw-primary);font-size:15px}
.jw-kpi>div{min-width:0}
.jw-kpi small,.jw-kpi strong,.jw-kpi em{display:block}
.jw-kpi small{margin:0 0 5px;color:#728096;font-size:var(--font-xs);font-weight:700}
.jw-kpi strong{font-weight:700;font-size:var(--font-2xl);color:#17223b;line-height:1.15}
.jw-kpi em{margin-top:5px;color:#99a3b2;font-size:var(--font-xs);font-style:normal}
.jw-kpi--posted{color:#15966a}
.jw-kpi--posted .jw-kpi__icon{background:#eaf8f2;color:#11815b}
.jw-kpi--draft{color:#e39a25}
.jw-kpi--draft .jw-kpi__icon{background:#fff7e8;color:#ca8012}
.jw-kpi--today{color:#64748b}
.jw-kpi--today .jw-kpi__icon{background:#f1f5f9;color:#64748b}
.jw-filter{display:block;padding:12px;align-items:end;gap:8px;background:#fff;border:1px solid var(--jw-border);border-radius:11px;margin-bottom:13px}
.jw-filter-primary{display:grid;grid-template-columns:minmax(250px,1.6fr) repeat(5,minmax(125px,.72fr)) auto auto;align-items:end;gap:9px}
.jw-field{display:block;min-width:0}
.jw-field>span{display:block;margin:0 3px 5px;color:#68778e;font-size:var(--font-ui);font-weight:700}
.jw-control{position:relative}
.jw-control>i{position:absolute;inset-inline-start:11px;bottom:11px;color:#98a5b7;font-size:10px;pointer-events:none;z-index:1}
.jw-control>i+input{padding-inline-start:31px}
.jw-filter input,.jw-filter select,.jw-field input,.jw-field select,.jw-field textarea{width:100%;height:35px;border:1px solid #d9e2ed;border-radius:7px;background:#fff;color:#334158;padding:6px 9px;font-weight:700;font-size:var(--font-ui);outline:0}
.jw-field textarea{height:auto;min-height:74px;resize:vertical}
.jw-filter input:focus,.jw-filter select:focus,.jw-field input:focus,.jw-field select:focus,.jw-field textarea:focus{border-color:#7dabef;box-shadow:0 0 0 3px rgba(37,99,235,.08)}
.jw-reset{height:35px}
.jw-advanced{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:11px;padding:11px;border:1px solid #e4eaf2;border-radius:9px;background:#f8fafc}
.jw-advanced[hidden]{display:none!important}
.jw-content-grid{display:grid;grid-template-columns:278px minmax(0,1fr);gap:12px;align-items:start}
.jw-side{display:grid;gap:12px;position:sticky;top:76px}
.jw-side-card{border:1px solid var(--jw-border);border-radius:12px;background:#fff;box-shadow:0 4px 17px rgba(21,32,54,.03);overflow:hidden}
.jw-side-card>header{display:flex;align-items:center;gap:9px;padding:13px;border-bottom:1px solid #e8edf3}
.jw-side-card>header>span{width:32px;height:32px;display:grid;place-items:center;flex:0 0 auto;border-radius:8px;color:var(--jw-primary);background:var(--jw-primary-soft)}
.jw-side-card h2{margin:0 0 3px;font-size:var(--font-sm);font-weight:700}
.jw-side-card p{margin:0;color:#8c97a8;font-size:var(--font-xs)}
.jw-accounting-summary dl{margin:0;padding:5px 13px}
.jw-accounting-summary dl>div{display:flex;justify-content:space-between;gap:10px;padding:10px 0;border-bottom:1px solid #edf1f5}
.jw-accounting-summary dl>div:last-child{border-bottom:0}
.jw-accounting-summary dt{color:#758196;font-size:var(--font-xs)}
.jw-accounting-summary dd{margin:0;font-weight:700;font-size:var(--font-xs)}
.jw-summary-difference dd{color:#334155}
.jw-balance-state{margin:0 13px 13px;min-height:31px;border-radius:7px;display:flex;align-items:center;justify-content:center;gap:6px;font-size:var(--font-ui);font-weight:700}
.jw-balance-state.is-balanced{background:#eaf8f2;color:#137656}
.jw-balance-state.is-unbalanced{background:#fff1f2;color:#b83247}
.jw-stats{list-style:none;margin:0;padding:6px 13px}
.jw-stats li{display:flex;justify-content:space-between;align-items:center;padding:10px 0;border-bottom:1px solid #edf1f5;color:#6d7a8f;font-size:var(--font-xs)}
.jw-stats li:last-child{border-bottom:0}
.jw-stats strong{font-weight:700;font-size:var(--font-sm);color:#253147}
.jw-quick{display:grid;gap:7px;padding:12px}
.jw-quick button{min-height:34px;border:1px solid #d8e2ee;border-radius:7px;background:#fff;color:#46556c;display:flex;align-items:center;gap:8px;padding:7px 10px;font-weight:700;font-size:var(--font-ui);cursor:pointer}
.jw-quick button:hover{border-color:#a8c5f3;background:#f8fbff;color:var(--jw-primary)}
.jw-quick button i{width:16px;color:var(--jw-primary)}
.jw-table-card{min-width:0;position:relative;background:#fff;overflow:visible}
.jw-table-head>label{display:flex;align-items:center;gap:7px;color:#7b8799;font-size:var(--font-sm);font-weight:700}
.jw-table-head select{height:30px;border:1px solid #dce4ee;border-radius:6px;padding:4px 7px;background:#fff;color:#445168;font-weight:700;font-size:var(--font-ui)}
.jw-table-wrap{overflow:auto;min-height:330px}
.jw-table{min-width:1120px;width:100%;border-collapse:collapse;font-size:var(--font-ui)}
.jw-table th{text-align:start}
.jw-table td{text-align:start}
.jw-row-index{color:#96a0af;font-weight:700;font-size:var(--font-xs)}
.jw-reference{color:var(--jw-primary)}
.jw-type{background:var(--jw-primary-soft);color:#1d5bbf;white-space:nowrap}
.jw-status--posted{color:#137656;background:#eaf8f2;border:1px solid #c6e9da}
.jw-status--draft{color:#966116;background:#fff7e7;border:1px solid #f4deb2}
.jw-status--voided{color:#b9364e;background:#fff0f2;border:1px solid #f0cbd2}
.jw-actions__trigger:hover{border-color:#9ebef0;color:var(--jw-primary);background:#f6faff}
.jw-actions__menu[hidden]{display:none!important}
.jw-actions__menu:not([hidden]){display:block}
.jw-actions__menu button{text-align:start}
.jw-actions__menu button i{color:var(--jw-primary)}
.jw-pagination button.active{background:var(--jw-primary);border-color:var(--jw-primary);color:#fff}
.jw-empty{gap:2px;min-height:245px;display:flex;align-items:center;justify-content:center;flex-direction:column;color:#8790a2}
.jw-empty--error i{background:#fff0f2;color:#c44257}
.jw-empty button{margin-top:9px;border:0;border-radius:7px;background:var(--jw-primary);color:#fff;padding:8px 13px;font-weight:700;font-size:var(--font-ui)}
.jw-source-ref{unicode-bidi:plaintext}
.jw-description{max-width:245px;white-space:nowrap}
.jw-confirm{min-height:82px;display:flex;align-items:center;gap:13px;padding:14px;border:1px solid #dce5ef;border-radius:10px;background:#f8fafc;margin-bottom:13px}
.jw-confirm>i{width:40px;height:40px;display:grid;place-items:center;flex:0 0 auto;border-radius:10px;background:#e8f1ff;color:var(--jw-primary);font-size:16px}
.jw-confirm p{margin:0;color:#4e5c72;font-size:var(--font-sm);line-height:1.8}
.jw-confirm--danger{border-color:#f1c8cf;background:#fff5f6}
.jw-confirm--danger>i{background:#fee2e2;color:#c7354c}
.jw-confirm--warning{border-color:#f0d2a4;background:#fff8eb}
.jw-confirm--warning>i{background:#ffedc8;color:#b86e0e}
[dir="ltr"] .jw-page .fa-chevron-left{transform:rotate(180deg)}
[dir="ltr"] .jw-page .jw-modal__head h2,[dir="ltr"] .jw-page .jw-mono{text-align:left}
.jw-modal__head h2,.jw-mono{unicode-bidi:plaintext;direction:ltr}
.jw-lines th,.jw-lines td{text-align:start}
@media(max-width:1400px){
    .jw-filter-primary{grid-template-columns:minmax(240px,1.6fr) repeat(3,minmax(125px,1fr)) auto auto}
    .jw-filter-primary .jw-field:nth-child(5),.jw-filter-primary .jw-field:nth-child(6){grid-row:2}
    .jw-content-grid{grid-template-columns:245px minmax(0,1fr)}
}
@media(max-width:1100px){
    .jw-content-grid{grid-template-columns:1fr}
    .jw-side{position:static;grid-template-columns:repeat(3,minmax(0,1fr));order:2}
    .jw-table-card{order:1}
    .jw-filter-primary{grid-template-columns:repeat(3,minmax(0,1fr))}
    .jw-filter-primary .jw-field:nth-child(1){grid-column:span 2}
    .jw-filter-primary .jw-field:nth-child(5),.jw-filter-primary .jw-field:nth-child(6){grid-row:auto}
}
@media(max-width:760px){
    .jw-header{align-items:stretch}
    .jw-header__actions{width:100%}
    .jw-header__actions>*{flex:1}
    .jw-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
    .jw-filter-primary,.jw-advanced{grid-template-columns:1fr 1fr}
    .jw-filter-primary .jw-field:nth-child(1){grid-column:1/-1}
    .jw-side{grid-template-columns:1fr}
    .jw-info-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:480px){
    .jw-kpis,.jw-filter-primary,.jw-advanced,.jw-info-grid{grid-template-columns:1fr}
    .jw-filter-primary .jw-field:nth-child(1){grid-column:auto}
    .jw-heading__icon{width:42px;height:42px}
    .jw-heading h1{font-size:var(--font-2xl)}
}

/* Account classification in the journal account picker, the chosen line and the journal details (shared badge). */
.account-search-option .je-option-copy{display:flex;flex-direction:column;align-items:flex-start;gap:2px;min-width:0;text-align:start}
.account-search-option .je-option-copy .coa-account-class{margin-top:0}
.je-account-selected{margin-top:4px;line-height:1}
.je-account-selected .coa-account-class{margin-top:0}
.jw-lines td .coa-account-class{display:flex;margin:3px 0 2px}

/* finance-vouchers.css */
/* Finance vouchers (Payment / Receipt): one shared visual system for both
   list, form and detail screens. Direction follows the document, so the same
   rules serve Arabic (RTL) and English (LTR). The document-entry system
   (document-entry.css) keeps styling the form shell via .fv-reference-form. */
.fv-app { --fv-accent: var(--primary, #2563eb); --fv-accent-soft: #eff6ff; --fv-ink: #172033; --fv-muted: #64748b; --fv-line: #e2e8f0; --fv-surface: #fff; --fv-radius: 12px; --fv-shadow: 0 3px 13px rgba(20, 35, 61, .035); color: var(--fv-ink); direction: inherit; max-width: 1480px; margin: 0 auto; }
.fv-app *, .fv-app *::before, .fv-app *::after { box-sizing: border-box; }
.fv-card { background: var(--fv-surface); border: 1px solid var(--fv-line); border-radius: var(--fv-radius); box-shadow: var(--fv-shadow); padding: 16px; }
.fv-card-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.fv-section-title { margin: 0 0 12px; font-size: var(--font-base); font-weight: 700; }
.fv-code { display: inline-block; padding: 2px 8px; border-radius: 6px; background: #f1f5f9; color: #334155; font-family:var(--font-family-mono); font-size: var(--font-sm); font-weight: 700; direction: ltr; unicode-bidi: isolate; white-space: nowrap; }

/* Buttons */
.fv-btn { border: 1px solid transparent; border-radius: 9px; padding: 9px 14px; min-height: 38px; cursor: pointer; font: inherit; font-size: var(--font-ui); font-weight: 700; display: inline-flex; align-items: center; justify-content: center; gap: 7px; white-space: nowrap; transition: background .15s, border-color .15s, color .15s; }
.fv-btn:disabled { opacity: .55; cursor: not-allowed; }
.fv-btn--primary { background: var(--fv-accent); color: #fff; }
.fv-btn--primary:hover:not(:disabled) { background: #1d4ed8; }
.fv-btn--outline { background: #fff; border-color: #cbd5e1; color: #334155; }
.fv-btn--outline:hover:not(:disabled) { border-color: var(--fv-accent); color: var(--fv-accent); }
.fv-btn--ghost { background: transparent; color: var(--fv-muted); }
.fv-btn--ghost:hover:not(:disabled) { background: #f1f5f9; color: var(--fv-ink); }
.fv-btn--sm { padding: 6px 10px; min-height: 32px; font-size: var(--font-ui); border-radius: 8px; }
.fv-back-icon { width: 38px; padding: 0; }

/* Page header */
.fv-page-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 16px; }
.fv-page-head__title { display: flex; align-items: center; gap: 13px; min-width: 0; }
.fv-page-head__icon { width: 46px; height: 46px; display: grid; place-items: center; border-radius: 12px; background: var(--fv-accent-soft); color: var(--fv-accent); font-size: 19px; flex: 0 0 46px; }
.fv-page-head h1 { margin: 0 0 3px; font-size: var(--font-2xl); font-weight: 700; line-height: 1.25; }
.fv-page-head p { margin: 0; color: var(--fv-muted); font-size: var(--font-ui); }
.fv-page-head--detail p { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }

/* Summary cards */
.fv-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-bottom: 14px; }
.fv-kpi { display: flex; align-items: center; gap: 12px; padding: 13px 15px; background: var(--fv-surface); border: 1px solid var(--fv-line); border-radius: var(--fv-radius); box-shadow: var(--fv-shadow); min-width: 0; }
.fv-kpi > i { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 10px; background: var(--fv-accent-soft); color: var(--fv-accent); font-size: 15px; flex: 0 0 38px; }
.fv-kpi span { display: block; color: var(--fv-muted); font-size: var(--font-sm); margin-bottom: 3px; }
.fv-kpi strong { display: block; font-size: var(--font-2xl); font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* Filters */
.fv-filter { margin-bottom: 14px; display: grid; gap: 10px; }
.fv-filter__row { display: grid; grid-template-columns: minmax(220px, 1.6fr) repeat(4, minmax(0, 1fr)) auto; gap: 10px; align-items: end; }
.fv-filter__row--advanced { grid-template-columns: repeat(3, minmax(0, 1fr)); padding-top: 10px; border-top: 1px dashed var(--fv-line); }
.fv-filter__actions { display: flex; gap: 6px; flex-wrap: wrap; }
.fv-field { display: grid; gap: 5px; min-width: 0; }
.fv-field > span { color: var(--fv-muted); font-size: var(--font-ui); font-weight: 700; }
.fv-field small { color: var(--fv-muted); font-size: var(--font-xs); }
.fv-field small.fv-note--danger { color: #b91c1c; font-weight: 700; }
.fv-input { width: 100%; min-height: 38px; padding: 8px 11px; border: 1px solid #cbd5e1; border-radius: 9px; background: #fff; color: var(--fv-ink); font: inherit; font-size: var(--font-ui); }
.fv-input:focus { outline: none; border-color: var(--fv-accent); box-shadow: 0 0 0 3px rgba(37, 99, 235, .12); }
.fv-input[readonly] { background: #f8fafc; color: var(--fv-muted); }
textarea.fv-input { resize: vertical; min-height: 64px; }

/* Table */
.fv-table-card { padding: 0; overflow: hidden; }
.fv-table-wrap { overflow-x: auto; }
.fv-table { width: 100%; border-collapse: collapse; font-size: var(--font-ui); }
.fv-table th { padding: 11px 12px; background: #f8fafc; color: var(--fv-muted); font-size: var(--font-ui); font-weight: 700; text-align: start; border-bottom: 1px solid var(--fv-line); white-space: nowrap; }
.fv-table td { padding: 10px 12px; border-bottom: 1px solid #eef2f6; vertical-align: middle; }
.fv-table tbody tr:last-child td { border-bottom: 0; }
.fv-table tbody tr[data-action="open"] { cursor: pointer; }
.fv-table tbody tr[data-action="open"]:hover td { background: #f8fbff; }
.fv-td-index { color: var(--fv-muted); font-size: var(--font-sm); width: 44px; }
.fv-td-statement { max-width: 260px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fv-td-amount { font-weight: 700; white-space: nowrap; }
.fv-td-actions { width: 56px; text-align: center; }
.fv-cell-title { font-weight: 700; }
.fv-cell-sub { color: var(--fv-muted); font-size: var(--font-xs); margin-top: 2px; }
.fv-badge { display: inline-flex; align-items: center; padding: 3px 9px; border-radius: 999px; font-size: var(--font-xs); font-weight: 700; line-height: 1.4; }
.fv-badge--draft { background: #fff7ed; color: #c2410c; }
.fv-badge--posted { background: #ecfdf5; color: #047857; }
.fv-badge--voided { background: #fef2f2; color: #b91c1c; }

/* Action menu (shared by list rows and the detail header) */
.fv-more { position: relative; display: inline-block; }
.fv-more__trigger { width: 32px; height: 32px; border: 1px solid #cbd5e1; border-radius: 8px; background: #fff; color: #475569; cursor: pointer; display: inline-grid; place-items: center; }
.fv-more__trigger:hover, .fv-more.open .fv-more__trigger { border-color: var(--fv-accent); color: var(--fv-accent); }
.fv-more--wide .fv-more__trigger { width: 38px; height: 38px; border-radius: 9px; }
.fv-menu { position: absolute; top: calc(100% + 4px); inset-inline-end: 0; min-width: 190px; padding: 6px; background: #fff; border: 1px solid var(--fv-line); border-radius: 10px; box-shadow: 0 12px 32px rgba(20, 35, 61, .14); display: none; z-index: 30; }
.fv-more.open .fv-menu { display: block; }
.fv-menu button { width: 100%; display: flex; align-items: center; gap: 9px; padding: 8px 10px; border: 0; border-radius: 7px; background: transparent; color: var(--fv-ink); font: inherit; font-size: var(--font-ui); text-align: start; cursor: pointer; }
.fv-menu button i { width: 16px; color: var(--fv-muted); text-align: center; }
.fv-menu button:hover { background: #f1f5f9; }
.fv-menu button.fv-menu__danger, .fv-menu button.fv-menu__danger i { color: #b91c1c; }
.fv-menu button.fv-menu__danger:hover { background: #fef2f2; }
.fv-menu__divider { margin: 5px 4px; border: 0; border-top: 1px solid var(--fv-line); }
.fv-more--up .fv-menu { box-shadow: 0 -12px 32px rgba(20, 35, 61, .14); }
.fv-journal-link { display: inline-flex; align-items: center; gap: 6px; color: var(--fv-accent); text-decoration: none; font-weight: 700; }
.fv-journal-link:hover .fv-code { background: var(--fv-accent-soft); color: var(--fv-accent); }

/* Pagination */
.fv-pagination { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 14px; border-top: 1px solid var(--fv-line); background: #fafbfc; flex-wrap: wrap; }
.fv-pagination__info { display: flex; align-items: center; gap: 14px; color: var(--fv-muted); font-size: var(--font-ui); flex-wrap: wrap; }
.fv-pagination__size { display: inline-flex; align-items: center; gap: 7px; }
.fv-pagination__size .fv-input { width: auto; min-height: 32px; padding: 4px 8px; }
.fv-pagination__pages { display: flex; align-items: center; gap: 4px; }

/* Empty / loading / error states */
.fv-empty { padding: 36px 16px; text-align: center; color: var(--fv-muted); display: grid; justify-items: center; gap: 10px; }
.fv-empty > i { font-size: 26px; color: #cbd5e1; }
.fv-empty p { margin: 0; font-size: var(--font-base); font-weight: 700; color: #475569; }
.fv-empty--inline { padding: 16px; font-size: var(--font-ui); font-weight: 500; }
.fv-empty--error, .fv-empty--error p { color: #b91c1c; }
.fv-skeleton { position: relative; overflow: hidden; background: #eef2f6; border-radius: 10px; }
.fv-skeleton::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .7), transparent); animation: fv-shimmer 1.2s infinite; }
.fv-skeleton--head { height: 46px; margin-bottom: 16px; }
.fv-skeleton--kpi { height: 66px; }
.fv-skeleton--filter { height: 74px; margin-bottom: 14px; }
.fv-skeleton--row { height: 42px; margin: 10px 12px; }
@keyframes fv-shimmer { from { transform: translateX(-100%); } to { transform: translateX(100%); } }

/* Form (create / edit): top toolbar, tabs, three-column grid */
.fv-form-toolbar h1 { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.fv-form-toolbar .de-header-actions .de-btn { min-width: 92px; font-size: var(--font-ui); }
.fv-form-tabs-row { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; margin-bottom: 0; }
.fv-form-tabs-row .fv-tabs { margin-bottom: 0; border-bottom: 0; }
.fv-form-tabs-row .fv-tab { padding: 11px 16px; border: 1px solid transparent; border-bottom: 0; border-radius: 10px 10px 0 0; }
.fv-form-tabs-row .fv-tab.active { background: #fff; border-color: var(--fv-line); border-bottom-color: #fff; margin-bottom: -1px; }
.fv-form-tabs-row .de-btn { margin-bottom: 6px; font-size: var(--font-ui); }
.fv-tab__count { display: inline-grid; place-items: center; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 999px; background: var(--fv-accent); color: #fff; font-size: var(--font-xs); }
.fv-tab__count[hidden] { display: none; }
.fv-reference-form { max-width: 1480px; }
.fv-reference-sheet { background: #fff; border: 1px solid var(--fv-line); border-radius: 0 0 var(--fv-radius) var(--fv-radius); padding: 18px; }
.fv-pane { display: grid; gap: 14px; }
.fv-pane[hidden] { display: none; }
.fv-required { color: #d44255; font-weight: 700; }
.fv-reference-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px 16px; align-items: start; }
.fv-field--description textarea.fv-input { min-height: 104px; }
.fv-amount-box { display: flex; align-items: stretch; }
.fv-amount-box .fv-input { border-start-start-radius: 0; border-end-start-radius: 0; font-weight: 700; }
.fv-reference-grid .fv-amount-box .fv-amount-input { height: 52px; min-height: 52px; font-size: var(--font-2xl); color: var(--fv-accent); border-color: #bfdbfe; text-align: end; }
.fv-amount-box .fv-amount-input:focus { border-color: var(--fv-accent); }
.fv-currency-box { display: inline-flex; align-items: center; padding: 0 14px; border: 1px solid #bfdbfe; border-inline-end: 0; border-start-start-radius: 9px; border-end-start-radius: 9px; background: #f8fafc; color: var(--fv-muted); font-size: var(--font-ui); font-weight: 700; }
.fv-dropzone { display: grid; justify-items: center; gap: 4px; padding: 22px 16px; border: 1.5px dashed #cbd5e1; border-radius: 10px; background: #fff; color: var(--fv-muted); text-align: center; cursor: pointer; transition: border-color .15s, background .15s; }
.fv-dropzone:hover { border-color: var(--fv-accent); background: #f8fbff; }
.fv-dropzone i { color: var(--fv-accent); font-size: 26px; margin-bottom: 4px; }
.fv-dropzone strong { color: var(--fv-ink); font-size: var(--font-ui); }
.fv-dropzone small { font-size: var(--font-xs); }
.fv-dropzone input { display: none; }
.fv-dropzone--compact { min-height: 104px; padding: 14px 12px; }
.fv-dropzone--compact i { font-size: 22px; }
.fv-attachments { display: grid; gap: 6px; }
.fv-tax-box { display: grid; gap: 8px; }
.fv-tax-line { display: inline-flex; align-items: center; gap: 8px; min-height: 38px; font-size: var(--font-ui); font-weight: 600; cursor: pointer; }
.fv-tax-line i { color: var(--fv-accent); font-size: 11px; }
.fv-tax-rate { display: grid; grid-template-columns: auto 90px auto 1fr; align-items: center; gap: 8px; padding: 8px 10px; border: 1px solid #edf1f5; border-radius: 9px; background: #f8fafc; font-size: var(--font-sm); color: var(--fv-muted); }
.fv-tax-rate strong { color: var(--fv-ink); font-size: var(--font-ui); }
.fv-tax-rate[hidden] { display: none; }
.fv-details { border: 1px solid #edf1f5; border-radius: 10px; background: #fcfdff; }
.fv-details summary { display: flex; align-items: center; gap: 8px; padding: 11px 14px; cursor: pointer; font-size: var(--font-ui); font-weight: 700; list-style: none; }
.fv-details summary::-webkit-details-marker { display: none; }
.fv-details summary i { color: var(--fv-accent); }
.fv-details[open] summary { border-bottom: 1px solid #edf1f5; }
.fv-details > .fv-reference-grid { padding: 14px; }
.fv-inline-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.fv-form-section { padding: 14px; border: 1px solid #edf1f5; border-radius: 10px; background: #fcfdff; }
.fv-form-section h3 { display: flex; align-items: center; gap: 8px; margin: 0 0 12px; font-size: var(--font-base); font-weight: 700; }
.fv-form-section h3 i { color: var(--fv-accent); }
.fv-form-section[hidden] { display: none; }
.fv-account-picker { position: relative; }
.fv-account-results { position: absolute; inset-inline: 0; top: calc(100% + 4px); max-height: 260px; overflow: auto; background: #fff; border: 1px solid var(--fv-line); border-radius: 10px; box-shadow: 0 12px 32px rgba(20, 35, 61, .14); z-index: 25; }
.fv-account-results[hidden] { display: none; }
.fv-account-option { width: 100%; display: flex; align-items: center; gap: 10px; padding: 8px 10px; border: 0; background: transparent; font: inherit; font-size: var(--font-ui); text-align: start; cursor: pointer; }
.fv-account-option:hover { background: #f1f5f9; }
.fv-account-option code { color: var(--fv-accent); font-weight: 700; direction: ltr; }
.fv-account-results__empty { padding: 14px; color: var(--fv-muted); font-size: var(--font-ui); text-align: center; }
.fv-invoices { display: grid; gap: 8px; }
.fv-invoice { display: grid; grid-template-columns: auto 1fr 170px; align-items: center; gap: 12px; padding: 10px 12px; border: 1px solid #edf1f5; border-radius: 9px; background: #fff; }
.fv-total { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 12px; border-radius: 9px; background: #f8fafc; font-size: var(--font-ui); }
.fv-total strong { font-size: var(--font-ui); font-weight: 700; }
.fv-grand-row { background: var(--fv-accent-soft); color: #1e3a8a; }
.fv-preview-note { display: flex; align-items: center; gap: 7px; margin: 0; color: var(--fv-muted); font-size: var(--font-xs); }
.fv-preview-note i { color: var(--fv-accent); }
.fv-table tfoot td { background: #f8fafc; font-weight: 700; }

/* Detail */
.fv-tabs { display: flex; gap: 4px; margin-bottom: 12px; border-bottom: 1px solid var(--fv-line); overflow-x: auto; }
.fv-tab { padding: 10px 14px; border: 0; border-bottom: 2px solid transparent; background: transparent; color: var(--fv-muted); font: inherit; font-size: var(--font-ui); font-weight: 700; cursor: pointer; white-space: nowrap; }
.fv-tab.active { color: var(--fv-accent); border-bottom-color: var(--fv-accent); }
.fv-detail-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.fv-detail { display: grid; gap: 4px; padding: 10px 12px; border: 1px solid #edf1f5; border-radius: 9px; background: #fcfdff; }
.fv-detail span { color: var(--fv-muted); font-size: var(--font-sm); }
.fv-detail strong { font-size: var(--font-ui); font-weight: 700; overflow-wrap: anywhere; }
.fv-detail--wide { margin-top: 12px; }
.fv-detail .fv-amount { font-size: var(--font-ui); color: #1e3a8a; }
.fv-journal-gap { margin-top: 22px; }
.fv-file { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 0; border-bottom: 1px solid #eef2f6; }
.fv-file:last-child { border-bottom: 0; }
.fv-activity { padding: 10px 0; border-bottom: 1px solid #eef2f6; }
.fv-activity:last-child { border-bottom: 0; }
.fv-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }

/* Responsive */
@media (max-width: 1150px) {
    .fv-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .fv-filter__row { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .fv-filter__search, .fv-filter__actions { grid-column: 1 / -1; }
    .fv-detail-grid, .fv-reference-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .fv-form-tabs-row { flex-direction: column; align-items: stretch; }
    .fv-form-tabs-row .fv-tabs { overflow-x: auto; }
}
@media (max-width: 720px) {
    .fv-page-head, .fv-form-toolbar { flex-direction: column; align-items: stretch; }
    .fv-form-toolbar .de-header-actions .de-btn { flex: 1; }
    .fv-page-head .fv-btn--primary { width: 100%; }
    .fv-kpis, .fv-filter__row, .fv-filter__row--advanced, .fv-detail-grid, .fv-reference-grid { grid-template-columns: 1fr; }
    .fv-tax-rate { grid-template-columns: auto 1fr; }
    .fv-invoice { grid-template-columns: auto 1fr; }
    .fv-invoice .fv-input { grid-column: 1 / -1; }
    .fv-pagination { justify-content: center; }
    .fv-td-statement { max-width: 160px; }
}

/* finance-treasuries.css */
/* Treasuries & bank accounts — rules that only this screen needs. The page
   head, KPI cards, filters, table, menus, tabs and detail grid come from the
   finance design system in finance-vouchers.css. */

.ft-avatar { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 10px; background: #fff; border: 1px solid var(--fv-line, #e2e8f0); overflow: hidden; flex: 0 0 auto; }
.ft-avatar img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; }
.ft-avatar--fallback { color: #64748b; background: #f1f5f9; }
.ft-avatar--cash { color: #0f766e; background: #ecfdf5; border-color: #a7f3d0; }
.ft-avatar--lg { width: 56px; height: 56px; border-radius: 14px; }
.ft-td-bank { display: flex; align-items: center; gap: 10px; }
.ft-td-number small { display: block; color: #64748b; font-size: var(--font-ui); }
.ft-negative, .ft-negative strong { color: #b91c1c; }
.ft-deposit { color: #15803d; }
.ft-withdrawal { color: #b91c1c; }
.ft-type-tabs { margin-bottom: 12px; }
.ft-inline-bank { display: inline-flex; align-items: center; gap: 8px; }

.ft-detail-kpis .fv-kpi strong { font-size: var(--font-2xl); }
.ft-period-strip { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin: 12px 0; }
.ft-period-strip > div { border: 1px solid var(--fv-line, #e2e8f0); border-radius: 10px; padding: 10px 12px; background: #f8fafc; }
.ft-period-strip span { display: block; font-size: var(--font-sm); color: #64748b; margin-bottom: 4px; }
.ft-period-strip strong { font-size: var(--font-base); }
.ft-source { display: inline-block; padding: 2px 8px; border-radius: 999px; font-size: var(--font-sm); background: #eef2ff; color: #3730a3; white-space: nowrap; }
.ft-source--payment_voucher, .ft-source--payment_voucher_reversal, .ft-source--supplier_payment { background: #fef2f2; color: #991b1b; }
.ft-source--receipt_voucher, .ft-source--receipt_voucher_reversal, .ft-source--customer_payment { background: #ecfdf5; color: #065f46; }
.ft-source--treasury_transfer, .ft-source--treasury_transfer_reversal { background: #f5f3ff; color: #5b21b6; }
.ft-source--manual, .ft-source--opening_balance { background: #f1f5f9; color: #334155; }
.ft-cross { color: #b45309; font-size: var(--font-sm); }

.ft-recon-status { display: flex; align-items: center; gap: 12px; padding: 14px 16px; border-radius: 12px; margin-bottom: 14px; }
.ft-recon-status.is-ok { background: #ecfdf5; color: #065f46; }
.ft-recon-status.is-warn { background: #fffbeb; color: #92400e; }
.ft-recon-status i { font-size: 1.6rem; }
.ft-recon-status strong { display: block; }
.ft-recon-status span { font-size: var(--font-xs); opacity: 0.85; }
.ft-recon-sheet { display: flex; flex-direction: column; gap: 6px; max-width: 560px; margin-bottom: 16px; }
.ft-recon-line { display: flex; justify-content: space-between; align-items: center; padding: 10px 14px; border: 1px solid var(--fv-line, #e2e8f0); border-radius: 10px; }
.ft-recon-line--total { background: #f8fafc; font-weight: 700; }
.ft-recon-line--ok { border-color: #a7f3d0; background: #ecfdf5; }
.ft-recon-line--warn { border-color: #fcd34d; background: #fffbeb; }

/* The dialog lives outside .fv-app, so it carries the same design tokens. */
.ft-overlay { --fv-accent: var(--primary, #2563eb); --fv-accent-soft: #eff6ff; --fv-ink: #172033; --fv-muted: #64748b; --fv-line: #e2e8f0; --fv-surface: #fff; --fv-radius: 12px; color: var(--fv-ink); position: fixed; inset: 0; background: rgba(15, 23, 42, 0.45); display: flex; align-items: center; justify-content: center; padding: 16px; z-index: 1300; }
.ft-overlay *, .ft-overlay *::before, .ft-overlay *::after { box-sizing: border-box; }
.ft-modal { background: #fff; border-radius: 16px; width: min(560px, 100%); max-height: calc(100vh - 32px); display: flex; flex-direction: column; box-shadow: 0 24px 60px rgba(15, 23, 42, 0.25); }
.ft-modal--wide { width: min(860px, 100%); }
.ft-modal__head { display: flex; align-items: center; justify-content: space-between; padding: 14px 18px; border-bottom: 1px solid var(--fv-line, #e2e8f0); }
.ft-modal__head h3 { margin: 0; font-size: var(--font-md); }
.ft-modal__body { padding: 18px; overflow: auto; }
.ft-modal__foot { display: flex; justify-content: flex-end; gap: 8px; padding: 12px 18px; border-top: 1px solid var(--fv-line, #e2e8f0); }
.ft-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 16px; }
.ft-form-grid .fv-detail--wide { grid-column: 1 / -1; }
.ft-bank-fields { display: contents; }
.ft-type-switch { display: flex; gap: 10px; }
.ft-type-option { flex: 1; display: flex; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid var(--fv-line, #e2e8f0); border-radius: 10px; cursor: pointer; }
.ft-type-option.is-active { border-color: var(--primary-color, #2563eb); background: rgba(37, 99, 235, 0.06); }
.ft-type-option input { accent-color: var(--primary-color, #2563eb); }
.ft-bank-picker { display: flex; align-items: center; gap: 8px; }
.ft-bank-picker .ft-combo { flex: 1; min-width: 0; }
.ft-avatar--sm { width: 46px; height: 28px; border-radius: 7px; padding: 2px 4px; box-sizing: border-box; }
.ft-combo { position: relative; }
.ft-combo__trigger { display: flex; align-items: center; gap: 8px; width: 100%; text-align: start; cursor: pointer; font: inherit; background: #fff; }
.ft-combo__trigger .fa-chevron-down { margin-inline-start: auto; font-size: 11px; color: #64748b; }
.ft-combo__value { display: inline-flex; align-items: center; gap: 8px; min-width: 0; }
.ft-combo__value > span:last-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ft-combo__value.is-placeholder { color: #94a3b8; }
.ft-combo__panel { position: absolute; inset-inline: 0; top: calc(100% + 4px); z-index: 30; background: #fff; border: 1px solid var(--fv-line, #e2e8f0); border-radius: 12px; box-shadow: 0 16px 40px rgba(15, 23, 42, 0.16); padding: 8px; }
.ft-combo__list { list-style: none; margin: 8px 0 0; padding: 0; max-height: 264px; overflow: auto; }
.ft-combo__list li { display: flex; align-items: center; gap: 10px; padding: 6px 8px; border-radius: 8px; cursor: pointer; font-size: var(--font-ui); }
.ft-combo__list li:hover, .ft-combo__list li.is-active { background: #f1f5f9; }
.ft-combo__list li[aria-selected="true"] { background: #eef2ff; color: #3730a3; font-weight: 600; }
.ft-combo__list .ft-combo__custom { border-top: 1px dashed var(--fv-line, #e2e8f0); border-radius: 0 0 8px 8px; margin-top: 4px; padding-top: 10px; color: #4f46e5; }
.ft-combo__empty { margin: 8px 4px 4px; font-size: var(--font-sm); color: #64748b; }
.ft-inline-form { display: flex; gap: 8px; flex-wrap: wrap; }
.ft-inline-form .fv-input { flex: 1; min-width: 140px; }
.ft-check { flex-direction: row; align-items: center; gap: 8px; }

@media (max-width: 900px) {
    .ft-period-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .ft-form-grid { grid-template-columns: 1fr; }
}

/* "Print" on the list prints the current table only. */
@media print {
    body.ft-printing-list .sidebar, body.ft-printing-list .top-header, body.ft-printing-list header.fv-page-head .fv-actions,
    body.ft-printing-list .fv-filter, body.ft-printing-list .fv-td-actions, body.ft-printing-list .ft-list-table th:last-child { display: none !important; }
}

/* document-entry.css */
/*
 * ACCMAN document-entry design system
 * Shared by commercial, finance, journal and inventory entry screens.
 * Selectors are deliberately scoped so list/detail pages keep their existing UI.
 */
.de-page,
.invoice-form-page,
.sw-return-create-page,
.jce-page {
    --de-primary: var(--primary-color, #2563eb);
    --de-primary-strong: #1d4ed8;
    --de-primary-soft: #eff6ff;
    --de-ink: #17233d;
    --de-muted: #6b7890;
    --de-line: #e2e8f0;
    --de-surface: #fff;
    --de-canvas: #f7f9fc;
    --de-success: #16875a;
    --de-danger: #d44255;
    --de-radius: 12px;
    direction: rtl;
    color: var(--de-ink);
}

.de-page *,
.invoice-entry-form * { box-sizing: border-box; }

.de-page-header {
    min-height: 78px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 14px;
    padding: 13px 16px;
    border: 1px solid var(--de-line);
    border-radius: var(--de-radius);
    background: #fff;
    box-shadow: 0 3px 13px rgba(20, 35, 61, .035);
}

.de-page-heading,
.de-page-heading > div,
.de-card-heading,
.de-card-toolbar { min-width: 0; }
.de-page-heading { display: flex; align-items: center; gap: 12px; }
.de-page-icon {
    width: 44px;
    height: 44px;
    flex: 0 0 44px;
    display: grid;
    place-items: center;
    border-radius: 11px;
    color: var(--de-primary);
    background: var(--de-primary-soft);
    font-size: 18px;
}
.de-breadcrumb { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; margin-bottom: 4px; color: #8290a6; font-size: var(--font-xs); }
.de-breadcrumb i { font-size: 7px; color: #b0bac9; }
.de-breadcrumb a { color: #66758d; text-decoration: none; }
.de-breadcrumb strong { color: var(--de-primary); }
.de-page-header h1 { margin: 0; color: var(--de-ink); font-size: var(--font-2xl); font-weight: 700; }
.de-page-header p { margin: 4px 0 0; color: var(--de-muted); font-size: var(--font-sm); }
.de-header-actions,
.de-action-bar > div:last-child { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }

.de-btn {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 7px 13px;
    border: 1px solid transparent;
    border-radius: 8px;
    font-weight:700;font-size:var(--font-ui);
    text-decoration: none;
    cursor: pointer;
    transition: border-color .16s ease, background .16s ease, transform .16s ease;
}
.de-btn:hover { transform: translateY(-1px); }
.de-btn:disabled { opacity: .55; cursor: wait; transform: none; }
.de-btn-primary { color: #fff; border-color: var(--de-primary); background: var(--de-primary); box-shadow: 0 5px 14px rgba(37, 99, 235, .17); }
.de-btn-primary:hover { color: #fff; border-color: var(--de-primary-strong); background: var(--de-primary-strong); }
.de-btn-light { color: #40506a; border-color: #d7dfe9; background: #fff; }
.de-btn-light:hover { color: var(--de-primary); border-color: #b9cdf5; background: #f8fbff; }
.de-btn-add { min-height: 35px; margin: 11px 14px 14px; color: var(--de-primary); border: 1px solid #cfe0ff; background: #f6f9ff; }

.invoice-entry-form { display: grid; gap: 13px; }
.invoice-entry-top-grid { display: grid; grid-template-columns: minmax(330px, .85fr) minmax(520px, 1.35fr); gap: 13px; align-items: stretch; }
.invoice-entry-card {
    min-width: 0;
    padding: 15px;
    margin: 0;
    border: 1px solid var(--de-line);
    border-radius: var(--de-radius);
    background: #fff;
    box-shadow: 0 3px 13px rgba(20, 35, 61, .035);
}

.de-card-heading { display: flex; align-items: center; gap: 9px; margin-bottom: 13px; }
.de-card-heading > span {
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    display: grid;
    place-items: center;
    border-radius: 9px;
    color: var(--de-primary);
    background: var(--de-primary-soft);
    font-size: var(--font-ui);
}
.de-card-heading h2 { margin: 0; color: var(--de-ink); font-size: var(--font-ui); font-weight: 700; }
.de-card-heading p { margin: 3px 0 0; color: var(--de-muted); font-size: var(--font-xs); }
.de-card-heading-small { margin-bottom: 11px; }

.invoice-entry-form .form-group { min-width: 0; margin: 0; }
.invoice-entry-form .form-label { margin-bottom: 5px; color: #54627a; font-size: var(--font-sm); font-weight: 700; }
.invoice-entry-form .form-control,
.invoice-entry-form .form-select {
    min-height: 39px;
    border: 1px solid #d7e0ea;
    border-radius: 8px;
    background-color: #fff;
    color: #26354e;
    font-weight:600;font-size:var(--font-ui);
    box-shadow: none;
}
.invoice-entry-form textarea.form-control { min-height: 78px; resize: vertical; }
.invoice-entry-form .form-control:focus,
.invoice-entry-form .form-select:focus { border-color: #8eb3f8; box-shadow: 0 0 0 3px rgba(37, 99, 235, .09); }
.invoice-entry-form .form-control:disabled { color: #657188; background: #f5f7fa; opacity: 1; }
.invoice-details-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 11px; }
.invoice-qr-input { grid-column: 1 / -1; }

.de-party-profile {
    min-height: 86px;
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    margin-top: 11px;
    padding: 12px;
    border: 1px solid #e4e9f1;
    border-radius: 9px;
    background: #fbfcfe;
}
.de-party-avatar { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 10px; color: var(--de-primary); background: #eaf2ff; }
.de-party-profile strong,
.de-party-profile small { display: block; }
.de-party-profile strong { overflow: hidden; color: #26354e; font-size: var(--font-sm); text-overflow: ellipsis; white-space: nowrap; }
.de-party-profile small { margin-top: 4px; color: #8995a7; font-size: var(--font-xs); }
.de-status-badge { padding: 4px 8px; border-radius: 999px; color: #66758b; background: #eef1f5; font-size: var(--font-xs); font-weight: 700; white-space: nowrap; }
.de-party-profile:not(.is-empty) .de-status-badge { color: #177653; background: #e8f7ef; }

.invoice-items-card { padding: 0; overflow: hidden; }
.invoice-searchable-select { min-width: 0; }
.invoice-search-results {
    position: absolute;
    inset-inline: 0;
    top: calc(100% + 4px);
    z-index: 1080;
    max-height: 320px;
    overflow-y: auto;
    overflow-x: hidden;
    border: 1px solid #d8e1ec;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 14px 34px rgba(15, 35, 68, .16);
    overscroll-behavior: contain;
    scrollbar-width: thin;
}
.invoice-search-result {
    display: block;
    width: 100%;
    padding: 10px 12px;
    border: 0;
    border-bottom: 1px solid #edf1f6;
    background: #fff;
    color: #1f2e46;
    text-align: right;
    cursor: pointer;
}
.invoice-search-result:last-of-type { border-bottom: 0; }
.invoice-search-result:hover,
.invoice-search-result.active { background: #eef5ff; color: #124fb3; }
.invoice-search-state,
.invoice-search-more-hint { padding: 12px; color: #718096; font-size: var(--font-xs); text-align: center; }
.invoice-search-loading { display: flex; align-items: center; justify-content: center; gap: 7px; }
.invoice-search-more-hint { padding-block: 7px; border-top: 1px solid #edf1f6; background: #f8fafc; font-size: var(--font-xs); }
.invoice-product-results {
    direction: rtl;
    z-index: 1085;
    max-height: 420px;
}
.invoice-product-results .invoice-search-result { display: grid; gap: 7px; padding: 11px 13px; }
.invoice-product-result-main {
    min-width: 0;
    color: #172b4d;
    font-size: var(--font-sm);
    font-weight: 700;
    line-height: 1.55;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}
.invoice-product-result-main small {
    display: inline-flex;
    margin-inline-start: 5px;
    padding: 2px 6px;
    border-radius: 999px;
    background: #f0eaff;
    color: #6941c6;
    font-size: var(--font-xs);
    white-space: nowrap;
}
.invoice-product-result-meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 5px 12px;
    color: #69788e;
    font-size: var(--font-xs);
    line-height: 1.5;
}
.invoice-product-result-meta span { min-width: 0; overflow-wrap: anywhere; }
.invoice-product-result-meta b { color: #455770; font-weight: 700; }
.invoice-product-result-stock { color: #16805c; }
.invoice-product-result-price { color: #1d4ed8; }
.invoice-search-footer {
    position: sticky;
    bottom: 0;
    z-index: 1;
    padding: 7px;
    border-top: 1px solid #e2e8f0;
    background: #fff;
    box-shadow: 0 -7px 14px rgba(20, 35, 61, .05);
}
.invoice-search-footer-action {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 36px;
    border: 1px dashed #9bc0ff;
    border-radius: 8px;
    color: var(--de-primary);
    background: #f7faff;
    font-size: var(--font-sm);
    font-weight: 700;
    cursor: pointer;
}
.invoice-search-footer-action:hover { border-style: solid; color: #fff; background: var(--de-primary); }

.invoice-quick-product-modal .modal-content { overflow: hidden; border: 1px solid #dce5f0; border-radius: 14px; box-shadow: 0 20px 50px rgba(20,35,61,.2); }
.invoice-quick-product-modal .modal-content > form { display: flex; flex: 1 1 auto; flex-direction: column; min-height: 0; width: 100%; }
.invoice-quick-product-modal .modal-body { min-height: 0; overflow-y: auto; }
.invoice-quick-product-modal .modal-header,
.invoice-quick-product-modal .modal-footer { flex-shrink: 0; }
.invoice-quick-product-modal .modal-header { align-items: flex-start; padding: 17px 20px; border-bottom-color: #e5ebf2; background: linear-gradient(135deg, #fbfdff, #f1f6ff); }
.invoice-quick-product-heading { display: flex; min-width: 0; align-items: center; gap: 10px; }
.invoice-quick-product-heading > span { display: grid; width: 38px; height: 38px; flex: 0 0 38px; place-items: center; border-radius: 10px; color: var(--de-primary); background: #e5efff; }
.invoice-quick-product-heading .modal-title { margin: 0; color: #1d2b45; font-size: var(--font-lg); font-weight: 700; }
.invoice-quick-product-heading p { margin: 3px 0 0; color: #6d7a90; font-size: var(--font-xs); }
.invoice-quick-product-modal .modal-body { padding: 17px 20px; background: #fbfcfe; }
.invoice-quick-product-section { margin-bottom: 14px; padding: 14px; border: 1px solid #e1e8f1; border-radius: 10px; background: #fff; }
.invoice-quick-product-section:last-child { margin-bottom: 0; }
.invoice-quick-product-section-heading { display: flex; align-items: center; gap: 7px; margin-bottom: 13px; color: #34445d; font-size: var(--font-sm); font-weight: 700; }
.invoice-quick-product-section-heading > i { color: var(--de-primary); }
.invoice-quick-product-section-heading .form-check { margin-inline-start: auto; }
.invoice-quick-product-section .form-label { margin-bottom: 5px; color: #52627a; font-size: var(--font-xs); font-weight: 700; }
.invoice-quick-product-section .form-control,
.invoice-quick-product-section .form-select { min-height: 38px; border-color: #d7e0ea; font-size: var(--font-sm); }
.invoice-quick-product-section .form-control:focus,
.invoice-quick-product-section .form-select:focus { border-color: #8eb3f8; box-shadow: 0 0 0 3px rgba(37,99,235,.09); }
.invoice-quick-field-error { display: block; min-height: 16px; margin-top: 3px; color: #cf4052; font-size: var(--font-xs); }
.invoice-quick-product-modal .modal-footer { gap: 8px; padding: 12px 20px; border-top-color: #e5ebf2; background: #fff; }

.invoice-product-results:dir(ltr) { direction: ltr; }

@media (max-width: 640px) {
    .invoice-product-results { max-width: calc(100vw - 16px); }
    .invoice-product-result-meta { display: grid; grid-template-columns: 1fr 1fr; gap: 4px 8px; }
    .invoice-quick-product-modal .modal-dialog { margin: 9px; }
    .invoice-quick-product-modal .modal-header,
    .invoice-quick-product-modal .modal-body,
    .invoice-quick-product-modal .modal-footer { padding-inline: 14px; }
    .invoice-quick-product-heading p { line-height: 1.5; }
}
.de-card-toolbar { min-height: 62px; display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 12px 14px; border-bottom: 1px solid var(--de-line); }
.de-card-toolbar .de-card-heading { margin: 0; }
.invoice-tax-defaults { display: flex; align-items: end; gap: 7px; flex-wrap: wrap; }
.invoice-tax-defaults label { align-self: center; margin: 0 0 0 3px; color: #617089; font-size: var(--font-sm); font-weight: 700; }
.invoice-tax-defaults .form-control { width: 210px; min-height: 35px; }
.invoice-tax-defaults .de-btn { min-height: 35px; }
.invoice-entry-table-wrap { border: 0; overflow-x: auto; }
.invoice-entry-table { width: 100%; min-width: 1160px; margin: 0; border-collapse: collapse; }
.invoice-entry-table thead th { height: 41px; padding: 9px 10px; border: 0; border-bottom: 1px solid #e5eaf1; color: #5e6c83; background: #f7f9fc; font-size: var(--font-ui); font-weight: 700; white-space: nowrap; vertical-align: middle; }
.invoice-entry-table tbody td { padding: 9px 8px; border-color: #edf1f5; vertical-align: top; }
.invoice-entry-table tbody tr:hover { background: #fbfdff; }
.invoice-entry-table th:first-child,
.invoice-entry-table td:first-child { width: 42px; text-align: center; color: #7d899c; }
.invoice-entry-table .invoice-item-product { min-width: 220px; }
.invoice-entry-table .invoice-item-description { min-width: 160px; }
.invoice-entry-table .invoice-item-price { min-width: 100px; }
.invoice-entry-table .invoice-item-tax-select { min-width: 180px; }
.invoice-entry-table .invoice-item-tax,
.invoice-entry-table .invoice-item-total { padding-top: 19px; white-space: nowrap; }
.invoice-entry-table .invoice-item-total { color: #1d4ed8; }
.invoice-item-stock { min-height: 13px; font-size: var(--font-ui) !important; }
.invoice-item-remove { width: 32px; height: 32px; margin-top: 3px; padding: 0 !important; border: 1px solid #f1cdd3 !important; border-radius: 7px !important; color: #c43d50 !important; background: #fff5f6 !important; }

.invoice-bottom-grid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(330px, .75fr); gap: 13px; align-items: start; }
.invoice-discount-controls { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 9px; }
.invoice-summary-list > div { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 7px 3px; border-bottom: 1px dashed #e5eaf1; color: #66748a; font-size: var(--font-xs); }
.invoice-summary-list strong { color: #26354e; font-weight:700;font-size:var(--font-sm); }
.invoice-summary-list .invoice-grand-total { margin-top: 5px; padding: 12px; border: 0; border-radius: 8px; color: #1d4ed8; background: #eef5ff; font-size: var(--font-ui); font-weight: 700; }
.invoice-summary-list .invoice-grand-total strong { color: #1d4ed8; font-size: var(--font-2xl); }

.invoice-payment-section { display: grid; grid-template-columns: minmax(260px, .55fr) minmax(0, 1.45fr); align-items: center; gap: 10px 18px; }
.invoice-payment-section > .de-card-heading { grid-column: 1 / -1; margin-bottom: 0; }
.invoice-paid-toggle { min-height: 42px; display: flex; align-items: center; gap: 9px; padding: 9px 12px; border: 1px solid #d9e3ee; border-radius: 8px; color: #33445e; background: #fbfcfe; font-size: var(--font-sm); font-weight: 700; }
.invoice-paid-toggle input { width: 17px; height: 17px; accent-color: var(--de-primary); }
.invoice-payment-fields { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.invoice-payment-status-note { grid-column: 1 / -1; }
.invoice-document-section { display: grid; grid-template-columns: minmax(240px, 1fr) auto minmax(180px, .7fr); align-items: center; gap: 12px; }
.invoice-document-section h3 { margin: 0 0 4px; color: var(--de-ink); font-size: var(--font-sm); font-weight: 700; }
.invoice-document-section p,
.invoice-document-name { font-size: var(--font-xs); }

.de-action-bar {
    position: sticky;
    bottom: 8px;
    z-index: 20;
    min-height: 62px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 10px 13px;
    border: 1px solid #d7e0eb;
    border-radius: 11px;
    background: rgba(255, 255, 255, .96);
    box-shadow: 0 10px 32px rgba(20, 35, 61, .12);
    backdrop-filter: blur(8px);
}
.de-action-note { display: flex; align-items: center; gap: 7px; color: #6c7990; font-size: var(--font-xs); }
.de-action-note i { color: #16875a; }

/* Existing sales and purchase return creators: preserve behavior, unify surfaces. */
.sw-return-create-page .sw-return-create-head { min-height: 76px; padding: 13px 16px; border: 1px solid #e2e8f0; border-radius: 12px; background: #fff; box-shadow: 0 3px 13px rgba(20,35,61,.035); }
.sw-return-create-page .sw-card,
.pw-page #pr-form .iw-form-table,
.pw-page #pr-form .pw-form-summary { border-color: #e2e8f0; border-radius: 11px; box-shadow: 0 3px 13px rgba(20,35,61,.035); }
.sw-return-create-actions,
.pw-page #pr-form > .iw-modal__footer { position: sticky; bottom: 0; z-index: 3; border-color: #dce4ed; background: rgba(255,255,255,.97); box-shadow: 0 -8px 24px rgba(20,35,61,.07); backdrop-filter: blur(8px); }

/* Finance vouchers share the same field density and surfaces. */
.fv-app.fv-reference-form { --de-primary: var(--primary-color, #2563eb); --de-primary-strong: #1d4ed8; --de-primary-soft: #eff6ff; --de-ink: #17233d; --de-muted: #6b7890; --de-line: #e2e8f0; --de-radius: 12px; --fv-accent: var(--de-primary); max-width: 1480px; padding: 0; background: transparent; }
.fv-reference-form .fv-reference-sheet { box-shadow: 0 3px 13px rgba(20,35,61,.035); }
.fv-reference-form .fv-reference-grid .fv-input,
.fv-reference-form .fv-reference-grid .fv-amount-box { border-radius: 8px; }
.fv-reference-form .fv-reference-grid .fv-input { height: 39px; }
.fv-reference-form .fv-reference-grid textarea.fv-input { height: auto; }

/* Journal form already has dedicated markup; normalize it to the shared system. */
.jce-page .jce-page-header,
.jce-page .jce-card { border-color: #e2e8f0; border-radius: 12px; box-shadow: 0 3px 13px rgba(20,35,61,.035); }
.jce-page .jce-page-header { min-height: 78px; }
.jce-page .jce-control,
.jce-page .jce-btn { border-radius: 8px; }
.jce-page .jce-actions { position: sticky; bottom: 8px; z-index: 15; border-radius: 11px; background: rgba(255,255,255,.97); box-shadow: 0 10px 32px rgba(20,35,61,.11); backdrop-filter: blur(8px); }
.jce-page .jce-page-header-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.jce-page .jce-page-header-actions .jce-btn-primary { min-width: 118px; }

/* Inventory vouchers, counts and purchase return are modal documents. */
.iw-modal:has(#iw-voucher-form),
.iw-modal:has(#iw-count-form),
.iw-modal:has(#pr-form) { width: min(1120px, 97vw); border-radius: 14px; }
.iw-modal:has(#iw-voucher-form) .iw-modal__header,
.iw-modal:has(#iw-count-form) .iw-modal__header,
.iw-modal:has(#pr-form) .iw-modal__header { min-height: 70px; }
.iw-modal:has(#iw-voucher-form) .iw-form-grid,
.iw-modal:has(#iw-count-form) .iw-form-grid,
.iw-modal:has(#pr-form) .iw-form-grid { padding: 14px; border: 1px solid #e2e8f0; border-radius: 11px; background: #fbfcfe; }
.iw-modal:has(#iw-voucher-form) .iw-form-table,
.iw-modal:has(#iw-count-form) .iw-form-table,
.iw-modal:has(#pr-form) .iw-form-table { border-color: #e2e8f0; border-radius: 11px; }
.iw-modal:has(#iw-voucher-form) .iw-modal__footer,
.iw-modal:has(#iw-count-form) .iw-modal__footer,
.iw-modal:has(#pr-form) .iw-modal__footer { position: sticky; bottom: 0; z-index: 4; background: rgba(255,255,255,.97); box-shadow: 0 -8px 24px rgba(20,35,61,.07); backdrop-filter: blur(8px); }

@media (max-width: 1180px) {
    .invoice-entry-top-grid { grid-template-columns: minmax(300px, .8fr) minmax(440px, 1.2fr); }
    .invoice-details-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 900px) {
    .invoice-entry-top-grid,
    .invoice-bottom-grid { grid-template-columns: 1fr; }
    .invoice-payment-section { grid-template-columns: 1fr; }
    .invoice-payment-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .invoice-document-section { grid-template-columns: 1fr auto; }
    .invoice-document-name { grid-column: 1 / -1; }
}

@media (max-width: 680px) {
    .de-page-header,
    .de-card-toolbar,
    .de-action-bar { align-items: stretch; flex-direction: column; }
    .de-page-header h1 { font-size: var(--font-lg); }
    .de-header-actions .de-btn,
    .de-action-bar > div:last-child .de-btn { flex: 1; }
    .invoice-details-grid,
    .invoice-payment-fields,
    .invoice-discount-controls { grid-template-columns: 1fr; }
    .invoice-tax-defaults { align-items: stretch; }
    .invoice-tax-defaults label { flex-basis: 100%; }
    .invoice-tax-defaults .form-control { width: 100%; }
    .de-party-profile { grid-template-columns: 38px minmax(0, 1fr); }
    .de-party-profile .de-status-badge { grid-column: 1 / -1; justify-self: start; }
    .invoice-document-section { grid-template-columns: 1fr; }
    .de-action-bar { position: sticky; bottom: 4px; }
    .de-action-note { display: none; }
    .de-action-bar > div:last-child { width: 100%; }
    .de-action-bar > div:last-child .de-btn { min-width: calc(50% - 5px); }
    .jce-page .jce-page-header-actions { width: 100%; }
    .jce-page .jce-page-header-actions > .jce-btn { flex: 1; }
}

@media print {
    .de-header-actions,
    .invoice-tax-defaults,
    .invoice-add-row,
    .invoice-item-remove,
    .de-action-bar,
    .fv-form-tabs-row,
    .jce-actions,
    .iw-modal__footer { display: none !important; }
    .invoice-entry-card,
    .de-page-header,
    .fv-reference-sheet,
    .jce-card { box-shadow: none !important; }
}

/* hr-phase-one.css */
.hrp-page{--hrp-border:#dfe7f1;--hrp-muted:#6b7a90;--hrp-navy:#17345f;--hrp-blue:#1769e0;color:#142b4a;max-width:1600px;margin:0 auto;padding:2px 0 28px}.hrp-header{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:22px}.hrp-header h1{font-size:var(--font-2xl);font-weight:700;color:var(--hrp-navy);margin:5px 0}.hrp-header p{color:var(--hrp-muted);font-size:var(--font-base);margin:0}.hrp-breadcrumb{font-size:var(--font-xs);color:#7c8da5}.hrp-primary-action{min-height:42px;display:inline-flex;align-items:center;gap:8px;white-space:nowrap}.hrp-kpis{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin-bottom:16px}.hrp-kpi{min-height:90px;background:#fff;border:1px solid var(--hrp-border);border-radius:13px;display:flex;align-items:center;gap:13px;padding:15px;box-shadow:0 4px 16px rgba(33,62,105,.035)}.hrp-kpi-icon{width:43px;height:43px;flex:0 0 43px;border-radius:11px;display:grid;place-items:center;font-size:1rem}.hrp-kpi-icon--blue{color:#1769e0;background:#eaf2ff}.hrp-kpi-icon--green{color:#179c58;background:#eaf9f0}.hrp-kpi-icon--orange{color:#dd8017;background:#fff4e8}.hrp-kpi-icon--purple{color:#8154d9;background:#f3edff}.hrp-kpi-icon--red{color:#dc4453;background:#ffedef}.hrp-kpi small{display:block;color:var(--hrp-muted);font-size:var(--font-sm);margin-bottom:5px}.hrp-kpi strong{font-weight:700;font-size:var(--font-2xl);color:var(--hrp-navy)}.hrp-skeleton{position:relative;overflow:hidden}.hrp-skeleton:after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent,rgba(230,237,248,.8),transparent);animation:hrp-shimmer 1.2s infinite}@keyframes hrp-shimmer{to{transform:translateX(-100%)}}
.hrp-filter-card,.hrp-table-card,.hrp-wizard-card{background:#fff;border:1px solid var(--hrp-border);border-radius:14px;box-shadow:0 4px 18px rgba(33,62,105,.04)}.hrp-filter-card{padding:14px;margin-bottom:16px}.hrp-filter-main{display:flex;align-items:center;gap:10px}.hrp-search{height:42px;min-width:280px;flex:1;display:flex;align-items:center;gap:10px;border:1px solid #d8e1ed;border-radius:10px;padding:0 13px;color:#8090a7;background:#fff}.hrp-search:focus-within{border-color:#8bb8f5;box-shadow:0 0 0 3px rgba(23,105,224,.08)}.hrp-search input{border:0;outline:0;width:100%;font-size:var(--font-ui);color:#1f385c}.hrp-advanced-filters{display:grid;grid-template-columns:repeat(5,minmax(140px,1fr));gap:12px;padding-top:15px;margin-top:14px;border-top:1px solid #edf1f6}.hrp-advanced-filters[hidden]{display:none}.hrp-advanced-filters label>span,.hrp-field>span{display:block;font-size:var(--font-ui);font-weight:600;color:#53647c;margin-bottom:6px}.hrp-advanced-filters .form-select,.hrp-table-toolbar .form-select{min-height:39px;border-color:#dce4ef;font-size:var(--font-ui)}.hrp-filter-submit{display:flex;align-items:end}.hrp-filter-submit .btn{width:100%;min-height:39px}.hrp-table-card{overflow:hidden}.hrp-table-toolbar{min-height:54px;padding:10px 16px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--hrp-border)}.hrp-table-toolbar strong{font-size:var(--font-base)}.hrp-table-toolbar select{width:105px}.hrp-table{width:100%;border-collapse:separate;border-spacing:0;min-width:1250px;font-size:var(--font-ui)}.hrp-table thead th{height:46px;padding:9px 10px;background:#f6f8fc;color:#344b6d;font-weight:700;border-bottom:1px solid var(--hrp-border);white-space:nowrap}.hrp-table thead button{background:none;border:0;color:inherit;font:inherit;padding:0;display:inline-flex;align-items:center;gap:5px}.hrp-table tbody td{height:58px;padding:9px 10px;border-bottom:1px solid #edf1f6;vertical-align:middle;color:#283f60}.hrp-table tbody tr:hover td{background:#fbfcfe}.hrp-table tbody tr:last-child td{border-bottom:0}.hrp-table td small{display:block;color:#8592a5;font-size:var(--font-xs);margin-top:3px}.hrp-avatar{width:38px;height:38px;border-radius:50%;overflow:hidden;background:#eaf2ff;color:#1769e0;display:grid;place-items:center;font-weight:800}.hrp-avatar img{width:100%;height:100%;object-fit:cover}.hrp-code{;font-size:var(--font-sm);color:#294c7e}.hrp-name{font-weight:700;color:#183d70;text-decoration:none}.hrp-name:hover{color:#1769e0}.hrp-more{width:34px;height:34px;border:1px solid #e3e9f2}.dropdown-menu .dropdown-item{display:flex;align-items:center;gap:9px;font-size:var(--font-ui);padding:8px 13px}.dropdown-menu .dropdown-item i{width:16px;color:#657791}.hrp-badge{display:inline-flex;align-items:center;border-radius:999px;padding:5px 9px;font-size:var(--font-xs);font-weight:700;white-space:nowrap}.hrp-badge--success{background:#eaf8f0;color:#16864c}.hrp-badge--warning{background:#fff4df;color:#b56d0a}.hrp-badge--danger{background:#ffedef;color:#c63747}.hrp-badge--info{background:#e9f2ff;color:#1762c6}.hrp-badge--purple{background:#f1ebff;color:#6e43bc}.hrp-badge--neutral{background:#eef2f6;color:#68788f}.hrp-pagination{min-height:56px;padding:10px 16px;display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--hrp-border);color:#7a899e;font-size:var(--font-sm)}.hrp-pagination>div{display:flex;gap:5px}.hrp-pagination button{width:32px;height:32px;border:1px solid #dfe6f0;background:#fff;border-radius:8px;color:#47617f;font-size:var(--font-ui)}.hrp-pagination button.active{background:#1769e0;border-color:#1769e0;color:#fff}.hrp-pagination button:disabled{opacity:.45}.hrp-loading,.hrp-error{min-height:320px;background:#fff;border:1px solid var(--hrp-border);border-radius:14px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;color:#728197}.hrp-loading i,.hrp-error>i{font-size:1.7rem;color:#1769e0}.hrp-error>i{color:#d44757}.hrp-loading-inline,.hrp-error-inline{display:flex;align-items:center;justify-content:center;gap:9px;min-height:130px;color:#718198}.hrp-empty{min-height:180px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;color:#8290a3}.hrp-empty i{font-size:1.65rem;color:#a5b6cc}.hrp-empty strong{color:#52657e}.hrp-empty.compact{min-height:130px;background:#f9fbfe;border:1px dashed #d6e0ed;border-radius:11px;margin-bottom:14px}
.hrp-wizard-page{max-width:1320px}.hrp-stepper{display:grid;grid-template-columns:repeat(6,1fr);background:#fff;border:1px solid var(--hrp-border);border-radius:14px;padding:13px 20px;margin-bottom:16px;box-shadow:0 4px 16px rgba(33,62,105,.03)}.hrp-stepper button{position:relative;background:none;border:0;display:flex;flex-direction:column;align-items:center;gap:7px;color:#8291a5;font-size:var(--font-ui)}.hrp-stepper button:not(:last-child):after{content:"";position:absolute;right:calc(50% + 26px);left:calc(-50% + 26px);top:18px;height:1px;background:#dce4ef}.hrp-stepper button>span{width:37px;height:37px;position:relative;z-index:1;border-radius:50%;display:grid;place-items:center;background:#f1f4f8;border:1px solid #e0e7f0}.hrp-stepper button.active{color:#1769e0;font-weight:700}.hrp-stepper button.active>span{background:#1769e0;border-color:#1769e0;color:#fff;box-shadow:0 0 0 4px #eaf2ff}.hrp-stepper button.done>span{background:#e9f8ef;border-color:#bfe9d0;color:#16864c}.hrp-wizard-card{padding:22px;min-height:430px}.hrp-section-title{display:flex;align-items:center;gap:12px;padding-bottom:16px;margin-bottom:20px;border-bottom:1px solid #e9eef5}.hrp-section-title>span{width:42px;height:42px;border-radius:11px;background:#eaf2ff;color:#1769e0;display:grid;place-items:center}.hrp-section-title h2{font-size:var(--font-md);font-weight:700;color:#1d395f;margin:0 0 4px}.hrp-section-title p{font-size:var(--font-sm);color:#8090a4;margin:0}.hrp-photo-row{display:grid;grid-template-columns:150px 1fr;gap:24px}.hrp-photo-upload{display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;color:#7b8aa0;font-size:var(--font-sm)}.hrp-photo-upload>span{width:112px;height:112px;border-radius:18px;border:1px dashed #b9c9dc;background:#f7faff;color:#6c92c6;display:grid;place-items:center;overflow:hidden;font-size:var(--font-2xl)}.hrp-photo-upload img{width:100%;height:100%;object-fit:cover}.hrp-photo-upload input{width:100%;font-size:var(--font-ui)}.hrp-fields{display:grid;gap:15px}.hrp-fields--3{grid-template-columns:repeat(3,minmax(0,1fr))}.hrp-fields--2{grid-template-columns:repeat(2,minmax(0,1fr))}.hrp-field input,.hrp-field select{width:100%;height:42px;border:1px solid #d9e2ee;border-radius:9px;padding:0 11px;font-size:var(--font-ui);color:#233f63;background:#fff;outline:0}.hrp-field input:focus,.hrp-field select:focus{border-color:#82b3f5;box-shadow:0 0 0 3px rgba(23,105,224,.08)}.hrp-field input[readonly]{background:#f6f8fb;color:#728198}.hrp-note{margin-top:18px;border:1px solid #d9e8fb;background:#f3f8ff;color:#55718f;border-radius:10px;padding:11px 13px;font-size:var(--font-xs);display:flex;gap:9px;align-items:center}.hrp-document-row{border:1px solid #e0e7f0;border-radius:12px;padding:15px;margin-bottom:12px;background:#fbfcfe}.hrp-document-row>.btn{margin-top:10px}.hrp-wizard-actions{display:grid;grid-template-columns:auto 1fr auto auto auto;align-items:center;gap:9px;background:#fff;border:1px solid var(--hrp-border);border-radius:13px;padding:12px 14px;margin-top:14px;position:sticky;bottom:10px;z-index:5;box-shadow:0 8px 25px rgba(35,57,90,.09)}.hrp-wizard-actions .btn{min-height:40px}.hrp-review{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.hrp-review article{border:1px solid #e2e8f1;border-radius:11px;padding:15px}.hrp-review h3{font-size:var(--font-base);font-weight:700;color:#1d436f;margin:0 0 10px;padding-bottom:8px;border-bottom:1px solid #edf1f6}.hrp-review article>div{display:flex;justify-content:space-between;gap:20px;padding:6px 0;font-size:var(--font-sm)}.hrp-review span{color:#7b899d}.hrp-review strong{color:#2c4667;text-align:left}
@media(max-width:1200px){.hrp-kpis{grid-template-columns:repeat(3,1fr)}.hrp-advanced-filters{grid-template-columns:repeat(3,1fr)}.hrp-fields--3{grid-template-columns:repeat(2,1fr)}}@media(max-width:768px){.hrp-header{align-items:flex-start;flex-direction:column}.hrp-primary-action{width:100%;justify-content:center}.hrp-kpis{grid-template-columns:repeat(2,1fr)}.hrp-filter-main{flex-wrap:wrap}.hrp-search{min-width:100%}.hrp-advanced-filters{grid-template-columns:repeat(2,1fr)}.hrp-stepper{overflow-x:auto;grid-template-columns:repeat(6,100px);padding-inline:10px}.hrp-photo-row{grid-template-columns:1fr}.hrp-fields--3,.hrp-fields--2{grid-template-columns:1fr}.hrp-review{grid-template-columns:1fr}.hrp-wizard-actions{grid-template-columns:auto 1fr auto}.hrp-wizard-actions>div{display:none}.hrp-wizard-actions .btn{font-size:var(--font-ui)}.hrp-pagination{align-items:flex-start;gap:10px;flex-direction:column}}@media(max-width:480px){.hrp-kpis{grid-template-columns:1fr}.hrp-advanced-filters{grid-template-columns:1fr}.hrp-wizard-card{padding:15px}.hrp-header h1{font-size:var(--font-2xl)}}
.hrp-profile-header{display:flex;align-items:center;justify-content:space-between;gap:20px;background:#fff;border:1px solid var(--hrp-border);border-radius:14px;padding:18px;margin:8px 0 16px;box-shadow:0 4px 18px rgba(33,62,105,.04)}.hrp-profile-identity{display:flex;align-items:center;gap:15px}.hrp-profile-avatar{width:72px;height:72px;flex:0 0 72px;border-radius:17px;overflow:hidden;background:#eaf2ff;color:#1769e0;display:grid;place-items:center;font-size:1.6rem;font-weight:800}.hrp-profile-avatar img{width:100%;height:100%;object-fit:cover}.hrp-profile-title{display:flex;align-items:center;gap:9px}.hrp-profile-title h1{font-size:var(--font-2xl);font-weight:700;color:#18385f;margin:0}.hrp-profile-identity p{display:flex;flex-wrap:wrap;gap:7px;margin:8px 0 0;color:#738398;font-size:var(--font-sm)}.hrp-profile-identity p span:before{content:"•";margin-left:7px}.hrp-profile-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:7px}.hrp-profile-actions .btn{font-size:var(--font-ui)}.hrp-profile-body{display:grid;grid-template-columns:210px minmax(0,1fr);gap:14px}.hrp-profile-tabs{display:flex;flex-direction:column;gap:4px;background:#fff;border:1px solid var(--hrp-border);border-radius:13px;padding:9px;height:max-content;position:sticky;top:14px}.hrp-profile-tabs button{border:0;background:transparent;text-align:right;border-radius:8px;padding:9px 10px;color:#65768e;font-size:var(--font-ui)}.hrp-profile-tabs button.active{background:#eaf2ff;color:#1769e0;font-weight:700}.hrp-profile-content{min-height:430px;background:#fff;border:1px solid var(--hrp-border);border-radius:13px;padding:16px}.hrp-profile-content>[hidden]{display:none}.hrp-profile-metrics{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}.hrp-profile-metrics article{min-height:90px;border:1px solid #e2e8f1;border-radius:11px;padding:13px;background:#fbfcfe}.hrp-profile-metrics small{display:block;color:#7b8ba0;font-size:var(--font-sm);margin-bottom:10px}.hrp-profile-metrics strong{font-size:var(--font-ui);color:#243f63}.hrp-profile-section{border:1px solid #e2e8f1;border-radius:11px;padding:15px;margin-bottom:13px}.hrp-profile-section h3{font-size:var(--font-base);font-weight:700;color:#1e426d;margin:0 0 14px;display:flex;align-items:center;gap:8px}.hrp-profile-info-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.hrp-profile-info small{display:block;color:#7c8ca1;font-size:var(--font-xs);margin-bottom:5px}.hrp-profile-info strong{font-size:var(--font-ui);color:#2a4465;word-break:break-word}.hrp-sensitive{}.hrp-profile-table{width:100%;min-width:680px;border-collapse:collapse;font-size:var(--font-ui)}.hrp-profile-table th{background:#f5f8fc;color:#3b5271;padding:10px;border-bottom:1px solid #dee6f0}.hrp-profile-table td{padding:11px 10px;border-bottom:1px solid #e9eef5;color:#344c6b}.hrp-future{min-height:300px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:9px;color:#8290a4}.hrp-future i{font-size:1.8rem;color:#9cb3cf}.hrp-future strong{color:#536a86}.hrp-future span{font-size:var(--font-ui)}.hrp-timeline{position:relative;padding-right:9px}.hrp-timeline:before{content:"";position:absolute;right:26px;top:10px;bottom:10px;width:1px;background:#dce5f0}.hrp-timeline-item{position:relative;display:flex;gap:13px;padding:8px 0 17px}.hrp-timeline-item>span{width:35px;height:35px;flex:0 0 35px;z-index:1;border-radius:50%;background:#eaf2ff;color:#1769e0;display:grid;place-items:center;border:3px solid #fff}.hrp-timeline-item strong{display:block;color:#2a4668;font-size:var(--font-ui);margin:3px 0 4px}.hrp-timeline-item small{color:#8190a4;font-size:var(--font-xs)}@media(max-width:1150px){.hrp-profile-header{align-items:flex-start;flex-direction:column}.hrp-profile-actions{justify-content:flex-start}.hrp-profile-metrics{grid-template-columns:repeat(3,1fr)}.hrp-profile-info-grid{grid-template-columns:repeat(3,1fr)}}@media(max-width:850px){.hrp-profile-body{grid-template-columns:1fr}.hrp-profile-tabs{position:static;flex-direction:row;overflow-x:auto}.hrp-profile-tabs button{white-space:nowrap}.hrp-profile-info-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:520px){.hrp-profile-identity{align-items:flex-start}.hrp-profile-avatar{width:58px;height:58px;flex-basis:58px}.hrp-profile-metrics,.hrp-profile-info-grid{grid-template-columns:1fr}}
.hrp-access-card{margin-top:22px;border:1px solid #dce5f1;border-radius:13px;background:#f9fbfe;overflow:hidden}.hrp-access-toggle{margin:0;min-height:74px;padding:14px 16px;display:flex;align-items:center;gap:12px;cursor:pointer;background:#fff}.hrp-access-toggle>input{width:18px;height:18px;accent-color:#1769e0}.hrp-access-toggle>span{display:flex;flex:1;flex-direction:column;gap:4px}.hrp-access-toggle strong{font-size:var(--font-base);color:#1d3d68}.hrp-access-toggle small{font-size:var(--font-xs);color:#78899f}.hrp-access-toggle>i{width:38px;height:38px;border-radius:11px;background:#eaf2ff;color:#1769e0;display:grid;place-items:center}.hrp-user-fields{padding:16px;border-top:1px solid #e2e9f2}.hrp-user-fields[hidden]{display:none}.hrp-user-fields .hrp-note{margin-top:15px}

/* Employees & Users Management — Phase 1 */
.hrp-management-header{align-items:center}.hrp-header-actions{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:9px}.hrp-header-actions .btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:40px;border-radius:9px;font-size:var(--font-ui);font-weight:700}.hrp-management-kpis{grid-template-columns:repeat(4,minmax(0,1fr))}.hrp-management-tabs{display:flex;gap:5px;margin:14px 0 10px;padding:5px;background:#eaf0f8;border:1px solid #dce5f0;border-radius:11px;width:max-content;max-width:100%}.hrp-management-tabs button{border:0;background:transparent;color:#687b94;border-radius:8px;padding:9px 18px;display:inline-flex;align-items:center;gap:7px;font-size:var(--font-ui);white-space:nowrap}.hrp-management-tabs button.active{color:#1769e0;background:#fff;font-weight:700;box-shadow:0 2px 7px rgba(30,67,111,.08)}.hrp-management-table{min-width:1080px}.hrp-management-table td{vertical-align:middle}.hrp-person-cell{display:flex;align-items:center;gap:10px;min-width:190px}.hrp-person-cell>div:last-child{display:flex;min-width:0;flex-direction:column;gap:3px}.hrp-person-cell strong,.hrp-name{color:#203f66;font-size:var(--font-ui);font-weight:700;text-decoration:none}.hrp-person-cell small,.hrp-management-table td>small{display:block;color:#8593a6;font-size:var(--font-xs)}.hrp-avatar{width:38px;height:38px;flex:0 0 38px;border-radius:10px;overflow:hidden;background:#eaf2ff;color:#1769e0;display:grid;place-items:center;font-weight:800}.hrp-avatar img{width:100%;height:100%;object-fit:cover}.hrp-code{;color:#2d4c72;font-size:var(--font-sm)}.hrp-more{width:34px;height:32px;padding:0;display:grid;place-items:center}.hrp-loading-inline,.hrp-error-inline{min-height:180px;display:flex;align-items:center;justify-content:center;gap:9px;color:#74869c}.hrp-error-inline{color:#b0444c}.hrp-drawer-open{overflow:hidden}.hrp-user-drawer{position:fixed;inset:0;z-index:1090;display:flex;justify-content:flex-start}.hrp-user-drawer[hidden]{display:none}.hrp-drawer-backdrop{position:absolute;inset:0;border:0;background:rgba(15,31,53,.44);backdrop-filter:blur(1px)}.hrp-user-panel{position:relative;width:min(720px,94vw);height:100%;margin-inline-start:0;background:#fff;box-shadow:0 0 45px rgba(11,31,60,.2);display:flex;flex-direction:column;animation:hrp-panel-in .18s ease-out}.hrp-user-panel>header{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:18px 20px;border-bottom:1px solid #e3e9f2}.hrp-user-panel>header small{display:block;color:#7f8ea2;font-size:var(--font-xs);margin-bottom:4px}.hrp-user-panel>header h2{font-size:var(--font-lg);font-weight:700;color:#193c67;margin:0}.hrp-user-panel>header button{border:0;background:#f1f5fa;color:#677b95;border-radius:9px;width:35px;height:35px}.hrp-user-panel form{display:flex;min-height:0;flex:1;flex-direction:column}.hrp-drawer-tabs{display:flex;gap:4px;padding:11px 20px 0;border-bottom:1px solid #e7edf5}.hrp-drawer-tabs button{border:0;border-bottom:2px solid transparent;background:transparent;color:#77879b;padding:10px 13px;font-size:var(--font-ui)}.hrp-drawer-tabs button.active{border-color:#1769e0;color:#1769e0;font-weight:700}.hrp-user-pane{flex:1;overflow:auto;padding:20px}.hrp-user-pane[hidden]{display:none}.hrp-user-panel form>footer{display:flex;justify-content:flex-end;gap:9px;padding:13px 20px;border-top:1px solid #e3e9f2;background:#fbfcfe}.hrp-user-panel form>footer .btn{min-width:92px}.hrp-inline-toggle{border:1px solid #e1e8f2;border-radius:11px;margin-top:16px;min-height:64px}.hrp-branch-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:11px}.hrp-branch-grid label{display:flex;align-items:center;gap:8px;border:1px solid #e3e9f2;border-radius:9px;padding:10px 11px;color:#516780;font-size:var(--font-sm);background:#fbfcfe}.hrp-branch-grid input{accent-color:#1769e0}.hrp-role-preview{margin-top:17px;border:1px solid #dce5f1;border-radius:12px;overflow:hidden}.hrp-role-preview>header{display:flex;align-items:center;gap:10px;padding:12px 14px;background:#f5f8fc;border-bottom:1px solid #e2e9f2}.hrp-role-preview>header i{width:34px;height:34px;display:grid;place-items:center;border-radius:9px;background:#eaf2ff;color:#1769e0}.hrp-role-preview>header div{display:flex;flex-direction:column;gap:3px}.hrp-role-preview>header strong{font-size:var(--font-ui);color:#24486f}.hrp-role-preview>header small{font-size:var(--font-xs);color:#8090a4}.hrp-role-preview>div{padding:12px}.hrp-role-preview article{display:grid;grid-template-columns:130px 1fr;align-items:flex-start;gap:10px;padding:9px 0;border-bottom:1px solid #edf1f6}.hrp-role-preview article:last-child{border-bottom:0}.hrp-role-preview article>strong{font-size:var(--font-sm);color:#2b4b71}.hrp-role-preview article>div{display:flex;flex-wrap:wrap;gap:5px}.hrp-role-preview article span{background:#eef4fc;color:#55708f;border-radius:999px;padding:4px 8px;font-size:var(--font-xs)}.hrp-role-preview p{color:#7d8da1;font-size:var(--font-sm);margin:0}.hrp-management[dir="ltr"] .hrp-table,.hrp-management[dir="ltr"] .hrp-profile-tabs button{text-align:left}.hrp-management[dir="ltr"] .dropdown-menu{text-align:left}.hrp-management[dir="ltr"] .hrp-user-panel{margin-inline-start:0}.hrp-management[dir="ltr"] .hrp-drawer-tabs,.hrp-management[dir="ltr"] .hrp-user-pane,.hrp-management[dir="ltr"] .hrp-user-panel{text-align:left}@keyframes hrp-panel-in{from{transform:translateX(-24px);opacity:.75}to{transform:none;opacity:1}}@media(max-width:1050px){.hrp-management-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:760px){.hrp-header-actions{width:100%}.hrp-header-actions .btn{flex:1}.hrp-management-tabs{width:100%}.hrp-management-tabs button{flex:1;justify-content:center}.hrp-user-panel{width:100vw}.hrp-branch-grid{grid-template-columns:1fr}.hrp-role-preview article{grid-template-columns:1fr}}@media(max-width:480px){.hrp-management-kpis{grid-template-columns:1fr}.hrp-header-actions{flex-direction:column}.hrp-header-actions .btn{width:100%}}

/* Employees & Users Management — the current /hr/employees screen. */
.hrp-management-kpis{grid-template-columns:repeat(6,minmax(0,1fr))}
.hrp-management-tabs{overflow-x:auto}
.hrp-management-tabs a{border:0;background:transparent;color:#687b94;border-radius:8px;padding:9px 18px;display:inline-flex;align-items:center;gap:7px;font-size:var(--font-ui);white-space:nowrap;text-decoration:none}
.hrp-management-tabs a:hover{color:#1769e0;background:#f7faff}
.hrp-management-table{min-width:1320px}
.hrp-section-heading{display:flex;align-items:center;gap:12px;margin-bottom:18px;padding-bottom:14px;border-bottom:1px solid #e7edf5}
.hrp-section-heading>span{width:42px;height:42px;flex:0 0 42px;border-radius:11px;display:grid;place-items:center;background:#eaf2ff;color:#1769e0}
.hrp-section-heading h3{font-size:var(--font-md);font-weight:700;color:#1d395f;margin:0 0 4px}
.hrp-section-heading p{font-size:var(--font-sm);color:#8090a4;margin:0}
.hrp-avatar--large{width:58px;height:58px;flex-basis:58px;border-radius:14px;font-size:1.2rem}
.hrp-photo-button{position:relative;overflow:hidden;display:inline-flex;align-items:center;gap:7px;font-size:var(--font-ui)}
.hrp-account-summary{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;margin:14px 0;padding:12px 14px;border:1px solid #dce6f3;border-radius:11px;background:#f6f9fe}
.hrp-account-summary span{font-size:var(--font-sm);color:#75869c}
.hrp-account-summary strong{font-size:var(--font-ui);color:#1769e0}
.hrp-account-summary small{margin-inline-start:auto;font-size:var(--font-xs);color:#647892}
.hrp-field input:disabled,.hrp-field select:disabled{background:#f3f5f8;color:#8492a5;cursor:not-allowed}
@media(max-width:1350px){.hrp-management-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:760px){.hrp-management-tabs a,.hrp-management-tabs button{flex:0 0 auto}.hrp-account-summary small{width:100%;margin-inline-start:0}.hrp-photo-button{margin-inline-start:auto}}
@media(max-width:480px){.hrp-management-kpis{grid-template-columns:1fr}}

/* hr-onboarding.css */
/* إضافة موظف جديد — employee onboarding workflow (hr_employees.js). Uses the ACCMAN theme tokens and the .hrp-* HR base. */
.hro-page{--hro-accent:var(--primary,#178f55);--hro-accent-soft:color-mix(in srgb,var(--hro-accent) 10%,#fff);--hro-border:#e2e8f0;--hro-muted:#6b7a90;padding-bottom:12px}
.hro-header{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:16px}
.hro-header h1{font-size:var(--font-2xl);font-weight:800;color:#13294b;margin:4px 0 2px}
.hro-header h2{font-size:var(--font-md);font-weight:600;color:#3d4f68;margin:0}
.hro-header p{color:var(--hro-muted);font-size:var(--font-sm);margin:4px 0 0}

.hro-stepper{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:0;background:#fff;border:1px solid var(--hro-border);border-radius:14px;padding:16px 10px 12px;margin-bottom:16px;position:relative;overflow-x:auto}
.hro-stepper button{position:relative;border:0;background:none;display:flex;flex-direction:column;align-items:center;gap:4px;padding:0 4px;color:#6b7a90;min-width:92px}
.hro-stepper button::before{content:"";position:absolute;top:17px;inset-inline-start:50%;width:100%;height:3px;background:#e3e8ef;z-index:0}
.hro-stepper button:last-child::before{display:none}
.hro-stepper button.done::before{background:var(--hro-accent)}
.hro-stepper__dot{position:relative;z-index:1;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;font-weight:800;background:#cfd6e0;color:#fff;border:3px solid #fff;box-shadow:0 0 0 1px #d8dee8}
.hro-stepper button.active .hro-stepper__dot{background:var(--hro-accent);box-shadow:0 0 0 4px var(--hro-accent-soft)}
.hro-stepper button.done .hro-stepper__dot{background:var(--hro-accent)}
.hro-stepper strong{font-size:var(--font-sm);color:#1d324f}
.hro-stepper button.active strong,.hro-stepper button.done strong{color:var(--hro-accent)}
.hro-stepper small{font-size:var(--font-xs)}
.hro-stepper button:disabled{opacity:.55;cursor:not-allowed}

.hro-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:16px;align-items:start}
.hro-main{display:flex;flex-direction:column;gap:14px;min-width:0}
.hro-aside{display:flex;flex-direction:column;gap:14px;position:sticky;top:12px}
.hro-card{background:#fff;border:1px solid var(--hro-border);border-radius:14px;box-shadow:0 4px 16px rgba(33,62,105,.04);overflow:hidden}
.hro-card__head{display:flex;align-items:center;gap:10px;padding:12px 16px;border-bottom:1px solid #eef2f7;background:#fbfcfe}
.hro-card__head h2{font-size:var(--font-md);font-weight:800;color:#15305a;margin:0}
.hro-card__head>i{color:var(--hro-accent)}
.hro-num{width:26px;height:26px;border-radius:50%;background:#e2394b;color:#fff;font-weight:800;display:grid;place-items:center;font-size:var(--font-sm)}
.hro-card__body{padding:16px}
.hro-card .hrp-fields{gap:12px}
.hrp-fields--4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.hro-basic{display:grid;grid-template-columns:minmax(0,1fr) 180px;gap:16px}
.hro-photo{border:2px dashed #cfd8e4;border-radius:12px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:14px;text-align:center;cursor:pointer;color:var(--hro-muted)}
.hro-photo input{display:none}
.hro-photo>span{width:84px;height:84px;border-radius:50%;background:#55606e;color:#fff;display:grid;place-items:center;font-size:1.6rem;overflow:hidden}
.hro-photo img{width:100%;height:100%;object-fit:cover}
.hro-photo small{font-size:var(--font-xs)}

.hro-accounting{border-color:color-mix(in srgb,var(--hro-accent) 35%,#fff)}
.hro-accounting-top{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) minmax(0,1fr);gap:12px;align-items:center;margin-bottom:14px}
.hro-info{background:#eef5ff;border-color:#cfe0fb;color:#24508f;margin:0}
.hro-switch{display:flex;align-items:center;gap:10px;cursor:pointer}
.hro-switch input{width:42px;height:22px;accent-color:var(--hro-accent)}
.hro-switch span{display:flex;flex-direction:column}
.hro-switch strong{font-size:var(--font-ui);color:#16365f}
.hro-switch small{font-size:var(--font-xs);color:var(--hro-muted)}
.hro-switch--lead{padding:12px;border:1px solid var(--hro-border);border-radius:12px;margin-bottom:12px}
.hro-accounts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:12px}
.hro-account{border:1px solid;border-radius:12px;padding:12px;display:flex;flex-direction:column;gap:10px}
.hro-account header{display:flex;gap:10px;align-items:center}
.hro-account header span{width:34px;height:34px;border-radius:9px;display:grid;place-items:center}
.hro-account header strong{display:block;font-size:var(--font-ui);color:#16365f}
.hro-account header small{font-size:var(--font-xs);color:var(--hro-muted)}
.hro-account__name{display:flex;align-items:center;gap:8px;background:#fff;border:1px solid #dfe5ee;border-radius:9px;padding:8px 10px;font-size:var(--font-ui)}
.hro-account footer{font-size:var(--font-xs);color:#2f6b45;display:flex;gap:6px;align-items:center}
.hro-account footer i{color:#1d9a55}
.hro-account--purple{border-color:#e3d8fb;background:#faf7ff}.hro-account--purple header span{background:#efe7ff;color:#7a4fd6}
.hro-account--blue{border-color:#d6e4fb;background:#f6f9ff}.hro-account--blue header span{background:#e5efff;color:#2563eb}
.hro-account--green{border-color:#cfeeda;background:#f4fbf6}.hro-account--green header span{background:#e1f6e8;color:#178f55}

.hro-preview__body{display:flex;flex-direction:column;align-items:center;gap:6px;padding:16px;text-align:center}
.hro-avatar{width:96px;height:96px;border-radius:50%;background:#e8eef6;color:#5a6b82;display:grid;place-items:center;font-size:2.4rem;overflow:hidden;border:4px solid #fff;box-shadow:0 4px 14px rgba(20,40,70,.12)}
.hro-avatar img{width:100%;height:100%;object-fit:cover}
.hro-preview__body>strong{font-size:var(--font-md);color:#13294b}
.hro-pill{font-size:var(--font-xs);background:#e9f2ff;color:#1d5fc0;border-radius:999px;padding:3px 10px}
.hro-code{font-size:var(--font-xs);color:var(--hro-muted);display:flex;gap:6px;align-items:center}
.hro-facts{margin:0;padding:6px 16px 14px}
.hro-facts div{display:flex;justify-content:space-between;gap:10px;padding:6px 0;border-bottom:1px dashed #edf1f6;font-size:var(--font-sm)}
.hro-facts dt{font-weight:500;color:var(--hro-muted)}
.hro-facts dt i{width:16px;color:#94a3b8}
.hro-facts dd{margin:0;color:#1f3657;font-weight:600;text-align:end;word-break:break-word}
.hro-accounts-side ul{list-style:none;margin:0;padding:10px 16px 14px;display:flex;flex-direction:column;gap:10px}
.hro-accounts-side li{display:flex;gap:10px;align-items:flex-start}
.hro-accounts-side strong{display:block;font-size:var(--font-sm);color:#1d3557}
.hro-accounts-side small{font-size:var(--font-xs);color:var(--hro-muted)}
.hro-dot{width:10px;height:10px;border-radius:50%;margin-top:5px;flex:0 0 10px}
.hro-dot--green{background:#1d9a55}.hro-dot--blue{background:#2563eb}.hro-dot--purple{background:#7a4fd6}

.hro-split{display:grid;grid-template-columns:minmax(0,1fr) 220px;gap:14px;align-items:start}
.hro-split--tree{grid-template-columns:minmax(0,1fr) 300px}
.hro-split--tree>div{display:flex;flex-direction:column;gap:14px;min-width:0}
.hro-org-hint{display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;padding:18px;border-radius:12px;background:#eef5ff;color:#1d4f96;text-decoration:none}
.hro-org-hint i{font-size:2rem}
.hro-org-hint small{color:#55709a}
.hro-readonly{min-height:38px;display:flex;align-items:center;gap:8px;border:1px solid #dfe5ee;border-radius:8px;padding:6px 10px;background:#f8fafc;font-size:var(--font-ui)}
.hro-user-fields{display:flex;flex-direction:column;gap:12px}
.hro-user-fields>.btn{align-self:flex-start}
.hro-inline-note{display:block;margin-top:-6px}
.hro-path{display:flex;flex-wrap:wrap;gap:6px;align-items:center;font-size:var(--font-xs);margin-bottom:10px}
.hro-path span{background:var(--hro-accent-soft);color:var(--hro-accent);border-radius:6px;padding:3px 7px;font-weight:600}
.hro-path i{font-size:.6rem;color:#94a3b8}
.hro-tree{max-height:420px;overflow:auto;font-size:var(--font-sm)}
.hro-tree ul{list-style:none;margin:0;padding-inline-start:16px;border-inline-start:1px dashed #d7dee8}
.hro-tree>ul{padding:0;border:0}
.hro-tree li{padding:3px 0}
.hro-tree li>span{display:inline-flex;gap:6px;align-items:center;padding:2px 6px;border-radius:6px}
.hro-tree li.is-selected>span{background:var(--hro-accent-soft);color:var(--hro-accent);font-weight:700}
.hro-tree li.is-root>span{font-weight:700;color:#13294b}
.hro-tree i{font-size:.75rem}

.hro-summary-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px;margin-bottom:12px}
.hro-summary-grid>div{background:#f8fafc;border:1px solid #edf1f6;border-radius:10px;padding:8px 10px;display:flex;flex-direction:column;gap:3px}
.hro-summary-grid span{font-size:var(--font-xs);color:var(--hro-muted)}
.hro-summary-grid strong{font-size:var(--font-ui);color:#1d3557}
.hro-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.hro-sub{font-size:var(--font-ui);font-weight:800;color:#15305a;margin:14px 0 8px}
.hro-check{display:flex;align-items:center;gap:8px;font-size:var(--font-ui);align-self:end;padding-bottom:8px}
.hro-contract-preview{display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center;background:#f3f8ff;border-radius:12px;padding:16px;margin-bottom:10px}
.hro-contract-preview i{font-size:2rem;color:#2563eb}
.hro-contract-preview small{color:#4b5d78}
.hro-files{list-style:none;margin:0 0 8px;padding:0;display:flex;flex-direction:column;gap:6px;font-size:var(--font-sm)}
.hro-upload{display:inline-flex;cursor:pointer}
.hro-upload input{display:none}
.hro-upload span{font-size:var(--font-xs);color:var(--hro-accent);border:1px dashed currentColor;border-radius:7px;padding:3px 8px}
.hro-table{min-width:760px}
.hro-table td small{display:block}
.hro-row-actions{white-space:nowrap}
.hro-row-actions .btn{padding:3px 7px}
.hro-change{font-size:var(--font-xs)}
.hro-change span{color:var(--hro-muted)}
.hro-field-action{display:flex;align-items:flex-end}
.hro-field-action .btn{width:100%}

.hro-review-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.hro-review{background:#fff;border:1px solid var(--hro-border);border-radius:12px;padding:12px;display:flex;flex-direction:column;gap:5px}
.hro-review header{display:flex;align-items:center;gap:8px;margin-bottom:4px}
.hro-review header span{width:32px;height:32px;border-radius:9px;background:var(--hro-accent-soft);color:var(--hro-accent);display:grid;place-items:center}
.hro-review h3{flex:1;font-size:var(--font-ui);font-weight:800;margin:0;color:#15305a}
.hro-review>div{display:flex;justify-content:space-between;gap:8px;font-size:var(--font-xs)}
.hro-review>div span{color:var(--hro-muted)}
.hro-review>div strong{color:#1d3557;text-align:end}
.hro-checks{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.hro-checks li{display:flex;align-items:center;gap:10px;border:1px solid #edf1f6;border-radius:10px;padding:8px 12px}
.hro-checks li>div{flex:1;display:flex;flex-direction:column}
.hro-checks li small{color:#b4232f}
.hro-checks li.is-ok>i{color:#1d9a55}
.hro-checks li.is-missing{border-color:#f6d3d7;background:#fff8f8}
.hro-checks li.is-missing>i{color:#d43c4b}
.hro-ready{background:#effaf3;border-color:#c9ecd6;color:#1f6b40}
.hro-done{background:#effaf3;border-color:#c9ecd6;color:#1f6b40}
.hro-missing{background:#fff6e5;border-color:#f6dfb0;color:#8a5a00}

.hro-footer{position:sticky;bottom:0;z-index:20;display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 16px;margin-top:16px;background:#fff;border:1px solid var(--hro-border);border-radius:14px;box-shadow:0 -6px 18px rgba(20,40,70,.06)}
.hro-footer>div{display:flex;gap:8px}
.hro-next{min-width:150px}

@media(max-width:1280px){.hro-review-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hrp-fields--4{grid-template-columns:repeat(2,minmax(0,1fr))}.hro-accounting-top{grid-template-columns:1fr}}
@media(max-width:1100px){.hro-layout{grid-template-columns:1fr}.hro-aside{position:static;order:-1}.hro-split,.hro-split--tree{grid-template-columns:1fr}}
@media(max-width:768px){.hro-header{flex-direction:column}.hro-basic{grid-template-columns:1fr}.hro-accounts{grid-template-columns:1fr}.hro-review-grid,.hrp-fields--4{grid-template-columns:1fr}.hro-footer{padding:8px 12px;flex-wrap:wrap}.hro-footer .btn{flex:1}}

/* Contract step «الرواتب والحضور والإجازات» (231/232/234) */
.hro-checks{display:flex;flex-wrap:wrap;gap:18px;margin:6px 0 10px}
.hro-deductions{display:grid;gap:8px;margin:6px 0 8px}
.hro-deduction{display:grid;grid-template-columns:minmax(160px,1.4fr) minmax(110px,.8fr) minmax(140px,1.4fr) auto;gap:8px;align-items:center}
.hro-deduction input{min-height:38px;border:1px solid #d6e2dc;border-radius:8px;padding:6px 10px;font:inherit}
@media(max-width:640px){.hro-deduction{grid-template-columns:1fr 1fr}}

/* hr-organization.css */
/* التنظيم الإداري — organizational structure page (hr_organization.js). ACCMAN theme tokens + .hrp-* HR base. */
.hro-org{--org-accent:var(--primary,#178f55);--org-soft:color-mix(in srgb,var(--org-accent) 10%,#fff);--org-border:#e3e9f1;--org-muted:#6b7a90;color:#142b4a;padding-bottom:24px}
.hro-org__head{margin-bottom:16px}
.hro-org__head h1{font-size:var(--font-2xl);font-weight:800;color:#13294b;margin:4px 0}
.hro-org__head p{margin:0;color:var(--org-muted);font-size:var(--font-sm)}
.hro-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:16px}
.hro-kpi{display:flex;align-items:center;gap:14px;background:#fff;border:1px solid var(--org-border);border-radius:14px;padding:16px 18px;box-shadow:0 4px 16px rgba(33,62,105,.04)}
.hro-kpi>span{width:52px;height:52px;border-radius:14px;display:grid;place-items:center;font-size:1.3rem;flex:0 0 52px}
.hro-kpi strong{display:block;font-size:var(--font-2xl);font-weight:800;color:#13294b;line-height:1.1}
.hro-kpi small{display:block;font-size:var(--font-sm);color:#33465f;font-weight:600}
.hro-kpi em{display:block;font-style:normal;font-size:var(--font-xs);color:var(--org-muted)}
.hro-kpi--orange>span{background:#fff1e3;color:#e07a12}.hro-kpi--green>span{background:#e3f6ea;color:#178f55}.hro-kpi--blue>span{background:#e6f0ff;color:#2563eb}.hro-kpi--purple>span{background:#f0e9ff;color:#7a4fd6}
.hro-tabs{display:flex;background:#fff;border:1px solid var(--org-border);border-radius:12px;padding:4px;gap:4px;margin-bottom:16px;overflow-x:auto}
.hro-tabs button{flex:1;border:0;background:transparent;border-radius:9px;padding:10px 14px;color:#4b5d78;font-weight:600;white-space:nowrap;display:inline-flex;align-items:center;justify-content:center;gap:8px}
.hro-tabs button.active{background:var(--org-accent);color:#fff}
.hro-panel{background:#fff;border:1px solid var(--org-border);border-radius:14px;box-shadow:0 4px 16px rgba(33,62,105,.04);margin-bottom:16px;overflow:hidden}
.hro-panel__head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;padding:14px 18px;border-bottom:1px solid #eef2f7}
.hro-panel__head h2{font-size:var(--font-lg);font-weight:800;margin:0;color:#13294b}
.hro-panel__head p{margin:2px 0 0;font-size:var(--font-xs);color:var(--org-muted)}
.hro-panel__actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.hro-panel__actions .form-select{width:auto;min-width:150px}
.hro-filters{display:grid;grid-template-columns:minmax(220px,2fr) repeat(3,minmax(140px,1fr));gap:10px;padding:12px 18px;border-bottom:1px solid #eef2f7}
.hro-filters .hrp-search{min-width:0;height:38px}

.hro-chart{overflow:auto;padding:20px 12px 24px}
.hro-chart ul{display:flex;justify-content:center;padding:18px 0 0;margin:0;list-style:none;position:relative}
.hro-chart>ul{padding-top:0;width:max-content;min-width:100%;margin:0 auto}
.hro-chart li{position:relative;padding:18px 8px 0;display:flex;flex-direction:column;align-items:center}
.hro-chart>ul>li{padding-top:0}
.hro-chart li::before,.hro-chart li::after{content:"";position:absolute;top:0;width:50%;height:18px;border-top:1.5px dashed #b9c4d3}
.hro-chart li::before{inset-inline-end:50%}
.hro-chart li::after{inset-inline-start:50%;border-inline-start:1.5px dashed #b9c4d3}
.hro-chart li:only-child::before,.hro-chart li:only-child::after{display:none}
.hro-chart li:only-child{padding-top:18px}
.hro-chart li:first-child::before,.hro-chart li:last-child::after{border:0}
.hro-chart li:last-child::before{border-inline-end:1.5px dashed #b9c4d3;border-start-end-radius:0}
.hro-chart>ul>li::before,.hro-chart>ul>li::after{display:none}
.hro-chart ul ul::before{content:"";position:absolute;top:0;inset-inline-start:50%;height:18px;border-inline-start:1.5px dashed #b9c4d3}
.hro-node{position:relative;display:flex;align-items:center;gap:10px;min-width:168px;max-width:220px;padding:10px 12px;border-radius:12px;border:1px solid;background:#fff;cursor:pointer;text-align:start;transition:box-shadow .15s,transform .15s}
.hro-node:hover,.hro-node:focus-visible{box-shadow:0 8px 20px rgba(20,40,70,.12);transform:translateY(-1px);outline:none}
.hro-node strong{display:block;font-size:var(--font-sm);color:#13294b;line-height:1.3}
.hro-node small{display:block;font-size:var(--font-xs);color:var(--org-muted)}
.hro-node em{display:block;font-style:normal;font-size:var(--font-xs);color:#4b5d78;margin-top:2px}
.hro-node__icon{width:34px;height:34px;border-radius:9px;display:grid;place-items:center;flex:0 0 34px}
.hro-node__toggle{position:absolute;bottom:-11px;inset-inline-start:50%;transform:translateX(-50%);min-width:24px;height:22px;border-radius:11px;border:1px solid #c9d3e1;background:#fff;font-size:11px;font-weight:700;color:#3d5170;padding:0 6px;z-index:1}
[dir="rtl"] .hro-node__toggle{transform:translateX(50%)}
.hro-node.is-inactive{opacity:.55;filter:grayscale(.6)}
.hro-node--root{background:var(--org-accent);border-color:var(--org-accent);cursor:default;min-width:210px;justify-content:center}
.hro-node--root strong,.hro-node--root small{color:#fff}
.hro-node--root .hro-node__icon{background:rgba(255,255,255,.18);color:#fff}
.hro-node--red{border-color:#f5c9cf;background:#fff6f7}.hro-node--red .hro-node__icon{background:#ffe3e7;color:#d43c4b}
.hro-node--orange{border-color:#f8dcbd;background:#fffaf3}.hro-node--orange .hro-node__icon{background:#fff0dd;color:#e07a12}
.hro-node--green{border-color:#c8ead4;background:#f4fbf6}.hro-node--green .hro-node__icon{background:#e1f6e8;color:#178f55}
.hro-node--purple{border-color:#ddd2f7;background:#faf7ff}.hro-node--purple .hro-node__icon{background:#efe7ff;color:#7a4fd6}
.hro-node--blue{border-color:#cfe0fb;background:#f5f9ff}.hro-node--blue .hro-node__icon{background:#e5efff;color:#2563eb}
.hro-node--teal{border-color:#c4e9e6;background:#f3fbfa}.hro-node--teal .hro-node__icon{background:#dcf4f1;color:#0f8c80}

.hro-org-table{min-width:880px}
.hro-cell-name{display:flex;align-items:center;gap:10px}
.hro-cell-name strong{display:block;color:#13294b}
.hro-cell-name small{display:block;font-size:var(--font-xs);color:var(--org-muted)}
.hro-unit-icon{width:32px;height:32px;border-radius:9px;display:grid;place-items:center;background:#eef3fa;color:#4b6587;flex:0 0 32px}
.hro-unit-icon--administration{background:#e1f6e8;color:#178f55}.hro-unit-icon--department{background:#e5efff;color:#2563eb}.hro-unit-icon--section{background:#fff0dd;color:#e07a12}
.hro-muted{color:var(--org-muted);font-size:var(--font-sm)}
.hro-status{display:inline-flex;align-items:center;gap:6px;font-size:var(--font-sm);color:#68788f}
.hro-status i{width:8px;height:8px;border-radius:50%;background:#a0acbd}
.hro-status.is-active{color:#178f55}.hro-status.is-active i{background:#1d9a55}
.hro-row-actions{white-space:nowrap}
.hro-icon-btn{width:32px;height:32px;border-radius:8px;border:1px solid #e1e7ef;background:#fff;color:#48607f;margin-inline-end:4px}
.hro-icon-btn:hover{background:#f3f6fa}
.hro-icon-btn.is-view{color:#d98b00;border-color:#f6dfb0;background:#fffaf0}
.hro-icon-btn.is-danger{color:#c63747}
.hro-pager{display:flex;justify-content:space-between;align-items:center;padding:10px 18px;font-size:var(--font-sm);color:var(--org-muted);border-top:1px solid #eef2f7}
.hro-pager div{display:flex;gap:8px;align-items:center}
.hro-pager button{border:1px solid #dfe6f0;background:#fff;border-radius:8px;padding:4px 10px}
.hro-pager button:disabled{opacity:.45}

.hro-modal{position:fixed;inset:0;z-index:1080;background:rgba(20,40,67,.38);display:grid;place-items:center;padding:20px}
.hro-modal[hidden]{display:none}
.hro-dialog{width:min(760px,100%);max-height:calc(100vh - 40px);overflow:auto;background:#fff;border-radius:16px;box-shadow:0 18px 60px rgba(13,37,70,.25)}
.hro-dialog>header{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border-bottom:1px solid #e7edf5;position:sticky;top:0;background:#fff;z-index:1}
.hro-dialog h2{font-size:var(--font-md);font-weight:800;margin:0;color:#13294b}
.hro-dialog header button{border:0;background:#f1f4f8;color:#687b94;width:32px;height:32px;border-radius:8px}
.hro-form,.hro-detail{padding:18px}
.hro-form .hrp-fields{gap:12px;margin-bottom:12px}
.hro-form footer,.hro-detail footer{display:flex;justify-content:flex-end;gap:8px;margin-top:16px;padding-top:14px;border-top:1px solid #e7edf5}
.hro-crumbs{display:flex;flex-wrap:wrap;gap:6px;align-items:center;font-size:var(--font-xs);color:var(--org-accent);margin-bottom:12px}
.hro-crumbs i{font-size:.6rem;color:#94a3b8}
[dir="ltr"] .hro-crumbs i{transform:scaleX(-1)}
.hro-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:12px}
.hro-summary div{background:#f8fafc;border:1px solid #edf1f6;border-radius:10px;padding:8px 10px;display:flex;flex-direction:column;gap:2px}
.hro-summary span{font-size:var(--font-xs);color:var(--org-muted)}
.hro-summary strong{font-size:var(--font-ui);color:#1d3557}
.hro-detail h3{font-size:var(--font-ui);font-weight:800;margin:14px 0 6px;color:#15305a}
.hro-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:4px}
.hro-list li{display:flex;justify-content:space-between;gap:10px;padding:6px 10px;border:1px solid #eef2f7;border-radius:8px;font-size:var(--font-sm)}

@media(max-width:1100px){.hro-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.hro-filters{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.hro-kpis{grid-template-columns:1fr}.hro-filters{grid-template-columns:1fr}.hro-summary{grid-template-columns:1fr 1fr}.hro-panel__head{flex-direction:column}.hro-tabs button{flex:0 0 auto}}
.hro-form textarea{width:100%}
/* المستندات والتنبيهات (hr_documents.js) — same page kit */
.hrd-kpis{grid-template-columns:repeat(5,minmax(0,1fr))}
.hrd-kpi{border:1px solid var(--org-border);text-align:start;cursor:pointer;font:inherit}
.hrd-kpi:hover{box-shadow:0 8px 20px rgba(20,40,70,.1)}
.hrd-filters{grid-template-columns:minmax(220px,2fr) repeat(4,minmax(130px,1fr)) repeat(2,minmax(130px,1fr))}
.hrd-range{display:flex;flex-direction:column;gap:2px;font-size:var(--font-xs);color:var(--org-muted)}
.hrd-range .form-control{height:38px}
.hrd-employee{text-decoration:none}
.hrd-employee strong{display:block;color:#13294b}
.hrd-employee small{display:block;font-size:var(--font-xs);color:var(--org-muted)}
.hrd-upload{display:inline-grid;place-items:center;cursor:pointer;vertical-align:middle}
@media(max-width:1280px){.hrd-filters{grid-template-columns:repeat(3,minmax(0,1fr))}.hrd-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:640px){.hrd-filters,.hrd-kpis{grid-template-columns:1fr}}

/* hr-attendance-phase2.css */
.hr2{--hr2-blue:#2563eb;--hr2-navy:#14213d;--hr2-line:#dfe6ef;--hr2-bg:#f6f8fb;--hr2-muted:#718096;direction:rtl;color:var(--hr2-navy);}.hr2 *{box-sizing:border-box}.hr2-page{display:grid;gap:16px}.hr2-head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 20px;background:#fff;border:1px solid var(--hr2-line);border-radius:14px;box-shadow:0 5px 18px rgba(26,45,78,.045)}.hr2-title{display:flex;align-items:center;gap:12px}.hr2-title-icon{width:44px;height:44px;display:grid;place-items:center;border-radius:12px;background:#eaf1ff;color:var(--hr2-blue);font-size:19px}.hr2-title h1{font-size:var(--font-2xl);margin:0 0 3px;font-weight:700}.hr2-title p{font-size:var(--font-sm);color:var(--hr2-muted);margin:0}.hr2-actions{display:flex;gap:8px;flex-wrap:wrap}.hr2-btn{border:1px solid var(--hr2-line);background:#fff;color:#34425a;border-radius:9px;min-height:39px;padding:8px 13px;font-weight:700;font-size:var(--font-ui);font-family:inherit;display:inline-flex;align-items:center;justify-content:center;gap:7px;cursor:pointer;text-decoration:none}.hr2-btn:hover{border-color:#b7c7e4;background:#f8faff}.hr2-btn--primary{background:var(--hr2-blue);color:#fff;border-color:var(--hr2-blue)}.hr2-btn--danger{color:#b42318;border-color:#fecaca;background:#fffafa}.hr2-btn--success{background:#ecfdf3;color:#087443;border-color:#bbf7d0}.hr2-btn:disabled{opacity:.55;cursor:not-allowed}.hr2-card{background:#fff;border:1px solid var(--hr2-line);border-radius:14px;box-shadow:0 4px 14px rgba(26,45,78,.035)}.hr2-toolbar{padding:13px;display:grid;grid-template-columns:repeat(6,minmax(130px,1fr));gap:10px;align-items:end}.hr2-field{display:grid;gap:5px}.hr2-field--wide{grid-column:span 2}.hr2-field label{font-size:var(--font-ui);color:#536076;font-weight:700}.hr2-input{width:100%;height:40px;border:1px solid #d5deea;border-radius:8px;background:#fff;color:#26334a;padding:8px 10px;font-weight:600;font-size:var(--font-ui);font-family:inherit;outline:none}.hr2-input:focus{border-color:#8eaff7;box-shadow:0 0 0 3px rgba(37,99,235,.08)}textarea.hr2-input{height:84px;resize:vertical}.hr2-table-wrap{overflow:auto;border-radius:14px}.hr2-table{width:100%;min-width:980px;border-collapse:collapse}.hr2-table th{background:#f4f7fb;color:#4b5870;font-size:var(--font-ui);font-weight:700;text-align:right;padding:12px;white-space:nowrap;border-bottom:1px solid var(--hr2-line)}.hr2-table td{padding:12px;border-bottom:1px solid #edf1f6;font-size:var(--font-ui);vertical-align:middle}.hr2-table tbody tr:hover{background:#fafcff}.hr2-table tbody tr[data-row]{cursor:pointer}.hr2-table strong{font-weight:700}.hr2-sub{font-size:var(--font-xs);color:var(--hr2-muted);margin-top:2px}.hr2-code{direction:ltr;display:inline-block;font-weight:700;font-size:var(--font-sm);font-family:var(--font-family-mono);padding:3px 7px;border-radius:6px;background:#edf2f7;color:#475569}.hr2-time{direction:ltr;font-variant-numeric:tabular-nums;white-space:nowrap}.hr2-row-actions{display:flex;gap:5px}.hr2-icon-btn{width:32px;height:32px;border:1px solid var(--hr2-line);border-radius:8px;background:#fff;color:#4f607a;cursor:pointer}.hr2-icon-btn:hover{color:var(--hr2-blue);border-color:#b7c9ee}.hr2-badge{display:inline-flex;align-items:center;gap:5px;border-radius:999px;padding:5px 9px;font-size:var(--font-xs);font-weight:700;white-space:nowrap;background:#edf2f7;color:#526079}.hr2-badge--on_time,.hr2-badge--approved,.hr2-badge--processed,.hr2-badge--active,.hr2-badge--online{background:#e6f7ef;color:#087443}.hr2-badge--late,.hr2-badge--pending_approval,.hr2-badge--submitted,.hr2-badge--pending{background:#fff7d6;color:#8a6100}.hr2-badge--missing_check_in,.hr2-badge--missing_check_out,.hr2-badge--missing_punch,.hr2-badge--unmatched{background:#fff0df;color:#a24b00}.hr2-badge--absent,.hr2-badge--rejected,.hr2-badge--failed{background:#feeceb;color:#b42318}.hr2-badge--leave{background:#eaf2ff;color:#245bb7}.hr2-badge--permission,.hr2-badge--in_review{background:#f1eafe;color:#6941c6}.hr2-badge--mission{background:#e3f6f3;color:#0f766e}.hr2-badge--holiday{background:#fdebf3;color:#be185d}.hr2-badge--rest_day,.hr2-badge--inactive,.hr2-badge--draft,.hr2-badge--unsupported{background:#edf1f5;color:#667085}.hr2-badge--early_leave,.hr2-badge--late_early_leave,.hr2-badge--overtime{background:#e7f7fb;color:#087a8d}.hr2-empty{padding:55px 20px;text-align:center;color:var(--hr2-muted)}.hr2-empty i{display:block;font-size:34px;color:#b8c4d4;margin-bottom:12px}.hr2-empty strong{display:block;color:#40506a;font-size:var(--font-base);margin-bottom:5px}.hr2-loading{padding:50px;text-align:center;color:var(--hr2-muted)}.hr2-skeleton{height:12px;border-radius:8px;background:linear-gradient(90deg,#edf1f6,#f7f9fb,#edf1f6);background-size:200% 100%;animation:hr2pulse 1.3s infinite}@keyframes hr2pulse{to{background-position:-200% 0}}.hr2-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:11px}.hr2-kpi{padding:14px 15px;display:flex;align-items:center;gap:12px}.hr2-kpi i{width:38px;height:38px;display:grid;place-items:center;border-radius:10px;background:#eaf1ff;color:var(--hr2-blue)}.hr2-kpi span{display:block;color:var(--hr2-muted);font-size:var(--font-xs)}.hr2-kpi strong{display:block;font-size:var(--font-2xl);margin-top:2px}.hr2-tabs{display:flex;gap:5px;padding:5px;overflow:auto}.hr2-tab{border:0;border-radius:8px;background:transparent;color:#64748b;font-weight:700;font-size:var(--font-sm);font-family:inherit;padding:9px 14px;cursor:pointer;white-space:nowrap}.hr2-tab.is-active{background:#eaf1ff;color:var(--hr2-blue)}.hr2-overlay{position:fixed;inset:0;background:rgba(16,30,54,.48);z-index:10550;display:flex;align-items:center;justify-content:center;padding:18px}.hr2-modal{width:min(760px,100%);max-height:92vh;overflow:auto;background:#fff;border-radius:15px;box-shadow:0 24px 70px rgba(8,24,47,.25)}.hr2-modal--wide{width:min(980px,100%)}.hr2-modal>header{position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:space-between;padding:15px 18px;background:#fff;border-bottom:1px solid var(--hr2-line)}.hr2-modal>header h2{font-size:var(--font-lg);margin:0}.hr2-modal>main{padding:18px}.hr2-modal>footer{position:sticky;bottom:0;display:flex;gap:8px;padding:13px 18px;background:#fff;border-top:1px solid var(--hr2-line)}.hr2-form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:13px}.hr2-span-2{grid-column:1/-1}.hr2-section{grid-column:1/-1;border-top:1px solid var(--hr2-line);padding-top:13px;margin-top:5px}.hr2-section h3{font-size:var(--font-ui);margin:0 0 11px}.hr2-checks{display:flex;gap:7px;flex-wrap:wrap}.hr2-check{border:1px solid var(--hr2-line);border-radius:8px;padding:8px 10px;font-size:var(--font-sm);cursor:pointer}.hr2-check:has(input:checked){border-color:#9eb9f3;background:#eff4ff;color:#194faf}.hr2-check input{margin-left:5px}.hr2-drawer{position:fixed;top:0;bottom:0;left:0;z-index:10550;width:min(640px,94vw);background:#fff;box-shadow:12px 0 45px rgba(15,31,55,.22);display:flex;flex-direction:column;direction:rtl}.hr2-drawer>header{display:flex;align-items:center;justify-content:space-between;padding:16px 18px;border-bottom:1px solid var(--hr2-line)}.hr2-drawer>main{flex:1;overflow:auto;padding:18px}.hr2-drawer h2{font-size:var(--font-lg);margin:0}.hr2-facts{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.hr2-fact{border:1px solid var(--hr2-line);border-radius:9px;padding:10px;background:#fbfcfe}.hr2-fact span{display:block;font-size:var(--font-xs);color:var(--hr2-muted)}.hr2-fact strong{display:block;margin-top:4px;font-size:var(--font-sm)}.hr2-list{display:grid;gap:8px;margin-top:14px}.hr2-list-item{display:flex;align-items:center;justify-content:space-between;gap:10px;border:1px solid var(--hr2-line);border-radius:9px;padding:10px}.hr2-compare{display:grid;grid-template-columns:1fr 1fr;gap:11px}.hr2-compare section{border:1px solid var(--hr2-line);border-radius:11px;padding:13px}.hr2-compare h3{font-size:var(--font-ui);margin:0 0 10px}.hr2-note{border:1px solid #cbdcf9;border-radius:9px;background:#f2f6ff;color:#365b9a;padding:10px;font-size:var(--font-xs)}.hr2-error{border:1px solid #fecaca;border-radius:10px;background:#fff4f4;color:#b42318;padding:13px}.hr2-selection{max-height:330px;overflow:auto;border:1px solid var(--hr2-line);border-radius:10px}.hr2-employee-check{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;padding:10px;border-bottom:1px solid #edf1f6}.hr2-employee-check:last-child{border-bottom:0}.hr2-link{color:var(--hr2-blue);font-weight:700;cursor:pointer;text-decoration:none}@media(max-width:1100px){.hr2-toolbar{grid-template-columns:repeat(3,1fr)}.hr2-kpis{grid-template-columns:repeat(2,1fr)}}@media(max-width:760px){.hr2-head{align-items:flex-start;flex-direction:column}.hr2-toolbar,.hr2-form-grid{grid-template-columns:1fr}.hr2-field--wide,.hr2-span-2{grid-column:auto}.hr2-kpis{grid-template-columns:1fr}.hr2-facts,.hr2-compare{grid-template-columns:1fr}.hr2-modal{max-height:96vh}.hr2-title h1{font-size:var(--font-lg)}}

/* Daily attendance (renderAttendance): six day KPIs + search row */
.hr2-att-kpis{grid-template-columns:repeat(6,minmax(0,1fr))}.hr2-att-search{padding:10px 13px}.hr2-att-search .hr2-input{max-width:360px}
@media(max-width:1100px){.hr2-att-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:760px){.hr2-att-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.hr2-att-search .hr2-input{max-width:none}}
/* Drawers and modals are mounted on <body>, outside .hr2: same palette, so primary buttons and borders stay visible. */
.hr2-overlay,.hr2-drawer{--hr2-blue:#2563eb;--hr2-navy:#14213d;--hr2-line:#dfe6ef;--hr2-bg:#f6f8fb;--hr2-muted:#718096}
/* Split shift form: hide the fields of the other shift type (author display rules would otherwise beat [hidden]). */
.hr2-modal [hidden]{display:none!important}
/* Attendance calendar (approved compact design): details on the right, compact month on the left; a tile holds the day
   number only and its whole surface carries the status colour. */
.hr2-cal-toolbar{display:flex;gap:12px;align-items:end;justify-content:space-between;flex-wrap:wrap;padding:12px 14px}
.hr2-cal-toolbar .hr2-field{min-width:260px;flex:0 1 340px}
.hr2-cal-nav{display:flex;align-items:center;gap:8px}
.hr2-cal-nav strong{min-width:130px;text-align:center;font-size:var(--font-ui)}
.hr2-att-layout{display:grid;grid-template-columns:minmax(0,1fr) 352px;gap:16px;align-items:start}
.hr2-att-cal{padding:14px;position:sticky;top:12px}
.hr2-cal-grid{display:grid;grid-template-columns:repeat(7,40px);gap:6px;justify-content:center}
.hr2-cal-head{font-size:var(--font-xs);color:var(--hr2-muted);text-align:center;font-weight:700;padding-bottom:2px}
.hr2-tile{width:40px;height:40px;border-radius:8px;border:1px solid transparent;font-weight:700;font-size:var(--font-sm);display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0;font-variant-numeric:tabular-nums;transition:transform .12s,box-shadow .12s}
.hr2-tile:hover{transform:translateY(-1px);box-shadow:0 3px 8px rgba(20,33,61,.18)}
.hr2-tile:focus-visible{outline:2px solid var(--hr2-navy);outline-offset:2px}
.hr2-tile.is-selected{box-shadow:0 0 0 2px #fff,0 0 0 4px var(--hr2-navy)}
.hr2-tile.is-today{text-decoration:underline;text-underline-offset:3px}
.hr2-tile--present{background:#16a34a;color:#fff}
.hr2-tile--late{background:#f97316;color:#fff}
.hr2-tile--absent{background:#dc2626;color:#fff}
.hr2-tile--leave{background:#2563eb;color:#fff}
.hr2-tile--permission{background:#7c3aed;color:#fff}
.hr2-tile--rest{background:#9ca3af;color:#fff}
.hr2-tile--missing{background:#facc15;color:#422006}
.hr2-tile--mission{background:#0f766e;color:#fff}
.hr2-tile--holiday{background:#be185d;color:#fff}
.hr2-tile--rest-salary{background:linear-gradient(135deg,#9ca3af 0 50%,#dc2626 50% 100%);color:#fff}
.hr2-tile--rest-leave{background:linear-gradient(135deg,#9ca3af 0 50%,#2563eb 50% 100%);color:#fff}
.hr2-tile--neutral{background:#fff;color:#64748b;border-color:var(--hr2-line)}
.hr2-cal-legend{display:flex;flex-wrap:wrap;gap:6px 12px;margin-top:14px;font-size:var(--font-xs);color:#475569}
.hr2-cal-legend span{display:flex;align-items:center;gap:5px}
.hr2-cal-legend b{color:var(--hr2-navy)}
.hr2-swatch{width:12px;height:12px;border-radius:3px;display:inline-block;border:1px solid transparent}
.hr2-cal-note{margin-top:12px}
.hr2-att-details{padding:16px;min-width:0}
.hr2-day-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;flex-wrap:wrap}
.hr2-day-head h2{margin:0;font-size:var(--font-lg)}
.hr2-day-head p{margin:4px 0 0;color:var(--hr2-muted);font-size:var(--font-sm)}
.hr2-day-badges{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.hr2-status-chip{border-radius:999px;padding:4px 12px;font-size:var(--font-sm);font-weight:700;border:1px solid transparent}
.hr2-alert{display:flex;gap:8px;align-items:flex-start;border-radius:10px;padding:10px 12px;margin-top:12px;font-size:var(--font-sm)}
.hr2-alert--warning{background:#fff7ed;border:1px solid #fdba74;color:#9a3412}
.hr2-alert--danger{background:#fef2f2;border:1px solid #fca5a5;color:#991b1b}
.hr2-day-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:14px 0}
.hr2-sum{border:1px solid var(--hr2-line);border-radius:10px;padding:10px 12px;display:grid;grid-template-columns:auto 1fr;gap:2px 8px;align-items:center;background:var(--hr2-bg)}
.hr2-sum i{grid-row:span 2;color:var(--hr2-blue)}
.hr2-sum span{font-size:var(--font-xs);color:var(--hr2-muted)}
.hr2-sum strong{font-size:var(--font-ui);direction:ltr;text-align:right}
.hr2-day-tabs{display:flex;gap:4px;border-bottom:1px solid var(--hr2-line);overflow-x:auto}
.hr2-day-tabs button{background:none;border:0;border-bottom:2px solid transparent;padding:9px 12px;font-weight:700;color:var(--hr2-muted);cursor:pointer;white-space:nowrap;font-family:inherit;font-size:var(--font-sm)}
.hr2-day-tabs button.is-active{color:var(--hr2-blue);border-bottom-color:var(--hr2-blue)}
.hr2-day-tabs b{background:var(--hr2-bg);border-radius:999px;padding:0 7px;font-size:var(--font-xs)}
.hr2-tab-body{padding-top:12px}
.hr2-period-actions{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px}
.hr2-btn--ghost{background:transparent}
.hr2-period-table{min-width:640px}
.hr2-period-table td,.hr2-period-table th{padding:8px 10px;font-size:var(--font-sm)}
.hr2-period-table td.hr2-time,.hr2-period-table th{white-space:nowrap}
.hr2-period-table tfoot td{font-weight:700;background:var(--hr2-bg)}
.hr2-period-table tr.is-removed td{opacity:.55;text-decoration:line-through}
.hr2-orig{display:block;color:var(--hr2-muted);font-size:var(--font-xs);direction:rtl}
.hr2-next-day{color:#7c3aed;font-size:var(--font-xs)}
.hr2-time-input{width:112px;padding:5px 8px}
.hr2-edit-day{margin-top:14px;border:1px solid #bfdbfe;background:#f8fbff;border-radius:12px;padding:14px}
.hr2-edit-day h3{margin:0 0 10px;font-size:var(--font-base)}
.hr2-edit-day [hidden]{display:none!important}
.hr2-edit-actions{display:flex;gap:8px;align-items:center;margin-top:10px}
.hr2-edit-actions span{flex:1}
.hr2-punches{margin-top:14px;border:1px solid var(--hr2-line);border-radius:10px;padding:8px 12px}
.hr2-punches summary{cursor:pointer;font-weight:700;font-size:var(--font-sm)}
.hr2-notes{display:grid;gap:10px}
.hr2-note-item{display:flex;gap:10px;border:1px solid var(--hr2-line);border-radius:10px;padding:10px 12px}
.hr2-note-item i{color:var(--hr2-blue);margin-top:3px}
.hr2-note-item p{margin:4px 0}
.hr2-history{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.hr2-history li{border-inline-start:3px solid var(--hr2-blue);background:var(--hr2-bg);border-radius:8px;padding:10px 12px}
.hr2-history-head{display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap}
.hr2-history p{margin:6px 0 0}
.hr2-history-diff{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:8px;font-size:var(--font-sm)}
.hr2-history-diff small{display:block;color:var(--hr2-muted)}
@media(max-width:1100px){.hr2-att-layout{grid-template-columns:1fr}.hr2-att-cal{position:static;order:-1}.hr2-day-summary{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:520px){.hr2-cal-grid{grid-template-columns:repeat(7,minmax(0,1fr))}.hr2-tile{width:100%;height:auto;aspect-ratio:1}.hr2-cal-toolbar .hr2-field{min-width:100%}.hr2-history-diff{grid-template-columns:1fr}.hr2-edit-actions{flex-wrap:wrap}}

/* Absence processing / approved coverage (231): the tile keeps only the day number and its status colour (approved
   design); the result is in the day panel and summarised under the calendar. */
.hr2-cal-processing{margin-top:6px;font-size:var(--font-xs,.75rem);color:#5f7088}
.hr2-processing{margin:10px 0;padding:10px 12px;border:1px solid #e4e9f1;border-radius:10px;background:#fbfcfe}
.hr2-processing h3{display:flex;align-items:center;gap:7px;margin:0 0 8px;font-size:var(--font-ui,.9rem);font-weight:800;color:#1d3f68}
.hr2-processing dl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 14px;margin:0}
.hr2-processing dt{color:#7f8da2;font-size:var(--font-xs,.75rem);font-weight:600}.hr2-processing dd{margin:0;color:#1d3f68;font-size:var(--font-sm,.82rem)}
.hr2-processing--salary_deduction{border-color:#f5c6cb;background:#fff7f8}.hr2-processing--leave_balance{border-color:#bcd4f5;background:#f5f9ff}
.hr2-processing--coverage{border-color:#d9cff7;background:#f8f6ff}.hr2-processing ul{margin:0;padding-inline-start:18px;font-size:var(--font-sm,.82rem);color:#3d5878}
@media(max-width:640px){.hr2-processing dl{grid-template-columns:1fr}}

.hr2-processing--approval{border-color:#b9e3dc;background:#f3fbf9}.hr2-processing--no_deduction{border-color:#cfe9da;background:#f6fcf8}
.hr2-processing h3 small.hr2-badge{font-size:var(--font-xs,.72rem);font-weight:700}
.hr2-approval-row td{background:#f3fbf9}
.hr2-processing ul li+li{margin-top:6px}

/* hr-phase3.css */
.hr3-detail-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}.hr3-subtitle{font-size:var(--font-sm);margin:20px 0 9px}.hr3-compare{display:grid;grid-template-columns:minmax(0,1fr) 34px minmax(0,1fr);align-items:start;gap:10px}.hr3-compare>i{align-self:center;text-align:center;color:#3478e5}.hr3-compare section{border:1px solid #e4eaf2;border-radius:12px;background:#fff;overflow:hidden}.hr3-compare section h3{font-size:var(--font-base);margin:0;padding:12px 14px;background:#f7f9fc;border-bottom:1px solid #e4eaf2}.hr3-compare section div{display:flex;justify-content:space-between;gap:14px;padding:9px 13px;border-bottom:1px solid #edf1f6;font-size:var(--font-sm)}.hr3-compare section div:last-child{border-bottom:0}.hr3-compare section div span{color:#667085}.hr3-compare section div strong{text-align:left;word-break:break-word}.hr3-compare section div.is-changed{background:#effaf4;color:#087443}.hr2-section-actions{display:flex;justify-content:flex-end}.hr2-btn--small{padding:7px 11px;font-size:var(--font-xs)}.hr2-btn--success{background:#138a55;color:#fff;border-color:#138a55}.hr2-btn--danger{background:#d92d20;color:#fff;border-color:#d92d20}.text-success{color:#087443}.text-danger{color:#b42318}
.hr2-field>span{font-size:var(--font-ui);color:#536076;font-weight:700}
.hr3-action-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.hr3-action-fields>.hr2-note{grid-column:1/-1}
@media(max-width:720px){.hr3-compare{grid-template-columns:1fr}.hr3-compare>i{transform:rotate(-90deg)}.hr2-section-actions>.hr2-btn{width:100%}}
@media(max-width:720px){.hr3-action-fields{grid-template-columns:1fr}}
/* Job decision details (hr_phase3.js showEmploymentAction): changed fields, actions, upload */
.hr3-changes{display:flex;flex-direction:column;gap:6px}
.hr3-changes>div{display:grid;grid-template-columns:minmax(110px,1fr) minmax(0,1.2fr) auto minmax(0,1.2fr);align-items:center;gap:8px;padding:8px 10px;border:1px solid #e6ecf3;border-radius:10px;background:#fbfcfe;font-size:var(--font-sm)}
.hr3-changes span{color:#6b7a90}
.hr3-changes em{font-style:normal;color:#8a5a00;text-decoration:line-through;text-decoration-color:rgba(138,90,0,.35)}
.hr3-changes strong{color:#16794a}
.hr3-changes i{color:#94a3b8;font-size:.75rem}
[dir="ltr"] .hr3-changes i{transform:scaleX(-1)}
.hr3-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px;padding-top:14px;border-top:1px solid #e7edf5}
.hr3-upload{margin-top:8px;cursor:pointer}
/* Leave requests (hr_phase3.js renderLeaves / showLeave): five KPIs, filter bar, balance impact */
.hr3-kpis{grid-template-columns:repeat(5,minmax(0,1fr))}
.hr3-filters{display:grid;grid-template-columns:minmax(180px,1.6fr) repeat(5,minmax(120px,1fr)) auto auto;gap:8px;padding:12px;align-items:center}
.hr3-balance{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
.hr3-balance>div{border:1px solid #e6ecf3;border-radius:10px;padding:9px 10px;background:#fbfcfe}
.hr3-balance span{display:block;font-size:var(--font-xs);color:#6b7a90}
.hr3-balance strong{display:block;margin-top:3px;font-size:var(--font-base);font-variant-numeric:tabular-nums}
.hr3-balance>div.is-negative{border-color:#fecaca;background:#fff4f4}.hr3-balance>div.is-negative strong{color:#b42318}
@media(max-width:1100px){.hr3-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}.hr3-filters{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:720px){.hr3-kpis,.hr3-filters{grid-template-columns:1fr 1fr}.hr3-filters>input[name=search]{grid-column:1/-1}.hr3-balance{grid-template-columns:repeat(2,minmax(0,1fr))}}
.hr3-leave .hr2-list-item .hr2-sub{display:block}
/* The tab host is a grid item of .hr2-page: without min-width:0 a wide table stretches the whole page on phones. */
.hr2-page>#phase3-content{min-width:0;display:grid;gap:16px}

/* hr-phase4.css */
.hr4-page{--hr4-blue:#1769e8;--hr4-navy:#12233f;--hr4-border:#e2e9f2;--hr4-muted:#68758c;--hr4-bg:#f6f8fb;color:var(--hr4-navy);direction:rtl;padding-bottom:32px}.hr4-breadcrumb{font-size:var(--font-xs);color:#8792a6;margin-bottom:8px}.hr4-header{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:22px}.hr4-header h1{font-size:var(--font-2xl);margin:0 0 5px;font-weight:700}.hr4-header p{font-size:var(--font-ui);color:var(--hr4-muted);margin:0}.hr4-header__actions,.hr4-row-actions,.hr4-workflow-actions{display:flex;align-items:center;gap:9px;flex-wrap:wrap}.hr4-header .btn,.hr4-workflow-actions .btn{min-height:40px;border-radius:9px;font-size:var(--font-ui);padding-inline:16px}.hr4-metrics,.hr4-run-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:16px}.hr4-metric{min-height:102px;background:#fff;border:1px solid var(--hr4-border);border-radius:12px;padding:16px;display:flex;align-items:center;gap:14px;box-shadow:0 3px 10px rgba(34,57,91,.035)}.hr4-metric__icon{width:44px;height:44px;border-radius:11px;display:grid;place-items:center;background:#eef5ff;color:#1769e8;font-size:18px;flex:0 0 auto}.hr4-metric__icon.green{background:#ebf9f0;color:#18a05e}.hr4-metric__icon.purple{background:#f1edff;color:#7653d6}.hr4-metric__icon.orange{background:#fff3e8;color:#ed7d24}.hr4-metric small{display:block;color:var(--hr4-muted);font-size:var(--font-sm);margin-bottom:7px}.hr4-metric strong{display:block;font-size:var(--font-2xl);font-weight:700;font-variant-numeric:tabular-nums}.hr4-metric em{display:block;font-style:normal;color:#8994a6;font-size:var(--font-sm);margin-top:3px}.hr4-section{background:#fff;border:1px solid var(--hr4-border);border-radius:13px;margin-top:14px;overflow:hidden;box-shadow:0 3px 12px rgba(34,57,91,.03)}.hr4-section__head{display:flex;align-items:center;justify-content:space-between;padding:17px 19px;border-bottom:1px solid #edf1f6}.hr4-section__head h2{font-size:var(--font-md);margin:0;font-weight:700}.hr4-section__head p{font-size:var(--font-sm);color:var(--hr4-muted);margin:4px 0 0}.hr4-period-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;padding:16px}.hr4-period-card{border:1px solid var(--hr4-border);border-radius:11px;padding:14px;background:#fff;display:flex;flex-direction:column;gap:13px}.hr4-period-card>div:first-child{display:flex;align-items:center;gap:10px}.hr4-period-card__icon{width:36px;height:36px;border-radius:9px;background:#edf5ff;color:var(--hr4-blue);display:grid;place-items:center}.hr4-period-card strong{font-size:var(--font-base)}.hr4-period-card small,.hr4-link small{display:block;color:var(--hr4-muted);font-size:var(--font-xs);margin-top:3px}.hr4-period-card__issues{display:flex!important;justify-content:space-between;color:#7b8698;font-size:var(--font-sm)}.hr4-period-card__issues span:first-child i{color:#e35252}.hr4-period-card__issues span:last-child i{color:#ef9b2d}.hr4-period-card footer{display:grid;grid-template-columns:1fr 1fr;gap:7px}.hr4-period-card footer button{border:1px solid var(--hr4-border);background:#fff;border-radius:8px;padding:8px;color:#3d4d68;font-size:var(--font-ui)}.hr4-period-card footer button.primary{background:var(--hr4-blue);color:#fff;border-color:var(--hr4-blue)}.hr4-badge{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:5px 9px;font-size:var(--font-xs);font-weight:700;white-space:nowrap}.hr4-badge--gray{background:#f0f2f5;color:#667085}.hr4-badge--blue{background:#eaf3ff;color:#1769e8}.hr4-badge--amber{background:#fff5df;color:#b46d08}.hr4-badge--green{background:#eaf8ef;color:#168c52}.hr4-badge--emerald{background:#dcf8ed;color:#087f57}.hr4-badge--red{background:#ffeded;color:#c64141}.hr4-table-wrap{overflow:auto}.hr4-table{width:100%;border-collapse:collapse;min-width:780px}.hr4-table th{background:#f7f9fc;color:#3c4d69;font-size:var(--font-ui);font-weight:700;text-align:right;padding:12px 13px;border-bottom:1px solid var(--hr4-border);white-space:nowrap}.hr4-table td{font-size:var(--font-ui);padding:12px 13px;border-bottom:1px solid #edf1f5;vertical-align:middle;color:#3e4c65;font-variant-numeric:tabular-nums}.hr4-table tr:last-child td{border-bottom:0}.hr4-table .strong{font-weight:700;color:#152744}.hr4-table .danger,.danger{color:#d94d57}.hr4-table .success,.success{color:#149259}.warning{color:#c88116}.hr4-link{border:0;background:transparent;color:#1769e8;padding:0;text-align:right;font-size:var(--font-sm)}.hr4-icon-btn{display:inline-grid;place-items:center;width:31px;height:31px;border:1px solid var(--hr4-border);border-radius:8px;background:#fff;color:#4b5b73;text-decoration:none}.hr4-icon-btn.success{color:#159257}.hr4-icon-btn.danger{color:#d94d57}.hr4-row-actions button{border:1px solid var(--hr4-border);width:29px;height:29px;border-radius:7px;background:#fff;color:#40516a}.hr4-empty{min-height:130px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#8a96a8;padding:20px}.hr4-empty i{font-size:24px;color:#b7c2d1;margin-bottom:10px}.hr4-empty strong{color:#526078;margin-bottom:4px}.hr4-empty span{font-size:var(--font-sm)}.hr4-loading,.hr4-error{min-height:360px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:12px;color:#6e7b90}.hr4-loading i,.hr4-error i{font-size:28px;color:var(--hr4-blue)}.hr4-error i{color:#db4f59}.hr4-modal{position:fixed;inset:0;z-index:1090;display:none}.hr4-modal.open{display:block}.hr4-modal__backdrop{position:absolute;inset:0;background:rgba(12,28,52,.48);backdrop-filter:blur(2px)}.hr4-modal__panel{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(610px,calc(100vw - 28px));max-height:calc(100vh - 32px);overflow:hidden;background:#fff;border-radius:14px;box-shadow:0 24px 70px rgba(8,25,51,.22);display:flex;flex-direction:column}.hr4-modal__panel.wide{width:min(1180px,calc(100vw - 28px))}.hr4-modal__panel>header{padding:16px 20px;border-bottom:1px solid var(--hr4-border);display:flex;justify-content:space-between;align-items:center}.hr4-modal__panel>header small{font-size:var(--font-xs);color:#8a96a8}.hr4-modal__panel>header h2{font-size:var(--font-lg);margin:4px 0 0}.hr4-modal__panel>header button{border:0;background:#f2f5f9;width:32px;height:32px;border-radius:8px}.hr4-modal__panel form{display:flex;flex-direction:column;min-height:0}.hr4-modal__body{padding:18px 20px;overflow:auto;max-height:calc(100vh - 170px)}.hr4-modal__panel footer{padding:13px 20px;border-top:1px solid var(--hr4-border);display:flex;justify-content:flex-end;gap:8px}.hr4-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.hr4-field{display:flex;flex-direction:column;gap:6px;margin-bottom:13px}.hr4-field>span{font-size:var(--font-ui);font-weight:700;color:#4a5870}.hr4-field input,.hr4-field select,.hr4-field textarea{width:100%;border:1px solid #dce4ee;border-radius:9px;min-height:41px;padding:9px 11px;background:#fff;color:#243552;font-size:var(--font-ui)}.hr4-field textarea{min-height:82px;resize:vertical}.hr4-field input:focus,.hr4-field select:focus,.hr4-field textarea:focus{outline:0;border-color:#75a9f6;box-shadow:0 0 0 3px rgba(23,105,232,.08)}.hr4-info,.hr4-warning{border:1px solid #dbe9fb;background:#f2f7ff;border-radius:9px;padding:11px 13px;display:flex;align-items:flex-start;gap:9px;color:#49617e;font-size:var(--font-sm);line-height:1.7}.hr4-warning{border-color:#f3dfbb;background:#fff9ec;color:#76571f}.hr4-inline-error{background:#fff0f0;border:1px solid #f3c2c2;color:#b83f49;border-radius:8px;padding:10px;margin-top:12px;font-size:var(--font-sm)}.hr4-check-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:14px}.hr4-check-summary>*{border:1px solid var(--hr4-border);border-radius:9px;padding:12px;text-align:center}.hr4-issue{border:1px solid var(--hr4-border);border-radius:9px;padding:11px 13px;display:flex;gap:10px;align-items:center;margin:8px 0}.hr4-issue.blocking i{color:#d94d57}.hr4-issue.warning i{color:#e69221}.hr4-issue span{display:block;font-size:var(--font-sm);color:var(--hr4-muted);margin-top:3px}.hr4-stepper{display:flex;align-items:flex-start;justify-content:space-between;margin:0 0 18px;gap:5px;direction:rtl}.hr4-stepper>div{flex:1;position:relative;text-align:center;color:#9aa5b5}.hr4-stepper>div:not(:last-child):after{content:"";height:2px;background:#e4eaf2;position:absolute;top:14px;right:58%;width:85%;z-index:0}.hr4-stepper>div.done:not(:last-child):after{background:#4caf75}.hr4-stepper span{position:relative;z-index:1;margin:auto;width:29px;height:29px;border-radius:50%;background:#edf1f6;display:grid;place-items:center;font-size:var(--font-sm)}.hr4-stepper small{display:block;font-size:var(--font-xs);margin-top:6px}.hr4-stepper .active{color:#1769e8;font-weight:700}.hr4-stepper .active span{background:#1769e8;color:#fff}.hr4-stepper .done{color:#25905a}.hr4-stepper .done span{background:#dcf5e7;color:#25905a}.hr4-run-summary{margin:0 0 15px}.hr4-run-summary .hr4-metric{min-height:83px;padding:12px}.hr4-run-summary .hr4-metric strong{font-size:var(--font-2xl)}.hr4-run-summary .hr4-metric__icon{width:36px;height:36px}.hr4-issues-strip{background:#fff8ed;border:1px solid #f2ddb9;border-radius:9px;padding:11px 13px;margin-bottom:13px;display:flex;align-items:center;gap:12px;flex-wrap:wrap;font-size:var(--font-xs);color:#75541d}.hr4-workflow-actions{padding-top:15px;justify-content:flex-end}.hr4-json{margin-top:14px;border:1px solid var(--hr4-border);border-radius:9px;padding:10px}.hr4-json summary{font-size:var(--font-sm);font-weight:700;cursor:pointer}.hr4-json pre{direction:ltr;text-align:left;font-size:var(--font-xs);white-space:pre-wrap;background:#f6f8fb;padding:10px;border-radius:7px;margin-top:8px}.hr4-page code{font-family:var(--font-family-mono);color:#344866}.hr4-table .hr4-empty{min-height:95px}
@media(max-width:1050px){.hr4-metrics,.hr4-period-grid,.hr4-run-summary{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:700px){.hr4-header{align-items:flex-start;flex-direction:column}.hr4-header__actions{width:100%}.hr4-header__actions .btn{flex:1}.hr4-metrics,.hr4-period-grid,.hr4-run-summary{grid-template-columns:1fr}.hr4-period-grid{padding:11px}.hr4-form-grid{grid-template-columns:1fr}.hr4-stepper{overflow-x:auto;justify-content:flex-start}.hr4-stepper>div{min-width:75px}.hr4-modal__panel{width:calc(100vw - 14px);max-height:calc(100vh - 14px)}.hr4-modal__body{padding:14px}.hr4-check-summary{grid-template-columns:1fr}.hr4-metric{min-height:88px}}
@media print{.sidebar,.topbar,.hr4-header__actions,.hr4-period-card footer,.hr4-workflow-actions,.hr4-modal__panel footer{display:none!important}.main-content{margin:0!important;padding:0!important}.hr4-page,.hr4-modal__body{padding:0}.hr4-section,.hr4-metric{box-shadow:none;break-inside:avoid}.hr4-modal{position:static;display:block}.hr4-modal__backdrop,.hr4-modal__panel>header button{display:none}.hr4-modal__panel{position:static;transform:none;width:100%;max-height:none;box-shadow:none}.hr4-modal__body{max-height:none;overflow:visible}}
.hr4-check{display:flex;align-items:flex-start;gap:10px;border:1px solid var(--hr4-border);border-radius:9px;padding:11px 12px;margin-top:10px;color:#46566f;font-size:var(--font-sm);line-height:1.6}.hr4-check input{margin-top:4px;accent-color:var(--hr4-blue);width:16px;height:16px;flex:0 0 auto}
.hr4-header .btn:disabled{opacity:.48;cursor:not-allowed;filter:saturate(.65)}

/* hr-payroll-management.css */
.hrp-page{--hrp-primary:var(--primary,#2563eb);--hrp-primary-soft:var(--primary-light,#eaf2ff);--hrp-text:var(--text-main,#1e3a5f);--hrp-muted:var(--text-muted,#718198);--hrp-border:var(--border-color,#dfe7f1);--hrp-surface:var(--bg-surface,#fff);--hrp-page:var(--bg-app,#f5f8fc);--hrp-green:#139b65;--hrp-orange:#e79a25;--hrp-red:#dc4c58;--hrp-purple:#7656d6;color:var(--hrp-text);font-family:inherit;padding-bottom:24px}.hrp-page *{box-sizing:border-box}.hrp-page button,.hrp-page input,.hrp-page select,.hrp-page textarea{font:inherit}
.hrp-header{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:18px}.hrp-header nav{margin-bottom:7px;color:#8493a7;font-size:var(--font-sm)}.hrp-header h1{margin:0;color:#15365e;font-size:var(--font-2xl);font-weight:850;line-height:1.3}.hrp-header p{margin:6px 0 0;color:#78899e;font-size:var(--font-sm)}.hrp-header-actions{display:flex;align-items:center;gap:9px}.hrp-btn{min-height:39px;padding:8px 14px;border:1px solid var(--hrp-border);border-radius:9px;background:#fff;color:#405c7c;display:inline-flex;align-items:center;justify-content:center;gap:7px;text-decoration:none;cursor:pointer;font-size:var(--font-ui);font-weight:700;transition:.16s}.hrp-btn:hover{border-color:#a9c5e8;color:var(--hrp-primary);background:#f8fbff}.hrp-btn--primary{border-color:var(--hrp-primary);color:#fff;background:var(--hrp-primary);box-shadow:0 7px 16px color-mix(in srgb,var(--hrp-primary) 18%,transparent)}.hrp-btn--primary:hover{color:#fff;background:var(--primary-hover,#1d4ed8)}.hrp-btn:disabled{cursor:not-allowed;opacity:.48}
.hrp-kpis{display:grid;grid-template-columns:1.45fr repeat(4,minmax(0,1fr));gap:12px;margin-bottom:15px}.hrp-kpi{min-width:0;min-height:94px;padding:16px;background:var(--hrp-surface);border:1px solid var(--hrp-border);border-radius:12px;box-shadow:0 3px 12px rgba(29,58,96,.035);display:flex;align-items:center;gap:13px}.hrp-kpi-icon{width:46px;height:46px;flex:0 0 46px;border-radius:12px;display:grid;place-items:center;font-size:1.02rem}.hrp-kpi-icon--blue{color:var(--hrp-primary);background:var(--hrp-primary-soft)}.hrp-kpi-icon--purple{color:var(--hrp-purple);background:#f1edff}.hrp-kpi-icon--green{color:var(--hrp-green);background:#e8f8f1}.hrp-kpi-icon--orange{color:#b66b08;background:#fff4e3}.hrp-kpi-icon--red{color:var(--hrp-red);background:#ffedf0}.hrp-kpi small{display:block;margin-bottom:5px;color:#7d8da1;font-size:var(--font-xs)}.hrp-kpi strong{display:block;overflow:hidden;color:#193a63;font-size:var(--font-2xl);font-weight:850;line-height:1.2;text-overflow:ellipsis;white-space:nowrap}.hrp-skeleton{position:relative;overflow:hidden;background:#f1f4f8}.hrp-skeleton:after{content:"";position:absolute;inset:0;transform:translateX(-100%);background:linear-gradient(90deg,transparent,rgba(255,255,255,.85),transparent);animation:hrp-shimmer 1.1s infinite}
.hrp-filter-card,.hrp-table-card{background:var(--hrp-surface);border:1px solid var(--hrp-border);border-radius:12px;box-shadow:0 3px 12px rgba(29,58,96,.035)}.hrp-filter-card{padding:13px;margin-bottom:15px}.hrp-filter-row{display:grid;grid-template-columns:minmax(260px,2fr) repeat(4,minmax(125px,1fr)) auto;gap:9px;align-items:end}.hrp-filter-row>label{display:flex;min-width:0;flex-direction:column;gap:5px}.hrp-filter-row>label>span{color:#5a7089;font-size:var(--font-sm);font-weight:700}.hrp-filter-row select,.hrp-filter-row input{width:100%;height:41px;padding:0 11px;border:1px solid #dbe4ef;border-radius:9px;outline:0;color:#294965;background:#fbfcfe;font-size:var(--font-ui)}.hrp-filter-row select:focus,.hrp-filter-row input:focus{border-color:#6ba4f4;box-shadow:0 0 0 3px rgba(23,105,224,.08)}.hrp-search{height:41px;position:relative;border:1px solid #dbe4ef;border-radius:9px;background:#fbfcfe;display:flex!important;align-items:center;flex-direction:row!important}.hrp-search i{margin-inline:13px;color:#7d8fa8}.hrp-search input{height:39px;padding:0;border:0;background:transparent;box-shadow:none!important}
.hrp-table-card{overflow:hidden}.hrp-table-card>header{min-height:55px;padding:12px 15px;border-bottom:1px solid #e5ecf4;display:flex;align-items:center;justify-content:space-between;gap:12px}.hrp-table-card>header strong{display:block;color:#1e416a;font-size:var(--font-ui)}.hrp-table-card>header small{display:block;margin-top:3px;color:#8a98aa;font-size:var(--font-xs)}.hrp-table-card>header label{display:flex;align-items:center;gap:7px;color:#718198;font-size:var(--font-sm)}.hrp-table-card>header select{height:32px;min-width:67px;border:1px solid #dbe4ee;border-radius:7px;color:#34516f;background:#fff}.hrp-table-scroll{overflow:auto}.hrp-table{width:100%;min-width:1090px;border-collapse:separate;border-spacing:0}.hrp-table th{padding:11px 12px;border-bottom:1px solid #dde6f0;color:#667b94;background:#f7f9fc;font-size:var(--font-ui);font-weight:700;text-align:start;white-space:nowrap}.hrp-table td{padding:10px 12px;border-bottom:1px solid #edf1f6;color:#344e6d;font-size:var(--font-ui);vertical-align:middle;white-space:nowrap}.hrp-table tbody tr:hover{background:#fbfdff}.hrp-table td.muted{color:#8a99aa}.hrp-table td.money{color:#117a55;font-weight:850;direction:ltr}.hrp-run-link{border:0;background:transparent;padding:0;text-align:start;color:#214b7e;cursor:pointer}.hrp-run-link strong{display:block;max-width:230px;overflow:hidden;text-overflow:ellipsis;font-size:var(--font-sm)}.hrp-run-link small{display:block;margin-top:4px;color:#8795a7;font-weight:600;font-size:var(--font-xs);direction:ltr;text-align:start}.hrp-badge{display:inline-flex;align-items:center;gap:6px;padding:5px 9px;border-radius:999px;font-size:var(--font-xs);font-weight:700}.hrp-badge i{width:6px;height:6px;border-radius:50%;background:currentColor}.hrp-badge--success{color:#0d8656;background:#e8f8f1}.hrp-badge--warning{color:#ad6809;background:#fff3df}.hrp-badge--danger{color:#c53e49;background:#ffebed}.hrp-badge--info{color:#276bc2;background:#eaf2ff}.hrp-badge--neutral{color:#65758a;background:#eef2f6}.hrp-row-actions{display:flex;align-items:center;gap:5px;position:relative}.hrp-row-actions>button,.hrp-row-actions summary{width:31px;height:30px;padding:0;border:1px solid #dce5ef;border-radius:7px;color:#537092;background:#fff;display:grid;place-items:center;cursor:pointer;list-style:none}.hrp-row-actions summary::-webkit-details-marker{display:none}.hrp-row-actions>button:hover,.hrp-row-actions summary:hover{border-color:#a9c8f4;color:var(--hrp-primary);background:#f1f6ff}.hrp-row-actions details{position:relative}.hrp-row-actions details>div{position:absolute;z-index:15;inset-inline-end:0;top:34px;min-width:170px;padding:5px;border:1px solid #e0e7f0;border-radius:9px;background:#fff;box-shadow:0 12px 30px rgba(17,42,72,.14)}.hrp-row-actions details button,.hrp-row-actions details a{width:100%;padding:8px 10px;border:0;border-radius:6px;color:#405c79;background:transparent;display:flex;align-items:center;gap:8px;text-decoration:none;text-align:start;font-size:var(--font-ui)}.hrp-row-actions details button:hover,.hrp-row-actions details a:hover{color:var(--hrp-primary);background:#f3f7fd}.hrp-row-actions details .danger{color:#c43e49}.hrp-pagination{min-height:54px;padding:11px 15px;color:#78899e;display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:var(--font-xs)}.hrp-pagination>div{display:flex;gap:5px}.hrp-pagination button{width:31px;height:31px;border:1px solid #dce5ef;border-radius:7px;color:#5f7590;background:#fff;font-size:var(--font-ui)}.hrp-pagination button.active{border-color:var(--hrp-primary);color:#fff;background:var(--hrp-primary)}.hrp-pagination button:disabled{opacity:.4}.hrp-loading,.hrp-empty{min-height:190px;color:#78899e;display:flex;align-items:center;justify-content:center;gap:9px}.hrp-empty{flex-direction:column}.hrp-empty>i{color:#a8b5c5;font-size:1.75rem}.hrp-empty strong{font-size:var(--font-ui)}.hrp-empty span{font-size:var(--font-xs)}.hrp-empty--error{color:#b6424d}.hrp-empty--error>i{color:#dd6871}
.hrp-drawer-open{overflow:hidden}.hrp-drawer{position:fixed;z-index:1100;inset:0;display:flex;justify-content:flex-end;direction:ltr}.hrp-drawer[hidden]{display:none}.hrp-backdrop{position:absolute;inset:0;border:0;background:rgba(12,29,52,.5)}.hrp-panel{position:relative;width:min(860px,96vw);height:100%;background:#fff;box-shadow:-18px 0 48px rgba(13,35,63,.2);display:flex;flex-direction:column;direction:rtl;animation:hrp-panel-in .2s ease-out}.hrp-page[dir="ltr"] .hrp-panel{direction:ltr;box-shadow:18px 0 48px rgba(13,35,63,.2)}.hrp-panel>header{min-height:72px;padding:16px 20px;border-bottom:1px solid #e1e8f1;display:flex;align-items:center;justify-content:space-between;gap:18px}.hrp-panel>header small{display:block;margin-bottom:4px;color:#8493a5;font-size:var(--font-xs)}.hrp-panel>header h2{margin:0;color:#173b66;font-size:var(--font-lg);font-weight:850}.hrp-panel>header>button{width:35px;height:35px;border:0;border-radius:9px;color:#6a7d94;background:#f1f5f9}.hrp-panel form{display:flex;flex:1;min-height:0;flex-direction:column}.hrp-tabs{padding:10px 18px 0;border-bottom:1px solid #e5ebf3;display:flex;gap:1px;overflow:auto}.hrp-tabs button{padding:10px 12px;border:0;border-bottom:2px solid transparent;color:#74859a;background:transparent;display:flex;align-items:center;gap:6px;white-space:nowrap;font-size:var(--font-ui)}.hrp-tabs button.active{border-color:var(--hrp-primary);color:var(--hrp-primary);font-weight:850}.hrp-panel>main,.hrp-panel form>main{flex:1;min-height:0;padding:19px 20px;overflow:auto}.hrp-panel>footer,.hrp-panel form>footer{min-height:65px;padding:12px 20px;border-top:1px solid #e2e9f1;background:#fbfcfe;display:flex;align-items:center;justify-content:space-between;gap:10px}.hrp-panel footer>div{display:flex;gap:8px}.hrp-panel footer .hrp-btn{min-height:39px}
.hrp-section-title{display:flex;align-items:flex-start;gap:10px;margin:4px 0 15px;padding-bottom:10px;border-bottom:1px solid #e9eef4}.hrp-section-title>i{width:35px;height:35px;flex:0 0 35px;border-radius:9px;color:var(--hrp-primary);background:var(--hrp-primary-soft);display:grid;place-items:center}.hrp-section-title h3{margin:1px 0 3px;color:#244870;font-size:var(--font-ui);font-weight:850}.hrp-section-title p{margin:0;color:#8795a7;font-size:var(--font-xs);line-height:1.6}.hrp-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.hrp-form-grid label,.hrp-dialog label{min-width:0;display:flex;flex-direction:column;gap:6px}.hrp-form-grid label>span,.hrp-dialog label>span{color:#526a85;font-size:var(--font-sm);font-weight:700}.hrp-form-grid input,.hrp-form-grid select,.hrp-form-grid textarea,.hrp-dialog input,.hrp-dialog select,.hrp-dialog textarea{width:100%;height:40px;padding:0 11px;border:1px solid #dce5ef;border-radius:8px;outline:0;color:#244363;background:#fff;font-size:var(--font-ui)}.hrp-form-grid textarea,.hrp-dialog textarea{height:90px;padding:10px;resize:vertical}.hrp-form-grid input:focus,.hrp-form-grid select:focus,.hrp-form-grid textarea:focus,.hrp-dialog input:focus,.hrp-dialog select:focus,.hrp-dialog textarea:focus{border-color:#6ba4f4;box-shadow:0 0 0 3px rgba(23,105,224,.08)}.hrp-form-grid input[readonly],.hrp-form-grid select:disabled{color:#708196;background:#f6f8fb}.hrp-form-grid label.wide{grid-column:1/-1}.hrp-readonly{min-height:40px;padding:7px 10px;border:1px solid #dce5ef;border-radius:8px;background:#f8fafc;display:flex;align-items:center}.hrp-form-error{margin-top:12px;padding:10px 12px;border:1px solid #ffc9ce;border-radius:8px;color:#b63e48;background:#ffedef;font-size:var(--font-sm)}.hrp-form-error[hidden]{display:none}
.hrp-review-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:9px;margin-bottom:15px}.hrp-review-grid article{min-width:0;padding:11px;border:1px solid #e0e7f0;border-radius:9px;background:#fbfcfe}.hrp-review-grid span{display:block;margin-bottom:4px;color:#7c8da0;font-size:var(--font-xs)}.hrp-review-grid strong{display:block;overflow:hidden;color:#23466d;font-size:var(--font-ui);font-weight:850;text-overflow:ellipsis;white-space:nowrap}.hrp-review-grid .danger,.hrp-inner-table .danger,.hrp-breakdown-list .danger{color:#c74651}.hrp-review-grid .success,.hrp-inner-table .success,.hrp-breakdown-list .success{color:#11805a}.hrp-inner-table{overflow:auto;border:1px solid #e0e7f0;border-radius:10px}.hrp-inner-table table{width:100%;min-width:760px;border-collapse:collapse}.hrp-inner-table th{padding:10px;color:#667b94;background:#f7f9fc;border-bottom:1px solid #dde6f0;text-align:start;white-space:nowrap;font-size:var(--font-ui)}.hrp-inner-table td{padding:10px;border-bottom:1px solid #edf1f6;color:#38536f;vertical-align:middle;white-space:nowrap;font-size:var(--font-ui)}.hrp-inner-table td strong,.hrp-inner-table td small{display:block}.hrp-inner-table td small{margin-top:3px;color:#8997a8;font-size:var(--font-xs)}.hrp-inner-table td.money{color:#117a55;font-weight:850}.hrp-source{padding:4px 7px;border-radius:6px;color:#366aa6;background:#edf4ff;font-size:var(--font-xs)}.hrp-pane-empty{min-height:160px;color:#8090a3;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:7px;text-align:center}.hrp-pane-empty>i{color:#9daec0;font-size:1.6rem}.hrp-pane-empty strong{color:#48617c;font-size:var(--font-sm)}.hrp-pane-empty span{font-size:var(--font-xs)}.hrp-pane-empty.error{color:#b6424d}.hrp-review-card{padding:14px;border:1px solid #e0e7f0;border-radius:10px;background:#fff}.hrp-review-card h3{margin:0 0 12px;color:#24466d;font-size:var(--font-ui)}.hrp-review-card dl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin:0}.hrp-review-card dl>div{padding:10px;border:1px solid #e7edf4;border-radius:8px;background:#fbfcfe}.hrp-review-card dt{margin-bottom:4px;color:#8190a2;font-size:var(--font-xs)}.hrp-review-card dd{margin:0;color:#284866;font-size:var(--font-sm);font-weight:700}.hrp-alert{margin-top:13px;padding:11px 12px;border:1px solid #dbe7f5;border-radius:9px;color:#476887;background:#f3f8ff;display:flex;align-items:flex-start;gap:9px;font-size:var(--font-xs);line-height:1.7}.hrp-alert--warning{border-color:#f2d69e;color:#8b610c;background:#fff8e8}.hrp-alert--danger{border-color:#ffc9ce;color:#ad3e49;background:#fff0f1}.hrp-alert--success{border-color:#bdebd4;color:#11734f;background:#eefbf5}.hrp-alert div{display:flex;flex-direction:column}.hrp-alert strong,.hrp-alert span{display:block}.hrp-breakdown-list{display:grid;gap:8px}.hrp-breakdown-list article{padding:11px 12px;border:1px solid #e1e8f1;border-radius:9px;background:#fbfcfe;display:flex;align-items:center;justify-content:space-between;gap:12px}.hrp-breakdown-list strong,.hrp-breakdown-list small{display:block}.hrp-breakdown-list strong{color:#2c4c6c;font-size:var(--font-sm)}.hrp-breakdown-list small{margin-top:3px;color:#8997a8;font-size:var(--font-xs)}.hrp-breakdown-list>article>span{color:#117a55;font-size:var(--font-sm);font-weight:850}
.hrp-dialog-host{position:fixed;z-index:1200;inset:0;display:grid;place-items:center;padding:18px}.hrp-dialog-host[hidden]{display:none}.hrp-dialog-backdrop{position:absolute;inset:0;border:0;background:rgba(12,29,52,.48)}.hrp-dialog{position:relative;width:min(500px,96vw);max-height:88vh;overflow:auto;border:1px solid #dce5ef;border-radius:13px;background:#fff;box-shadow:0 20px 60px rgba(13,35,63,.24);direction:rtl}.hrp-page[dir="ltr"] .hrp-dialog{direction:ltr}.hrp-dialog>header{padding:14px 16px;border-bottom:1px solid #e4eaf2;display:flex;align-items:center;justify-content:space-between}.hrp-dialog h3{margin:0;color:#1f4168;font-size:var(--font-base)}.hrp-dialog header button{width:32px;height:32px;border:0;border-radius:8px;color:#708197;background:#f1f5f9}.hrp-dialog>main{padding:16px}.hrp-dialog>footer{padding:12px 16px;border-top:1px solid #e4eaf2;background:#fbfcfe;display:flex;justify-content:flex-end;gap:8px}
.hrp-page[dir="ltr"] .hrp-table th,.hrp-page[dir="ltr"] .hrp-table td,.hrp-page[dir="ltr"] .hrp-inner-table th,.hrp-page[dir="ltr"] .hrp-inner-table td{text-align:left}@keyframes hrp-shimmer{to{transform:translateX(100%)}}@keyframes hrp-panel-in{from{transform:translateX(34px);opacity:.74}to{transform:none;opacity:1}}
@media(max-width:1250px){.hrp-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}.hrp-filter-row{grid-template-columns:repeat(3,minmax(0,1fr))}.hrp-search{grid-column:span 2}.hrp-review-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:760px){.hrp-header{align-items:flex-start;flex-direction:column}.hrp-header-actions,.hrp-header-actions .hrp-btn{width:100%}.hrp-kpis,.hrp-filter-row,.hrp-review-grid{grid-template-columns:1fr 1fr}.hrp-search{grid-column:1/-1}.hrp-panel{width:100vw}.hrp-tabs{padding-inline:8px}.hrp-panel>main,.hrp-panel form>main{padding-inline:13px}.hrp-panel>footer,.hrp-panel form>footer{align-items:stretch;flex-direction:column}.hrp-panel footer>div{display:grid;grid-template-columns:1fr 1fr}.hrp-panel footer .hrp-btn{width:100%}.hrp-form-grid,.hrp-review-card dl{grid-template-columns:1fr}.hrp-panel main:has(.hrp-stepper){overflow:auto}.hrp-pagination{align-items:flex-start;flex-direction:column}}
@media(max-width:480px){.hrp-kpis,.hrp-filter-row,.hrp-review-grid{grid-template-columns:1fr}.hrp-header h1{font-size:var(--font-2xl)}.hrp-panel footer>div{grid-template-columns:1fr}.hrp-pagination>span{line-height:1.6}}

/* Payroll periods (hr_payroll_management.js loadPeriods) */
.hrp-periods{background:var(--hrp-surface);border:1px solid var(--hrp-border);border-radius:12px;box-shadow:0 3px 12px rgba(29,58,96,.035);padding:14px 16px;display:grid;gap:12px}
.hrp-periods>header{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.hrp-periods>header strong{display:block;color:var(--hrp-text)}.hrp-periods>header small{color:var(--hrp-muted)}
.hrp-period-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:10px}
.hrp-period{border:1px solid var(--hrp-border);border-radius:10px;padding:12px;display:grid;gap:6px;background:var(--hrp-page)}
.hrp-period-head{display:flex;align-items:center;justify-content:space-between;gap:8px}.hrp-period small{color:var(--hrp-muted)}.hrp-period-note{color:var(--hrp-orange)!important}
.hrp-period-issues{list-style:none;margin:2px 0;padding:0;display:grid;gap:4px;font-size:.82rem}.hrp-period-issues li{display:flex;gap:6px;align-items:center;color:var(--hrp-orange)}.hrp-period-issues li.is-blocking{color:var(--hrp-red)}.hrp-period-issues li.is-ok{color:var(--hrp-green)}
.hrp-period footer{display:flex;gap:6px;flex-wrap:wrap;margin-top:4px}.hrp-period footer button{border:1px solid var(--hrp-border);background:var(--hrp-surface);color:var(--hrp-text);border-radius:8px;padding:6px 10px;font:inherit;font-size:.8rem;cursor:pointer;display:inline-flex;gap:6px;align-items:center}.hrp-period footer button.primary{background:var(--hrp-primary);border-color:var(--hrp-primary);color:#fff}.hrp-period footer button:disabled{opacity:.55;cursor:not-allowed}
.hrp-check{display:flex;gap:8px;align-items:center;margin-top:12px}

/* ── Payroll design 2026-10-04 (hr_payroll_management.js: list, wizard, review, run status, employee pay detail) ── */
.hrp-kpis--six{grid-template-columns:repeat(6,minmax(0,1fr))}
.hrp-filter-row--six{grid-template-columns:minmax(220px,2fr) repeat(5,minmax(120px,1fr))}
.hrp-filter-row select,.hrp-pick-bar select{height:40px;border:1px solid #dbe4ee;border-radius:8px;padding:0 10px;background:#fff;color:#34516f;font:inherit}
.hrp-card{background:var(--hrp-surface);border:1px solid var(--hrp-border);border-radius:12px;box-shadow:0 3px 12px rgba(29,58,96,.035);padding:16px;margin-bottom:14px}
.hrp-wsteps,.hrp-lifecycle{display:grid;grid-template-columns:repeat(4,1fr);margin:0 0 16px}
.hrp-wsteps>div,.hrp-lifecycle>div{position:relative;text-align:center;color:#93a1b2}
.hrp-wsteps>div:before,.hrp-lifecycle>div:before{content:"";position:absolute;top:14px;inset-inline-start:-50%;width:100%;height:2px;background:#e3e9f1}
.hrp-wsteps>div:first-child:before,.hrp-lifecycle>div:first-child:before{display:none}
.hrp-wsteps span,.hrp-lifecycle span{position:relative;z-index:1;width:30px;height:30px;margin:0 auto 6px;border:2px solid #dce4ee;border-radius:50%;background:#fff;display:grid;place-items:center;font-weight:800;color:#7c8b9d}
.hrp-wsteps small,.hrp-lifecycle small{font-size:var(--font-sm)}
.hrp-wsteps .done span,.hrp-wsteps .active span,.hrp-lifecycle .done span,.hrp-lifecycle .active span{border-color:#16794a;background:#16794a;color:#fff}
.hrp-wsteps .done:before,.hrp-wsteps .active:before,.hrp-lifecycle .done:before,.hrp-lifecycle .active:before{background:#16794a}
.hrp-wsteps .active small,.hrp-lifecycle .active small{color:#16794a;font-weight:800}
.hrp-wizard-footer{display:flex;justify-content:flex-end;gap:8px;flex-wrap:wrap;margin-bottom:20px}
.hrp-wizard-footer [data-cancel]{margin-inline-end:auto}
.hrp-form-grid label.wide{grid-column:1/-1}
.hrp-pick-bar{display:grid;grid-template-columns:minmax(220px,2fr) repeat(3,minmax(130px,1fr));gap:8px;margin-bottom:12px}
.hrp-pick-count{margin:10px 0 0;color:#16794a;font-weight:800}
.hrp-table tr.is-disabled td{opacity:.55}
.hrp-note{display:block;color:#8a6100;font-size:var(--font-xs);margin-top:3px}
p.hrp-note{color:#5f6f84;font-size:var(--font-sm)}
.hrp-code{direction:ltr;display:inline-block;padding:2px 7px;border-radius:6px;background:#edf2f7;color:#475569;font-family:var(--font-family-mono,monospace);font-size:var(--font-sm)}
.hrp-section-title{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.hrp-section-title>div{flex:1}
.hrp-toolbar{display:flex;gap:6px;flex-wrap:wrap}
.hrp-chips{display:flex;gap:6px;flex-wrap:wrap;margin:6px 0 10px}
.hrp-chips button{border:1px solid #dce5ef;background:#fff;color:#536e8e;border-radius:999px;padding:6px 12px;font:inherit;font-size:var(--font-sm);cursor:pointer}
.hrp-chips button.active{border-color:#16794a;background:#e8f5ee;color:#16794a;font-weight:800}
.hrp-table td.danger,.hrp-mini td.danger{color:#c0392b}
.hrp-icon{width:30px;height:30px;border:1px solid #dce5ef;border-radius:7px;background:#fff;color:#537092;cursor:pointer}
.hrp-btn--danger{background:#fff5f5;border-color:#f5c2c2;color:#b42318}
.hrp-row-actions>button.danger{color:#b42318}
.hrp-review-layout{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:12px;margin-top:12px}
.hrp-review-layout>section{border:1px solid var(--hrp-border);border-radius:10px;padding:12px;background:#fbfcfe}
.hrp-review-layout h3{font-size:var(--font-base);margin:0 0 10px;display:flex;gap:7px;align-items:center}
.hrp-warnings{background:#fffaf0!important;border-color:#f6d79b!important}
.hrp-warnings ul,.hrp-issue-list{list-style:none;margin:0;padding:0;display:grid;gap:7px}
.hrp-warnings li{display:flex;gap:7px;align-items:center;color:#8a6100}
.hrp-warnings li.is-blocking{color:#b42318}.hrp-warnings li.is-ok{color:#16794a}
.hrp-journal-options label{display:grid;gap:5px;margin-bottom:10px}
.hrp-journal-options input[type=date]{height:38px;border:1px solid #dbe4ee;border-radius:8px;padding:0 8px}
.hrp-run-info dl,.hrp-employee-card dl,.hrp-dl{display:grid;gap:7px;margin:0}
.hrp-run-info dl>div,.hrp-employee-card dl>div,.hrp-dl>div{display:flex;justify-content:space-between;gap:8px}
.hrp-run-info dt,.hrp-employee-card dt,.hrp-dl dt{color:#7a8a9c}
.hrp-link{border:0;background:none;color:var(--hrp-primary);cursor:pointer;padding:0;margin-top:8px;font:inherit}
.hrp-status-cards{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin-bottom:12px}
.hrp-status-cards article{border:1px solid var(--hrp-border);border-radius:10px;padding:12px;background:var(--hrp-surface)}
.hrp-status-cards small{display:block;color:#7a8a9c}.hrp-status-cards strong{display:block;margin-top:4px;color:#1e3a5f}
.hrp-next-step{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;border:1px solid #cbdcf9;background:#f2f6ff;border-radius:12px;padding:14px;margin-bottom:12px}
.hrp-next-step>div:first-child{display:flex;gap:10px;align-items:flex-start}.hrp-next-step p{margin:3px 0 0;color:#4a6185}
.hrp-next-actions{display:flex;gap:7px;flex-wrap:wrap}
.hrp-issue-list li{display:flex;gap:9px;align-items:center;border:1px solid #edf1f6;border-radius:9px;padding:9px}
.hrp-issue-list li>div{flex:1}.hrp-issue-list small{display:block;color:#7a8a9c}
.hrp-issue-list li.blocking i{color:#b42318}.hrp-issue-list li.warning i{color:#d08a00}
.hrp-mini{width:100%;border-collapse:collapse;margin-bottom:12px}
.hrp-mini th,.hrp-mini td{border-bottom:1px solid #edf1f6;padding:8px;text-align:start;font-size:var(--font-sm)}
.hrp-mini thead th{background:#f4f7fb;color:#4b5870}.hrp-mini tfoot th{background:#f8fafc}
.hrp-mini td.money,.hrp-mini th.money{direction:ltr;text-align:end}
.hrp-mini td.muted,p.muted{color:#8a99aa}
.hrp-net-line{display:flex;justify-content:space-between;align-items:center;border-radius:10px;background:#e8f5ee;color:#16794a;padding:12px 14px;font-size:var(--font-lg)}
.hrp-employee-layout{display:grid;grid-template-columns:260px minmax(0,1fr) 200px;gap:12px;align-items:start}
.hrp-employee-card{background:var(--hrp-surface);border:1px solid var(--hrp-border);border-radius:12px;padding:16px;display:grid;gap:6px;justify-items:start}
.hrp-employee-card small{color:#7a8a9c}.hrp-employee-card h4{margin:10px 0 2px}.hrp-employee-card dl{width:100%}.hrp-employee-card .hrp-btn{width:100%}
.hrp-avatar{width:56px;height:56px;border-radius:50%;background:#eaf1ff;color:var(--hrp-primary);display:grid;place-items:center;font-size:24px}
.hrp-employee-body h3{margin:0 0 12px;font-size:var(--font-lg)}
.hrp-employee-nav{display:grid;gap:4px;background:#0f5132;border-radius:12px;padding:8px}
.hrp-employee-nav button{border:0;border-radius:8px;background:transparent;color:#d6efe2;text-align:start;padding:9px 10px;font:inherit;cursor:pointer}
.hrp-employee-nav button.active{background:#fff;color:#0f5132;font-weight:800}
.hrp-pagination{display:flex;gap:5px;justify-content:center;padding:10px}
.hrp-pagination button{min-width:32px;height:32px;border:1px solid #dce5ef;border-radius:7px;background:#fff;cursor:pointer}
.hrp-pagination button.active{background:var(--hrp-primary);border-color:var(--hrp-primary);color:#fff}
@media(max-width:1200px){.hrp-kpis--six{grid-template-columns:repeat(3,minmax(0,1fr))}.hrp-review-layout{grid-template-columns:1fr}.hrp-status-cards{grid-template-columns:repeat(3,minmax(0,1fr))}.hrp-employee-layout{grid-template-columns:1fr}.hrp-employee-nav{grid-auto-flow:column;overflow:auto;order:-1}}
@media(max-width:760px){.hrp-kpis--six,.hrp-filter-row--six,.hrp-pick-bar,.hrp-status-cards{grid-template-columns:1fr 1fr}.hrp-wsteps small,.hrp-lifecycle small{font-size:10px}}
.hrp-kpis--six .hrp-kpi>div{min-width:0}.hrp-kpis--six .hrp-kpi strong{font-size:clamp(14px,1.35vw,20px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}
.hrp-blocked{margin:10px 0 0;color:#b42318;font-weight:700;display:flex;gap:6px;align-items:center}
.hrp-settings-title{margin:16px 0 8px;font-size:var(--font-base)}.hrp-gosi-note{margin:0 0 8px;color:#365b9a}

/* Payroll groups & payment (231) */
.hrp-group-kpis{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:8px;margin-bottom:12px}.hrp-group-kpis article{border:1px solid #e3e9f1;border-radius:10px;padding:9px 10px;background:#fff}.hrp-group-kpis small{display:block;color:#7f8da2;font-size:.74rem}.hrp-group-kpis strong{font-size:.92rem;color:#173b66}
.hrp-group-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:10px}
.hrp-group-card{border:1px solid #e3e9f1;border-radius:12px;padding:12px;background:#fff;display:flex;flex-direction:column;gap:8px}
.hrp-group-card header{display:flex;justify-content:space-between;align-items:flex-start;gap:8px}.hrp-group-card header strong{display:block;color:#173b66}.hrp-group-card header small{color:#7f8da2}
.hrp-group-card dl{display:grid;grid-template-columns:1fr 1fr;gap:6px 10px;margin:0}.hrp-group-card dt{color:#7f8da2;font-size:.74rem;font-weight:600}.hrp-group-card dd{margin:0;color:#1d3f68;font-size:.86rem}
.hrp-group-states{margin:0;display:flex;flex-wrap:wrap;gap:4px;align-items:center}.hrp-group-errors{margin:0;color:#b4303a;font-size:.8rem}.hrp-group-card footer{display:flex;flex-wrap:wrap;gap:6px;margin-top:auto}
@media(max-width:1100px){.hrp-group-kpis{grid-template-columns:repeat(4,minmax(0,1fr))}}@media(max-width:640px){.hrp-group-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* Staged payroll run (owner mockup 2026-10-04) */
.hrp-stages{list-style:none;margin:0 0 14px;padding:14px 16px;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;background:#fff;border:1px solid #e3e9f1;border-radius:12px;position:relative}
.hrp-stages li{display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;position:relative;color:#7f8da2;font-size:.8rem}
.hrp-stages li:not(:last-child)::after{content:"";position:absolute;top:15px;inset-inline-start:calc(50% + 18px);width:calc(100% - 36px);height:2px;background:#e3e9f1}
.hrp-stages li.done:not(:last-child)::after{background:#1f7a4d}
.hrp-stages span{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;border:2px solid #d5dde8;background:#fff;font-weight:800;color:#7f8da2;position:relative;z-index:1}
.hrp-stages li.done span{background:#1f7a4d;border-color:#1f7a4d;color:#fff}.hrp-stages li.active span{border-color:#1f7a4d;color:#1f7a4d;box-shadow:0 0 0 4px #e3f3ea}
.hrp-stages li.active small{color:#1f7a4d;font-weight:800}.hrp-stages li.is-link{cursor:pointer}.hrp-stages li.is-link:hover small{text-decoration:underline}
.hrp-stage-body{padding:16px}.hrp-stage-title{font-size:.92rem;font-weight:800;color:#173b66;margin:14px 0 8px}
.hrp-form-grid--six{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}.hrp-form-grid--six label{display:flex;flex-direction:column;gap:4px;font-size:.8rem;color:#55677f}.hrp-form-grid--six select{height:36px;border:1px solid #d5dde8;border-radius:8px;padding:0 8px;background:#fff}
.hrp-readiness{margin-top:12px;border:1px solid #e3e9f1;border-radius:10px;padding:10px 12px;background:#fbfcfe}.hrp-readiness>header{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;margin-bottom:6px}.hrp-readiness>header strong{color:#173b66;font-size:.88rem}
.hrp-readiness-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}.hrp-readiness-list li{border-radius:8px;padding:8px 10px;background:#fff;border:1px solid #e3e9f1}.hrp-readiness-list li.is-blocking{border-color:#f5c6cb;background:#fff7f8}.hrp-readiness-list li.is-warning{border-color:#f6dfb0;background:#fffaf0}
.hrp-readiness-list li>div:first-child{display:flex;align-items:center;gap:6px;color:#1d3f68;font-size:.84rem}.hrp-readiness-list .fa-circle-xmark{color:#c83f49}.hrp-readiness-list .fa-triangle-exclamation{color:#b36b08}
.hrp-fix{display:flex;flex-wrap:wrap;gap:5px;margin-top:6px;align-items:center}.hrp-chip{display:inline-block;padding:2px 8px;border-radius:999px;background:#eef2f6;color:#3d5878;font-size:.75rem}
.hrp-btn--sm{min-height:28px;padding:3px 10px;font-size:.78rem}.hrp-ok{margin:0;color:#0d8c59;font-size:.84rem}.hrp-note.danger,.danger{color:#c83f49}
.hrp-radio-row{display:flex;flex-wrap:wrap;gap:14px;align-items:center;margin-bottom:8px}.hrp-radio{display:flex;align-items:center;gap:6px;font-size:.84rem;color:#1d3f68}
.hrp-stage-footer{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px;margin-top:14px;padding-top:12px;border-top:1px solid #edf1f6}
.hrp-calc{max-width:520px;margin:6px auto;text-align:center}.hrp-calc h3{font-size:1rem;color:#173b66;margin-bottom:12px}.hrp-calc ul{list-style:none;padding:0;margin:0 auto 12px;display:flex;flex-direction:column;gap:7px;text-align:start;max-width:340px}
.hrp-calc li{display:flex;align-items:center;gap:8px;color:#8a98ab;font-size:.86rem}.hrp-calc li.done{color:#1d3f68}.hrp-calc li.done i{color:#1f7a4d}.hrp-calc li.active{color:#1f7a4d;font-weight:700}
.hrp-progress{height:8px;border-radius:999px;background:#edf1f6;overflow:hidden}.hrp-progress span{display:block;height:100%;background:#1f7a4d;transition:width .3s}.hrp-calc-result{margin:10px 0 0;color:#1d3f68;font-weight:700}
.hrp-tabs--groups{margin-bottom:8px}.hrp-table--review td small,.hrp-table--review th small{display:block;color:#8a98ab;font-weight:400;font-size:.72rem}.hrp-table--review tfoot th{background:#f6f8fb;color:#173b66}
.hrp-group-kpis--five{grid-template-columns:repeat(5,minmax(0,1fr))}
.hrp-pay-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}.hrp-pay-list li{display:flex;align-items:center;gap:12px;border:1px solid #e3e9f1;border-radius:10px;padding:10px 12px;background:#fff}
.hrp-pay-icon{width:38px;height:38px;border-radius:10px;display:grid;place-items:center;background:#e3f3ea;color:#1f7a4d;flex:0 0 38px}.hrp-pay-main{flex:1;min-width:0}.hrp-pay-main strong{display:block;color:#173b66}.hrp-pay-main small{color:#7f8da2}.hrp-pay-actions{display:flex;flex-wrap:wrap;gap:6px}
@media(max-width:1100px){.hrp-form-grid--six{grid-template-columns:repeat(3,minmax(0,1fr))}.hrp-group-kpis--five{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:640px){.hrp-form-grid--six{grid-template-columns:repeat(2,minmax(0,1fr))}.hrp-stages small{font-size:.68rem}.hrp-pay-list li{flex-wrap:wrap}}

/* Stage 3 filters (payment method / branch / department / status) and the dense full-column review table */
.hrp-stage-filters{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:8px 0}
.hrp-stage-filters select{min-height:34px;border:1px solid #d6e2dc;border-radius:8px;padding:4px 10px;font:inherit;font-size:var(--font-sm,.82rem);background:#fff}
.hrp-stage-filters small{color:#6b7c74;margin-inline-start:auto}
.hrp-table--dense th,.hrp-table--dense td{padding:8px 9px;white-space:nowrap}
.hrp-table--dense td small{display:block;color:#7b8a83;font-size:var(--font-xs,.72rem)}

.hrp-filter-row--eight{grid-template-columns:minmax(220px,2fr) repeat(7,minmax(110px,1fr))}
@media(max-width:1200px){.hrp-filter-row--eight{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:760px){.hrp-filter-row--eight{grid-template-columns:1fr 1fr}}
.hrp-filter-row.hrp-stage-filters{display:flex;grid-template-columns:none}
.hrp-filter-row.hrp-stage-filters select{width:auto;min-width:150px;flex:0 1 190px}
/* ───────── Agreed payroll design (docs/design/payroll_design_20261004.webp, eight screens) ───────── */
.hrp-wizard{padding:16px}
.hrp-wizard .hrp-stages{border:0;padding:4px 0 18px;margin:0}
.hrp-stages--four{grid-template-columns:repeat(4,minmax(0,1fr))}
.hrp-stages li.is-link{cursor:pointer}
.hrp-kpis--seven{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px;margin:12px 0}
.hrp-kpis--seven .hrp-kpi{min-width:0}
.hrp-kpis--seven .hrp-kpi strong{font-size:.98rem;display:block;overflow-wrap:anywhere;line-height:1.3}
.hrp-kpis--seven .hrp-kpi-icon{flex:0 0 auto}
.hrp-kpis--seven .hrp-kpi>div{min-width:0}
.hrp-kpis--seven .hrp-kpi{min-height:78px;padding:12px}
.hrp-kpis--seven .hrp-kpi:nth-child(1){background:#effaf4;border-color:#c8ebd6}
.hrp-kpis--seven .hrp-kpi:nth-child(2),.hrp-kpis--seven .hrp-kpi:nth-child(3){background:#fff3f4;border-color:#f6d0d4}
/* screen 3: employees */
.hrp-pick-filters{display:grid;grid-template-columns:minmax(220px,2fr) repeat(3,minmax(140px,1fr));gap:10px;align-items:end;margin:6px 0 12px}
.hrp-pick-filters label{display:grid;gap:4px;font-size:.8rem;color:#6d7e93}
.hrp-pick-filters select{min-height:39px;border:1px solid var(--hrp-border);border-radius:9px;padding:0 10px;background:#fff}
.hrp-check-col{width:44px;text-align:center}
.hrp-check-col input{width:16px;height:16px;accent-color:#1f7a4d}
.hrp-table--pick tr.is-picked td{background:#f6fbf8}
.hrp-readiness-inline{display:flex;flex-wrap:wrap;gap:4px;margin-top:3px}
.hrp-pick-count{color:#1f6fd1;font-weight:800}
.hrp-stage-footer--split{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.hrp-stage-footer--split>div{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.hrp-stage-footer--split .hrp-btn--primary{background:#1f7a4d;border-color:#1f7a4d;min-width:120px}
/* screen 4: preview */
.hrp-preview-head{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.hrp-preview-actions{display:flex;gap:8px;flex-wrap:wrap}
.hrp-btn--success{background:#1f7a4d;border-color:#1f7a4d;color:#fff}
.hrp-preview-bar{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin:6px 0 10px}
.hrp-tabs--pills{border:0;padding:0;gap:6px}
.hrp-tabs--pills button{border:1px solid var(--hrp-border);border-radius:9px;padding:7px 12px;background:#fff}
.hrp-tabs--pills button.active{background:#eaf2ff;border-color:#b9d1f7;color:var(--hrp-primary)}
.hrp-table--preview td,.hrp-table--preview th{white-space:nowrap}
/* screen 5: components with coloured totals */
.hrp-components .hrp-total-earn th{background:#fff7e6;color:#9a6200}
.hrp-components .hrp-total-ded th{background:#fff1f2;color:#c23b48}
.hrp-components .hrp-total-net th{background:#effaf4;color:#1f7a4d;font-size:1.05rem}
/* screen 6: three panels */
.hrp-review-panels{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:12px 0}
.hrp-review-panel{border:1px solid var(--hrp-border);border-radius:12px;padding:14px;background:#fff;display:grid;gap:8px;align-content:start}
.hrp-review-panel h4{margin:0 0 4px;font-size:.95rem;display:flex;align-items:center;gap:7px;color:#1e3a5f}
.hrp-review-panel .hrp-field{display:grid;gap:4px;font-size:.8rem;color:#6d7e93}
.hrp-review-panel .hrp-field input{min-height:37px;border:1px solid var(--hrp-border);border-radius:8px;padding:0 10px}
.hrp-review-panel--warn{background:#fffaf0;border-color:#f3d9a4}
.hrp-warn-list{margin:0;padding-inline-start:18px;display:grid;gap:5px;font-size:.85rem;color:#7a5410}
.hrp-warn-list li.is-blocking{color:#c23b48;font-weight:700}
/* screen 8: status after approval */
.hrp-status-screen{padding:16px;display:grid;gap:14px}
.hrp-status-head h2{margin:0;font-size:1.25rem;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.hrp-status-head small{color:#7a8a9c}
.hrp-track{list-style:none;margin:0;padding:6px 0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr))}
.hrp-track li{display:flex;flex-direction:column;align-items:center;gap:6px;position:relative;color:#7f8da2;font-size:.8rem}
.hrp-track li:not(:last-child)::after{content:"";position:absolute;top:11px;inset-inline-start:calc(50% + 14px);width:calc(100% - 28px);height:3px;background:#e3e9f1}
.hrp-track li.done:not(:last-child)::after{background:#1f7a4d}
.hrp-track span{width:24px;height:24px;border-radius:50%;background:#cfd7e2;display:grid;place-items:center;color:#fff;font-size:.7rem;position:relative;z-index:1}
.hrp-track li.done span{background:#1f7a4d}
.hrp-track li.active span{background:#1f7a4d;box-shadow:0 0 0 5px #dff2e8}
.hrp-track li.active small,.hrp-track li.done small{color:#1f7a4d;font-weight:800}
.hrp-status-cards--four{grid-template-columns:repeat(4,minmax(0,1fr));margin:0}
.hrp-status-cards--four span{display:block;margin-top:3px;color:#5d6f86;font-size:.82rem}
.hrp-next-step--status{margin:0}
.hrp-next-step--status>div:first-child{display:flex;gap:12px;align-items:center}
.hrp-next-icon{width:44px;height:44px;border-radius:12px;background:#e6efff;color:var(--hrp-primary);display:grid;place-items:center;font-size:1.2rem}
@media(max-width:1200px){.hrp-review-panels{grid-template-columns:1fr 1fr}}
@media(max-width:760px){.hrp-status-cards--four{grid-template-columns:repeat(2,minmax(0,1fr))}.hrp-review-panels,.hrp-pick-filters{grid-template-columns:1fr}.hrp-track small{font-size:.68rem}}
/* .hrp-stepper is shared with the employees screen (hr_employees.js) — kept. */
.hrp-stepper{display:grid;grid-template-columns:repeat(8,1fr);margin-bottom:18px}
.hrp-stepper>div{position:relative;color:#93a1b2;text-align:center}
.hrp-stepper>div:before{content:"";position:absolute;z-index:0;top:13px;inset-inline-start:-50%;width:100%;height:2px;background:#e3e9f1}
.hrp-stepper>div:first-child:before{display:none}
.hrp-stepper span{position:relative;z-index:1;width:27px;height:27px;margin:0 auto 5px;border:2px solid #dce4ee;border-radius:50%;color:#7c8b9d;background:#fff;display:grid;place-items:center;font-size:var(--font-xs);font-weight:850}
.hrp-stepper small{font-size:var(--font-xs);white-space:nowrap}
.hrp-stepper .active span,.hrp-stepper .done span{border-color:var(--hrp-primary);color:#fff;background:var(--hrp-primary)}
.hrp-stepper .done:before,.hrp-stepper .active:before{background:var(--hrp-primary)}
.hrp-stepper .active small,.hrp-stepper .done small{color:#2e5f9c;font-weight:700}
/* ───────── Payroll per payroll group (owner design 2026-10-05): green / white, compact, one five-stage stepper ───────── */
.hrp-g{--hrp-g:#1f7a4d;--hrp-g-soft:#e8f5ee;--hrp-g-dark:#155f3b}
.hrp-g .hrp-btn--primary{background:var(--hrp-g);border-color:var(--hrp-g);box-shadow:none}.hrp-g .hrp-btn--primary:hover{background:var(--hrp-g-dark)}.hrp-g .hrp-btn--primary:disabled{opacity:.55;cursor:not-allowed}
.hrp-g .hrp-btn--success{background:#e8f5ee;border-color:#bfe0cd;color:var(--hrp-g)}
.hrp-gtitle-icon{display:inline-grid;place-items:center;width:38px;height:38px;margin-inline-end:10px;border-radius:10px;background:var(--hrp-g-soft);color:var(--hrp-g);font-size:18px;vertical-align:middle}
.hrp-gboard{padding:18px}.hrp-ginfo{margin:0 0 14px;padding:10px 14px;border:1px solid #cfe5d8;border-radius:9px;background:#f2faf5;color:var(--hrp-g-dark);font-weight:700;display:flex;gap:8px;align-items:center;justify-content:center}
.hrp-gmonth{display:flex;gap:10px;justify-content:center;margin-bottom:16px}.hrp-gmonth label{display:flex;align-items:center;gap:8px;padding:7px 12px;border:1px solid var(--hrp-border);border-radius:9px;background:#fff;color:var(--hrp-muted)}.hrp-gmonth input{border:0;background:transparent;color:var(--hrp-text);font-weight:700;outline:0}.hrp-gmonth select{padding:7px 12px;border:1px solid var(--hrp-border);border-radius:9px;background:#fff;color:var(--hrp-text);font-weight:700}
.hrp-gcards{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px}
.hrp-gcard{border:1px solid var(--hrp-border);border-radius:12px;padding:14px;background:#fff;display:grid;gap:10px;transition:border-color .15s,box-shadow .15s}.hrp-gcard:hover{border-color:#9fd2b5;box-shadow:0 6px 18px rgba(31,122,77,.08)}.hrp-gcard.has-run{border-color:#9fd2b5;background:linear-gradient(180deg,#f6fcf8,#fff)}.hrp-gcard.is-off{opacity:.7}
.hrp-gcard header{display:flex;align-items:center;gap:10px}.hrp-gcard header strong{display:block;color:#173d63}.hrp-gcard header small{color:var(--hrp-muted)}
.hrp-gicon{width:40px;height:40px;flex:0 0 40px;border-radius:10px;display:grid;place-items:center;font-size:17px;background:var(--hrp-g-soft);color:var(--hrp-g)}.hrp-gicon--internal_transfer{background:#fff4e3;color:#b66b08}.hrp-gicon--cash{background:#e8f8f1;color:#139b65}.hrp-gicon--other{background:#f1edff;color:#7656d6}
.hrp-gamount{margin:0;font-size:1.15rem;font-weight:850;color:#173d63}.hrp-gamount small{display:block;font-size:.72rem;font-weight:600;color:var(--hrp-muted)}
.hrp-gcard-foot{display:flex;align-items:center;justify-content:space-between;gap:8px}
.hrp-gwork{padding:14px 16px}.hrp-g .hrp-gstages{grid-template-columns:repeat(5,minmax(0,1fr));border:0;padding:4px 0 16px;margin:0 0 6px;border-bottom:1px solid #eef2f6;border-radius:0}
.hrp-g .hrp-stages li.done span{background:var(--hrp-g);border-color:var(--hrp-g)}.hrp-g .hrp-stages li.active span{border-color:var(--hrp-g);color:var(--hrp-g);box-shadow:0 0 0 4px var(--hrp-g-soft)}.hrp-g .hrp-stages li.active small{color:var(--hrp-g)}.hrp-g .hrp-stages li.done:not(:last-child)::after{background:var(--hrp-g)}
.hrp-gsub{margin:4px 0 12px;color:#5a6f86;font-size:var(--font-sm);display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.hrp-gkpis{display:grid;gap:10px;margin-bottom:12px;grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}
.hrp-gkpis .hrp-kpi{min-height:70px;padding:11px 12px;box-shadow:none}.hrp-gkpis .hrp-kpi-icon{width:38px;height:38px;flex-basis:38px}.hrp-gkpis .hrp-kpi>div{min-width:0}.hrp-gkpis .hrp-kpi strong{font-size:1rem;direction:ltr;unicode-bidi:isolate;overflow-wrap:anywhere}
.hrp-gfilters{display:grid;grid-template-columns:2fr repeat(3,minmax(0,1fr));gap:8px;margin-bottom:10px}
.hrp-gtable{font-size:.8rem}.hrp-gtable th{white-space:nowrap;background:#f6f9fb}.hrp-gtable td{padding-block:7px}.hrp-gtable tfoot th{background:#f2faf5;color:var(--hrp-g-dark)}.hrp-gtable tr.is-flagged{background:#fff7f7}.hrp-gtable td.ok{color:var(--hrp-g)}.hrp-gtable td.warn{color:#b66b08}
.hrp-person{display:flex;align-items:center;gap:8px;min-width:150px}.hrp-person strong{display:block;font-weight:700}.hrp-person small{display:block}
.hrp-initials{width:30px;height:30px;flex:0 0 30px;border-radius:50%;display:grid;place-items:center;background:#e8f5ee;color:#1f7a4d;font-size:.72rem;font-weight:800}
.hrp-iban{font-family:ui-monospace,Consolas,monospace;font-size:.76rem;white-space:nowrap}
.hrp-glist{margin:6px 0 0;padding-inline-start:18px}
.hrp-gfoot{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:14px;padding-top:12px;border-top:1px solid #eef2f6}.hrp-gfoot>div{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.hrp-gwarn{color:#c0392b;font-weight:700;display:inline-flex;gap:5px;align-items:center;white-space:nowrap}.hrp-gok{color:var(--hrp-g);font-size:1.05rem}
.hrp-gproblems{align-items:center}.hrp-gproblems>div{flex:1}
.hrp-gbar{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}.hrp-gtools{display:flex;gap:8px;flex-wrap:wrap}
.hrp-gpending{border:1px solid #f2d69e;background:#fffbf1;border-radius:10px;padding:10px 12px;margin-bottom:12px}.hrp-gpending header{display:flex;flex-direction:column;gap:2px;margin-bottom:8px}.hrp-gpending header small{color:#8b610c}
.hrp-gmenu{position:relative}.hrp-gmenu summary{list-style:none;cursor:pointer;width:30px;height:30px;border:1px solid var(--hrp-border);border-radius:8px;display:grid;place-items:center;color:#5a6f86;background:#fff}.hrp-gmenu summary::-webkit-details-marker{display:none}
.hrp-gmenu>div{position:absolute;z-index:30;inset-inline-end:0;top:34px;min-width:190px;padding:6px;background:#fff;border:1px solid #dce5ef;border-radius:10px;box-shadow:0 14px 36px rgba(13,35,63,.16);display:grid;gap:2px}
.hrp-gmenu>div button{border:0;background:none;text-align:start;padding:8px 10px;border-radius:7px;display:flex;gap:9px;align-items:center;color:#24476e;cursor:pointer;font-size:.8rem;white-space:nowrap}.hrp-gmenu>div button:hover{background:#f2faf5;color:var(--hrp-g)}.hrp-gmenu>div button i{width:16px;color:#7a8ba0}
.hrp-gpager{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:8px;font-size:.8rem}
.hrp-gnet{font-weight:850;color:#155f3b}
.hrp-gtabs{margin:12px 0}
.hrp-gsummary{width:100%;margin-top:4px}.hrp-gsummary th{color:#5a6f86;font-weight:600;width:22%}.hrp-gsummary tfoot th{color:var(--hrp-g-dark);font-size:.95rem}
.hrp-gnotes{display:grid;gap:6px;margin-top:12px}.hrp-gnotes textarea{width:100%;border:1px solid var(--hrp-border);border-radius:9px;padding:9px}
.hrp-gpay{max-width:620px;border:1px solid var(--hrp-border);border-radius:12px;padding:14px;display:grid;gap:12px;background:#fff}.hrp-gpay h3{margin:0;font-size:1rem;color:#173d63}.hrp-gpay .hrp-field{display:grid;gap:6px}.hrp-gpay select,.hrp-gpay input[type=date]{width:100%;padding:9px 10px;border:1px solid var(--hrp-border);border-radius:9px;background:#fff}
.hrp-gpay-row{display:grid;grid-template-columns:1fr 1fr;gap:12px;align-items:end}.hrp-gbalance{display:flex;align-items:center;gap:10px;padding:10px;border:1px solid #cfe5d8;border-radius:10px;background:#f2faf5}.hrp-gbalance:empty{display:none}.hrp-gbalance small{display:block;color:#5a6f86}.hrp-gbalance strong{font-size:1.05rem;color:var(--hrp-g-dark)}.hrp-gbalance strong.danger{color:#c0392b}
.hrp-gpay-warn{margin-top:0}.hrp-gpay-warn strong{font-size:1.05rem}
.hrp-gpick{max-height:220px;overflow:auto;border:1px solid var(--hrp-border);border-radius:9px;padding:8px 10px;display:grid;gap:4px;margin:0 0 10px}.hrp-gpick legend{font-weight:700;font-size:.8rem;padding:0 4px}
@media(max-width:760px){.hrp-gfilters,.hrp-gpay-row{grid-template-columns:1fr 1fr}.hrp-gstages small{font-size:.66rem}.hrp-gfoot{flex-direction:column-reverse;align-items:stretch}}

/* hr-phase5.css */
.hr5-page{--hr5-blue:#2563eb;--hr5-navy:#142b55;--hr5-line:#e2e8f0;--hr5-muted:#64748b;--hr5-soft:#f8fafc;direction:rtl;color:#172554;font-family:inherit;display:grid;gap:18px}
.hr5-breadcrumb{font-size:var(--font-xs);color:#7182a3;display:flex;align-items:center;gap:7px}.hr5-breadcrumb i{font-size:9px}
.hr5-header{display:flex;align-items:flex-start;justify-content:space-between;gap:18px}.hr5-header h1{font-size:var(--font-2xl);margin:0 0 6px;font-weight:700;color:#10234a}.hr5-header p{margin:0;color:var(--hr5-muted);font-size:var(--font-ui)}.hr5-actions{display:flex;gap:8px;flex-wrap:wrap}.hr5-actions .btn{min-height:40px;border-radius:9px;display:inline-flex;align-items:center;gap:7px}
.hr5-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.hr5-metric{background:#fff;border:1px solid var(--hr5-line);border-radius:13px;padding:16px;display:flex;align-items:center;gap:13px;min-height:100px;box-shadow:0 4px 16px rgba(15,43,82,.035)}.hr5-metric__icon{width:43px;height:43px;border-radius:11px;display:grid;place-items:center;background:#e8f0ff;color:#2563eb;font-size:18px}.hr5-metric__icon.green{background:#e9f8ef;color:#15803d}.hr5-metric__icon.orange{background:#fff4e6;color:#ea580c}.hr5-metric__icon.purple{background:#f2ecff;color:#7c3aed}.hr5-metric__icon.red{background:#fff0f0;color:#dc2626}.hr5-metric small{display:block;color:var(--hr5-muted);font-size:var(--font-sm);margin-bottom:5px}.hr5-metric strong{font-size:var(--font-2xl);color:#10234a;line-height:1}.hr5-metric em{display:block;font-style:normal;color:#8290aa;font-size:var(--font-sm);margin-top:5px}
.hr5-card{background:#fff;border:1px solid var(--hr5-line);border-radius:13px;box-shadow:0 4px 18px rgba(15,43,82,.035);overflow:hidden}.hr5-card__head{padding:15px 18px;border-bottom:1px solid var(--hr5-line);display:flex;align-items:center;justify-content:space-between;gap:12px}.hr5-card__head h2{font-size:var(--font-md);margin:0;color:#152c58}.hr5-card__head p{margin:3px 0 0;color:var(--hr5-muted);font-size:var(--font-sm)}.hr5-card__body{padding:17px}
.hr5-filterbar{display:grid;grid-template-columns:minmax(190px,1.4fr) repeat(3,minmax(145px,1fr)) auto;gap:9px;padding:13px;background:#fff;border:1px solid var(--hr5-line);border-radius:12px}.hr5-field{display:grid;gap:6px;font-size:var(--font-ui);color:#425274}.hr5-field>span{font-weight:700}.hr5-field input,.hr5-field select,.hr5-field textarea{width:100%;min-height:40px;border:1px solid #d9e1ec;border-radius:9px;background:#fff;padding:8px 11px;color:#172554;outline:none}.hr5-field textarea{min-height:92px;resize:vertical}.hr5-field input:focus,.hr5-field select:focus,.hr5-field textarea:focus{border-color:#7aa2f8;box-shadow:0 0 0 3px #eaf1ff}.hr5-field.full{grid-column:1/-1}.hr5-check{display:flex;gap:9px;align-items:center;color:#425274;font-size:var(--font-ui)}.hr5-check input{width:18px;height:18px}
.hr5-table-wrap{overflow:auto}.hr5-table{width:100%;border-collapse:separate;border-spacing:0;min-width:790px}.hr5-table th{background:#f3f6fb;color:#324363;font-size:var(--font-ui);font-weight:700;padding:12px 13px;border-bottom:1px solid var(--hr5-line);white-space:nowrap}.hr5-table td{padding:12px 13px;border-bottom:1px solid #edf1f6;font-size:var(--font-ui);vertical-align:middle;color:#344462}.hr5-table tbody tr:last-child td{border-bottom:0}.hr5-table tbody tr:hover td{background:#fbfdff}.hr5-table strong{color:#172554}.hr5-table small{display:block;color:#8793a8;margin-top:3px}.hr5-table .num{font-variant-numeric:tabular-nums;text-align:left;font-weight:700}.hr5-row-actions{display:flex;gap:5px}.hr5-icon-btn{width:32px;height:32px;border:1px solid #dbe3ee;background:#fff;color:#355079;border-radius:8px;display:grid;place-items:center}.hr5-icon-btn:hover{color:#2563eb;border-color:#9bb8f4}.hr5-link{border:0;background:transparent;color:#1d5cd0;font-weight:700;padding:0;text-align:inherit}
.hr5-badge{display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;border-radius:999px;padding:5px 9px;background:#eef2f7;color:#516078;font-size:var(--font-xs);font-weight:700}.hr5-badge.blue{background:#eaf1ff;color:#1d4ed8}.hr5-badge.green{background:#e9f8ee;color:#15803d}.hr5-badge.orange{background:#fff4e6;color:#c85b00}.hr5-badge.red{background:#fff0f0;color:#c72323}.hr5-badge.purple{background:#f1ebff;color:#6d28d9}
.hr5-empty,.hr5-loading,.hr5-error{min-height:160px;display:grid;place-items:center;align-content:center;gap:8px;color:#7a879d;text-align:center;padding:28px}.hr5-empty i,.hr5-loading i,.hr5-error i{font-size:28px;color:#9cadd0}.hr5-error i{color:#dc2626}.hr5-empty strong,.hr5-error strong{color:#334565}
.hr5-alert-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.hr5-alert{border:1px solid var(--hr5-line);background:#fff;border-radius:11px;padding:13px;display:flex;align-items:center;justify-content:space-between;gap:10px}.hr5-alert span{font-size:var(--font-sm);color:#52617b}.hr5-alert strong{font-size:var(--font-xl);color:#142b55}
.hr5-catalog{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.hr5-report-card{border:1px solid var(--hr5-line);background:#fff;border-radius:13px;padding:17px;display:grid;gap:12px;transition:.18s}.hr5-report-card:hover{border-color:#a9bff1;transform:translateY(-1px);box-shadow:0 8px 24px rgba(37,99,235,.07)}.hr5-report-card>span{width:39px;height:39px;border-radius:10px;background:#edf3ff;color:#2563eb;display:grid;place-items:center}.hr5-report-card h3{font-size:var(--font-base);margin:0}.hr5-report-card p{font-size:var(--font-sm);color:#748096;margin:0}.hr5-report-card button{justify-self:start;border:0;background:transparent;color:#2563eb;font-weight:700;padding:0}
.hr5-stepper{display:grid;grid-template-columns:repeat(6,1fr);gap:5px;padding:13px;border:1px solid var(--hr5-line);border-radius:11px;background:#fafcff}.hr5-step{display:flex;align-items:center;gap:6px;color:#8a96aa;font-size:var(--font-sm)}.hr5-step span{width:24px;height:24px;border-radius:50%;background:#e8edf5;display:grid;place-items:center;font-weight:700}.hr5-step.active,.hr5-step.done{color:#1d4ed8;font-weight:700}.hr5-step.active span,.hr5-step.done span{background:#2563eb;color:#fff}
.hr5-detail-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:12px}.hr5-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.hr5-summary div{background:#f8fafc;border:1px solid var(--hr5-line);border-radius:10px;padding:11px}.hr5-summary small{display:block;color:#75839b;font-size:var(--font-xs)}.hr5-summary strong{display:block;margin-top:5px;color:#142b55}.hr5-settlement-total{background:#eef6ff;border:1px solid #cfe0ff;border-radius:12px;padding:15px;display:flex;justify-content:space-between;align-items:center}.hr5-settlement-total strong{font-size:var(--font-2xl);color:#174fb7}
.hr5-tabs{display:flex;gap:5px;border-bottom:1px solid var(--hr5-line);overflow:auto}.hr5-tabs button{padding:11px 14px;border:0;background:transparent;color:#6b7890;font-weight:700;white-space:nowrap}.hr5-tabs button.active{color:#2563eb;border-bottom:2px solid #2563eb}.hr5-settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.hr5-info{background:#eff6ff;color:#31588e;border:1px solid #d4e5ff;border-radius:10px;padding:11px 13px;display:flex;gap:9px;font-size:var(--font-sm)}.hr5-warning{background:#fff8e7;color:#8a5b00;border:1px solid #f4dfaa;border-radius:10px;padding:11px 13px;display:flex;gap:9px;font-size:var(--font-sm)}
.hr5-modal{position:fixed;inset:0;z-index:1200;display:none}.hr5-modal.open{display:block}.hr5-modal__backdrop{position:absolute;inset:0;background:rgba(7,21,46,.46);backdrop-filter:blur(2px)}.hr5-modal__panel{position:absolute;top:0;bottom:0;left:0;width:min(560px,95vw);background:#fff;display:flex;flex-direction:column;box-shadow:20px 0 60px rgba(0,0,0,.14)}.hr5-modal__panel.wide{width:min(980px,97vw)}.hr5-modal header{padding:18px 20px;border-bottom:1px solid var(--hr5-line);display:flex;align-items:center;justify-content:space-between}.hr5-modal header h2{font-size:var(--font-lg);margin:2px 0 0}.hr5-modal header small{color:#8090aa}.hr5-modal header button{border:0;background:#f1f5f9;width:34px;height:34px;border-radius:9px}.hr5-modal form{display:flex;flex-direction:column;min-height:0;flex:1}.hr5-modal__body{padding:18px 20px;overflow:auto;display:grid;gap:14px}.hr5-modal footer{margin-top:auto;padding:13px 20px;border-top:1px solid var(--hr5-line);display:flex;gap:8px}.hr5-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.hr5-inline-error{background:#fff0f0;color:#b91c1c;border:1px solid #ffcaca;border-radius:9px;padding:10px;font-size:var(--font-sm)}
@media(max-width:1100px){.hr5-metrics{grid-template-columns:repeat(2,1fr)}.hr5-alert-grid{grid-template-columns:repeat(2,1fr)}.hr5-catalog{grid-template-columns:repeat(2,1fr)}.hr5-filterbar{grid-template-columns:repeat(2,1fr)}.hr5-detail-grid,.hr5-settings-grid{grid-template-columns:1fr}}
@media(max-width:700px){.hr5-header{flex-direction:column}.hr5-metrics,.hr5-alert-grid,.hr5-catalog,.hr5-filterbar,.hr5-form-grid,.hr5-summary{grid-template-columns:1fr}.hr5-stepper{grid-template-columns:repeat(2,1fr)}.hr5-modal__panel,.hr5-modal__panel.wide{width:100vw}.hr5-actions{width:100%}.hr5-actions .btn{flex:1;justify-content:center}}
.hr5-total-row td{background:#f4f7fb;border-top:2px solid #cfdbea}
/* .hr5-page is a grid: its items need min-width:0 or a wide report table stretches the whole page (the table scrolls instead). */
.hr5-page>*{min-width:0}
/* Unified HR settings page (hr_phase5.js renderSettings): tabs, section titles, onboarding document groups */
.hr5-settings-tabs{display:flex;gap:6px;flex-wrap:wrap;background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:6px}
.hr5-settings-tabs button{border:0;background:transparent;color:#55657e;border-radius:9px;padding:9px 13px;font:inherit;font-weight:700;display:inline-flex;gap:7px;align-items:center;cursor:pointer}
.hr5-settings-tabs button.active{background:#eaf1ff;color:#2563eb}
.hr5-form-grid>h3.full{margin:10px 0 0;font-size:var(--font-base);color:#142b55;border-bottom:1px solid #e2e8f0;padding-bottom:6px}
.hr5-note{margin:0;color:#64748b;font-size:var(--font-sm)}
.hr5-section-actions{display:flex;justify-content:flex-end;margin-bottom:12px}
.hr5-docgroup{border:1px solid #e2e8f0;border-radius:10px;padding:10px;display:flex;flex-wrap:wrap;gap:6px}
.hr5-docgroup legend{font-weight:700;color:#425274;padding:0 6px;font-size:var(--font-sm)}
.hr5-chip{display:inline-flex;gap:5px;align-items:center;border:1px solid #d9e1ec;border-radius:999px;padding:5px 10px;cursor:pointer;font-size:var(--font-sm)}
.hr5-chip:has(input:checked){border-color:#2563eb;background:#eaf1ff;color:#1d4ed8}
/* HR settings → مجموعات الرواتب (231) */
.hr5-groups-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:12px}.hr5-groups-head h3{margin:0 0 4px;font-size:var(--font-ui);font-weight:800}

/* hr-contracts-management.css */
.hrc-page{--hrc-blue:#1769e0;--hrc-navy:#173a63;--hrc-text:#203f66;--hrc-muted:#7f8da2;--hrc-border:#dfe7f1;--hrc-surface:#fff;--hrc-bg:#f5f8fc;--hrc-green:#13a66b;--hrc-orange:#ee9b24;--hrc-red:#e74c57;color:var(--hrc-text);font-family:inherit;padding-bottom:24px}
.hrc-header{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:18px}.hrc-header nav{color:#8190a4;font-size:var(--font-sm);margin-bottom:7px}.hrc-header h1{font-size:var(--font-2xl);line-height:1.3;font-weight:850;color:#15365e;margin:0}.hrc-header p{font-size:var(--font-sm);color:#78899e;margin:6px 0 0}.hrc-header-actions{display:flex;gap:9px;align-items:center}.hrc-header-actions .btn{min-height:42px;border-radius:9px;padding-inline:17px;display:flex;gap:8px;align-items:center;font-size:var(--font-ui);font-weight:700}.hrc-header-actions .btn-primary{background:var(--hrc-blue);border-color:var(--hrc-blue);box-shadow:0 7px 16px rgba(23,105,224,.16)}
.hrc-kpis{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin-bottom:15px}.hrc-kpi{min-height:94px;background:var(--hrc-surface);border:1px solid var(--hrc-border);border-radius:12px;padding:17px 18px;display:flex;align-items:center;gap:14px;box-shadow:0 3px 12px rgba(29,58,96,.035)}.hrc-kpi-icon{width:47px;height:47px;flex:0 0 47px;border-radius:12px;display:grid;place-items:center;font-size:1.06rem}.hrc-kpi-icon--blue{background:#eaf2ff;color:var(--hrc-blue)}.hrc-kpi-icon--green{background:#e8f8f1;color:var(--hrc-green)}.hrc-kpi-icon--orange{background:#fff4e3;color:var(--hrc-orange)}.hrc-kpi-icon--red{background:#ffedf0;color:var(--hrc-red)}.hrc-kpi-icon--purple{background:#f1ecff;color:#6d4fd6}.hrc-kpi small{display:block;color:#7d8da1;font-size:var(--font-sm);margin-bottom:5px}.hrc-kpi strong{font-size:var(--font-2xl);color:#193a63;line-height:1;font-weight:850}.hrc-skeleton{position:relative;overflow:hidden;background:#f1f4f8}.hrc-skeleton:after{content:"";position:absolute;inset:0;transform:translateX(-100%);background:linear-gradient(90deg,transparent,rgba(255,255,255,.8),transparent);animation:hrc-shimmer 1.1s infinite}
.hrc-filter-card,.hrc-table-card{background:var(--hrc-surface);border:1px solid var(--hrc-border);border-radius:12px;box-shadow:0 3px 12px rgba(29,58,96,.035)}.hrc-filter-card{padding:13px;margin-bottom:15px}.hrc-filter-main{display:flex;align-items:center;gap:9px}.hrc-search{height:42px;flex:1;position:relative;border:1px solid #dbe4ef;border-radius:9px;background:#fbfcfe;display:flex;align-items:center}.hrc-search i{color:#7d8fa8;margin-inline:13px}.hrc-search input{border:0;outline:0;background:transparent;width:100%;height:100%;font-size:var(--font-ui);color:#24466d}.hrc-filter-main .btn{height:42px;border-radius:9px;font-size:var(--font-ui);display:inline-flex;align-items:center;gap:7px}.hrc-filter-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr)) auto;gap:10px;padding-top:12px;margin-top:12px;border-top:1px solid #e8edf4;transition:.18s}.hrc-filter-grid.is-collapsed{display:none}.hrc-filter-apply{display:flex;align-items:flex-end}.hrc-filter-apply .btn{height:39px;font-size:var(--font-ui);white-space:nowrap;border-radius:8px;display:flex;gap:7px;align-items:center}
.hrc-field{display:flex;flex-direction:column;gap:6px;min-width:0}.hrc-field>span{font-size:var(--font-ui);color:#526a85;font-weight:750}.hrc-field input,.hrc-field select,.hrc-field textarea{width:100%;height:40px;border:1px solid #dce5ef;background:#fff;border-radius:8px;padding:0 11px;color:#244363;outline:0;font-size:var(--font-ui);transition:border-color .15s,box-shadow .15s}.hrc-field textarea{height:90px;padding:10px;resize:vertical}.hrc-field input:focus,.hrc-field select:focus,.hrc-field textarea:focus{border-color:#6ba4f4;box-shadow:0 0 0 3px rgba(23,105,224,.08)}.hrc-field input[readonly],.hrc-field select:disabled,.hrc-field textarea[readonly]{background:#f6f8fb;color:#708196}.hrc-field--full{grid-column:1/-1;margin-top:14px}
.hrc-table-card{overflow:hidden}.hrc-table-card>header{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:1px solid #e5ecf4}.hrc-table-card>header strong{display:block;font-size:var(--font-ui);color:#1e416a}.hrc-table-card>header small{display:block;font-size:var(--font-xs);color:#8a98aa;margin-top:3px}.hrc-table-card>header label{display:flex;align-items:center;gap:7px;font-size:var(--font-sm);color:#718198}.hrc-table-card>header select{height:32px;min-width:66px;border:1px solid #dbe4ee;border-radius:7px;color:#34516f;background:#fff}.hrc-table-scroll{overflow:auto}.hrc-table{width:100%;min-width:1180px;border-collapse:separate;border-spacing:0}.hrc-table th{background:#f7f9fc;border-bottom:1px solid #dde6f0;padding:11px 12px;color:#667b94;font-size:var(--font-ui);font-weight:700;white-space:nowrap;text-align:start}.hrc-table td{border-bottom:1px solid #edf1f6;padding:10px 12px;color:#344e6d;font-size:var(--font-ui);vertical-align:middle;white-space:nowrap}.hrc-table tbody tr:hover{background:#fbfdff}.hrc-index{color:#8a99aa!important}.hrc-person{display:flex;align-items:center;gap:9px;min-width:190px}.hrc-person>div{display:flex;flex-direction:column;gap:3px}.hrc-person strong{font-size:var(--font-sm);color:#1f426c}.hrc-person small{font-size:var(--font-xs);color:#8b98a9;direction:ltr;text-align:start}.hrc-avatar{width:37px;height:37px;flex:0 0 37px;border-radius:10px;display:grid;place-items:center;overflow:hidden;background:#eaf2ff;color:var(--hrc-blue);font-size:.69rem;font-weight:850}.hrc-avatar img{width:100%;height:100%;object-fit:cover}.hrc-contract-number{display:block;color:#214b7e;font-size:var(--font-ui);direction:ltr;text-align:start;border:0;background:none;padding:0;font-weight:800;cursor:pointer}.hrc-contract-number:hover{color:var(--hrc-blue);text-decoration:underline}.hrc-renewed{display:block;color:#7565d8;margin-top:3px;font-size:var(--font-xs)}.hrc-money{font-weight:700;color:#137c58!important;direction:ltr}.hrc-badge{display:inline-flex;align-items:center;gap:6px;padding:5px 9px;border-radius:999px;font-size:var(--font-xs);font-weight:700}.hrc-badge i{width:6px;height:6px;border-radius:50%;background:currentColor}.hrc-badge--success{background:#e8f8f1;color:#0d8c59}.hrc-badge--warning{background:#fff3df;color:#b36b08}.hrc-badge--danger{background:#ffebed;color:#c83f49}.hrc-badge--info{background:#eaf2ff;color:#276bc2}.hrc-badge--neutral{background:#eef2f6;color:#65758a}.hrc-row-actions{display:flex;align-items:center;gap:5px}.hrc-row-actions>button,.hrc-row-actions>.dropdown>button{width:31px;height:30px;border:1px solid #dce5ef;border-radius:7px;background:#fff;color:#537092;display:grid;place-items:center}.hrc-row-actions>button:hover,.hrc-row-actions>.dropdown>button:hover{color:var(--hrc-blue);border-color:#a9c8f4;background:#f1f6ff}.hrc-row-actions .dropdown-menu{min-width:165px;border-color:#e0e7f0;border-radius:9px;padding:5px;box-shadow:0 12px 30px rgba(17,42,72,.14)}.hrc-row-actions .dropdown-item{border-radius:6px;font-size:var(--font-ui);padding:8px 10px;display:flex;align-items:center;gap:8px}.hrc-pagination{min-height:54px;padding:11px 15px;display:flex;align-items:center;justify-content:space-between;gap:12px;color:#78899e;font-size:var(--font-xs)}.hrc-pagination>div{display:flex;gap:5px}.hrc-pagination button{width:31px;height:31px;border:1px solid #dce5ef;border-radius:7px;background:#fff;color:#5f7590;font-size:var(--font-ui)}.hrc-pagination button.active{background:var(--hrc-blue);border-color:var(--hrc-blue);color:#fff}.hrc-pagination button:disabled{opacity:.4}.hrc-loading,.hrc-empty{min-height:190px;display:flex;align-items:center;justify-content:center;gap:9px;color:#78899e}.hrc-empty{flex-direction:column}.hrc-empty>i{font-size:1.7rem;color:#a8b5c5}.hrc-empty strong{font-size:var(--font-ui)}.hrc-empty span{font-size:var(--font-sm)}.hrc-empty--error{color:#b6424d}.hrc-empty--error>i{color:#dd6871}
.hrc-drawer-open{overflow:hidden}.hrc-drawer{position:fixed;z-index:1100;inset:0;display:flex;justify-content:flex-end}.hrc-drawer[hidden]{display:none}.hrc-backdrop{position:absolute;inset:0;border:0;background:rgba(12,29,52,.48)}.hrc-panel{position:relative;width:min(820px,96vw);height:100%;background:#fff;box-shadow:-18px 0 48px rgba(13,35,63,.2);display:flex;flex-direction:column;animation:hrc-panel-in .2s ease-out}.hrc-panel>header{padding:17px 20px;border-bottom:1px solid #e1e8f1;display:flex;align-items:center;justify-content:space-between;gap:18px}.hrc-panel>header small{display:block;color:#8493a5;font-size:var(--font-xs);margin-bottom:4px}.hrc-panel>header h2{margin:0;color:#173b66;font-size:var(--font-lg);font-weight:850}.hrc-panel>header button{border:0;background:#f1f5f9;color:#6a7d94;width:35px;height:35px;border-radius:9px}.hrc-panel form{display:flex;flex-direction:column;flex:1;min-height:0}.hrc-tabs{display:flex;gap:2px;padding:10px 19px 0;border-bottom:1px solid #e5ebf3;overflow:auto}.hrc-tabs button{border:0;border-bottom:2px solid transparent;background:transparent;color:#74859a;padding:10px 13px;font-size:var(--font-ui);display:flex;align-items:center;gap:6px;white-space:nowrap}.hrc-tabs button.active{border-color:var(--hrc-blue);color:var(--hrc-blue);font-weight:850}.hrc-panel form>main{padding:19px 20px;overflow:auto;flex:1;min-height:0}.hrc-panel form>footer{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 20px;border-top:1px solid #e2e9f1;background:#fbfcfe}.hrc-panel form>footer>div{display:flex;gap:8px}.hrc-panel form>footer .btn{min-height:39px;border-radius:8px;font-size:var(--font-ui);font-weight:750;display:inline-flex;align-items:center;gap:7px}.hrc-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.hrc-section-title{display:flex;align-items:flex-start;gap:10px;margin:5px 0 14px;padding-bottom:10px;border-bottom:1px solid #e9eef4}.hrc-section-title:not(:first-child){margin-top:24px}.hrc-section-title>i{width:34px;height:34px;display:grid;place-items:center;border-radius:9px;background:#eaf2ff;color:var(--hrc-blue)}.hrc-section-title h3{font-size:var(--font-ui);color:#244870;margin:1px 0 3px;font-weight:850}.hrc-section-title p{font-size:var(--font-xs);color:#8795a7;margin:0}.hrc-status-display{min-height:40px;border:1px solid #dce5ef;background:#f8fafc;border-radius:8px;padding:7px 10px;display:flex;align-items:center}.hrc-toggle{display:flex;align-items:center;gap:10px;border:1px solid #dce5ef;border-radius:10px;padding:11px 12px;margin-bottom:14px;background:#fbfcfe}.hrc-toggle input{accent-color:var(--hrc-blue);width:17px;height:17px}.hrc-toggle span{display:flex;flex-direction:column;gap:2px}.hrc-toggle strong{font-size:var(--font-sm);color:#385572}.hrc-toggle small{font-size:var(--font-xs);color:#8492a3}.hrc-upload{min-height:128px;border:1.5px dashed #a9c7ec;border-radius:12px;background:#f5f9ff;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:6px;color:#587898;cursor:pointer}.hrc-upload>i{font-size:1.45rem;color:var(--hrc-blue)}.hrc-upload strong{font-size:var(--font-sm);color:#28598f}.hrc-upload span{font-size:var(--font-xs)}.hrc-upload input{display:none}.hrc-file-list{display:flex;flex-direction:column;gap:8px;margin-top:13px}.hrc-file-list a,.hrc-file-list article{border:1px solid #e0e7f0;border-radius:9px;padding:10px 12px;display:flex;align-items:center;gap:10px;color:#365775;text-decoration:none;background:#fff}.hrc-file-list>a>i:first-child,.hrc-file-list>article>i{color:var(--hrc-blue);font-size:1.1rem}.hrc-file-list span{display:flex;flex:1;min-width:0;flex-direction:column;gap:3px}.hrc-file-list strong{font-size:var(--font-sm);overflow:hidden;text-overflow:ellipsis}.hrc-file-list small{font-size:var(--font-xs);color:#8a98a8}.hrc-file-list button{border:0;background:#ffedf0;color:#c94c55;width:29px;height:29px;border-radius:7px}.hrc-no-files{padding:35px;text-align:center;color:#8c99aa;font-size:var(--font-sm);display:flex;flex-direction:column;gap:7px;align-items:center}.hrc-no-files i{font-size:1.4rem}.hrc-form-error{margin:0 20px 9px;padding:10px 12px;border-radius:8px;background:#ffedef;border:1px solid #ffc9ce;color:#b63e48;font-size:var(--font-sm)}
.hrc-page[dir="ltr"] .hrc-table th,.hrc-page[dir="ltr"] .hrc-table td,.hrc-page[dir="ltr"] .hrc-panel,.hrc-page[dir="ltr"] .hrc-field{text-align:left}.hrc-page[dir="ltr"] .hrc-panel{box-shadow:18px 0 48px rgba(13,35,63,.2)}
.hrc-document-controls{max-width:280px;margin-bottom:12px}.hrc-drawer{direction:ltr}.hrc-page[dir="rtl"] .hrc-panel{direction:rtl}.hrc-page[dir="ltr"] .hrc-panel{direction:ltr}
@keyframes hrc-shimmer{to{transform:translateX(100%)}}@keyframes hrc-panel-in{from{transform:translateX(34px);opacity:.74}to{transform:none;opacity:1}}
@media(max-width:1120px){.hrc-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.hrc-filter-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:760px){.hrc-header{align-items:flex-start;flex-direction:column}.hrc-header-actions,.hrc-header-actions .btn{width:100%}.hrc-filter-main{flex-wrap:wrap}.hrc-search{flex-basis:100%}.hrc-filter-grid{grid-template-columns:1fr 1fr}.hrc-panel{width:100vw}.hrc-tabs{padding-inline:8px}.hrc-panel form>main{padding-inline:13px}.hrc-form-grid{grid-template-columns:1fr}.hrc-panel form>footer{align-items:stretch;flex-direction:column}.hrc-panel form>footer>div{display:grid;grid-template-columns:1fr 1fr}.hrc-panel form>footer .btn{justify-content:center}.hrc-pagination{align-items:flex-start;flex-direction:column}}
@media(max-width:480px){.hrc-kpis,.hrc-filter-grid{grid-template-columns:1fr}.hrc-filter-main .btn{flex:1}.hrc-panel form>footer>div{grid-template-columns:1fr}.hrc-header h1{font-size:var(--font-2xl)}}

/* Contract actions menu + details drawer (2026-10-04, approved design) */
.hrc-badge--renewal{background:#f1ecff;color:#6d4fd6}
.hrc-table tbody tr[data-row-id]{cursor:pointer}
.hrc-kebab{width:32px;height:32px;border:1px solid #dce5ef;border-radius:8px;background:#fff;color:#537092;display:grid;place-items:center}
.hrc-kebab:hover,.hrc-kebab[aria-expanded="true"]{color:var(--hrc-blue);border-color:#a9c8f4;background:#f1f6ff}
.hrc-menu{min-width:190px;border-color:#e0e7f0;border-radius:10px;padding:5px;box-shadow:0 12px 30px rgba(17,42,72,.16);z-index:1200}
.hrc-menu .dropdown-item{border-radius:7px;font-size:var(--font-ui);padding:8px 10px;display:flex;align-items:center;gap:9px;color:#284a73}
.hrc-menu .dropdown-item i{width:16px;text-align:center;color:#6a819d}
.hrc-menu .dropdown-item:hover{background:#f1f6ff;color:var(--hrc-blue)}
.hrc-menu .dropdown-item.text-success i{color:#0d8c59}.hrc-menu .dropdown-item.text-danger i{color:#c83f49}
.hrc-menu .hrc-menu-danger,.hrc-menu .hrc-menu-danger i{color:#c83f49}
.hrc-menu .hrc-menu-danger:hover{background:#ffebed;color:#b4303a}
.hrc-menu .dropdown-divider{margin:4px 2px;border-color:#edf1f6}
.hrc-drawer-sub{display:flex;align-items:center;gap:8px;margin-top:6px;color:#58708f;font-size:var(--font-sm);direction:ltr;justify-content:flex-end}
.hrc-page[dir="ltr"] .hrc-drawer-sub{justify-content:flex-start}
.hrc-drawer-sub:empty{display:none}
.hrc-details{display:flex;flex-direction:column}
.hrc-person-card{display:flex;align-items:center;gap:13px;padding:14px;border:1px solid var(--hrc-border);border-radius:12px;background:#fbfcfe;margin-bottom:6px}
.hrc-person-card .hrc-avatar{width:56px;height:56px;font-size:1rem}
.hrc-person-card>div{flex:1;min-width:0}.hrc-person-card strong{display:block;color:#173b66;font-size:var(--font-md,1rem);font-weight:850}.hrc-person-card small{color:var(--hrc-muted)}
.hrc-person-card .btn{display:inline-flex;align-items:center;gap:6px;border-radius:8px}
.hrc-block-title{display:flex;align-items:center;gap:8px;margin:16px 0 9px;color:#173b66;font-size:var(--font-ui);font-weight:850}
.hrc-block-title i{color:var(--hrc-blue)}
.hrc-info-grid,.hrc-note-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
.hrc-note-grid{grid-template-columns:1fr}
.hrc-info{display:flex;align-items:flex-start;gap:10px;padding:11px 12px;border:1px solid var(--hrc-border);border-radius:10px;background:#fff;min-width:0}
.hrc-info>i{width:30px;height:30px;flex:0 0 30px;border-radius:8px;display:grid;place-items:center;background:#eef4fc;color:#4c6f99;font-size:.85rem}
.hrc-info span{min-width:0}.hrc-info small{display:block;color:var(--hrc-muted);font-size:var(--font-xs);margin-bottom:3px}
.hrc-info strong{display:flex;align-items:center;gap:6px;flex-wrap:wrap;color:#1d3f68;font-size:var(--font-ui);font-weight:800;word-break:break-word}
.hrc-info--total{border-color:#b9d3f5;background:#f4f8ff}
.hrc-copy{border:0;background:none;color:#7b90aa;padding:0 2px}.hrc-copy:hover{color:var(--hrc-blue)}
.hrc-chip{display:inline-block;padding:3px 9px;border-radius:999px;background:#eaf2ff;color:#276bc2;font-size:var(--font-xs)}
.hrc-note{padding:12px 14px;border:1px solid var(--hrc-border);border-radius:10px;background:#fbfcfe;color:#3d5878;line-height:1.8;white-space:pre-line}
.hrc-renewal-list{display:flex;flex-direction:column;gap:8px}
.hrc-renewal-list article{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1.6fr) auto auto;align-items:center;gap:10px;padding:11px 13px;border:1px solid var(--hrc-border);border-radius:10px}
.hrc-renewal-list article.is-current{border-color:#a9c8f4;background:#f4f8ff}
.hrc-renewal-list small{display:block;color:var(--hrc-muted);font-size:var(--font-xs)}
.hrc-timeline{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px}
.hrc-timeline>li{display:flex;gap:11px;padding:9px 0;border-bottom:1px dashed #e5ebf3}
.hrc-timeline-dot{width:10px;height:10px;border-radius:50%;background:var(--hrc-blue);margin-top:6px;flex:0 0 10px;box-shadow:0 0 0 4px #eaf2ff}
.hrc-timeline strong{display:block;color:#1d3f68;font-size:var(--font-ui)}.hrc-timeline small{color:var(--hrc-muted)}.hrc-timeline p{margin:4px 0 0;color:#46617f}
.hrc-changes{margin:5px 0 0;padding:0 16px;color:#46617f;font-size:var(--font-sm)}.hrc-changes del{color:#b4303a}.hrc-changes ins{color:#0d8c59;text-decoration:none}
.hrc-panel form>footer #hrc-form-actions{flex-wrap:wrap;justify-content:flex-start}
.hrc-btn-danger-soft{background:#ffecee;color:#c83f49;border:1px solid #f7c9ce}.hrc-btn-danger-soft:hover{background:#ffdfe3;color:#b4303a}
.hrc-more .btn{gap:8px}.hrc-more .btn i{font-size:.75rem}
@media(max-width:1120px){.hrc-info-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.hrc-info-grid{grid-template-columns:1fr}.hrc-renewal-list article{grid-template-columns:1fr 1fr}.hrc-person-card{flex-wrap:wrap}}
/* Drawer actions as approved: «تجديد العقد» solid blue, «تعديل» light blue, «إنهاء العقد» soft red, «المزيد من الإجراءات» at the far end. */
#hrc-form-actions .btn-primary{background:var(--hrc-blue);border-color:var(--hrc-blue);color:#fff}
#hrc-form-actions .btn-primary:hover{filter:brightness(.95)}
#hrc-form-actions .btn-outline-primary{background:#eaf2ff;border-color:#c9dcfb;color:var(--hrc-blue)}
#hrc-form-actions .btn-outline-primary:hover{background:#dce9ff;color:var(--hrc-blue)}
#hrc-form-actions .hrc-more{margin-inline-start:auto}
/* Selection column and «مزيد من الإجراءات» of the list (approved design). */
.hrc-table th.hrc-check,.hrc-table td.hrc-check{width:38px;padding-inline:10px 4px;text-align:center}
.hrc-check input{width:16px;height:16px;accent-color:var(--hrc-blue);cursor:pointer;vertical-align:middle}
.hrc-table tbody tr.is-selected td{background:#f3f8ff}
.hrc-bulk .btn{height:42px;border-radius:9px;display:inline-flex;align-items:center;gap:7px;font-size:var(--font-ui)}
.hrc-bulk #hrc-bulk-count{min-width:20px;height:20px;border-radius:999px;background:var(--hrc-blue);color:#fff;font-size:var(--font-xs);display:inline-flex;align-items:center;justify-content:center;padding:0 6px}
.hrc-filter-main .hrc-bulk{margin-inline-start:0}
/* Actions the user may use but the contract status forbids: shown disabled with the reason. */
.hrc-menu .dropdown-item.is-blocked{opacity:.55;cursor:not-allowed}
.hrc-menu .dropdown-item span{display:flex;flex-direction:column;gap:2px}
.hrc-menu-hint{font-size:var(--font-xs);color:#7b8ca3;font-weight:400;white-space:normal;max-width:230px;line-height:1.35}
#hrc-form-actions .btn:disabled{opacity:.5;cursor:not-allowed}
@media(min-width:481px){.hrc-filter-main>.btn,.hrc-filter-main .hrc-bulk .btn{flex:0 0 auto}.hrc-filter-main .hrc-search{flex:1 1 280px;min-width:240px}}
.hrc-row-menu .hrc-menu,.hrc-more .hrc-menu,.hrc-bulk .hrc-menu{max-height:min(460px,calc(100vh - 32px));overflow-y:auto}
.hrc-bulk .btn,.hrc-filter-main>.btn{white-space:nowrap}

/* 234: fixed deductions of the contract */
.hrc-fixed-deductions{display:grid;gap:8px;margin:6px 0 10px}
.hrc-deduction-row{display:grid;grid-template-columns:minmax(160px,1.4fr) minmax(110px,.8fr) minmax(140px,1.4fr) auto;gap:8px;align-items:center}
.hrc-deduction-row select,.hrc-deduction-row input{min-height:38px;border:1px solid #d6e2dc;border-radius:8px;padding:6px 10px;font:inherit;background:#fff}
@media(max-width:640px){.hrc-deduction-row{grid-template-columns:1fr 1fr}}

/* subscriptions.css */
.auth-overlay {
    position: fixed;
    inset: 0;
    z-index: 9999;
    overflow-y: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    background:
        radial-gradient(circle at 15% 15%, rgba(37, 99, 235, .12), transparent 32%),
        linear-gradient(135deg, var(--bg-body), var(--bg-card));
}

.auth-card {
    width: min(100%, 420px);
    border: 0;
    border-radius: 15px;
    background: var(--bg-card, #fff);
    box-shadow: 0 20px 60px rgba(15, 23, 42, .14);
    padding: 32px;
}

.auth-card.auth-card-wide { width: min(100%, 860px); }
.auth-brand-icon { font-size: 3rem; }
.auth-divider { display: flex; align-items: center; gap: 12px; color: #94a3b8; font-size: var(--font-ui); }
.auth-divider::before, .auth-divider::after { content: ''; flex: 1; height: 1px; background: #e2e8f0; }
.auth-free-note { color: #64748b; font-size: var(--font-sm); text-align: center; margin: 10px 0 0; }
.auth-required { color: #dc2626; }
.auth-honeypot { position: absolute !important; inset-inline-start: -10000px !important; opacity: 0 !important; pointer-events: none !important; }
.auth-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.auth-form-grid .full-width { grid-column: 1 / -1; }
.auth-help { font-size: var(--font-sm); color: #64748b; margin-top: 6px; }
.auth-error-list { margin: 0; padding-inline-start: 18px; }

.subscription-banner {
    margin: 14px 22px 0;
    padding: 12px 16px;
    border: 1px solid #bfdbfe;
    border-radius: 12px;
    background: #eff6ff;
    color: #1e3a8a;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.subscription-banner.warning { background: #fffbeb; border-color: #fde68a; color: #92400e; }
.subscription-banner.danger { background: #fff1f2; border-color: #fecdd3; color: #9f1239; }
.subscription-banner strong { display: block; }
.subscription-banner small { opacity: .82; }

/* SaaS support mode: the administrator inside a customer company (dedicated support session) */
.support-banner {
    margin: 14px 22px 0;
    padding: 12px 16px;
    border: 1px solid #fcd34d;
    border-radius: 12px;
    background: #fffbeb;
    color: #78350f;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px 16px;
}

.support-banner.is-elevated { background: #fff1f2; border-color: #fda4af; color: #9f1239; }
.support-banner__text { display: flex; align-items: flex-start; gap: 12px; min-width: 0; }
.support-banner__text > i { margin-top: 3px; font-size: 1.25rem; }
.support-banner__text strong { display: block; }
.support-banner__text small { display: block; margin-top: 2px; opacity: .85; }
.support-banner__code { font-family: monospace; font-size: .85em; opacity: .8; }
.support-banner__actions { display: flex; flex-wrap: wrap; gap: 8px; }
body.support-mode .topbar { box-shadow: inset 0 4px 0 #f59e0b; }
body.support-mode--elevated .topbar { box-shadow: inset 0 4px 0 #e11d48; }
body.pos-active #support-banner { display: none; }

.subscription-status-icon { width: 74px; height: 74px; border-radius: 22px; display: grid; place-items: center; margin: 0 auto 18px; background: #eff6ff; color: #2563eb; font-size: 2rem; }

@media (max-width: 720px) {
    .support-banner { margin-inline: 12px; }
    .support-banner__actions { width: 100%; }
    .support-banner__actions .btn { flex: 1 1 auto; }
    .auth-overlay { align-items: flex-start; padding: 12px; }
    .auth-card { padding: 22px 18px; }
    .auth-form-grid { grid-template-columns: 1fr; }
    .auth-form-grid .full-width { grid-column: auto; }
    .subscription-banner { margin: 10px 12px 0; flex-direction: column; align-items: stretch; }
}

/* Customer subscription portal */
.subscription-portal {
    --sub-primary: #2563eb;
    --sub-purple: #7c3aed;
    --sub-ink: #172033;
    --sub-muted: #667085;
    --sub-border: #e6eaf2;
    color: var(--sub-ink);
}
.subscription-shell { display: grid; gap: 22px; max-width: 1180px; margin: 0 auto; padding: 4px 0 40px; }
.subscription-shell > * { min-width: 0; }
.subscription-portal .btn-primary {
    border-color: #16a34a;
    background: #16a34a;
    color: #fff;
}
.subscription-portal .btn-primary:hover,
.subscription-portal .btn-primary:focus { border-color: #15803d; background: #15803d; }
.subscription-page-loading,
.subscription-load-error {
    min-height: 420px;
    display: grid;
    place-content: center;
    justify-items: center;
    gap: 14px;
    text-align: center;
    color: var(--sub-muted);
}
.subscription-page-loading i,
.subscription-load-error > i { color: var(--sub-primary); font-size: 2rem; }
.subscription-load-error h2 { margin: 0; color: var(--sub-ink); font-size: var(--font-lg); font-weight: 700; }
.subscription-load-error p { max-width: 520px; margin: 0; }

.subscription-breadcrumb { display: flex; align-items: center; gap: 8px; color: var(--sub-muted); font-size: var(--font-sm); }
.subscription-breadcrumb a { color: var(--sub-primary); font-weight: 600; text-decoration: none; }
.subscription-breadcrumb > i { font-size: .7rem; }
[dir="ltr"] .subscription-breadcrumb > i,
[dir="ltr"] .subscription-hero-current > i:last-child { transform: scaleX(-1); }

.subscription-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(300px, 400px);
    gap: 22px;
    align-items: stretch;
}
.subscription-hero-copy { display: grid; align-content: center; justify-items: start; gap: 8px; padding: 8px 4px; }
.subscription-hero h1 { margin: 0; font-size: var(--font-2xl); font-weight: 800; letter-spacing: -.02em; }
.subscription-hero-copy > p { margin: 0; color: var(--sub-muted); font-size: var(--font-md); }
.subscription-hero-current {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-top: 8px;
    padding: 9px 15px;
    border: 1px solid #bfdbfe;
    border-radius: 999px;
    background: #eff6ff;
    color: #1e3a8a;
    font-size: var(--font-sm);
    font-weight: 600;
    text-align: start;
}
.subscription-hero-current:hover { border-color: #93c5fd; background: #dbeafe; }
.subscription-hero-current > i:first-child { color: #d97706; }
.subscription-hero-current > i:last-child { font-size: .7rem; opacity: .7; }
.subscription-hero-current b { font-weight: 800; }
.subscription-hero-panel {
    position: relative;
    display: grid;
    align-content: center;
    gap: 8px;
    overflow: hidden;
    padding: 24px 26px;
    border-radius: 22px;
    background: linear-gradient(135deg, #1e40af 0%, #2563eb 58%, #3b82f6 100%);
    color: #fff;
    box-shadow: 0 16px 34px rgba(37, 99, 235, .22);
}
.subscription-hero-panel h2 { margin: 0; color: #fff; font-size: var(--font-lg); font-weight: 700; }
.subscription-hero-panel p { margin: 0; color: #dbeafe; font-size: var(--font-sm); }
.subscription-hero-panel ul { display: grid; gap: 7px; margin: 8px 0 0; padding: 0; list-style: none; font-size: var(--font-sm); font-weight: 600; }
.subscription-hero-panel li { display: flex; align-items: center; gap: 9px; }
.subscription-hero-panel li i { width: 26px; height: 26px; display: grid; place-items: center; border-radius: 8px; background: rgba(255, 255, 255, .16); font-size: .8rem; }
.subscription-hero-panel img { position: absolute; inset-inline-end: -34px; inset-block-end: -38px; width: 190px; opacity: .13; pointer-events: none; }

.subscription-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    font-size: var(--font-xs);
    font-weight: 700;
    letter-spacing: .02em;
    color: var(--sub-primary);
}
.subscription-cycle-wrap { display: grid; justify-items: center; gap: 9px; }
.subscription-cycle {
    display: flex;
    align-items: stretch;
    padding: 4px;
    border: 1px solid #e4e9f2;
    border-radius: 999px;
    background: #f4f7fb;
    box-shadow: inset 0 1px 1px rgba(15, 23, 42, .03);
}
.subscription-cycle button {
    min-width: 118px;
    border: 0;
    border-radius: 999px;
    padding: 9px 20px;
    background: transparent;
    color: #667085;
    font-weight: 700;
}
.subscription-cycle button.active { background: #16b77b; color: #fff; box-shadow: 0 5px 12px rgba(22, 183, 123, .25); }
.subscription-cycle-note { display: inline-flex; align-items: center; gap: 7px; padding: 5px 12px; border-radius: 999px; background: #ecfdf3; color: #169764; font-size: var(--font-xs); font-weight: 700; }

.subscription-plans {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(236px, 1fr));
    gap: 18px;
    align-items: stretch;
    width: 100%;
    max-width: calc(var(--plan-count, 4) * 300px + (var(--plan-count, 4) - 1) * 18px);
    margin: 0 auto;
}
.subscription-plan {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    overflow: hidden;
    border: 1px solid #dce5f1;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 9px 23px rgba(15, 23, 42, .055);
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.subscription-plan:hover { transform: translateY(-4px); border-color: #9fc5f8; box-shadow: 0 17px 33px rgba(37, 99, 235, .12); }
.subscription-plan.is-current { border-color: #16a34a; box-shadow: 0 0 0 2px #dcfce7, 0 17px 33px rgba(22, 163, 74, .1); }
.subscription-plan.is-recommended { border-color: #80ddba; }
.subscription-plan-badges { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; min-height: 26px; margin-bottom: 8px; }
.subscription-popular,
.subscription-current-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    border-radius: 999px;
    background: #0da65f;
    color: #fff;
    font-size: var(--font-xs);
    font-weight: 700;
    line-height: 1.4;
    box-shadow: 0 4px 10px rgba(13, 166, 95, .3);
}
.subscription-current-badge { background: #1d4ed8; box-shadow: 0 4px 10px rgba(29, 78, 216, .28); }
.subscription-plan-head { display: grid; align-content: start; min-height: 190px; padding: 14px 16px 16px; text-align: center; background: #eaf5ff; }
.subscription-plan-head h3 { margin: 0 0 5px; color: #16419a; font-size: var(--font-md); font-weight: 800; line-height: 1.35; }
.subscription-plan-head p { min-height: 30px; margin: 0; color: #4e6d9f; font-size: var(--font-xs); line-height: 1.45; }
.subscription-price { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: center; gap: 6px; margin-top: 10px; color: #123b87; }
.subscription-price small.is-block { flex-basis: 100%; }
.subscription-price strong { font-size: 1.7rem; font-weight: 800; letter-spacing: -.035em; }
.subscription-price strong.is-text { font-size: var(--font-lg); letter-spacing: 0; }
.subscription-price strong em { margin-inline-start: 4px; font-size: var(--font-sm); font-style: normal; font-weight: 700; }
.subscription-price small { color: inherit; font-size: var(--font-xs); font-weight: 700; }
.subscription-saving { justify-self: center; margin-top: 7px; padding: 3px 9px; border-radius: 999px; background: rgba(255, 255, 255, .78); color: #087a4a; font-size: var(--font-xs); font-weight: 700; }
.subscription-plan-body { display: flex; flex: 1; flex-direction: column; padding: 19px 17px 17px; }
.subscription-plan ul { display: grid; gap: 11px; margin: 0 0 20px; padding: 0; list-style: none; }
.subscription-plan li { display: flex; align-items: flex-start; gap: 8px; color: #3e506d; font-size: var(--font-sm); line-height: 1.45; }
.subscription-plan li i { margin-top: 3px; color: #1680e8; font-size: .8rem; }
.subscription-plan .btn { width: 100%; margin-top: auto; display: inline-flex; align-items: center; justify-content: center; gap: 8px; border-color: #0877df; border-radius: 9px; background: #0877df; color: #fff; box-shadow: 0 4px 8px rgba(8, 119, 223, .18); }
.subscription-plan .btn:hover:not(:disabled),
.subscription-plan .btn:focus:not(:disabled) { border-color: #0565c0; background: #0565c0; }
.subscription-plan .btn:disabled { box-shadow: none; opacity: .75; }
.subscription-plan .btn-outline-success { border-color: #16a34a; background: #f0fdf4; color: #15803d; }
.subscription-plan .btn-outline-primary { background: #fff; color: #0877df; }
.subscription-plan .btn-outline-primary:hover:not(:disabled),
.subscription-plan .btn-outline-primary:focus:not(:disabled) { color: #fff; }
.subscription-plan--standard .subscription-plan-head { background: #e8f4ff; }
.subscription-plan--standard .subscription-plan-head h3,
.subscription-plan--standard .subscription-price { color: #1851ac; }
.subscription-plan--pro .subscription-plan-head { background: #e7fbf3; }
.subscription-plan--pro .subscription-plan-head h3,
.subscription-plan--pro .subscription-price { color: #08764d; }
.subscription-plan--pro .subscription-plan-head p { color: #28745e; }
.subscription-plan--pro .subscription-plan-body li i { color: #10a961; }
.subscription-plan--pro .btn:not(.btn-outline-success):not(.btn-outline-primary) { border-color: #0da65f; background: #0da65f; box-shadow: 0 4px 8px rgba(13, 166, 95, .18); }
.subscription-plan--pro .btn:not(.btn-outline-success):not(.btn-outline-primary):hover:not(:disabled),
.subscription-plan--pro .btn:not(.btn-outline-success):not(.btn-outline-primary):focus:not(:disabled) { border-color: #098b4e; background: #098b4e; }
.subscription-plan--enterprise .subscription-plan-head { background: #eeeeff; }
.subscription-plan--enterprise .subscription-plan-head h3,
.subscription-plan--enterprise .subscription-price { color: #5151c8; }
.subscription-plan--enterprise .subscription-plan-head p { color: #6969a7; }
.subscription-plan--enterprise .subscription-plan-body li i { color: #6666dc; }
.subscription-plan--enterprise .btn { border-color: #5e5ed7; background: #5e5ed7; box-shadow: 0 4px 8px rgba(94, 94, 215, .18); }
.subscription-plan--enterprise .btn-outline-primary { background: #fff; color: #5151c8; }
.subscription-plan--enterprise .btn:hover:not(:disabled),
.subscription-plan--enterprise .btn:focus:not(:disabled) { border-color: #4e4ec2; background: #4e4ec2; color: #fff; }
.subscription-empty--plans { border: 1px dashed #cbd5e1; border-radius: 18px; background: #fff; }
.subscription-empty--plans h3 { margin: 0; font-size: var(--font-md); font-weight: 700; color: var(--sub-ink); }
.subscription-empty--plans p { margin: 0; color: var(--sub-muted); }

.subscription-trust { display: grid; gap: 16px; padding: 20px 24px; border: 1px solid var(--sub-border); border-radius: 20px; background: #fff; box-shadow: 0 12px 34px rgba(15, 23, 42, .05); }
.subscription-trust-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 16px; }
.subscription-trust-item { display: flex; align-items: center; gap: 12px; min-width: 0; }
.subscription-trust-item > span { flex: 0 0 auto; width: 44px; height: 44px; display: grid; place-items: center; border-radius: 13px; background: #eff6ff; color: var(--sub-primary); font-size: 1.05rem; }
.subscription-trust-item strong,
.subscription-trust-item small { display: block; }
.subscription-trust-item strong { font-size: var(--font-sm); font-weight: 700; }
.subscription-trust-item small { color: var(--sub-muted); font-size: var(--font-xs); }
.subscription-pay-methods { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 16px; padding-top: 14px; border-top: 1px dashed var(--sub-border); color: #475467; font-size: 2rem; }
.subscription-pay-mark { display: inline-flex; align-items: center; padding: 6px 12px; border: 1px solid currentColor; border-radius: 8px; font-size: var(--font-sm); font-weight: 800; letter-spacing: .02em; text-transform: lowercase; }
.subscription-pay-mark--mada { color: #0c9b6b; }

.subscription-manage { display: grid; gap: 18px; padding: 22px; border: 1px solid var(--sub-border); border-radius: 22px; background: #fff; box-shadow: 0 12px 34px rgba(15, 23, 42, .06); }
.subscription-manage > *,
.subscription-manage-head > *,
.subscription-tab-content > * { min-width: 0; max-width: 100%; }
.subscription-manage-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px; }
.subscription-manage-head h2 { margin: 0; font-size: var(--font-xl); font-weight: 700; }
.subscription-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    padding: 4px;
    border-radius: 12px;
    background: #f4f7fb;
}
.subscription-tabs button {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    border: 0;
    border-radius: 9px;
    padding: 8px 13px;
    background: transparent;
    color: #667085;
    font-size: var(--font-sm);
    font-weight: 700;
}
.subscription-tabs button.active { background: #fff; color: var(--sub-primary); box-shadow: 0 2px 6px rgba(15, 23, 42, .08); }
.subscription-tab-content { min-width: 0; display: grid; gap: 16px; }

.subscription-current { padding: 25px; border: 1px solid var(--sub-border); border-top: 4px solid var(--sub-primary); border-radius: 18px; background: #fbfcff; }
.subscription-current.is-warning { border-top-color: #f59e0b; }
.subscription-current.is-danger { border-top-color: #e11d48; }
.subscription-current-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 20px; }
.subscription-current-head h2 { margin: 0 0 5px; font-weight: 700; font-size: var(--font-xl); }
.subscription-current-head p { margin: 0; color: var(--sub-muted); }
.subscription-status,
.subscription-payment {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 7px 12px;
    border-radius: 999px;
    white-space: nowrap;
    font-size: var(--font-xs);
    font-weight: 700;
    background: #f2f4f7;
    color: #475467;
}
.subscription-status i { font-size: .48rem; }
.subscription-status.is-success,
.subscription-payment.is-approved,
.subscription-payment.is-paid { background: #dcfce7; color: #15803d; }
.subscription-status.is-warning,
.subscription-payment.is-pending { background: #fef3c7; color: #a16207; }
.subscription-status.is-danger,
.subscription-payment.is-failed,
.subscription-payment.is-cancelled { background: #ffe4e6; color: #be123c; }
.subscription-trial-strip {
    display: flex;
    align-items: center;
    gap: 13px;
    margin: 18px 0;
    padding: 14px 16px;
    border-radius: 16px;
    background: linear-gradient(90deg, #fff7ed, #fffbeb);
    color: #92400e;
}
.subscription-trial-strip > i { font-size: 1.4rem; }
.subscription-trial-strip div { flex: 1; }
.subscription-trial-strip strong,
.subscription-trial-strip span { display: block; }
.subscription-trial-strip span { font-size: var(--font-sm); opacity: .8; }
.subscription-trial-strip button { border: 0; background: transparent; color: #9a3412; font-weight: 700; }
.subscription-current-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin-top: 19px;
}
.subscription-current-grid > div {
    min-width: 0;
    padding: 14px;
    border: 1px solid #edf0f6;
    border-radius: 15px;
    background: #fff;
}
.subscription-current-grid small,
.subscription-current-grid span,
.subscription-current-grid em { display: block; color: var(--sub-muted); font-size: var(--font-xs); font-style: normal; }
.subscription-current-grid strong { display: block; margin: 5px 0; overflow-wrap: anywhere; }
.subscription-current-foot { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 18px; padding-top: 16px; border-top: 1px solid #edf0f6; color: var(--sub-muted); font-size: var(--font-sm); }
.subscription-current-foot span { display: flex; align-items: flex-start; gap: 8px; }
.subscription-current-foot i { margin-top: 3px; color: var(--sub-primary); }

.subscription-comparison { border: 1px solid var(--sub-border); border-radius: 15px; background: #fff; }
.subscription-comparison summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 13px 16px; cursor: pointer; font-weight: 700; list-style: none; }
.subscription-comparison summary::-webkit-details-marker { display: none; }
.subscription-comparison summary i { transition: transform .18s ease; }
.subscription-comparison[open] summary { border-bottom: 1px solid #edf0f6; color: var(--sub-primary); }
.subscription-comparison[open] summary i { transform: rotate(180deg); }
.subscription-comparison .subscription-table-wrap { margin: 0; border: 0; border-radius: 0; }
.subscription-comparison th small { display: block; margin-top: 3px; color: #0da65f; font-size: var(--font-xs); }
.subscription-panel-head { display: flex; justify-content: space-between; align-items: center; gap: 20px; }
.subscription-panel-head h2 { margin: 0 0 5px; font-size: var(--font-lg); font-weight: 700; }
.subscription-panel-head p { margin: 0; color: var(--sub-muted); }
.subscription-table-wrap { margin-top: 17px; overflow: auto; border: 1px solid #edf0f6; border-radius: 15px; }
.subscription-table-wrap table { width: 100%; min-width: 690px; border-collapse: collapse; }
.subscription-table-wrap th,
.subscription-table-wrap td { padding: 13px 14px; border-bottom: 1px solid #edf0f6; text-align: start; font-size: var(--font-ui); }
.subscription-table-wrap th { background: #f8fafc; color: #475467; font-weight: 700; }
.subscription-table-wrap tbody tr:last-child td { border-bottom: 0; }
.subscription-policy-label { display: inline-flex; padding: 4px 8px; border-radius: 8px; background: #f2f4f7; color: #475467; font-size: var(--font-sm); }

.subscription-usage-grid,
.subscription-addons { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.subscription-usage-grid article,
.subscription-addons article { padding: 20px; border: 1px solid var(--sub-border); border-radius: 19px; background: #fff; box-shadow: 0 9px 25px rgba(15, 23, 42, .05); }
.subscription-usage-grid article { display: flex; gap: 13px; }
.subscription-usage-grid article > span,
.subscription-addons article > span { flex: 0 0 auto; width: 42px; height: 42px; display: grid; place-items: center; border-radius: 13px; background: #eff6ff; color: var(--sub-primary); }
.subscription-usage-grid article > div { flex: 1; min-width: 0; }
.subscription-usage-grid small,
.subscription-usage-grid em { display: block; color: var(--sub-muted); font-size: var(--font-xs); font-style: normal; }
.subscription-usage-grid strong { display: block; }
.subscription-meter { height: 6px; margin: 9px 0 5px; overflow: hidden; border-radius: 999px; background: #e9edf5; }
.subscription-meter i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #2563eb, #7c3aed); }
.subscription-info,
.subscription-blockers { display: flex; gap: 11px; margin-top: 16px; padding: 13px 15px; border-radius: 13px; background: #eff6ff; color: #1e3a8a; font-size: var(--font-sm); }
.subscription-info.success { background: #ecfdf3; color: #15803d; }
.subscription-blockers { display: grid; background: #fff1f2; color: #be123c; }
.subscription-blockers span { display: flex; gap: 7px; }
.subscription-empty { min-height: 190px; display: grid; place-content: center; justify-items: center; gap: 8px; text-align: center; color: var(--sub-muted); }
.subscription-empty i { font-size: 1.7rem; color: #98a2b3; }
.subscription-empty.compact { min-height: 105px; }
.subscription-addons article { display: flex; flex-direction: column; gap: 9px; }
.subscription-addons h3,
.subscription-addons p { margin: 0; }
.subscription-addons h3 { font-size: var(--font-md); font-weight: 700; }
.subscription-addons p { min-height: 40px; color: var(--sub-muted); font-size: var(--font-sm); }
.subscription-addons .btn { margin-top: auto; }

.subscription-safety-note { display: flex; align-items: flex-start; gap: 13px; padding: 17px 19px; border: 1px solid #fde68a; border-radius: 16px; background: #fffbeb; color: #92400e; }
.subscription-safety-note > i { margin-top: 3px; font-size: 1.3rem; }
.subscription-safety-note strong { display: block; }
.subscription-safety-note p { margin: 4px 0 0; opacity: .8; font-size: var(--font-xs); }

.subscription-modal-backdrop { position: fixed; inset: 0; z-index: 11000; display: grid; place-items: center; padding: 20px; background: rgba(15, 23, 42, .55); }
.subscription-change-modal { position: relative; width: min(100%, 620px); max-height: calc(100vh - 40px); overflow: auto; padding: 28px; border-radius: 24px; background: #fff; box-shadow: 0 30px 70px rgba(15, 23, 42, .28); }
.subscription-modal-close { position: absolute; inset-block-start: 15px; inset-inline-end: 15px; width: 36px; height: 36px; border: 0; border-radius: 50%; background: #f2f4f7; color: #475467; }
.subscription-change-icon { width: 52px; height: 52px; display: grid; place-items: center; margin-bottom: 14px; border-radius: 16px; background: #eff6ff; color: var(--sub-primary); font-size: 1.3rem; }
.subscription-change-modal h2 { margin: 0 0 5px; font-size: var(--font-xl); font-weight: 700; }
.subscription-change-modal > p { margin: 0; color: var(--sub-muted); }
.subscription-change-summary { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 14px; margin-top: 20px; padding: 16px; border-radius: 16px; background: #f8fafc; }
.subscription-change-summary div { min-width: 0; }
.subscription-change-summary small,
.subscription-change-summary strong,
.subscription-change-summary span { display: block; }
.subscription-change-summary small,
.subscription-change-summary span { color: var(--sub-muted); }
[dir="ltr"] .subscription-change-summary > i { transform: scaleX(-1); }
.subscription-change-modal dl { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin: 16px 0 0; }
.subscription-change-modal dl div { padding: 11px; border: 1px solid #edf0f6; border-radius: 12px; }
.subscription-change-modal dt { color: var(--sub-muted); font-size: var(--font-sm); }
.subscription-change-modal dd { margin: 4px 0 0; font-weight: 700; }
.subscription-modal-actions { display: flex; justify-content: flex-end; gap: 9px; margin-top: 20px; }
.subscription-contact-links { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 20px; }
.subscription-contact-links .btn { display: inline-flex; align-items: center; gap: 8px; }

.subscription-settings-card { display: flex; align-items: center; gap: 18px; padding: 22px; border: 1px solid var(--sub-border); border-radius: 22px; background: #fff; box-shadow: 0 12px 34px rgba(15, 23, 42, .06); }
.subscription-settings-icon { flex: 0 0 auto; width: 58px; height: 58px; display: grid; place-items: center; border-radius: 18px; background: #eff6ff; color: var(--sub-primary); font-size: 1.4rem; }
.subscription-settings-card > div { flex: 1; min-width: 0; }
.subscription-settings-card small { color: var(--sub-primary); font-weight: 700; }
.subscription-settings-card h4 { margin: 3px 0; font-weight: 700; }
.subscription-settings-card p { margin: 0; color: var(--sub-muted); }

/* Stage 2: plan review / checkout summary */
.subscription-checkout-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; }
.subscription-checkout-head h1 { margin: 0; font-size: var(--font-2xl); font-weight: 800; letter-spacing: -.02em; }
.subscription-checkout-head p { margin: 4px 0 0; color: var(--sub-muted); font-size: var(--font-md); }
.subscription-steps { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 18px; margin: 0; padding: 0; list-style: none; color: var(--sub-muted); font-size: var(--font-sm); font-weight: 600; }
.subscription-steps li { display: inline-flex; align-items: center; gap: 8px; }
.subscription-steps li span { width: 28px; height: 28px; display: grid; place-items: center; border: 2px solid #d5dce8; border-radius: 50%; background: #fff; font-size: var(--font-xs); font-weight: 800; }
.subscription-steps li.is-done { color: #15803d; }
.subscription-steps li.is-done span { border-color: #16a34a; background: #16a34a; color: #fff; }
.subscription-steps li.is-current { color: var(--sub-primary); }
.subscription-steps li.is-current span { border-color: var(--sub-primary); background: #eff6ff; color: var(--sub-primary); }
.subscription-checkout-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(320px, 400px); gap: 22px; align-items: start; }
.subscription-checkout-main,
.subscription-checkout-aside { display: grid; gap: 18px; min-width: 0; }
.subscription-checkout-aside { position: sticky; top: 16px; }
.subscription-checkout-card { display: grid; gap: 14px; padding: 22px 24px; border: 1px solid var(--sub-border); border-radius: 20px; background: #fff; box-shadow: 0 12px 34px rgba(15, 23, 42, .05); }
.subscription-checkout-card h3 { display: flex; align-items: center; gap: 10px; margin: 0; font-size: var(--font-md); font-weight: 700; }
.subscription-checkout-card h3 i { color: var(--sub-primary); }
.subscription-checkout-hint { margin: -6px 0 0; color: var(--sub-muted); font-size: var(--font-xs); }
.subscription-checkout-plan-head { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; }
.subscription-checkout-plan-icon { flex: 0 0 auto; width: 56px; height: 56px; display: grid; place-items: center; border-radius: 16px; background: linear-gradient(135deg, #1e40af, #3b82f6); color: #fff; font-size: 1.35rem; box-shadow: 0 10px 22px rgba(37, 99, 235, .25); }
.subscription-checkout-plan-head > div { flex: 1 1 220px; min-width: 0; }
.subscription-checkout-plan-head h2 { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 0; font-size: var(--font-xl); font-weight: 800; }
.subscription-checkout-plan-head p { margin: 4px 0 0; color: var(--sub-muted); }
.subscription-checkout-plan-price { flex: 0 0 auto; text-align: end; }
.subscription-checkout-plan-price strong { display: block; color: #123b87; font-size: var(--font-xl); font-weight: 800; letter-spacing: -.02em; }
.subscription-checkout-plan-price strong em { font-size: var(--font-sm); font-style: normal; font-weight: 700; }
.subscription-checkout-plan-price small { display: block; color: var(--sub-muted); font-size: var(--font-xs); }
.subscription-checkout-period { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; padding-top: 14px; border-top: 1px dashed var(--sub-border); font-size: var(--font-sm); font-weight: 600; }
.subscription-checkout-period .subscription-cycle a { min-width: 96px; padding: 7px 16px; border-radius: 999px; color: #667085; font-weight: 700; text-align: center; text-decoration: none; }
.subscription-checkout-period .subscription-cycle a.active { background: #16b77b; color: #fff; box-shadow: 0 5px 12px rgba(22, 183, 123, .25); }
.subscription-checkout-context { display: flex; align-items: flex-start; gap: 12px; padding: 13px 15px; border-radius: 14px; background: #eff6ff; color: #1e3a8a; }
.subscription-checkout-context > i { margin-top: 3px; }
.subscription-checkout-context strong,
.subscription-checkout-context span { display: block; }
.subscription-checkout-context span { font-size: var(--font-sm); opacity: .85; }
.subscription-checkout-context.is-downgrade { background: #fff7ed; color: #9a3412; }
.subscription-checkout-context.is-renewal { background: #ecfdf3; color: #166534; }
.subscription-checkout-blockers { display: grid; gap: 8px; margin: 0; padding: 13px 15px; border-radius: 14px; background: #fff1f2; color: #be123c; list-style: none; font-size: var(--font-sm); }
.subscription-checkout-blockers li { display: flex; gap: 8px; }
.subscription-checkout-features,
.subscription-checkout-limits { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 10px 18px; margin: 0; padding: 0; list-style: none; }
.subscription-checkout-features li,
.subscription-checkout-limits li { display: flex; align-items: flex-start; gap: 9px; color: #3e506d; font-size: var(--font-sm); line-height: 1.5; }
.subscription-checkout-features li i { margin-top: 3px; color: #10a961; }
.subscription-checkout-limits li i { width: 18px; margin-top: 3px; color: var(--sub-primary); text-align: center; }
.subscription-checkout-company { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 12px; margin: 0; }
.subscription-checkout-company div { min-width: 0; padding: 11px 13px; border: 1px solid #edf0f6; border-radius: 12px; background: #fbfcff; }
.subscription-checkout-company dt { color: var(--sub-muted); font-size: var(--font-xs); font-weight: 600; }
.subscription-checkout-company dd { margin: 4px 0 0; font-weight: 700; overflow-wrap: anywhere; }
.subscription-checkout-missing { color: #b45309; font-weight: 600; }
.subscription-checkout-link { display: inline-flex; align-items: center; gap: 8px; color: var(--sub-primary); font-size: var(--font-sm); font-weight: 700; text-decoration: none; }
.subscription-checkout-summary { border-top: 4px solid var(--sub-primary); }
.subscription-checkout-lines { display: grid; gap: 10px; margin: 0; }
.subscription-checkout-lines div { display: flex; justify-content: space-between; gap: 12px; font-size: var(--font-sm); }
.subscription-checkout-lines dt { color: var(--sub-muted); font-weight: 600; }
.subscription-checkout-lines dt small { color: inherit; font-size: var(--font-xs); font-weight: 500; }
.subscription-checkout-lines dd { margin: 0; font-weight: 700; text-align: end; white-space: nowrap; }
.subscription-checkout-lines .is-discount dd { color: #15803d; }
.subscription-checkout-total { display: grid; gap: 4px; padding: 16px; border-radius: 16px; background: linear-gradient(135deg, #eff6ff, #f0fdf4); }
.subscription-checkout-total span { color: var(--sub-muted); font-size: var(--font-sm); font-weight: 700; }
.subscription-checkout-total strong { color: #123b87; font-size: var(--font-2xl); font-weight: 800; letter-spacing: -.02em; }
.subscription-checkout-total small { color: var(--sub-muted); font-size: var(--font-xs); overflow-wrap: anywhere; }
.subscription-checkout-total code { padding: 1px 5px; border-radius: 5px; background: rgba(255, 255, 255, .7); font-size: inherit; }
.subscription-checkout-continue,
.subscription-checkout-back { display: inline-flex; align-items: center; justify-content: center; gap: 8px; width: 100%; border-radius: 12px; padding: 12px 16px; font-weight: 700; }
.subscription-checkout-back { margin-top: -6px; }
[dir="ltr"] .subscription-checkout-continue i,
[dir="ltr"] .subscription-checkout-back i,
[dir="ltr"] .subscription-checkout-error-actions i { transform: scaleX(-1); }
.subscription-checkout-notes { display: grid; gap: 7px; margin: 0; padding: 12px 0 0; border-top: 1px dashed var(--sub-border); list-style: none; color: var(--sub-muted); font-size: var(--font-xs); }
.subscription-checkout-notes li { display: flex; gap: 8px; }
.subscription-checkout-notes li i { margin-top: 2px; color: var(--sub-primary); }
.subscription-checkout-error-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 6px; }
.subscription-checkout-payment-pending { flex-direction: row; display: flex; align-items: flex-start; gap: 16px; }
.subscription-checkout-payment-pending > i { flex: 0 0 auto; width: 52px; height: 52px; display: grid; place-items: center; border-radius: 16px; background: #eff6ff; color: var(--sub-primary); font-size: 1.3rem; }
.subscription-checkout-payment-pending strong { display: block; font-size: var(--font-md); }
.subscription-checkout-payment-pending p { margin: 6px 0 0; color: var(--sub-muted); }
.subscription-checkout-payment-pending code { padding: 2px 6px; border-radius: 6px; background: #f2f4f7; color: #172033; font-size: var(--font-xs); }
.subscription-checkout-skeleton { display: grid; gap: 22px; max-width: 1180px; margin: 0 auto; padding: 4px 0 40px; }
.subscription-skeleton-line,
.subscription-skeleton-card { border-radius: 16px; background: linear-gradient(90deg, #eef2f7 25%, #f7f9fc 50%, #eef2f7 75%); background-size: 400% 100%; animation: subscription-skeleton 1.4s ease infinite; }
.subscription-skeleton-line.is-title { width: min(100%, 360px); height: 34px; }
.subscription-skeleton-card { height: 190px; margin-bottom: 18px; }
.subscription-skeleton-card.is-short { height: 130px; }
.subscription-skeleton-card.is-tall { height: 420px; }
@keyframes subscription-skeleton { 0% { background-position: 100% 0; } 100% { background-position: 0 0; } }

/* Stage 3: payment method selection */
.subscription-pay-list { display: grid; gap: 12px; }
.subscription-pay-method { position: relative; display: flex; align-items: center; gap: 14px; margin: 0; padding: 16px 18px; border: 2px solid #e4e9f2; border-radius: 16px; background: #fff; cursor: pointer; transition: border-color .15s ease, box-shadow .15s ease, background .15s ease; }
.subscription-pay-method:hover { border-color: #93c5fd; }
.subscription-pay-method.is-selected { border-color: var(--sub-primary); background: #f5f9ff; box-shadow: 0 0 0 4px rgba(37, 99, 235, .12); }
.subscription-pay-method input { position: absolute; inset-inline-start: 18px; width: 20px; height: 20px; margin: 0; accent-color: var(--sub-primary); }
.subscription-pay-method-icon { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 8px; min-width: 96px; margin-inline-start: 30px; color: #475467; font-size: 1.9rem; }
.subscription-pay-method-icon .subscription-pay-mark { font-size: var(--font-xs); }
.subscription-pay-method-body { flex: 1; min-width: 0; display: grid; gap: 4px; }
.subscription-pay-method-body strong { font-size: var(--font-md); font-weight: 700; }
.subscription-pay-method-body small { color: var(--sub-muted); font-size: var(--font-sm); line-height: 1.5; }
.subscription-pay-badges { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 2px; }
.subscription-pay-badge { display: inline-flex; align-items: center; gap: 6px; padding: 3px 9px; border-radius: 999px; background: #ecfdf3; color: #15803d; font-size: var(--font-xs); font-style: normal; font-weight: 700; }
.subscription-pay-badge.is-verify { background: #fff7ed; color: #9a3412; }
.subscription-pay-badge.is-sandbox { background: #f2f4f7; color: #475467; }
.subscription-pay-method-check { flex: 0 0 auto; color: #cbd5e1; font-size: 1.3rem; }
.subscription-pay-method.is-selected .subscription-pay-method-check { color: var(--sub-primary); }
.subscription-pay-mark--stc { color: #4f008c; }
.subscription-pay-trust .subscription-trust-grid { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }
.subscription-info.is-warning { background: #fff7ed; color: #9a3412; }
.subscription-pay-continue { display: inline-flex; align-items: center; justify-content: center; gap: 8px; width: 100%; border: 1px solid var(--sub-primary); border-radius: 12px; padding: 12px 16px; background: var(--sub-primary); color: #fff; font-weight: 700; box-shadow: 0 8px 18px rgba(37, 99, 235, .22); }
.subscription-pay-continue:hover:not(:disabled),
.subscription-pay-continue:focus:not(:disabled) { border-color: #1d4ed8; background: #1d4ed8; color: #fff; }
.subscription-pay-continue:disabled { opacity: .55; box-shadow: none; }
.subscription-pay-verify-note { display: flex; gap: 8px; margin: 10px 0 0; padding: 10px 12px; border-radius: 12px; background: #fff7ed; color: #9a3412; font-size: var(--font-sm); }

/* Stage 4: payment execution + verification screen */
.subscription-pay-execute { gap: 16px; }
.subscription-pay-identity { display: flex; align-items: center; gap: 12px; padding-bottom: 14px; border-bottom: 1px solid var(--sub-border); }
.subscription-pay-identity img { width: 42px; height: 42px; }
.subscription-pay-identity > div { flex: 1; min-width: 0; }
.subscription-pay-identity strong { display: block; font-size: var(--font-md); font-weight: 800; letter-spacing: .04em; }
.subscription-pay-identity small { color: var(--sub-muted); font-size: var(--font-xs); }
.subscription-pay-selected { display: flex; align-items: center; gap: 14px; padding: 12px 14px; border: 1px solid var(--sub-border); border-radius: 14px; background: #fbfcff; }
.subscription-pay-selected .subscription-pay-method-icon { margin-inline-start: 0; min-width: 0; }
.subscription-pay-selected > div { flex: 1 1 160px; min-width: 0; overflow-wrap: anywhere; }
.subscription-pay-selected small { display: block; color: var(--sub-muted); font-size: var(--font-xs); }
.subscription-pay-selected strong { font-size: var(--font-md); font-weight: 700; }
.subscription-pay-secure { display: flex; gap: 12px; padding: 14px 16px; border-radius: 14px; background: #eff6ff; color: #1e3a8a; }
.subscription-pay-secure > i { margin-top: 3px; font-size: 1.2rem; }
.subscription-pay-secure strong { display: block; }
.subscription-pay-secure p { margin: 4px 0 0; font-size: var(--font-sm); opacity: .9; }
.subscription-verify { display: flex; align-items: flex-start; gap: 16px; }
.subscription-verify > i { flex: 0 0 auto; width: 56px; height: 56px; display: grid; place-items: center; border-radius: 18px; background: #eff6ff; color: var(--sub-primary); font-size: 1.5rem; }
.subscription-verify.is-paid > i { background: #ecfdf3; color: #15803d; }
.subscription-verify.is-failed > i,
.subscription-verify.is-cancelled > i,
.subscription-verify.is-expired > i { background: #fff1f2; color: #be123c; }
.subscription-verify > div { flex: 1; min-width: 0; }
.subscription-verify strong { display: block; font-size: var(--font-md); font-weight: 700; }
.subscription-verify p { margin: 6px 0 0; color: var(--sub-muted); }
.subscription-verify code { padding: 2px 6px; border-radius: 6px; background: #f2f4f7; color: #172033; font-size: var(--font-xs); }
.subscription-verify .subscription-checkout-error-actions { justify-content: flex-start; margin-top: 14px; }

/* Stage 5: payment verification screen */
.subscription-verify-shell { max-width: 720px; }
.subscription-verify-head { display: flex; justify-content: center; }
.subscription-verify-card { justify-items: center; padding: 30px 28px; text-align: center; }
.subscription-verify-card h1 { margin: 0; font-size: var(--font-xl); font-weight: 800; }
.subscription-verify-card > p { max-width: 520px; margin: 0; color: var(--sub-muted); }
.subscription-verify-icon { position: relative; width: 76px; height: 76px; display: grid; place-items: center; border-radius: 50%; background: #eff6ff; color: var(--sub-primary); font-size: 1.8rem; }
.subscription-verify-icon.is-animated::before,
.subscription-verify-icon.is-animated::after { content: ''; position: absolute; inset: -6px; border-radius: 50%; border: 3px solid rgba(37, 99, 235, .28); animation: subscription-verify-pulse 1.8s ease-out infinite; }
.subscription-verify-icon.is-animated::after { animation-delay: .9s; }
@keyframes subscription-verify-pulse { 0% { transform: scale(.85); opacity: .9; } 100% { transform: scale(1.35); opacity: 0; } }
.subscription-verify-card.is-paid .subscription-verify-icon { background: #ecfdf3; color: #15803d; }
.subscription-verify-card.is-failed .subscription-verify-icon { background: #fff1f2; color: #be123c; }
.subscription-verify-card.is-review .subscription-verify-icon { background: #fff7ed; color: #b45309; }
.subscription-verify-steps { display: grid; gap: 10px; width: 100%; max-width: 420px; margin: 4px 0 0; padding: 0; list-style: none; text-align: start; }
.subscription-verify-steps li { display: flex; align-items: center; gap: 12px; color: var(--sub-muted); font-size: var(--font-sm); font-weight: 600; }
.subscription-verify-steps li span { flex: 0 0 auto; width: 28px; height: 28px; display: grid; place-items: center; border: 2px solid #d5dce8; border-radius: 50%; background: #fff; font-size: var(--font-xs); }
.subscription-verify-steps li.is-done { color: #15803d; }
.subscription-verify-steps li.is-done span { border-color: #16a34a; background: #16a34a; color: #fff; }
.subscription-verify-steps li.is-current { color: var(--sub-primary); }
.subscription-verify-steps li.is-current span { border-color: var(--sub-primary); color: var(--sub-primary); }
.subscription-verify-summary { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; width: 100%; margin: 6px 0 0; padding: 14px; border: 1px solid #edf0f6; border-radius: 14px; background: #fbfcff; text-align: start; }
.subscription-verify-summary div { min-width: 0; }
.subscription-verify-summary dt { color: var(--sub-muted); font-size: var(--font-xs); font-weight: 600; }
.subscription-verify-summary dd { margin: 3px 0 0; font-weight: 700; overflow-wrap: anywhere; }
.subscription-verify-summary code { padding: 1px 5px; border-radius: 5px; background: #f2f4f7; color: #172033; font-size: inherit; }
.subscription-verify-code { color: var(--sub-muted); font-size: var(--font-xs); }
.subscription-verify-code code { font-size: inherit; }
.subscription-verify-card .subscription-checkout-error-actions { justify-content: center; margin-top: 6px; }

/* Stage 6: verified payment success */
.subscription-success-shell { max-width: 760px; }
.subscription-success-hero { justify-items: center; padding: 34px 28px 28px; text-align: center; background: linear-gradient(180deg, #f0fdf4 0%, #fff 70%); }
.subscription-success-check { width: 92px; height: 92px; display: grid; place-items: center; border-radius: 50%; background: #16a34a; color: #fff; font-size: 2.4rem; box-shadow: 0 0 0 12px #dcfce7, 0 14px 30px rgba(22, 163, 74, .28); }
.subscription-success-hero h1 { margin: 6px 0 0; font-size: var(--font-2xl); font-weight: 800; letter-spacing: -.02em; }
.subscription-success-hero > p { max-width: 520px; margin: 0; color: var(--sub-muted); font-size: var(--font-md); }
.subscription-success-verified { display: inline-flex; align-items: center; gap: 8px; padding: 6px 14px; border-radius: 999px; background: #dcfce7; color: #15803d; font-size: var(--font-sm); font-weight: 700; }
.subscription-success-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px; margin: 0; }
.subscription-success-grid div { min-width: 0; padding: 12px 14px; border: 1px solid #edf0f6; border-radius: 12px; background: #fbfcff; }
.subscription-success-grid dt { color: var(--sub-muted); font-size: var(--font-xs); font-weight: 600; }
.subscription-success-grid dd { display: grid; gap: 2px; margin: 4px 0 0; font-weight: 700; overflow-wrap: anywhere; }
.subscription-success-grid dd small { color: var(--sub-muted); font-size: var(--font-xs); font-weight: 500; }
.subscription-success-grid dd code { justify-self: start; max-width: 100%; padding: 2px 6px; border-radius: 6px; background: #f2f4f7; color: #172033; font-size: var(--font-xs); white-space: normal; overflow-wrap: anywhere; }
.subscription-success-grid dd small { overflow-wrap: anywhere; }
.subscription-success-grid dd.is-verified { display: flex; align-items: center; gap: 8px; color: #15803d; }
.subscription-checkout-total.is-success { background: linear-gradient(135deg, #f0fdf4, #eff6ff); }
.subscription-checkout-total.is-success strong { color: #15803d; }
.subscription-success-activation { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; border-inline-start: 4px solid var(--sub-primary); }
.subscription-success-activation > span { flex: 0 0 auto; width: 48px; height: 48px; display: grid; place-items: center; border-radius: 14px; background: #eff6ff; color: var(--sub-primary); font-size: 1.25rem; }
.subscription-success-activation > div { flex: 1 1 260px; min-width: 0; }
.subscription-success-activation strong { display: block; font-size: var(--font-md); }
.subscription-success-activation p { margin: 4px 0 0; color: var(--sub-muted); font-size: var(--font-sm); }
.subscription-success-activation .btn { display: inline-flex; align-items: center; gap: 8px; }
.subscription-success-activation.is-active { border-inline-start-color: #16a34a; }
.subscription-success-activation.is-active > span { background: #dcfce7; color: #15803d; }
.subscription-success-activation.is-failed { border-inline-start-color: #d97706; }
.subscription-success-activation.is-failed > span { background: #fff7ed; color: #b45309; }
.subscription-success-activation.is-review { border-inline-start-color: #b45309; }
.subscription-success-activation.is-review > span { background: #fff7ed; color: #b45309; }
.subscription-success-notes { gap: 10px; color: var(--sub-muted); font-size: var(--font-sm); }
.subscription-success-notes div { display: flex; align-items: flex-start; gap: 10px; }
.subscription-success-notes i { margin-top: 3px; color: var(--sub-primary); }
.subscription-success-notes div.is-warning { color: #9a3412; }
.subscription-success-notes div.is-warning i { color: #d97706; }
.subscription-success-notes code { padding: 1px 6px; border-radius: 6px; background: #f2f4f7; color: #172033; font-size: inherit; overflow-wrap: anywhere; }
.subscription-success-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
.subscription-success-actions .btn { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 10px 18px; border-radius: 12px; }

/* Stage 7: activation progress and the activated summary */
.subscription-success-hero .subscription-activation-steps { max-width: 360px; margin-top: 10px; }
.subscription-success-activation.is-over-limit { border-inline-start-color: #d97706; }
.subscription-success-activation.is-over-limit > span { background: #fff7ed; color: #b45309; }
.subscription-checkout-card h4 { margin: 4px 0 0; font-size: var(--font-sm); font-weight: 700; color: var(--sub-muted); }
.subscription-activation-limits { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; margin: 0; padding: 0; list-style: none; }
.subscription-activation-limits li { display: grid; gap: 2px; min-width: 0; padding: 10px 12px; border: 1px solid #edf0f6; border-radius: 12px; background: #fbfcff; }
.subscription-activation-limits li span { color: var(--sub-muted); font-size: var(--font-xs); font-weight: 600; }
.subscription-activation-limits li strong { font-size: var(--font-md); overflow-wrap: anywhere; }
.subscription-activation-limits li.is-over { border-color: #fdba74; background: #fff7ed; }
.subscription-activation-limits li.is-over strong { color: #b45309; }
.subscription-activation-modules { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.subscription-activation-modules li { display: inline-flex; align-items: center; gap: 7px; padding: 6px 12px; border-radius: 999px; background: #eff6ff; color: var(--sub-primary); font-size: var(--font-xs); font-weight: 700; }

/* Stage 8: billing center */
.subscription-billing { max-width: 1180px; }
.subscription-billing-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-start; gap: 14px; }
.subscription-billing-head h1 { margin: 0 0 4px; font-size: var(--font-2xl); font-weight: 800; letter-spacing: -.02em; }
.subscription-billing-head p { max-width: 640px; margin: 0; color: var(--sub-muted); }
.subscription-billing-head .btn { display: inline-flex; align-items: center; gap: 8px; }
.subscription-billing-current-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 10px; }
.subscription-billing-current-head h2 { margin: 0; font-size: var(--font-xl); font-weight: 800; }
.subscription-billing-current-head p { margin: 2px 0 0; color: var(--sub-muted); font-size: var(--font-sm); }
.subscription-billing-usage { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 10px; margin: 0; padding: 0; list-style: none; }
.subscription-billing-usage li { min-width: 0; padding: 10px 12px; border: 1px solid #edf0f6; border-radius: 12px; background: #fbfcff; }
.subscription-billing-usage li span { display: block; color: var(--sub-muted); font-size: var(--font-xs); font-weight: 600; }
.subscription-billing-usage li strong { display: block; margin-top: 2px; font-size: var(--font-md); }
.subscription-billing-usage li.is-over { border-color: #fdba74; background: #fff7ed; }
.subscription-billing-usage li.is-over strong { color: #b45309; }
.subscription-billing-info { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 12px; padding: 12px 14px; border: 1px dashed #d5dce8; border-radius: 12px; }
.subscription-billing-info > div { min-width: 0; flex: 1 1 320px; }
.subscription-billing-info h4 { margin: 0 0 4px; }
.subscription-billing-info p { margin: 0; color: var(--sub-muted); font-size: var(--font-sm); overflow-wrap: anywhere; }
.subscription-billing-info .btn { display: inline-flex; align-items: center; gap: 8px; }
.subscription-billing-tabs { width: fit-content; max-width: 100%; }
.subscription-billing-panel { display: grid; gap: 16px; }
.subscription-billing-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 12px; }
.subscription-billing-stats button { display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto; column-gap: 12px; align-items: center; padding: 14px 16px; border: 1px solid #edf0f6; border-radius: 14px; background: #fbfcff; text-align: start; cursor: pointer; font: inherit; color: inherit; }
.subscription-billing-stats button span { grid-row: span 2; width: 42px; height: 42px; display: grid; place-items: center; border-radius: 12px; background: #eff6ff; color: var(--sub-primary); }
.subscription-billing-stats button strong { font-size: var(--font-xl); font-weight: 800; line-height: 1.1; }
.subscription-billing-stats button small { color: var(--sub-muted); font-size: var(--font-xs); font-weight: 600; }
.subscription-billing-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.subscription-billing-panel-head { flex-wrap: wrap; }
.subscription-billing-panel-head > * { min-width: 0; }
.subscription-billing-filters { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; align-items: end; padding: 14px; border: 1px solid #edf0f6; border-radius: 14px; background: #fbfcff; }
.subscription-billing-filters label { display: grid; gap: 4px; min-width: 0; font-size: var(--font-xs); font-weight: 600; color: var(--sub-muted); }
.subscription-billing-filters label.is-search { grid-column: span 2; }
.subscription-billing-filters label.is-hidden { display: none; }
.subscription-billing-input { width: 100%; min-height: 40px; padding: 8px 10px; border: 1px solid #d5dce8; border-radius: 10px; background: #fff; color: var(--sub-ink); font: inherit; font-size: var(--font-sm); }
.subscription-billing-input:focus { outline: 2px solid rgba(37, 99, 235, .25); border-color: var(--sub-primary); }
.subscription-billing-filter-actions { display: flex; gap: 8px; }
.subscription-billing-filter-actions .btn { display: inline-flex; align-items: center; gap: 6px; min-height: 40px; }
.subscription-billing-table { margin-top: 0; }
.subscription-billing-table table { min-width: 860px; }
.subscription-billing-table td small { display: block; margin-top: 2px; color: var(--sub-muted); font-size: var(--font-xs); font-weight: 500; }
.subscription-billing-table td code { padding: 2px 6px; border-radius: 6px; background: #f2f4f7; color: #172033; font-size: var(--font-xs); }
.subscription-billing-table td.is-amount { font-variant-numeric: tabular-nums; white-space: nowrap; }
.subscription-billing-table td bdi { white-space: nowrap; }
.subscription-billing-table td.is-actions { white-space: nowrap; }
.subscription-billing-table td.is-actions .btn, .subscription-billing-actions .btn, .subscription-billing-modal .subscription-modal-actions .btn { display: inline-flex; align-items: center; gap: 6px; margin-inline-end: 6px; margin-bottom: 4px; }
.subscription-billing-table .btn-sm { min-height: 34px; padding: 5px 10px; font-size: var(--font-xs); }
.subscription-billing-pagination { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 10px; color: var(--sub-muted); font-size: var(--font-sm); }
.subscription-billing-pagination label { display: inline-flex; align-items: center; gap: 6px; }
.subscription-billing-pagination label .subscription-billing-input { width: auto; min-height: 34px; padding: 4px 8px; }
.subscription-billing-pagination nav { display: flex; flex-wrap: wrap; gap: 6px; }
.subscription-billing-pagination nav .btn { min-width: 38px; min-height: 34px; }
.subscription-billing-timeline { display: grid; margin: 0; padding: 0; list-style: none; }
.subscription-billing-timeline li { position: relative; display: flex; align-items: center; gap: 12px; padding: 10px 0; padding-inline-start: 24px; border-inline-start: 2px solid #e2e8f0; }
.subscription-billing-timeline li > span { position: absolute; inset-inline-start: -7px; top: 50%; width: 12px; height: 12px; border-radius: 50%; background: #cbd5e1; transform: translateY(-50%); }
.subscription-billing-timeline li.is-paid > span { background: #16a34a; }
.subscription-billing-timeline li.is-pending > span { background: #d97706; }
.subscription-billing-timeline li > div { flex: 1 1 auto; min-width: 0; }
.subscription-billing-timeline li strong { display: block; font-size: var(--font-sm); }
.subscription-billing-timeline li small { color: var(--sub-muted); font-size: var(--font-xs); }
.subscription-billing-modal { width: min(100%, 760px); }
.subscription-billing-modal > p { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.subscription-billing-modal code { padding: 2px 6px; border-radius: 6px; background: #f2f4f7; font-size: var(--font-xs); overflow-wrap: anywhere; }
.subscription-billing-modal dd small { display: block; color: var(--sub-muted); font-size: var(--font-xs); font-weight: 500; }
.subscription-billing-modal .subscription-modal-actions { flex-wrap: wrap; justify-content: flex-start; }

@media (max-width: 1240px) {
    .subscription-usage-grid,
    .subscription-addons { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 900px) {
    .subscription-hero { grid-template-columns: 1fr; }
    .subscription-checkout-grid { grid-template-columns: 1fr; }
    .subscription-checkout-aside { position: static; order: -1; }
    .subscription-current-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .subscription-plans { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .subscription-manage-head { flex-direction: column; align-items: stretch; }
}

@media (max-width: 640px) {
    .subscription-billing-table table { min-width: 0; }
    .subscription-billing-table thead { display: none; }
    .subscription-billing-table tr { display: grid; gap: 4px; padding: 12px 14px; border-bottom: 1px solid #edf0f6; }
    .subscription-billing-table td { display: flex; justify-content: space-between; gap: 12px; padding: 2px 0; border: 0; }
    .subscription-billing-table td::before { content: attr(data-label); flex: 0 0 auto; color: var(--sub-muted); font-size: var(--font-xs); font-weight: 600; }
    .subscription-billing-table td.is-actions { flex-direction: column; align-items: stretch; white-space: normal; }
    .subscription-billing-table td.is-actions .btn { justify-content: center; margin-inline-end: 0; }
    .subscription-billing-filters label.is-search { grid-column: span 1; }
    .subscription-billing-modal dl { grid-template-columns: 1fr; }
    .subscription-shell { gap: 16px; }
    .subscription-hero-copy { padding: 4px 0; }
    .subscription-hero-panel { padding: 20px; }
    .subscription-hero-current { width: 100%; }
    .subscription-hero-current span { flex: 1; min-width: 0; }
    .subscription-cycle { width: 100%; }
    .subscription-cycle button { flex: 1; min-width: 0; }
    .subscription-current { padding: 19px; }
    .subscription-current-head,
    .subscription-current-foot,
    .subscription-panel-head,
    .subscription-settings-card { align-items: stretch; flex-direction: column; }
    .subscription-current-grid,
    .subscription-plans,
    .subscription-usage-grid,
    .subscription-addons,
    .subscription-trust-grid { grid-template-columns: 1fr; }
    .subscription-plan-head { min-height: 0; padding: 14px 17px 16px; }
    .subscription-plan-body { padding: 17px; }
    .subscription-trust,
    .subscription-manage,
    .subscription-checkout-card { padding: 16px; }
    .subscription-checkout-head { flex-direction: column; align-items: stretch; }
    .subscription-steps { justify-content: space-between; gap: 8px; }
    .subscription-checkout-plan-price { text-align: start; }
    .subscription-checkout-payment-pending { flex-direction: column; }
    .subscription-steps li span { width: 24px; height: 24px; }
    .subscription-pay-method { flex-wrap: wrap; padding: 14px; }
    .subscription-pay-method-icon { min-width: 0; font-size: 1.6rem; }
    .subscription-pay-method-body { flex-basis: 100%; }
    .subscription-pay-method-check { position: absolute; inset-inline-end: 14px; inset-block-start: 14px; }
    .subscription-pay-identity,
    .subscription-verify { flex-wrap: wrap; }
    .subscription-verify-card { padding: 22px 16px; }
    .subscription-success-hero { padding: 26px 16px 22px; }
    .subscription-success-actions .btn { width: 100%; }
    .subscription-success-activation .btn { width: 100%; justify-content: center; }
    .subscription-verify-summary { grid-template-columns: 1fr 1fr; }
    .subscription-pay-selected { flex-wrap: wrap; }
    .subscription-tabs button { padding: 8px 11px; }
    .subscription-change-modal { padding: 22px 17px; }
    .subscription-change-summary { grid-template-columns: 1fr; }
    .subscription-change-summary > i { transform: rotate(-90deg); justify-self: center; }
    .subscription-change-modal dl { grid-template-columns: 1fr; }
    .subscription-modal-actions { flex-direction: column-reverse; }
    .subscription-modal-actions .btn { width: 100%; }
    .subscription-settings-card > .btn { width: 100%; }
}

/* saas-console.css */
/* ACCMAN SaaS management console: the operational admin surface under /saas.
   Tokens come from variables.css; typography follows the central scale
   (page title 24–26px, card titles 16–18px, UI ~15px, tables 14–15px). */
.saas-console { --saas-ink: #172033; --saas-muted: #64748b; --saas-line: #e6eaf2; --saas-surface: #ffffff; --saas-soft: #f7f9fc; --saas-primary: #1d4ed8; --saas-primary-soft: #e8efff; display: grid; gap: 18px; color: var(--saas-ink); font-size: 15px; }
.saas-console > * { min-width: 0; }
.saas-console a.saas-link, .saas-console button.saas-link { border: 0; padding: 0; background: none; color: var(--saas-primary); font: inherit; font-weight: 600; text-decoration: none; cursor: pointer; }
.saas-console a.saas-link:hover, .saas-console button.saas-link:hover { text-decoration: underline; }
.saas-muted { color: var(--saas-muted); font-size: 14px; }

/* page head */
.saas-page-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-start; gap: 14px 20px; }
.saas-page-head__copy { min-width: 0; flex: 1 1 420px; }
.saas-page-head h1 { margin: 0 0 4px; font-size: 25px; font-weight: 800; letter-spacing: -.01em; line-height: 1.25; overflow-wrap: anywhere; }
.saas-page-head p { margin: 0; max-width: 760px; color: var(--saas-muted); font-size: 15px; line-height: 1.6; }
.saas-page-head__meta { display: flex; flex-wrap: wrap; gap: 6px 18px; margin-top: 10px; color: var(--saas-muted); font-size: 14px; }
.saas-page-head__meta i { margin-inline-end: 6px; color: var(--saas-primary); }
.saas-page-head__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }

/* buttons, inputs, chips */
.saas-btn { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 8px 16px; border: 1px solid var(--saas-line); border-radius: 10px; background: var(--saas-surface); color: var(--saas-ink); font: inherit; font-size: 14.5px; font-weight: 600; text-decoration: none; cursor: pointer; transition: background .15s, border-color .15s; }
.saas-btn:hover { background: var(--saas-soft); text-decoration: none; color: var(--saas-ink); }
.saas-btn--primary { border-color: var(--saas-primary); background: var(--saas-primary); color: #fff; }
.saas-btn--primary:hover { background: #1e40af; color: #fff; }
.saas-btn--ghost { background: transparent; }
.saas-btn--sm { min-height: 34px; padding: 5px 11px; font-size: 13.5px; border-radius: 8px; }
.saas-btn[disabled] { opacity: .5; cursor: default; }
.saas-input { width: 100%; min-height: 40px; padding: 8px 11px; border: 1px solid #d5dce8; border-radius: 10px; background: #fff; color: var(--saas-ink); font: inherit; font-size: 14.5px; }
.saas-input:focus { outline: 2px solid rgba(29, 78, 216, .22); border-color: var(--saas-primary); }
.saas-chip { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: 999px; background: #eef2f7; color: #475467; font-size: 13.5px; font-weight: 700; white-space: nowrap; }
.saas-chip--success { background: #dcfce7; color: #15803d; }
.saas-chip--danger { background: #ffe4e6; color: #be123c; }
.saas-chip--warning { background: #fef3c7; color: #a16207; }
.saas-chip--info { background: #dbeafe; color: #1d4ed8; }
.saas-chip--violet { background: #ede9fe; color: #6d28d9; }
.saas-chip--primary { background: var(--saas-primary-soft); color: var(--saas-primary); }
.saas-chip--muted { background: #eef2f7; color: #64748b; }
.saas-status-dot { display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px; border-radius: 999px; background: #ecfdf3; color: #15803d; font-size: 14px; font-weight: 700; }
.saas-status-dot i { font-size: .55rem; }
.saas-status-dot.is-danger { background: #ffe4e6; color: #be123c; }

/* KPI cards */
.saas-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.saas-kpis--secondary { grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); }
.saas-kpi { display: flex; align-items: center; gap: 14px; min-width: 0; padding: 16px 18px; border: 1px solid var(--saas-line); border-radius: 16px; background: var(--saas-surface); color: var(--saas-ink); text-decoration: none; text-align: start; cursor: pointer; font: inherit; box-shadow: 0 1px 2px rgba(15, 23, 42, .04); transition: border-color .15s, box-shadow .15s, transform .15s; }
.saas-kpi:hover { border-color: #c7d2fe; box-shadow: 0 8px 22px rgba(15, 23, 42, .08); transform: translateY(-1px); color: var(--saas-ink); text-decoration: none; }
.saas-kpi.is-secondary { padding: 12px 14px; border-radius: 12px; }
.saas-kpi.is-active { border-color: var(--saas-primary); box-shadow: 0 0 0 2px rgba(29, 78, 216, .18); }
.saas-kpi__icon { flex: 0 0 auto; display: grid; place-items: center; width: 46px; height: 46px; border-radius: 13px; background: var(--saas-primary-soft); color: var(--saas-primary); font-size: 1.15rem; }
.saas-kpi--success .saas-kpi__icon { background: #dcfce7; color: #15803d; }
.saas-kpi--danger .saas-kpi__icon { background: #ffe4e6; color: #be123c; }
.saas-kpi--warning .saas-kpi__icon { background: #fef3c7; color: #a16207; }
.saas-kpi--info .saas-kpi__icon { background: #cffafe; color: #0e7490; }
.saas-kpi--violet .saas-kpi__icon { background: #ede9fe; color: #6d28d9; }
.saas-kpi--muted .saas-kpi__icon { background: #eef2f7; color: #64748b; }
.saas-kpi__body { display: grid; gap: 2px; min-width: 0; }
.saas-kpi__body small { color: var(--saas-muted); font-size: 14px; font-weight: 600; }
.saas-kpi__body strong { font-size: 26px; font-weight: 800; line-height: 1.15; letter-spacing: -.01em; overflow-wrap: anywhere; }
.saas-kpi.is-secondary .saas-kpi__body strong { font-size: 21px; }
.saas-kpi__body em { color: var(--saas-muted); font-size: 12.5px; font-style: normal; }

/* cards + grids */
.saas-card { display: grid; align-content: start; gap: 14px; min-width: 0; padding: 18px 20px; border: 1px solid var(--saas-line); border-radius: 16px; background: var(--saas-surface); box-shadow: 0 1px 2px rgba(15, 23, 42, .04); }
.saas-card > header { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 8px 14px; }
.saas-card > header h2 { margin: 0; font-size: 17px; font-weight: 800; }
.saas-card > header small { flex-basis: 100%; color: var(--saas-muted); font-size: 13.5px; }
.saas-card > header > b { font-size: 18px; font-weight: 800; color: var(--saas-primary); }
.saas-card h3 { margin: 6px 0 0; font-size: 15px; font-weight: 700; color: var(--saas-muted); }
.saas-card--chart { min-height: 340px; }
.saas-chart { position: relative; height: 260px; }
.saas-chart--donut { height: 230px; }
.saas-grid { display: grid; gap: 14px; }
.saas-grid--charts { grid-template-columns: 1.6fr 1fr 1fr; }
.saas-grid--tables { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.saas-grid--side { grid-template-columns: 1.4fr 1fr; }
.saas-grid--two { grid-template-columns: repeat(2, minmax(0, 1fr)); }

/* tables */
.saas-table-wrap { overflow: auto; border: 1px solid var(--saas-line); border-radius: 12px; }
.saas-table { width: 100%; min-width: 640px; border-collapse: collapse; font-size: 14.5px; }
.saas-table th { padding: 11px 13px; background: var(--saas-soft); color: #475467; font-size: 14px; font-weight: 700; text-align: start; white-space: nowrap; border-bottom: 1px solid var(--saas-line); }
.saas-table td { padding: 11px 13px; border-bottom: 1px solid var(--saas-line); vertical-align: middle; text-align: start; }
.saas-table tbody tr:last-child td { border-bottom: 0; }
.saas-table tbody tr[data-open] { cursor: pointer; }
.saas-table tbody tr[data-open]:hover td { background: #f8fbff; }
.saas-table td small { display: block; margin-top: 2px; color: var(--saas-muted); font-size: 13px; font-weight: 500; }
.saas-table td code, .saas-dl dd code, .saas-modal code { padding: 2px 6px; border-radius: 6px; background: #f2f4f7; color: #172033; font-size: 13px; }
.saas-table .is-num { text-align: end; font-variant-numeric: tabular-nums; white-space: nowrap; }
.saas-table td .saas-btn { margin-inline-end: 6px; }
.saas-empty { display: grid; justify-items: center; gap: 8px; padding: 34px 16px; color: var(--saas-muted); text-align: center; font-size: 14.5px; }
.saas-empty i { font-size: 1.6rem; color: #98a2b3; }
.saas-empty p { margin: 0; }

/* filters, pager, tabs */
.saas-filters { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 10px; align-items: end; padding: 14px; border: 1px solid var(--saas-line); border-radius: 14px; background: var(--saas-surface); }
.saas-filters label { display: grid; gap: 4px; min-width: 0; color: var(--saas-muted); font-size: 13.5px; font-weight: 600; }
.saas-filters label.is-wide { grid-column: span 2; }
.saas-filters label.is-hidden { display: none; }
.saas-filters__actions { display: flex; gap: 8px; }
.saas-pager { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 10px; color: var(--saas-muted); font-size: 14px; }
.saas-pager nav { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.saas-pager nav .saas-btn { min-width: 40px; min-height: 36px; padding: 6px 10px; }
.saas-pager label { display: inline-flex; align-items: center; gap: 6px; margin-inline-start: 8px; }
.saas-pager label .saas-input { width: auto; min-height: 36px; padding: 4px 8px; }
.saas-tabs { display: flex; flex-wrap: wrap; gap: 6px; padding: 6px; border: 1px solid var(--saas-line); border-radius: 12px; background: var(--saas-soft); width: fit-content; max-width: 100%; }
.saas-tabs button { display: inline-flex; align-items: center; gap: 8px; min-height: 38px; padding: 7px 14px; border: 0; border-radius: 9px; background: transparent; color: #475467; font: inherit; font-size: 14.5px; font-weight: 700; cursor: pointer; }
.saas-tabs button b { padding: 1px 8px; border-radius: 999px; background: #e2e8f0; color: #334155; font-size: 12.5px; }
.saas-tabs button.active { background: #fff; color: var(--saas-primary); box-shadow: 0 2px 6px rgba(15, 23, 42, .08); }
.saas-inline { display: inline-flex; align-items: center; gap: 8px; color: var(--saas-muted); font-size: 14px; font-weight: 600; }
.saas-inline .saas-input { width: auto; }

/* lists inside cards */
.saas-bars { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.saas-bars li { display: grid; grid-template-columns: minmax(80px, 1fr) 2fr auto; align-items: center; gap: 10px; font-size: 14px; }
.saas-bars li span { color: #334155; font-weight: 600; overflow-wrap: anywhere; }
.saas-bars li i { display: block; height: 10px; border-radius: 999px; background: linear-gradient(90deg, #2563eb, #7c3aed); }
.saas-bars li strong { font-variant-numeric: tabular-nums; }
.saas-alerts { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.saas-alerts li { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid var(--saas-line); border-radius: 10px; background: var(--saas-soft); font-size: 14.5px; }
.saas-alerts li i { flex: 0 0 auto; width: 30px; height: 30px; display: grid; place-items: center; border-radius: 9px; background: #eef2f7; color: #64748b; }
.saas-alerts li.is-danger i { background: #ffe4e6; color: #be123c; }
.saas-alerts li.is-warning i { background: #fef3c7; color: #a16207; }
.saas-alerts li.is-info i { background: #dbeafe; color: #1d4ed8; }
.saas-alerts li b { margin-inline-start: auto; padding: 2px 10px; border-radius: 999px; background: #fff; border: 1px solid var(--saas-line); font-variant-numeric: tabular-nums; }
.saas-quick { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; }
.saas-quick__item { display: grid; justify-items: center; gap: 8px; padding: 14px 10px; border: 1px solid var(--saas-line); border-radius: 12px; background: var(--saas-soft); color: var(--saas-ink); font-size: 14px; font-weight: 700; text-align: center; text-decoration: none; }
.saas-quick__item i { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 12px; background: var(--saas-primary-soft); color: var(--saas-primary); font-size: 1.1rem; }
.saas-quick__item:hover { border-color: #c7d2fe; color: var(--saas-primary); text-decoration: none; }
.saas-dl { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 10px; margin: 0; }
.saas-dl > div { min-width: 0; padding: 10px 12px; border: 1px solid var(--saas-line); border-radius: 10px; background: var(--saas-soft); }
.saas-dl dt { color: var(--saas-muted); font-size: 13px; font-weight: 600; }
.saas-dl dd { margin: 3px 0 0; font-size: 14.5px; font-weight: 700; overflow-wrap: anywhere; }
.saas-dl dd small { display: block; color: var(--saas-muted); font-size: 12.5px; font-weight: 500; }
.saas-issues { display: grid; gap: 6px; margin: 0; padding: 0; list-style: none; color: #9a3412; font-size: 14px; }
.saas-issues li { display: flex; gap: 8px; align-items: flex-start; padding: 8px 10px; border-radius: 8px; background: #fff7ed; }
.saas-services { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.saas-services li { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border: 1px solid var(--saas-line); border-radius: 12px; background: var(--saas-surface); }
.saas-services li > i { font-size: 1.2rem; color: #15803d; }
.saas-services li.is-down > i { color: #be123c; }
.saas-services li > div { flex: 1 1 auto; min-width: 0; }
.saas-services li strong { display: block; font-size: 15px; }
.saas-services li small { color: var(--saas-muted); font-size: 13px; }
.saas-services li ul { margin: 4px 0 0; padding-inline-start: 18px; color: #9a3412; font-size: 13px; }
.saas-meter { position: relative; display: block; min-width: 120px; height: 22px; border-radius: 999px; background: #eef2f7; overflow: hidden; }
.saas-meter i { position: absolute; inset: 0 auto 0 0; display: block; border-radius: inherit; background: #2563eb; }
[dir="rtl"] .saas-meter i { inset: 0 0 0 auto; }
.saas-meter b { position: relative; display: block; line-height: 22px; text-align: center; font-size: 12.5px; font-weight: 700; color: #172033; }
.saas-meter.is-warn i { background: #d97706; }
.saas-meter.is-over i { background: #dc2626; }
.saas-meter.is-over b { color: #fff; }
.saas-meter.is-unlimited { display: inline-block; height: auto; padding: 2px 10px; background: #f2f4f7; font-size: 13.5px; }
.saas-perm-list { display: grid; gap: 6px; margin: 0 0 8px; padding: 0; list-style: none; }
.saas-perm-list li { display: grid; grid-template-columns: minmax(160px, 1fr) 1.4fr 1.4fr; gap: 10px; align-items: center; padding: 8px 10px; border: 1px solid var(--saas-line); border-radius: 8px; font-size: 14px; }
.saas-perm-list li small { color: var(--saas-muted); font-size: 12.5px; }
.saas-check { display: grid; grid-template-columns: auto 1fr; gap: 4px 10px; align-items: center; padding: 8px 10px; border: 1px solid var(--saas-line); border-radius: 8px; font-size: 14px; cursor: pointer; }
.saas-check code { grid-column: 2; font-size: 12px; color: var(--saas-muted); background: none; padding: 0; }
.saas-check.is-primary { margin-bottom: 8px; background: var(--saas-primary-soft); border-color: #c7d2fe; font-weight: 700; }
.saas-check-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 8px; }
.saas-timeline { display: grid; gap: 6px; margin: 0; padding: 0; list-style: none; font-size: 13.5px; }
.saas-timeline li { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.saas-timeline time { color: var(--saas-muted); }
.saas-details summary { cursor: pointer; color: var(--saas-primary); font-size: 13.5px; font-weight: 600; }
.saas-details pre { margin: 6px 0 0; max-width: 420px; max-height: 220px; overflow: auto; padding: 8px; border-radius: 8px; background: #0f172a; color: #e2e8f0; font-size: 12px; text-align: left; }
.saas-log { max-height: 60vh; overflow: auto; margin: 0; padding: 12px; border-radius: 12px; background: #0f172a; color: #e2e8f0; font-size: 12.5px; line-height: 1.6; text-align: left; white-space: pre-wrap; overflow-wrap: anywhere; }
.saas-form { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; }
.saas-form label { display: grid; gap: 4px; color: var(--saas-muted); font-size: 13.5px; font-weight: 600; }
.saas-form label.is-wide, .saas-form .is-wide { grid-column: 1 / -1; }
.saas-form__actions { grid-column: 1 / -1; display: flex; justify-content: flex-end; }
.saas-brand-preview { display: grid; place-items: center; min-height: 110px; padding: 16px; border: 1px dashed #d5dce8; border-radius: 12px; background: var(--saas-soft); }
.saas-brand-preview img { max-width: 220px; max-height: 80px; object-fit: contain; }
.saas-brand-preview span { font-size: 28px; font-weight: 900; color: var(--saas-primary); letter-spacing: .06em; }

/* customer messages */
.saas-msg-list .saas-table { min-width: 880px; font-size: 14px; }
.saas-msg-list .saas-table th, .saas-msg-list .saas-table td { padding: 8px 6px; white-space: nowrap; }
.saas-msg-list .saas-table td:nth-child(2) { white-space: normal; min-width: 170px; max-width: 240px; font-weight: 600; }
.saas-msg-list .saas-table td:nth-child(4) { white-space: normal; max-width: 130px; }
.saas-msg-date { display: inline-grid; line-height: 1.3; }
.saas-msg-date small { color: var(--saas-muted); font-size: 12px; }
.saas-msg-actions { display: flex; flex-wrap: nowrap; gap: 4px; }
.saas-msg-actions .saas-btn { margin: 0; min-height: 30px; padding-inline: 7px; }
.saas-btn.is-danger { color: #b91c1c; border-color: #f8c7c7; }
.saas-btn.is-danger:hover { background: #fff5f5; }
.saas-msg-editor { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(340px, 1fr); gap: 16px; align-items: start; }
.saas-msg-editor__side { position: sticky; top: calc(var(--header-height) + 16px); }
.saas-msg-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.saas-msg-steps button { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: 8px 10px; border: 1px solid var(--saas-line); border-radius: 10px; background: var(--saas-soft); color: var(--saas-muted); font: inherit; font-size: 14px; font-weight: 700; cursor: pointer; }
.saas-msg-steps button.is-active { border-color: var(--saas-primary); background: var(--saas-primary-soft); color: var(--saas-primary); }
.saas-msg-steps button.is-done { color: #15803d; }
.saas-msg-form { display: grid; gap: 14px; }
.saas-msg-form h3 { margin: 4px 0 0; font-size: 15px; font-weight: 800; color: var(--saas-ink); }
.saas-form__field small { color: var(--saas-muted); font-size: 12.5px; font-weight: 500; }
.saas-form__field.is-hidden { display: none; }
.saas-msg-form textarea.saas-input { min-height: 120px; resize: vertical; }
.saas-msg-editor__footer { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 10px; padding-top: 14px; border-top: 1px solid var(--saas-line); }
.saas-msg-editor__footer > div, .saas-msg-editor__save { display: flex; flex-wrap: wrap; gap: 8px; }
.saas-msg-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 10px; }
.saas-msg-cards--four { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.saas-msg-card { position: relative; display: grid; justify-items: center; gap: 8px; padding: 14px 10px; border: 1px solid var(--saas-line); border-radius: 12px; background: #fff; text-align: center; cursor: pointer; transition: border-color .15s, box-shadow .15s; }
.saas-msg-card input { position: absolute; opacity: 0; pointer-events: none; }
.saas-msg-card:hover { border-color: #c7d2fe; }
.saas-msg-card.is-selected { border-color: var(--saas-primary); box-shadow: 0 0 0 2px rgba(29, 78, 216, .16); background: #f8fbff; }
.saas-msg-card strong { font-size: 14.5px; }
.saas-msg-card small { color: var(--saas-muted); font-size: 12.5px; line-height: 1.5; }
.saas-msg-card__icon { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 12px; font-size: 1.1rem; }
.saas-msg-audience-detail { margin-top: 14px; padding-top: 14px; border-top: 1px dashed var(--saas-line); }
.saas-msg-picker { display: grid; gap: 10px; }
.saas-msg-results { display: grid; gap: 6px; max-height: 280px; overflow: auto; padding: 4px; border: 1px solid var(--saas-line); border-radius: 10px; background: var(--saas-soft); }
.saas-msg-result { display: grid; grid-template-columns: 1fr auto; grid-template-areas: 'name icon' 'meta icon'; align-items: center; gap: 2px 10px; padding: 8px 10px; border: 1px solid transparent; border-radius: 8px; background: #fff; font: inherit; text-align: start; cursor: pointer; }
.saas-msg-result strong { grid-area: name; font-size: 14px; }
.saas-msg-result small { grid-area: meta; color: var(--saas-muted); font-size: 12.5px; }
.saas-msg-result i { grid-area: icon; color: var(--saas-primary); }
.saas-msg-result.is-selected { border-color: var(--saas-primary); background: var(--saas-primary-soft); }
.saas-msg-selected { display: flex; flex-wrap: wrap; gap: 6px; }
.saas-chip__remove { border: 0; padding: 0 0 0 2px; background: none; color: inherit; cursor: pointer; }
.saas-msg-radios { display: flex; flex-wrap: wrap; gap: 8px; }
.saas-msg-radios .saas-check { grid-template-columns: auto auto; }
.saas-check.is-selected { border-color: var(--saas-primary); background: #f8fbff; }
.saas-msg-preview { display: grid; gap: 8px; }
.saas-msg-preview__label { color: var(--saas-muted); font-size: 12.5px; font-weight: 600; }
.saas-msg-preview .dash-banner { flex-wrap: wrap; pointer-events: none; }
.saas-msg-preview .dash-banner__copy { flex-basis: calc(100% - 58px); }
.saas-msg-preview .dash-banner__actions { width: 100%; justify-content: flex-end; }
.saas-msg-targets { display: flex; flex-wrap: wrap; gap: 4px; }
.saas-msg-preview .dash-banner strong, .saas-msg-preview .dash-banner p { overflow-wrap: anywhere; }
.saas-msg-body { margin: 0; padding: 12px 14px; border: 1px solid var(--saas-line); border-radius: 10px; background: var(--saas-soft); font-size: 14.5px; line-height: 1.7; white-space: pre-wrap; }
.saas-timeline li strong { font-weight: 700; }

/* support console */
button.saas-kpi { border: 1px solid var(--saas-line); font: inherit; }
.saas-attachments { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0 0; padding: 0; list-style: none; }
.saas-attachments a { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border: 1px solid var(--saas-line); border-radius: 8px; background: #fff; color: var(--saas-ink); font-size: 12.5px; font-weight: 600; text-decoration: none; }
.saas-attachments a:hover { border-color: #c7d2fe; color: var(--saas-primary); }
.saas-attachments small { color: var(--saas-muted); }
.saas-files { display: grid; gap: 6px; }
.saas-files__drop { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border: 1px dashed #c7d2fe; border-radius: 10px; background: #f8fbff; color: var(--saas-primary); font-size: 13.5px; font-weight: 600; cursor: pointer; }
.saas-files__drop input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.saas-files__list { display: grid; gap: 4px; margin: 0; padding: 0; list-style: none; }
.saas-files__list li { display: flex; align-items: center; gap: 8px; padding: 5px 10px; border: 1px solid var(--saas-line); border-radius: 8px; font-size: 13px; }
.saas-files__list small { color: var(--saas-muted); }
.saas-files__list button { margin-inline-start: auto; border: 0; background: none; color: #b91c1c; cursor: pointer; }
.saas-thread { display: grid; gap: 10px; }
.saas-thread__msg { max-width: 90%; padding: 12px 14px; border: 1px solid var(--saas-line); border-radius: 12px; background: #fff; }
.saas-thread__msg.is-customer { justify-self: start; background: var(--saas-soft); }
.saas-thread__msg.is-support { justify-self: end; background: var(--saas-primary-soft); border-color: #cfe0fb; }
.saas-thread__msg header { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 4px; font-size: 13.5px; }
.saas-thread__msg header i { color: var(--saas-primary); }
.saas-thread__msg header time { color: var(--saas-muted); font-size: 12.5px; }
.saas-thread__msg p { margin: 0; font-size: 14.5px; line-height: 1.7; white-space: pre-wrap; overflow-wrap: anywhere; }
.saas-reply { margin-top: 4px; padding-top: 14px; border-top: 1px solid var(--saas-line); }
.saas-ticket-props { margin-bottom: 4px; }
.saas-msg-note { display: block; max-width: 280px; white-space: normal; font-size: 13.5px; color: var(--saas-muted); }
.saas-input--sm { min-height: 32px; margin-top: 6px; padding: 3px 8px; font-size: 13px; }
.saas-status-dot.is-danger { padding: 2px 8px; font-size: 12px; }

/* modal */
.saas-modal-backdrop { position: fixed; inset: 0; z-index: 11000; display: grid; place-items: center; padding: 20px; background: rgba(15, 23, 42, .45); }
.saas-modal { width: min(100%, 820px); max-height: calc(100vh - 40px); display: grid; grid-template-rows: auto 1fr auto; border-radius: 16px; background: #fff; box-shadow: 0 24px 60px rgba(15, 23, 42, .3); overflow: hidden; }
.saas-modal > header { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 16px 20px; border-bottom: 1px solid var(--saas-line); }
.saas-modal > header h2 { margin: 0; font-size: 17px; font-weight: 800; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.saas-modal__close { width: 36px; height: 36px; border: 0; border-radius: 10px; background: #f2f4f7; color: #475467; cursor: pointer; }
.saas-modal__body { display: grid; gap: 14px; padding: 18px 20px; overflow: auto; }
.saas-modal__actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; padding: 14px 20px; border-top: 1px solid var(--saas-line); background: var(--saas-soft); }

/* legacy console pages (plans, add-ons, support, ZATCA, apps, company profile) share the console title scale */
body.saas-console-mode #app-content > header > h2, body.saas-console-mode [id^="saas-"][id$="-root"] > .d-flex > div > h2, body.saas-console-mode [id^="saas-"][id$="-root"] > div > .d-flex > div > h2 { font-size: 25px; font-weight: 800; letter-spacing: -.01em; }

/* shell: sidebar in console mode */
.sidebar-console-label { display: none; margin-top: 4px; color: var(--primary); font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
body.saas-console-mode .sidebar-console-label { display: block; }
body.saas-console-mode .sidebar-nav .nav-item, body.saas-console-mode .sidebar-nav .nav-toggle { font-size: 15.5px; }
body.saas-console-mode .sidebar-nav .nav-sub-item { font-size: 14.5px; }
body.saas-console-mode .nav-item-return { margin: 4px 0 0; background: var(--sidebar-module-open); border: 1px dashed var(--sidebar-border); }

@media (max-width: 1400px) {
    .saas-grid--charts { grid-template-columns: 1.4fr 1fr; }
    .saas-grid--charts > :last-child { grid-column: 1 / -1; }
}
@media (max-width: 1100px) {
    .saas-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .saas-msg-editor { grid-template-columns: 1fr; }
    .saas-msg-editor__side { position: static; }
    .saas-msg-cards--four { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .saas-grid--charts, .saas-grid--tables, .saas-grid--side, .saas-grid--two { grid-template-columns: 1fr; }
    .saas-grid--charts > :last-child { grid-column: auto; }
    .saas-perm-list li { grid-template-columns: 1fr; gap: 2px; }
}
@media (max-width: 640px) {
    .saas-console { gap: 14px; }
    .saas-page-head h1 { font-size: 22px; }
    .saas-kpis { grid-template-columns: 1fr; }
    .saas-kpis--secondary { grid-template-columns: 1fr; }
    .saas-card { padding: 14px; }
    .saas-filters label.is-wide { grid-column: span 1; }
    .saas-table, .saas-msg-list .saas-table { min-width: 0; }
    .saas-msg-list .saas-table td, .saas-msg-list .saas-table td:nth-child(2) { white-space: normal; max-width: none; }
    .saas-table thead { display: none; }
    .saas-table tr { display: grid; gap: 4px; padding: 12px 14px; border-bottom: 1px solid var(--saas-line); }
    .saas-table td { display: flex; justify-content: space-between; gap: 12px; padding: 2px 0; border: 0; text-align: start; }
    .saas-table td::before { content: attr(data-label); flex: 0 0 auto; color: var(--saas-muted); font-size: 13px; font-weight: 600; }
    .saas-table td.is-num { text-align: end; }
    .saas-tabs { width: 100%; }
    .saas-modal { width: 100%; max-height: 100vh; border-radius: 12px; }
    .saas-msg-steps { grid-template-columns: 1fr; }
    .saas-msg-steps button span { font-size: 13.5px; }
    .saas-msg-cards--four { grid-template-columns: 1fr; }
}

/* public website manager (/saas/site) */
.saas-status-dot.is-warning { background: #fef3c7; color: #b45309; }
.saas-status-dot.is-muted { background: #f1f5f9; color: #475569; }
.saas-site-status__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 14px 24px; align-items: center; }
.saas-site-status__grid > div { display: grid; gap: 6px; }
.saas-site-status__grid small { color: var(--saas-muted); font-size: 13px; font-weight: 600; }
.saas-site-status__grid strong { font-size: 14.5px; font-weight: 700; }
.saas-site-status__actions { justify-self: end; }
.saas-site-sections { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.saas-site-section { display: grid; grid-template-columns: auto auto minmax(0, 1fr) auto auto; align-items: center; gap: 12px; padding: 10px 14px; border: 1px solid var(--saas-line); border-radius: 12px; background: var(--saas-surface); }
.saas-site-section.is-hidden-section { background: var(--saas-soft); }
.saas-site-section.is-hidden-section .saas-site-section__body strong { color: var(--saas-muted); }
.saas-site-section.is-dragging { opacity: .5; border-style: dashed; }
.saas-site-section__handle { color: #94a3b8; cursor: grab; font-size: 15px; }
.saas-site-section__icon { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 10px; background: var(--saas-primary-soft); color: var(--saas-primary); }
.saas-site-section__body { display: grid; min-width: 0; }
.saas-site-section__body strong { font-size: 15px; overflow-wrap: anywhere; }
.saas-site-section__body small { color: var(--saas-muted); font-size: 13px; }
.saas-site-section__visible { display: inline-flex; align-items: center; gap: 8px; font-size: 13.5px; font-weight: 600; color: var(--saas-muted); cursor: pointer; }
.saas-site-section__visible input:checked + span { color: #15803d; }
.saas-site-section__tools { display: flex; gap: 6px; }
.saas-site-form { align-content: start; }
.saas-site-bilingual { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 12px; }
.saas-site-bilingual em, .saas-site-list legend small { margin-inline-start: 6px; padding: 1px 6px; border-radius: 6px; background: var(--saas-soft); color: var(--saas-muted); font-size: 11.5px; font-style: normal; }
.saas-site-thumb { width: 100%; max-width: 220px; border: 1px solid var(--saas-line); border-radius: 8px; background: #fff; object-fit: cover; }
.saas-site-thumb.is-hidden { display: none; }
.saas-site-media { display: grid; gap: 10px; }
.saas-site-media__pick { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; align-items: start; }
.saas-site-media__pick .saas-site-thumb { width: 160px; aspect-ratio: 16 / 10; }
.saas-site-media__position { max-width: 260px; }
.saas-site-upload { display: grid; gap: 12px; padding: 14px; border: 1px solid var(--saas-line); border-radius: 12px; background: var(--saas-soft); }
.saas-site-upload.is-hidden, .saas-site-upload__zone.is-hidden, .saas-site-upload__preview.is-hidden, .saas-site-upload input[type="file"].is-hidden { display: none; }
.saas-site-upload__title { font-size: 14px; font-weight: 800; color: var(--saas-ink); }
.saas-site-upload__zone { display: grid; justify-items: center; gap: 8px; padding: 26px 16px; border: 2px dashed #c7d2fe; border-radius: 12px; background: #fff; text-align: center; transition: border-color .15s, background .15s; }
.saas-site-upload__zone.is-over { border-color: var(--saas-primary); background: var(--saas-primary-soft); }
.saas-site-upload__zone > i { font-size: 28px; color: var(--saas-primary); }
.saas-site-upload__zone p { margin: 0; color: var(--saas-muted); font-size: 13.5px; font-weight: 600; }
.saas-site-upload__zone small { color: var(--saas-muted); font-size: 12.5px; }
.saas-site-upload__zone-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.saas-site-upload__preview { display: grid; grid-template-columns: 200px minmax(0, 1fr); gap: 14px; align-items: start; padding: 12px; border: 1px solid var(--saas-line); border-radius: 12px; background: #fff; }
.saas-site-upload__img { width: 200px; aspect-ratio: 16 / 10; object-fit: cover; border-radius: 8px; border: 1px solid var(--saas-line); background: var(--saas-soft); }
.saas-site-upload__meta { display: grid; gap: 3px; min-width: 0; font-size: 13px; color: var(--saas-muted); }
.saas-site-upload__meta strong { font-size: 14px; color: var(--saas-ink); overflow-wrap: anywhere; }
.saas-site-upload__meta em { font-style: normal; font-weight: 700; color: #15803d; }
.saas-site-upload__actions { grid-column: 2; display: flex; flex-wrap: wrap; gap: 8px; }
.saas-site-upload__settings { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 12px; }
.saas-site-upload__settings .saas-form__field span em { margin-inline-start: 6px; padding: 1px 6px; border-radius: 6px; background: #fff; color: var(--saas-muted); font-size: 11.5px; font-style: normal; }
.saas-site-add { display: flex; justify-content: center; padding-top: 6px; }
/* support access dialog (SaaS administrator opening a customer company) */
.saas-support-target { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 10px 16px; padding: 12px 14px; border: 1px solid var(--saas-line); border-radius: 12px; background: var(--saas-soft); }
.saas-support-target small { display: block; color: var(--saas-muted); font-size: 12.5px; font-weight: 600; }
.saas-support-target strong { display: block; font-size: 14px; overflow-wrap: anywhere; }
.saas-support-durations { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 6px; }
.saas-support-durations .saas-check { flex: 1 1 90px; justify-content: center; }
.saas-support-note { margin: 0; padding: 10px 12px; border-radius: 10px; background: #fffbeb; border: 1px solid #fde68a; color: #92400e; font-size: 13.5px; }
.saas-support-result { padding: 10px 12px; border-radius: 10px; background: #ecfdf5; border: 1px solid #a7f3d0; color: #065f46; font-size: 13.5px; }
.saas-support-result.is-hidden { display: none; }
.saas-site-library { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 12px; }
.saas-site-library__item { display: grid; gap: 8px; padding: 10px; border: 1px solid var(--saas-line); border-radius: 12px; background: #fff; }
.saas-site-library__item img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; border-radius: 8px; background: var(--saas-soft); }
.saas-site-library__meta { display: grid; gap: 2px; font-size: 12.5px; color: var(--saas-muted); }
.saas-site-library__meta strong { font-size: 13px; color: var(--saas-ink); overflow-wrap: anywhere; }
.saas-site-library__actions { display: flex; gap: 6px; }
.saas-site-versions { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.saas-site-versions li { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 10px; padding: 10px 14px; border: 1px solid var(--saas-line); border-radius: 12px; }
.saas-site-versions__stamp { display: grid; gap: 2px; }
.saas-site-versions__stamp small { color: var(--saas-muted); font-size: 13px; }
.saas-site-list { grid-column: 1 / -1; display: grid; gap: 10px; margin: 4px 0 0; padding: 12px 14px 14px; border: 1px solid var(--saas-line); border-radius: 12px; }
.saas-site-list legend { padding-inline: 6px; font-size: 14px; font-weight: 700; color: var(--saas-ink); }
.saas-site-list__rows { display: grid; gap: 10px; }
.saas-site-list__row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; padding: 12px; border: 1px dashed #d5dce8; border-radius: 10px; background: var(--saas-soft); }
.saas-site-list__fields { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 10px; }
.saas-site-list__tools { display: grid; align-content: start; gap: 6px; }
@media (max-width: 720px) {
    .saas-site-section { grid-template-columns: auto minmax(0, 1fr) auto; }
    .saas-site-media__pick { grid-template-columns: 1fr; }
    .saas-site-upload__preview { grid-template-columns: 1fr; }
    .saas-site-upload__img { width: 100%; }
    .saas-site-upload__actions { grid-column: 1; }
    .saas-site-section__icon { display: none; }
    .saas-site-section__tools { grid-column: 1 / -1; justify-content: flex-end; }
    .saas-site-status__actions { justify-self: start; }
}

/* communications & notifications (platform messaging: /saas/communications/*) */
#saas-communications-root { display: grid; gap: 18px; min-width: 0; }
.saas-comm-nav { display: flex; flex-wrap: wrap; gap: 6px; padding: 6px; border: 1px solid var(--saas-line); border-radius: 12px; background: var(--saas-soft); }
.saas-comm-nav a { display: inline-flex; align-items: center; gap: 8px; min-height: 38px; padding: 7px 14px; border-radius: 9px; color: #475467; font-size: 14.5px; font-weight: 700; text-decoration: none; }
.saas-comm-nav a:hover { color: var(--saas-primary); text-decoration: none; }
.saas-comm-nav a.active { background: #fff; color: var(--saas-primary); box-shadow: 0 2px 6px rgba(15, 23, 42, .08); }
.saas-comm-nav .fa-whatsapp { color: #16a34a; }
.saas-comm-flow { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 10px; margin: 0; padding: 0; list-style: none; }
.saas-comm-flow li { position: relative; display: grid; justify-items: center; gap: 6px; padding: 12px 8px; border: 1px solid var(--saas-line); border-radius: 12px; background: var(--saas-soft); text-align: center; }
.saas-comm-flow li span { display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; border-radius: 50%; background: var(--saas-primary-soft); color: var(--saas-primary); font-size: 17px; }
.saas-comm-flow li b { position: absolute; inset-block-start: 6px; inset-inline-start: 8px; color: var(--saas-muted); font-size: 12px; }
.saas-comm-flow li em { font-style: normal; font-size: 13.5px; font-weight: 700; line-height: 1.4; }
.saas-comm-flow li:nth-child(6) span { background: #dcfce7; color: #15803d; }
.saas-comm-note { display: flex; gap: 10px; align-items: flex-start; margin: 0; padding: 10px 12px; border-radius: 10px; background: #fffbeb; color: #854d0e; font-size: 14px; line-height: 1.6; }
.saas-comm-note i { margin-block-start: 4px; }
.saas-comm-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.saas-comm-attempts .saas-input { width: 80px; }
.saas-comm-channels { display: grid; gap: 10px; }
.saas-comm-channel-card { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 12px; padding: 14px; border: 1px solid var(--saas-line); border-radius: 12px; color: var(--saas-ink); text-decoration: none; }
.saas-comm-channel-card:hover { border-color: #c7d2fe; color: var(--saas-ink); text-decoration: none; }
.saas-comm-channel-card > i { display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; border-radius: 12px; background: var(--saas-primary-soft); color: var(--saas-primary); font-size: 19px; }
.saas-comm-channel-card > i.fa-whatsapp { background: #dcfce7; color: #16a34a; }
.saas-comm-channel-card small { display: block; color: var(--saas-muted); font-size: 13px; overflow-wrap: anywhere; }
.saas-comm-channel { display: inline-flex; align-items: center; gap: 6px; padding: 3px 9px; border-radius: 999px; background: var(--saas-primary-soft); color: var(--saas-primary); font-size: 13px; font-weight: 700; white-space: nowrap; }
.saas-comm-channel--whatsapp { background: #dcfce7; color: #15803d; }
.saas-comm-sub, .saas-comm-warning, .saas-comm-error { display: block; margin-block-start: 3px; font-size: 12.5px; font-weight: 500; }
.saas-comm-sub { color: var(--saas-muted); }
.saas-comm-warning { color: #a16207; }
.saas-comm-error { color: #be123c; overflow-wrap: anywhere; }
p.saas-comm-error { display: flex; gap: 8px; margin: 0; padding: 10px 12px; border-radius: 10px; background: #fff1f2; font-size: 14px; }
.saas-comm-toggle { display: inline-flex; align-items: center; gap: 8px; color: var(--saas-ink); font-size: 14px; font-weight: 700; cursor: pointer; }
.saas-comm-toggle input { width: 18px; height: 18px; accent-color: var(--saas-primary); }
.saas-comm-test { margin-block-start: 6px; }
.saas-comm-newtpl { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; max-width: 100%; }
.saas-comm-newtpl .saas-input { flex: 1 1 150px; width: auto; min-width: 0; }
.saas-comm-h3 { margin: 16px 0 8px; font-size: 15px; font-weight: 800; }
.saas-comm-list { display: grid; margin: 0; padding: 0; list-style: none; }
.saas-comm-list li { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 6px 12px; padding: 10px 0; border-block-end: 1px solid var(--saas-line); }
.saas-comm-list li:last-child { border-block-end: 0; }
.saas-comm-list li > span:first-child { display: grid; min-width: 0; }
.saas-comm-list .saas-comm-actions { gap: 6px; }
/* template editor */
.saas-comm-editor { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(300px, 1fr); gap: 14px; align-items: start; }
.saas-comm-editor__side { display: grid; gap: 14px; position: sticky; inset-block-start: 12px; }
.saas-comm-editor__footer { justify-content: flex-end; padding-block-start: 12px; border-block-start: 1px solid var(--saas-line); }
.saas-comm-langs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.saas-comm-lang { display: grid; gap: 10px; min-width: 0; margin: 0; padding: 12px; border: 1px solid var(--saas-line); border-radius: 12px; background: var(--saas-soft); }
.saas-comm-lang legend { float: none; width: auto; margin: 0; padding: 0 6px; font-size: 14px; font-weight: 800; }
.saas-comm-lang .saas-form__field { display: grid; gap: 4px; color: var(--saas-muted); font-size: 13.5px; font-weight: 600; }
.saas-comm-body { min-height: 150px; font-family: ui-monospace, Consolas, monospace; font-size: 13.5px; line-height: 1.6; resize: vertical; unicode-bidi: plaintext; }
.saas-comm-toolbar { display: flex; gap: 4px; }
.saas-comm-vars { display: flex; flex-wrap: wrap; gap: 6px; }
.saas-comm-var { display: inline-flex; align-items: center; gap: 6px; padding: 5px 9px; border: 1px solid #c7d2fe; border-radius: 9px; background: #f8fbff; color: var(--saas-ink); font: inherit; font-size: 13px; cursor: pointer; }
.saas-comm-var:hover { background: var(--saas-primary-soft); }
.saas-comm-var code { color: var(--saas-primary); font-size: 12.5px; }
.saas-comm-var.is-secret { border-color: #fcd34d; background: #fffbeb; }
.saas-comm-var[disabled] { cursor: default; opacity: .7; }
.saas-comm-provider-status { font-size: 13.5px; color: var(--saas-muted); }
.saas-comm-preview { display: grid; gap: 10px; }
.saas-comm-preview__subject { display: grid; gap: 2px; padding: 8px 10px; border-radius: 10px; background: var(--saas-soft); }
.saas-comm-preview__subject small { color: var(--saas-muted); font-size: 12.5px; }
.saas-comm-preview__frame { width: 100%; height: 440px; border: 1px solid var(--saas-line); border-radius: 12px; background: #f1f5f9; }
.saas-comm-bubble { max-width: 420px; padding: 12px 14px; border-radius: 14px; background: #dcf8c6; color: #111827; font-size: 14.5px; line-height: 1.7; overflow-wrap: anywhere; box-shadow: 0 1px 2px rgba(15, 23, 42, .12); }
/* automation rules */
.saas-comm-rules { display: grid; gap: 10px; }
.saas-comm-rule { display: grid; grid-template-columns: minmax(180px, 1.3fr) minmax(120px, .7fr) repeat(2, minmax(170px, 1fr)) minmax(170px, 1fr) auto; gap: 12px; align-items: start; padding: 14px; border: 1px solid var(--saas-line); border-radius: 12px; background: var(--saas-surface); }
.saas-comm-rule__head { display: grid; gap: 6px; }
.saas-comm-rule__cell { display: grid; gap: 8px; min-width: 0; }
.saas-comm-rule__cell .saas-form__field { display: grid; gap: 4px; color: var(--saas-muted); font-size: 13px; font-weight: 600; }
.saas-comm-rule__save { align-self: center; }
@media (max-width: 1400px) {
    .saas-comm-rule { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .saas-comm-rule__head { grid-column: 1 / -1; }
    .saas-comm-flow { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 1100px) {
    .saas-comm-editor, .saas-comm-langs { grid-template-columns: 1fr; }
    .saas-comm-editor__side { position: static; }
}
@media (max-width: 640px) {
    .saas-comm-flow { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .saas-comm-rule { grid-template-columns: 1fr; }
    .saas-comm-nav a { flex: 1 1 calc(50% - 6px); justify-content: center; padding-inline: 8px; font-size: 13.5px; }
    .saas-comm-channel-card { grid-template-columns: auto 1fr; }
    .saas-comm-channel-card > .saas-chip { grid-column: 2; justify-self: start; }
    .saas-comm-preview__frame { height: 360px; }
}

/* ───────── SaaS → إدارة الباقات (owner design 2026-10-14, saas_plans.js) ───────── */
#saas-plans-root .saas-loading { display: grid; place-items: center; min-height: 120px; color: var(--saas-muted); font-size: 1.4rem; }
#saas-plans-root .saas-btn--danger { border-color: #dc2626; background: #dc2626; color: #fff; }
#saas-plans-root .saas-btn--danger:hover { background: #b91c1c; color: #fff; }
.saas-plans-kpis { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.saas-plans-kpi { width: 100%; text-align: start; cursor: pointer; font: inherit; }
.saas-plans-kpi .saas-kpi__body strong { display: block; font-size: 1.6rem; line-height: 1.2; }
.saas-plans-kpi .saas-kpi__body em { color: var(--saas-primary); font-weight: 600; }
.saas-plans-card { padding: 14px 16px; }
.saas-plans-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.saas-plans-toolbar select.saas-input { width: auto; min-width: 150px; }
.saas-plans-toolbar__gap { flex: 1; }
.saas-plans-search { position: relative; flex: 1 1 260px; max-width: 420px; }
.saas-plans-search i { position: absolute; inset-inline-start: 12px; top: 50%; transform: translateY(-50%); color: var(--saas-muted); }
.saas-plans-search input { padding-inline-start: 34px; }
.saas-plans-table td, .saas-plans-table th { white-space: nowrap; vertical-align: middle; }
.saas-plans-table td:nth-child(2) { white-space: normal; min-width: 170px; }
.saas-plans-name { font-weight: 700; text-align: start; }
.saas-plans-desc { display: block; color: var(--saas-muted); font-size: 12.5px; }
.saas-plans-sort { border: 0; background: none; padding: 0; font: inherit; font-weight: 700; color: inherit; cursor: pointer; }
.saas-plans-sort.is-active { color: var(--saas-primary); }
.saas-plans-switch { position: relative; display: inline-block; width: 40px; height: 22px; flex: 0 0 auto; }
.saas-plans-switch input { position: absolute; opacity: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; z-index: 1; }
.saas-plans-switch span, .saas-plans-switch i { position: absolute; inset: 0; border-radius: 999px; background: #cbd5e1; transition: background .15s; }
.saas-plans-switch span::after, .saas-plans-switch i::after { content: ""; position: absolute; top: 3px; inset-inline-start: 3px; width: 16px; height: 16px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.2); transition: inset-inline-start .15s; }
.saas-plans-switch input:checked + span, .saas-plans-toggle input:checked + .saas-plans-switch i { background: var(--saas-primary); }
.saas-plans-switch input:checked + span::after, .saas-plans-toggle input:checked + .saas-plans-switch i::after { inset-inline-start: 21px; }
.saas-plans-menu { position: relative; }
.saas-plans-menu summary { list-style: none; display: grid; place-items: center; width: 32px; height: 32px; border: 1px solid var(--saas-line); border-radius: 9px; cursor: pointer; color: var(--saas-muted); background: #fff; }
.saas-plans-menu summary::-webkit-details-marker { display: none; }
.saas-plans-menu > div { position: absolute; z-index: 1080; min-width: 200px; padding: 6px; display: grid; gap: 2px; background: #fff; border: 1px solid var(--saas-line); border-radius: 12px; box-shadow: 0 16px 40px rgba(15, 23, 42, .16); }
.saas-plans-menu > div button { display: flex; align-items: center; gap: 10px; border: 0; background: none; padding: 8px 10px; border-radius: 8px; font: inherit; font-size: 14px; color: var(--saas-ink); text-align: start; cursor: pointer; white-space: nowrap; }
.saas-plans-menu > div button i { width: 16px; color: var(--saas-primary); }
.saas-plans-menu > div button:hover { background: var(--saas-primary-soft); }
.saas-plans-menu > div button.is-danger, .saas-plans-menu > div button.is-danger i { color: #dc2626; }
.saas-modal.saas-plans-modal { width: min(100%, 1060px); }
.saas-plans-editor { display: grid; grid-template-columns: 230px minmax(0, 1fr); gap: 16px; min-height: 420px; }
.saas-plans-editor > nav { display: grid; align-content: start; gap: 4px; padding-inline-end: 12px; border-inline-end: 1px solid var(--saas-line); }
.saas-plans-editor > nav button { display: flex; align-items: center; gap: 10px; border: 0; background: none; padding: 10px 12px; border-radius: 10px; font: inherit; font-size: 14px; font-weight: 600; color: var(--saas-ink); text-align: start; cursor: pointer; }
.saas-plans-editor > nav button i { width: 18px; color: var(--saas-muted); }
.saas-plans-editor > nav button.is-active { background: var(--saas-primary-soft); color: var(--saas-primary); }
.saas-plans-editor > nav button.is-active i { color: var(--saas-primary); }
.saas-plans-pane h3 { margin: 0 0 12px; font-size: 1.05rem; }
.saas-plans-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 16px; }
.saas-plans-field { display: grid; gap: 6px; align-content: start; font-size: 14px; }
.saas-plans-field > span { font-weight: 600; }
.saas-plans-field > small { color: var(--saas-muted); font-size: 12.5px; }
.saas-plans-field.is-wide { grid-column: span 1; }
.saas-plans-code { display: flex; gap: 6px; }
.saas-plans-code .saas-btn { min-width: 42px; justify-content: center; padding: 8px; }
.saas-plans-toggle { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 4px 10px; padding: 10px 12px; border: 1px solid var(--saas-line); border-radius: 12px; cursor: pointer; }
.saas-plans-toggle > input { position: absolute; opacity: 0; width: 0; height: 0; }
.saas-plans-toggle > b { font-weight: 600; }
.saas-plans-toggle > small { grid-column: 2; color: var(--saas-muted); font-size: 12.5px; }
.saas-plans-note { display: flex; gap: 10px; margin-top: 14px; padding: 10px 12px; border-radius: 12px; background: var(--saas-primary-soft); color: #1e3a8a; font-size: 13.5px; line-height: 1.7; }
.saas-plans-features { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; margin-top: 12px; }
.saas-plans-features.is-off { opacity: .55; }
.saas-plans-features section { border: 1px solid var(--saas-line); border-radius: 12px; padding: 10px 12px; }
.saas-plans-features h4 { margin: 0 0 8px; font-size: .95rem; color: var(--saas-primary); }
.saas-plans-feature label, .saas-plans-sub label { display: flex; align-items: center; gap: 8px; font-size: 14px; cursor: pointer; }
.saas-plans-sub { display: grid; gap: 4px; margin: 4px 0 8px; padding-inline-start: 24px; color: var(--saas-muted); }
.saas-plans-error { margin-top: 12px; padding: 10px 12px; border-radius: 10px; background: #fef2f2; color: #b91c1c; font-weight: 600; }
.saas-plans-confirm { line-height: 1.8; }
#saas-plans-history tr.is-code td { background: #fffbeb; }
@media (max-width: 1100px) { .saas-plans-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 760px) {
    .saas-plans-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .saas-plans-editor { grid-template-columns: 1fr; }
    .saas-plans-editor > nav { grid-auto-flow: column; grid-auto-columns: max-content; overflow-x: auto; padding: 0 0 8px; border-inline-end: 0; border-bottom: 1px solid var(--saas-line); }
    .saas-plans-grid { grid-template-columns: 1fr; }
    .saas-plans-toolbar select.saas-input, .saas-plans-search { flex: 1 1 100%; max-width: none; }
}

/* auth.css */
:root {
    --auth-green: #16a34a;
    --auth-green-dark: #12813d;
    --auth-green-soft: #ecfdf3;
    --auth-navy: #071a2f;
    --auth-navy-soft: #102c49;
    --auth-ink: #14243a;
    --auth-muted: #708096;
    --auth-border: #dfe7ee;
    --auth-surface: #ffffff;
}

body.auth-mode { overflow: hidden; }

.auth-overlay {
    align-items: stretch;
    justify-content: stretch;
    padding: 0;
    color: var(--auth-ink);
    background: #f5f8f8;
    isolation: isolate;
}

.auth-experience {
    width: 100%;
    min-height: 100%;
}

.auth-login-experience {
    display: grid;
    grid-template-columns: minmax(360px, .92fr) minmax(460px, 1.08fr);
    direction: ltr;
    background: #f7faf9;
}

.auth-brand-panel,
.auth-form-panel { direction: rtl; }

.auth-brand-panel {
    position: relative;
    min-height: 100vh;
    overflow: hidden;
    padding: clamp(36px, 6vw, 76px);
    color: #fff;
    background: linear-gradient(150deg, #06182b 0%, #09223a 56%, #0b3b3a 100%);
}

.auth-brand-panel::before {
    position: absolute;
    inset: 0;
    content: '';
    background: linear-gradient(135deg, transparent 40%, rgba(25, 201, 104, .08));
    pointer-events: none;
}

.auth-brand-content {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    min-height: calc(100vh - clamp(72px, 12vw, 152px));
}

.auth-logo {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    width: fit-content;
    color: inherit;
    direction: ltr;
}

.auth-logo > img { display: block; width: 225px; max-width: 100%; height: auto; }
.auth-logo-compact > img { width: 190px; }

.auth-logo-mark {
    display: grid;
    place-items: center;
    width: 46px;
    height: 46px;
    border: 1px solid rgba(255, 255, 255, .24);
    border-radius: 15px;
    color: #fff;
    background: linear-gradient(145deg, #28c76f, #119448);
    box-shadow: 0 12px 30px rgba(13, 173, 83, .28);
    font-size: 1.2rem;
}

.auth-logo-copy { display: grid; line-height: 1; text-align: left; }
.auth-logo-copy strong { font: 800 1.34rem/1 'Inter', sans-serif; letter-spacing: .04em; }
.auth-logo-copy small { margin-top: 5px; color: rgba(255, 255, 255, .62); font: 600 .52rem/1 'Inter', sans-serif; letter-spacing: .21em; }

.auth-logo-compact { color: var(--auth-navy); }
.auth-logo-compact .auth-logo-mark { width: 42px; height: 42px; border-radius: 13px; }
.auth-logo-compact .auth-logo-copy small { color: #8290a2; }

.auth-brand-message {
    width: min(100%, 530px);
    margin: auto 0 42px;
}

.auth-eyebrow,
.auth-card-kicker {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin-bottom: 12px;
    color: #7ce8a8;
    font-size: var(--font-xs);
    font-weight: 700;
    letter-spacing: .02em;
}

.auth-eyebrow::before,
.auth-card-kicker::before {
    width: 22px;
    height: 2px;
    border-radius: 999px;
    content: '';
    background: currentColor;
}

.auth-brand-message h1 {
    margin: 0;
    max-width: 500px;
    color: #fff;
    font-size: var(--font-2xl);
    font-weight: 700;
    line-height: 1.35;
}

.auth-brand-message p {
    max-width: 500px;
    margin: 20px 0 0;
    color: rgba(230, 240, 247, .72);
    font-size: var(--font-md);
    line-height: 1.95;
}

.auth-benefits {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.auth-benefits > div {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    padding: 13px 12px;
    border: 1px solid rgba(255, 255, 255, .11);
    border-radius: 15px;
    background: rgba(255, 255, 255, .055);
    backdrop-filter: blur(8px);
}

.auth-benefits span {
    display: grid;
    flex: 0 0 34px;
    place-items: center;
    width: 34px;
    height: 34px;
    border-radius: 10px;
    color: #7ce8a8;
    background: rgba(25, 201, 104, .12);
}

.auth-benefits strong { overflow: hidden; font-size: var(--font-sm); font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }

.auth-brand-foot {
    position: absolute;
    z-index: 2;
    bottom: 20px;
    inset-inline: 0;
    margin: 0;
    color: rgba(255, 255, 255, .38);
    font-size: var(--font-xs);
    text-align: center;
}

.auth-brand-orb { position: absolute; border-radius: 50%; filter: blur(1px); pointer-events: none; }
.auth-brand-orb-one { top: -120px; left: -120px; width: 330px; height: 330px; border: 1px solid rgba(73, 222, 128, .1); box-shadow: 0 0 100px rgba(22, 163, 74, .08) inset; }
.auth-brand-orb-two { right: -130px; bottom: -180px; width: 400px; height: 400px; background: rgba(22, 163, 74, .07); }

.auth-ledger-grid {
    position: absolute;
    top: 20%;
    right: -7%;
    width: 48%;
    height: 48%;
    opacity: .045;
    transform: rotate(-8deg);
    background-image: linear-gradient(rgba(255,255,255,.9) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.9) 1px, transparent 1px);
    background-size: 32px 32px;
}

.auth-form-panel {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    padding: 38px clamp(28px, 6vw, 92px) 26px;
    background: radial-gradient(circle at 85% 12%, rgba(22, 163, 74, .065), transparent 25%), #f7faf9;
}

.auth-mobile-brand { display: none; width: min(100%, 470px); margin-bottom: 26px; }

.auth-card {
    border: 1px solid rgba(218, 227, 233, .86);
    border-radius: 24px;
    background: var(--auth-surface);
    box-shadow: 0 28px 70px rgba(13, 36, 53, .105);
}

.auth-login-card { width: min(100%, 470px); padding: clamp(30px, 4vw, 48px); }

.auth-card-heading { margin-bottom: 30px; }
.auth-card-heading .auth-card-kicker { margin-bottom: 7px; color: var(--auth-green); }
.auth-card-heading h2 { margin: 0; color: var(--auth-navy); font-size: var(--font-2xl); font-weight: 700; line-height: 1.35; }
.auth-card-heading p { margin: 9px 0 0; color: var(--auth-muted); font-size: var(--font-base); line-height: 1.7; }

.auth-field { min-width: 0; }
.auth-field + .auth-field { margin-top: 18px; }
.auth-form-grid .auth-field + .auth-field { margin-top: 0; }
.auth-field label { display: block; margin-bottom: 8px; color: #34445a; font-size: var(--font-ui); font-weight: 700; }

.auth-control { position: relative; }
.auth-control > i:first-child {
    position: absolute;
    z-index: 2;
    top: 50%;
    right: 16px;
    width: 18px;
    color: #8492a4;
    transform: translateY(-50%);
    text-align: center;
    pointer-events: none;
}

.auth-control input,
.auth-control select {
    width: 100%;
    height: 50px;
    padding: 0 46px 0 16px;
    border: 1px solid var(--auth-border);
    border-radius: 13px;
    outline: 0;
    color: var(--auth-ink);
    background: #fbfcfc;
    font-weight:500;font-size:var(--font-ui);line-height:1;
    transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
}

.auth-control input[dir="ltr"] { text-align: left; }
.auth-control input::placeholder { color: #a5b0bd; font-weight: 400; }
.auth-control select { appearance: none; padding-left: 42px; cursor: pointer; }

.auth-control input:focus,
.auth-control select:focus {
    border-color: #42b86e;
    background: #fff;
    box-shadow: 0 0 0 4px rgba(22, 163, 74, .105);
}

.auth-control input.is-invalid,
.auth-control select.is-invalid { border-color: #e45858; box-shadow: 0 0 0 3px rgba(220, 38, 38, .075); }

.auth-password-toggle {
    position: absolute;
    z-index: 3;
    top: 50%;
    left: 8px;
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    padding: 0;
    border: 0;
    border-radius: 9px;
    color: #728196;
    background: transparent;
    transform: translateY(-50%);
}

.auth-password-toggle:hover,
.auth-password-toggle:focus-visible { color: var(--auth-green-dark); background: var(--auth-green-soft); }
.auth-control-password input { padding-left: 48px; }
.auth-select-arrow { right: auto !important; left: 16px; width: auto !important; font-size: var(--font-ui); }

.auth-field-error {
    display: block;
    min-height: 0;
    margin-top: 5px;
    color: #c73737;
    font-size: var(--font-ui);
    font-weight: 600;
}

.auth-field-error:empty { display: none; }

.auth-options-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin: 16px 0 24px;
}

.auth-check,
.auth-terms-check { display: inline-flex; align-items: center; gap: 8px; color: #627187; font-size: var(--font-ui); cursor: pointer; }
.auth-check input,
.auth-terms-check input { width: 17px; height: 17px; margin: 0; accent-color: var(--auth-green); cursor: pointer; }
.auth-text-link,
.auth-account-switch button {
    padding: 0;
    border: 0;
    color: var(--auth-green-dark);
    background: transparent;
    font-size: var(--font-ui);
    font-weight: 700;
}
.auth-text-link:hover,
.auth-account-switch button:hover { color: #086e32; text-decoration: underline; }

.auth-primary-btn,
.auth-secondary-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 50px;
    padding: 12px 22px;
    border-radius: 13px;
    font-family: inherit;
    font-size: var(--font-ui);
    font-weight: 700;
    transition: transform .17s ease, box-shadow .17s ease, background .17s ease;
}

.auth-primary-btn {
    width: 100%;
    border: 1px solid var(--auth-green);
    color: #fff;
    background: linear-gradient(180deg, #1eae55, #159447);
    box-shadow: 0 11px 24px rgba(22, 163, 74, .2);
}

.auth-primary-btn:hover:not(:disabled) { background: linear-gradient(180deg, #1ba34f, #10823c); box-shadow: 0 14px 30px rgba(22, 163, 74, .25); transform: translateY(-1px); }
.auth-primary-btn:disabled { opacity: .65; cursor: wait; }
.auth-secondary-btn { border: 1px solid #dce4e9; color: #536278; background: #fff; }
.auth-secondary-btn:hover { border-color: #bfcbd3; background: #f8fafb; }

.auth-account-switch {
    display: flex;
    justify-content: center;
    gap: 6px;
    margin-top: 24px;
    padding-top: 22px;
    border-top: 1px solid #edf1f3;
    color: #77869a;
    font-size: var(--font-ui);
}

.auth-security-note {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    margin-top: 17px;
    color: #9aa6b3;
    font-size: var(--font-xs);
}
.auth-security-note i { color: #58b97a; }
.auth-form-foot { margin: 22px 0 0; color: #9aa6b3; font-size: var(--font-xs); text-align: center; }

.auth-alert {
    margin: -8px 0 20px;
    padding: 12px 14px;
    border: 1px solid;
    border-radius: 12px;
    font-size: var(--font-ui);
    line-height: 1.7;
}
.auth-alert-danger { border-color: #fecaca; color: #a72020; background: #fff7f7; }
.auth-error-list { margin: 0; padding-inline-start: 18px; }

.auth-register-experience {
    min-height: 100vh;
    padding: 24px;
    background:
        radial-gradient(circle at 10% 10%, rgba(22, 163, 74, .08), transparent 25%),
        radial-gradient(circle at 90% 85%, rgba(15, 39, 65, .055), transparent 28%),
        #f4f8f6;
}

.auth-register-shell { width: min(100%, 1080px); margin: 0 auto; }
.auth-register-topbar { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 20px; padding: 0 4px; }
.auth-back-login { display: inline-flex; align-items: center; gap: 8px; padding: 9px 14px; border: 1px solid #d9e3e6; border-radius: 11px; color: #5f6d80; background: rgba(255,255,255,.82); font-size: var(--font-sm); font-weight: 700; }
.auth-back-login:hover { border-color: #bcd4c4; color: var(--auth-green-dark); background: #fff; }

.auth-register-card { width: 100%; padding: clamp(25px, 4vw, 44px) clamp(22px, 5vw, 58px); }
.auth-register-heading { margin-bottom: 26px; text-align: center; }
.auth-register-heading .auth-card-kicker { justify-content: center; }

.auth-stepper {
    position: relative;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
    margin: 0 0 34px;
    padding: 0;
    list-style: none;
}

.auth-stepper::before {
    position: absolute;
    z-index: 0;
    top: 21px;
    right: 16.6%;
    left: 16.6%;
    height: 1px;
    content: '';
    background: #dce5e5;
}

.auth-stepper li { position: relative; z-index: 1; display: flex; align-items: center; justify-content: center; gap: 10px; min-width: 0; color: #8a98a9; }
.auth-stepper li > span { display: grid; flex: 0 0 42px; place-items: center; width: 42px; height: 42px; border: 1px solid #dbe4e6; border-radius: 14px; color: #7d8b9c; background: #f8faf9; font-weight:700;font-size:var(--font-ui);line-height:1; }
.auth-stepper li > div { display: grid; min-width: 0; }
.auth-stepper strong { font-size: var(--font-sm); }
.auth-stepper small { margin-top: 2px; font-size: var(--font-xs); }
.auth-stepper li.is-active { color: var(--auth-green-dark); }
.auth-stepper li.is-active > span { border-color: var(--auth-green); color: #fff; background: var(--auth-green); box-shadow: 0 7px 18px rgba(22,163,74,.2); }
.auth-stepper li.is-complete > span { border-color: #bce5cb; color: var(--auth-green-dark); background: #eaf9ef; }
.auth-stepper li.is-complete > span { font-size: 0; }
.auth-stepper li.is-complete > span::after { content: '\f00c'; font: 900 .78rem/1 'Font Awesome 6 Free'; }

.auth-step-panel { animation: authPanelIn .22s ease both; }
@keyframes authPanelIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }

.auth-section-heading { display: flex; align-items: center; gap: 12px; margin-bottom: 24px; }
.auth-section-heading > span { display: grid; flex: 0 0 42px; place-items: center; width: 42px; height: 42px; border-radius: 13px; color: var(--auth-green-dark); background: var(--auth-green-soft); }
.auth-section-heading h3 { margin: 0; color: var(--auth-navy); font-size: var(--font-md); font-weight: 700; }
.auth-section-heading p { margin: 3px 0 0; color: var(--auth-muted); font-size: var(--font-sm); }

.auth-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.auth-required { color: #d43c3c; }
.auth-honeypot { position: absolute !important; inset-inline-start: -10000px !important; opacity: 0 !important; pointer-events: none !important; }

.auth-password-rules { display: flex; flex-wrap: wrap; gap: 8px 16px; margin-top: 18px; padding: 13px 15px; border: 1px solid #edf0f2; border-radius: 12px; background: #fafcfc; }
.auth-password-rules span { display: inline-flex; align-items: center; gap: 6px; color: #8a97a7; font-size: var(--font-sm); }
.auth-password-rules i { color: #cbd3da; }
.auth-password-rules span.is-valid { color: #27834a; }
.auth-password-rules span.is-valid i { color: #22a95a; }

.auth-step-actions { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-top: 30px; padding-top: 24px; border-top: 1px solid #edf1f2; }
.auth-step-actions .auth-primary-btn,
.auth-step-actions .auth-secondary-btn { width: auto; min-width: 142px; }
.auth-step-actions-first { justify-content: flex-end; }

.auth-registration-summary { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 11px; }
.auth-registration-summary > div { display: flex; align-items: center; gap: 11px; min-width: 0; padding: 14px; border: 1px solid #e5ebed; border-radius: 13px; background: #fbfcfc; }
.auth-registration-summary > div > span { display: grid; flex: 0 0 36px; place-items: center; width: 36px; height: 36px; border-radius: 10px; color: var(--auth-green-dark); background: var(--auth-green-soft); }
.auth-registration-summary p { display: grid; min-width: 0; margin: 0; }
.auth-registration-summary small { color: #8a97a7; font-size: var(--font-xs); }
.auth-registration-summary strong { overflow: hidden; margin-top: 2px; color: #34445a; font-size: var(--font-sm); text-overflow: ellipsis; white-space: nowrap; }

.auth-zatca-benefit { display: flex; align-items: center; gap: 12px; margin: 16px 0; padding: 14px 16px; border: 1px solid #d9eee0; border-radius: 14px; background: #f5fcf7; }
.auth-zatca-benefit > span { display: grid; flex: 0 0 38px; place-items: center; width: 38px; height: 38px; border-radius: 11px; color: #fff; background: var(--auth-green); }
.auth-zatca-benefit strong { color: #22693b; font-size: var(--font-sm); }
.auth-zatca-benefit p { margin: 3px 0 0; color: #6f8577; font-size: var(--font-sm); line-height: 1.55; }
.auth-terms-check { width: fit-content; margin-top: 3px; color: #536278; font-weight: 600; }

.auth-success-shell { display: grid; min-height: calc(100vh - 48px); place-items: center; }
.auth-success-card { width: min(100%, 520px); padding: 52px 44px; text-align: center; }
.auth-success-card .auth-card-kicker { justify-content: center; color: var(--auth-green); }
.auth-success-card h2 { margin: 3px 0 8px; color: var(--auth-navy); font-size: var(--font-2xl); font-weight: 700; }
.auth-success-card > p { margin: 0 auto 22px; max-width: 390px; color: var(--auth-muted); line-height: 1.8; }
.auth-success-icon { display: grid; place-items: center; width: 76px; height: 76px; margin: 0 auto 20px; border: 8px solid #e8f8ed; border-radius: 24px; color: #fff; background: var(--auth-green); font-size: 1.6rem; }
.auth-success-meta { display: inline-flex; align-items: center; gap: 7px; margin-bottom: 24px; padding: 9px 13px; border-radius: 999px; color: #2f7948; background: #effaf3; font-size: var(--font-xs); font-weight: 700; }
.auth-field-hint { display: block; margin-top: 6px; color: var(--auth-muted); font-size: var(--font-xs); line-height: 1.5; }
.auth-tenant-url { display: flex; align-items: center; justify-content: center; gap: 8px; margin: 0 auto 8px; padding: 12px 16px; border: 1px solid #cbd9ff; border-radius: 12px; color: var(--auth-blue); background: #f5f8ff; font-weight: 700; text-decoration: none; overflow-wrap: anywhere; }
.auth-tenant-url:hover { color: #1547b9; border-color: #8dabff; background: #edf3ff; }
.auth-tenant-note { display: block; margin: 0 auto 18px; max-width: 410px; color: var(--auth-muted); line-height: 1.7; }

/* Post-registration preparation screen («جاري تجهيز شركتك...»): bilingual, 10-second countdown, the five real stages. */
.auth-provisioning {
    --prov-blue: #2563eb;
    --prov-blue-dark: #1d4ed8;
    --prov-blue-soft: #eaf1ff;
    --prov-blue-line: #cfdefb;
    --prov-navy: #0f2a5c;
    --prov-muted: #64748b;
    --prov-line: #e2e9f4;
    min-height: 100vh;
    padding: 18px 24px 32px;
    overflow-x: hidden;
    color: var(--auth-ink);
    background:
        radial-gradient(ellipse at 12% 18%, rgba(37, 99, 235, .09), transparent 42%),
        radial-gradient(ellipse at 88% 82%, rgba(37, 99, 235, .07), transparent 40%),
        linear-gradient(180deg, #f8fbff 0%, #eef4fd 100%);
}
.auth-provisioning__sr { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.auth-provisioning__top { position: relative; display: flex; align-items: center; justify-content: center; width: min(100%, 1040px); min-height: 56px; margin: 0 auto 12px; }
.auth-provisioning__top .auth-logo-compact > img { width: 176px; }
.auth-provisioning__language { position: absolute; inset-inline-start: 0; top: 50%; display: inline-flex; gap: 2px; padding: 4px; border: 1px solid #dde6f3; border-radius: 999px; background: #edf2f9; transform: translateY(-50%); }
.auth-provisioning__language button { min-width: 78px; padding: 7px 16px; border: 0; border-radius: 999px; color: #475569; background: transparent; font: inherit; font-size: var(--font-sm); font-weight: 700; cursor: pointer; }
.auth-provisioning__language button[aria-pressed="true"] { color: #fff; background: var(--prov-blue); box-shadow: 0 6px 14px rgba(37, 99, 235, .25); }
.auth-provisioning__language button:focus-visible { outline: 3px solid rgba(37, 99, 235, .3); outline-offset: 2px; }
.auth-provisioning__card { width: min(100%, 1000px); margin: 0 auto; padding: 22px 34px 26px; border: 1px solid rgba(214, 226, 243, .9); border-radius: 28px; background: rgba(255, 255, 255, .94); box-shadow: 0 30px 70px rgba(30, 64, 125, .1); text-align: center; }
.auth-provisioning__art svg { display: block; width: min(100%, 290px); height: auto; margin: 0 auto 2px; }
/* Each line carries its own dir (bilingual); keep the alignment above user-preferences.css `html[dir=rtl] [dir=ltr]`. */
.auth-provisioning .auth-provisioning__heading > [dir],
.auth-provisioning .auth-provisioning__countdown-value > [dir],
.auth-provisioning .auth-provisioning__stage-label > [dir] { text-align: center; }
.auth-provisioning__title { margin: 0; color: var(--prov-navy); font-size: clamp(1.45rem, 1.05rem + 1.5vw, 2.1rem); font-weight: 800; line-height: 1.35; }
.auth-provisioning__title:focus { outline: none; }
.auth-provisioning__title-alt { margin: 4px 0 0; color: #475569; font-size: var(--font-md); font-weight: 600; }
.auth-provisioning__text { max-width: 640px; margin: 12px auto 0; color: #334155; font-size: var(--font-base); line-height: 1.75; }
.auth-provisioning__text-alt { max-width: 640px; margin: 2px auto 0; color: var(--prov-muted); font-size: var(--font-sm); line-height: 1.6; }
.auth-provisioning__meter { display: grid; place-items: center; min-height: 132px; margin: 12px 0 14px; }
.auth-provisioning__countdown { position: relative; width: 136px; height: 136px; }
.auth-provisioning__countdown svg { display: block; width: 100%; height: 100%; transform: rotate(-90deg); }
.auth-provisioning__ring-track,
.auth-provisioning__ring-value { fill: none; stroke-width: 8; }
.auth-provisioning__ring-track { stroke: #e6edf7; }
.auth-provisioning__ring-value { stroke: var(--prov-blue); stroke-linecap: round; stroke-dasharray: 326.73; stroke-dashoffset: 326.73; transition: stroke-dashoffset 1s linear; }
.auth-provisioning__countdown-value { position: absolute; inset: 0; display: grid; place-content: center; gap: 1px; line-height: 1.15; }
.auth-provisioning__countdown-value strong { color: var(--prov-navy); font-size: 2.45rem; font-weight: 800; font-variant-numeric: tabular-nums; }
.auth-provisioning__countdown-label { color: var(--prov-navy); font-size: .74rem; font-weight: 700; }
.auth-provisioning__countdown-alt { color: var(--prov-muted); font-size: .6rem; }
.auth-provisioning__spinner { width: 76px; height: 76px; border: 7px solid #e6edf7; border-top-color: var(--prov-blue); border-radius: 50%; animation: auth-provisioning-spin 1.1s linear infinite; }
.auth-provisioning__badge { display: grid; place-items: center; width: 86px; height: 86px; border: 9px solid #e7f7ed; border-radius: 50%; color: #fff; background: #16a34a; font-size: 1.7rem; }
.auth-provisioning__badge.is-danger { border-color: #fdecec; background: #dc2626; }
.auth-provisioning__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin: 0 0 20px; }
.auth-provisioning__actions .auth-primary-btn,
.auth-provisioning__actions .auth-secondary-btn { width: auto; min-width: 170px; min-height: 46px; text-decoration: none; }
.auth-provisioning__actions .auth-primary-btn { border-color: var(--prov-blue); background: linear-gradient(180deg, #3b7bf0, var(--prov-blue-dark)); box-shadow: 0 11px 24px rgba(37, 99, 235, .22); }
.auth-provisioning__actions .auth-primary-btn:hover:not(:disabled) { background: linear-gradient(180deg, #2f6fe6, #1a44c2); box-shadow: 0 14px 30px rgba(37, 99, 235, .28); }
.auth-provisioning .auth-alert { max-width: 620px; margin: 0 auto 16px; }
.auth-provisioning__stages { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; margin: 0; padding: 20px 12px 16px; border: 1px solid var(--prov-line); border-radius: 20px; background: #fbfdff; list-style: none; }
.auth-provisioning__stages li { position: relative; display: grid; justify-items: center; align-content: start; gap: 8px; min-width: 0; }
.auth-provisioning__stages li + li::before { content: ''; position: absolute; top: 24px; inset-inline-start: calc(-50% + 22px); width: calc(100% - 52px); height: 2px; border-radius: 2px; background: var(--prov-line); }
.auth-provisioning__stages li.is-complete::before,
.auth-provisioning__stages li.is-active::before { background: var(--prov-blue); }
.auth-provisioning__stage-icon { position: relative; z-index: 1; display: grid; place-items: center; width: 50px; height: 50px; border: 1px solid var(--prov-blue-line); border-radius: 50%; color: var(--prov-blue); background: var(--prov-blue-soft); font-size: 1.1rem; }
.auth-provisioning__stages li.is-active .auth-provisioning__stage-icon { border: 2px solid var(--prov-blue); background: #fff; box-shadow: 0 0 0 5px rgba(37, 99, 235, .1); }
.auth-provisioning__stages li.is-pending .auth-provisioning__stage-icon { border-color: #dfe6ef; color: #94a3b8; background: #f3f6fa; }
.auth-provisioning__stages li.is-failed .auth-provisioning__stage-icon { border-color: #fecaca; color: #b91c1c; background: #fff5f5; }
.auth-provisioning__stage-label { display: grid; gap: 2px; min-width: 0; }
.auth-provisioning__stage-name { color: var(--prov-navy); font-size: .84rem; font-weight: 700; line-height: 1.4; }
.auth-provisioning__stage-alt { color: var(--prov-muted); font-size: .7rem; line-height: 1.35; }
.auth-provisioning__stages li.is-pending .auth-provisioning__stage-name { color: #64748b; }
.auth-provisioning__stage-mark { display: grid; place-items: center; width: 24px; height: 24px; border: 2px solid #cbd5e1; border-radius: 50%; color: #fff; font-size: .7rem; }
.auth-provisioning__stages li.is-complete .auth-provisioning__stage-mark { border-color: #16a34a; background: #16a34a; }
.auth-provisioning__stages li.is-active .auth-provisioning__stage-mark { border: 0; }
.auth-provisioning__stages li.is-failed .auth-provisioning__stage-mark { border-color: #dc2626; background: #dc2626; }
.auth-provisioning__dots { width: 22px; height: 22px; border: 3px dotted var(--prov-blue); border-radius: 50%; animation: auth-provisioning-spin 2.4s linear infinite; }
.auth-provisioning__notice { display: flex; align-items: center; gap: 12px; margin: 16px 0 0; padding: 13px 18px; border: 1px solid var(--prov-blue-line); border-radius: 14px; background: #eef4ff; text-align: start; }
.auth-provisioning__notice > i { display: grid; flex: 0 0 30px; place-items: center; width: 30px; height: 30px; border-radius: 50%; color: #fff; background: var(--prov-blue); font-size: .8rem; }
.auth-provisioning__notice > span { display: grid; gap: 2px; min-width: 0; }
.auth-provisioning .auth-provisioning__notice > span > [dir] { text-align: start; }
.auth-provisioning__notice-text { color: #1e3a6b; font-size: var(--font-sm); font-weight: 600; line-height: 1.6; }
.auth-provisioning__notice-alt { color: var(--prov-muted); font-size: .72rem; line-height: 1.5; }
@keyframes auth-provisioning-spin { to { transform: rotate(360deg); } }

@media (max-width: 760px) {
    .auth-provisioning { padding: 12px 12px 24px; }
    .auth-provisioning__top { justify-content: space-between; gap: 10px; margin-bottom: 12px; }
    .auth-provisioning__top .auth-logo-compact > img { width: 140px; }
    .auth-provisioning__language { position: static; transform: none; }
    .auth-provisioning__language button { min-width: 0; padding: 6px 12px; }
    .auth-provisioning__card { padding: 20px 16px 20px; border-radius: 22px; }
    .auth-provisioning__art svg { width: min(100%, 240px); }
    .auth-provisioning__countdown { width: 118px; height: 118px; }
    .auth-provisioning__countdown-value strong { font-size: 2.2rem; }
    .auth-provisioning__stages { grid-template-columns: 1fr; gap: 0; padding: 8px 14px; text-align: start; }
    .auth-provisioning__stages li { grid-template-columns: 40px minmax(0, 1fr) 24px; align-items: center; justify-items: start; gap: 12px; padding: 9px 0; }
    .auth-provisioning .auth-provisioning__stage-label > [dir] { text-align: start; }
    .auth-provisioning__stages li + li { border-top: 1px dashed var(--prov-line); }
    .auth-provisioning__stages li + li::before { display: none; }
    .auth-provisioning__stage-icon { width: 40px; height: 40px; font-size: .92rem; }
    .auth-provisioning__actions .auth-primary-btn,
    .auth-provisioning__actions .auth-secondary-btn { flex: 1 1 100%; }
}

@media (prefers-reduced-motion: reduce) {
    .auth-provisioning__ring-value { transition: none; }
    .auth-provisioning__spinner { animation-duration: 3s; }
    .auth-provisioning__dots { animation: none; }
}

.auth-overlay > .auth-card { align-self: center; width: min(calc(100% - 32px), 440px); margin: auto; padding: 32px; }

.auth-primary-btn:focus-visible,
.auth-secondary-btn:focus-visible,
.auth-back-login:focus-visible,
.auth-text-link:focus-visible,
.auth-account-switch button:focus-visible,
.auth-check input:focus-visible,
.auth-terms-check input:focus-visible {
    outline: 3px solid rgba(22, 163, 74, .25);
    outline-offset: 2px;
}

@media (max-width: 1080px) {
    .auth-login-experience { grid-template-columns: minmax(320px, .78fr) minmax(430px, 1.22fr); }
    .auth-brand-panel { padding: 42px 36px; }
    .auth-benefits { grid-template-columns: 1fr; }
    .auth-benefits > div { width: min(100%, 260px); }
}

@media (max-width: 800px) {
    body.auth-mode { overflow: auto; }
    .auth-overlay { overflow-y: auto; }
    .auth-login-experience { display: block; min-height: 100%; }
    .auth-brand-panel { display: none; }
    .auth-form-panel { justify-content: flex-start; min-height: 100%; padding: 26px 18px 22px; }
    .auth-mobile-brand { display: block; }
    .auth-login-card { margin: auto 0; }
    .auth-register-experience { padding: 16px; }
    .auth-register-card { border-radius: 20px; }
    .auth-stepper li { flex-direction: column; gap: 5px; text-align: center; }
    .auth-stepper li > div { display: block; }
    .auth-stepper small { display: none; }
    .auth-stepper::before { top: 21px; }
}

@media (max-width: 600px) {
    .auth-form-panel { padding: 20px 12px 16px; }
    .auth-mobile-brand { margin-bottom: 18px; padding-inline: 6px; }
    .auth-login-card { padding: 28px 22px; border-radius: 20px; }
    .auth-card-heading { margin-bottom: 24px; }
    .auth-options-row { align-items: flex-start; }
    .auth-register-experience { padding: 10px; }
    .auth-register-topbar { margin-bottom: 12px; }
    .auth-back-login { padding: 8px; font-size: 0; }
    .auth-back-login i { margin: 0; font-size: .85rem; }
    .auth-register-card { padding: 24px 17px; border-radius: 18px; }
    .auth-register-heading { text-align: right; }
    .auth-register-heading .auth-card-kicker { justify-content: flex-start; }
    .auth-stepper { gap: 4px; margin-bottom: 28px; }
    .auth-stepper li > span { flex-basis: 36px; width: 36px; height: 36px; border-radius: 11px; }
    .auth-stepper::before { top: 18px; right: 16%; left: 16%; }
    .auth-stepper strong { font-size: var(--font-xs); }
    .auth-section-heading { align-items: flex-start; }
    .auth-form-grid { grid-template-columns: 1fr; gap: 14px; }
    .auth-registration-summary { grid-template-columns: 1fr; }
    .auth-step-actions { display: grid; grid-template-columns: 1fr 1fr; }
    .auth-step-actions .auth-primary-btn,
    .auth-step-actions .auth-secondary-btn { width: 100%; min-width: 0; padding-inline: 10px; }
    .auth-step-actions-first { display: block; }
    .auth-step-actions-first .auth-primary-btn { width: 100%; }
    .auth-success-card { padding: 40px 22px; }
}

@media (max-width: 380px) {
    .auth-options-row { flex-direction: column; gap: 10px; }
    .auth-account-switch { flex-wrap: wrap; }
    .auth-stepper strong { font-size: var(--font-xs); }
}

@media (prefers-reduced-motion: reduce) {
    .auth-step-panel,
    .auth-primary-btn,
    .auth-secondary-btn,
    .auth-control input,
    .auth-control select { animation: none; transition: none; }
}

/* pos.css */
/* Point of sale — mobile-first (catalog / cart / payment / success as full screens), split view from 768px. */
:root {
    --pos-bg: #f4f6fb;
    --pos-surface: #ffffff;
    --pos-line: #e5e9f2;
    --pos-ink: #0f172a;
    --pos-muted: #64748b;
    --pos-primary: var(--primary, #2563eb);
    --pos-primary-soft: #eff6ff;
    --pos-success: #16a34a;
    --pos-danger: #dc2626;
    --pos-radius: 14px;
    --pos-header-height: 60px;
    --pos-safe-bottom: env(safe-area-inset-bottom, 0px);
}

body.pos-active { overflow: hidden; }
body.pos-active .sidebar, body.pos-active .topbar, body.pos-active #subscription-banner, body.pos-active .subscription-banner { display: none; }
body.pos-active .main-wrapper { margin: 0; width: 100%; min-height: 0; }
body.pos-active .main-content { padding: 0; max-width: none; overflow: hidden; }

.pos-screen { position: relative; height: 100vh; height: 100dvh; display: flex; flex-direction: column; background: var(--pos-bg); color: var(--pos-ink); overflow: hidden; }
.pos-screen *, .pos-screen *::before, .pos-screen *::after { box-sizing: border-box; }
.pos-screen button, .pos-screen input, .pos-screen select, .pos-screen textarea { font-family: inherit; }
.pos-screen h2, .pos-screen h3, .pos-screen h4, .pos-screen p { margin: 0; }
html[dir="ltr"] .pos-flip { transform: scaleX(-1); }
.pos-loading, .pos-fatal { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; text-align: center; padding: 24px; }
.pos-loading i { font-size: 34px; color: var(--pos-primary); }
.pos-fatal i { font-size: 46px; color: var(--pos-danger); }
.pos-fatal p { color: var(--pos-muted); max-width: 420px; }

/* buttons */
.pos-button { min-height: 50px; padding: 0 18px; border-radius: var(--pos-radius); border: 1px solid transparent; display: inline-flex; align-items: center; justify-content: center; gap: 8px; font-weight: 800; font-size: 15px; cursor: pointer; text-decoration: none; transition: transform .12s ease, box-shadow .12s ease, background .12s ease; }
.pos-button--primary { background: var(--pos-primary); color: #fff; box-shadow: 0 8px 20px rgba(37, 99, 235, .25); }
.pos-button--primary:hover { color: #fff; background: var(--primary-hover, #1d4ed8); }
.pos-button--ghost { background: var(--pos-surface); color: var(--pos-ink); border-color: var(--pos-line); }
.pos-button--ghost:hover { border-color: #bfd3f2; color: var(--pos-primary); }
.pos-button--danger { background: var(--pos-danger); color: #fff; }
.pos-button:disabled { opacity: .55; cursor: not-allowed; box-shadow: none; }
.pos-icon-button { width: 40px; height: 40px; flex: 0 0 auto; display: inline-grid; place-items: center; border-radius: 12px; border: 1px solid var(--pos-line); background: var(--pos-surface); color: var(--pos-ink); font-size: 15px; cursor: pointer; }
.pos-icon-button--danger { color: var(--pos-danger); }
.pos-link-button { border: 0; background: transparent; color: var(--pos-primary); font-weight: 700; display: inline-flex; align-items: center; gap: 6px; padding: 8px 0; cursor: pointer; }

/* header */
.pos-header { height: var(--pos-header-height); flex: 0 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 0 14px; background: var(--pos-surface); border-bottom: 1px solid var(--pos-line); z-index: 20; }
.pos-header__branch { position: relative; display: flex; align-items: center; gap: 8px; height: 40px; padding: 0 12px; border: 1px solid var(--pos-line); border-radius: 12px; background: #f8fafc; color: var(--pos-ink); max-width: 46vw; }
.pos-header__branch i { color: var(--pos-primary); font-size: 13px; }
.pos-header__branch select { appearance: none; border: 0; background: transparent; font-weight: 700; font-size: 13.5px; color: inherit; padding-inline-end: 18px; max-width: 100%; text-overflow: ellipsis; }
.pos-header__branch select:disabled { opacity: 1; }
.pos-header__caret { position: absolute; inset-inline-end: 12px; font-size: 11px; color: var(--pos-muted); pointer-events: none; }
.pos-header__tools { display: none; align-items: center; gap: 8px; flex: 1; justify-content: center; min-width: 0; }
.pos-tool { display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 12px; border: 1px solid var(--pos-line); border-radius: 12px; background: var(--pos-surface); color: #334155; font-weight: 700; font-size: 13px; cursor: pointer; white-space: nowrap; }
.pos-tool.is-active { border-color: #bbf7d0; background: #f0fdf4; color: #15803d; }
.pos-tool--static { cursor: default; background: #f8fafc; }
.pos-header__brand { display: flex; align-items: center; gap: 10px; }
.pos-header__brand > div { display: flex; flex-direction: column; align-items: flex-end; line-height: 1.2; }
.pos-header__brand strong { font-size: 15px; letter-spacing: .01em; }
.pos-status { display: inline-flex; align-items: center; gap: 5px; font-size: 11px; font-weight: 700; }
.pos-status i { font-size: 7px; }
.pos-status.is-online { color: var(--pos-success); }
.pos-status.is-offline { color: var(--pos-danger); }

/* menu drawer */
.pos-menu-backdrop { position: fixed; inset: 0; z-index: 50; background: rgba(15, 23, 42, .45); opacity: 0; pointer-events: none; transition: opacity .2s; }
.pos-menu { position: fixed; top: 0; bottom: 0; inset-inline-end: 0; z-index: 55; width: min(300px, 84vw); display: flex; flex-direction: column; gap: 4px; padding: 18px 14px calc(18px + var(--pos-safe-bottom)); background: var(--pos-surface); box-shadow: 0 0 60px rgba(15, 23, 42, .2); transform: translateX(-100%); transition: transform .26s cubic-bezier(.22, 1, .36, 1); overflow-y: auto; }
html[dir="ltr"] .pos-menu { transform: translateX(100%); }
.pos-menu-open .pos-menu { transform: none; }
.pos-menu-open .pos-menu-backdrop { opacity: 1; pointer-events: auto; }
.pos-menu__head { display: flex; flex-direction: column; gap: 2px; padding: 6px 10px 14px; border-bottom: 1px solid var(--pos-line); margin-bottom: 8px; }
.pos-menu__head span { color: var(--pos-muted); font-size: 12.5px; }
.pos-menu > button, .pos-menu > a { display: flex; align-items: center; gap: 12px; width: 100%; padding: 12px 10px; border: 0; border-radius: 12px; background: transparent; color: var(--pos-ink); font-weight: 700; font-size: 14px; text-align: start; text-decoration: none; cursor: pointer; }
.pos-menu > button:hover, .pos-menu > a:hover { background: var(--pos-primary-soft); color: var(--pos-primary); }
.pos-menu > button i, .pos-menu > a i { width: 22px; text-align: center; color: var(--pos-primary); }
.pos-menu__foot { margin-top: auto; display: flex; gap: 8px; align-items: flex-start; padding: 12px 10px 0; border-top: 1px solid var(--pos-line); color: var(--pos-muted); font-size: 12px; }

/* main */
.pos-main { position: relative; flex: 1; min-height: 0; display: flex; flex-direction: column; }
.pos-catalog { flex: 1; min-height: 0; display: flex; flex-direction: column; gap: 10px; padding: 12px 14px 0; }
.pos-warning { display: flex; align-items: center; gap: 9px; padding: 10px 12px; border: 1px solid #fbbf24; border-radius: 12px; color: #92400e; background: #fffbeb; font-size: 13px; }
.pos-warning i { color: #d97706; }
.pos-search { flex: 0 0 auto; height: 50px; display: flex; align-items: center; gap: 8px; padding: 0 10px 0 12px; background: var(--pos-surface); border: 1px solid var(--pos-line); border-radius: var(--pos-radius); }
.pos-search > i { color: var(--pos-muted); }
.pos-search input { flex: 1; min-width: 0; border: 0; background: transparent; outline: 0; font-size: 14.5px; color: var(--pos-ink); }
.pos-search input::placeholder { color: #94a3b8; }
.pos-search__scan { width: 38px; height: 38px; border: 0; border-radius: 10px; background: var(--pos-primary-soft); color: var(--pos-primary); font-size: 17px; cursor: pointer; }
.pos-search--inline { margin-bottom: 12px; }
.pos-order-types { flex: 0 0 auto; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px; padding: 4px; background: var(--pos-surface); border: 1px solid var(--pos-line); border-radius: var(--pos-radius); }
.pos-order-types button { min-height: 40px; border: 0; border-radius: 10px; background: transparent; color: #475569; font-weight: 700; font-size: 13.5px; cursor: pointer; transition: background .15s, color .15s; }
.pos-order-types button.is-active { background: var(--pos-primary); color: #fff; box-shadow: 0 6px 14px rgba(37, 99, 235, .25); }
.pos-categories { flex: 0 0 auto; display: flex; gap: 8px; overflow-x: auto; padding: 2px 0 4px; scrollbar-width: none; }
.pos-categories::-webkit-scrollbar { display: none; }
.pos-category { flex: 0 0 auto; min-width: 74px; display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 8px 10px; border: 1px solid var(--pos-line); border-radius: var(--pos-radius); background: var(--pos-surface); color: #334155; font-weight: 700; font-size: 12.5px; cursor: pointer; transition: background .15s, color .15s, border-color .15s; }
.pos-category__icon { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 10px; background: #f1f5f9; color: var(--pos-primary); overflow: hidden; }
.pos-category__icon img { width: 100%; height: 100%; object-fit: cover; }
.pos-category__name { max-width: 110px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pos-category.is-active { background: var(--pos-primary); border-color: var(--pos-primary); color: #fff; box-shadow: 0 8px 18px rgba(37, 99, 235, .28); }
.pos-category.is-active .pos-category__icon { background: rgba(255, 255, 255, .22); color: #fff; }
.pos-products { flex: 1; min-height: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: max-content; gap: 10px; align-content: start; overflow-y: auto; padding: 2px 0 calc(92px + var(--pos-safe-bottom)); }
.pos-product { display: flex; flex-direction: column; background: var(--pos-surface); border: 1px solid var(--pos-line); border-radius: 16px; overflow: hidden; transition: transform .12s ease, box-shadow .12s ease; }
.pos-product:hover { box-shadow: 0 10px 22px rgba(15, 23, 42, .08); }
.pos-product__body { display: flex; flex-direction: column; width: 100%; padding: 0; border: 0; background: transparent; color: inherit; text-align: start; cursor: pointer; }
.pos-product__image { position: relative; display: grid; place-items: center; aspect-ratio: 4 / 3; background: #f1f5f9; color: #94a3b8; font-size: 30px; overflow: hidden; }
.pos-product__image img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.pos-product__image em { position: absolute; inset-inline: 8px; bottom: 8px; padding: 5px 8px; border-radius: 8px; background: rgba(15, 23, 42, .74); color: #fff; font-style: normal; font-size: 11.5px; font-weight: 700; text-align: center; }
.pos-product__name { padding: 10px 10px 4px; font-weight: 700; font-size: 13.5px; line-height: 1.35; min-height: 40px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.pos-product__foot { display: flex; align-items: center; justify-content: space-between; gap: 6px; padding: 0 10px 10px; }
.pos-product__price { font-weight: 800; font-size: 13.5px; color: var(--pos-ink); white-space: nowrap; }
.pos-product__add { width: 34px; height: 34px; flex: 0 0 auto; border: 0; border-radius: 50%; background: var(--pos-primary); color: #fff; font-size: 14px; cursor: pointer; box-shadow: 0 6px 14px rgba(37, 99, 235, .3); }
.pos-product__add:disabled, .pos-product__body:disabled { cursor: not-allowed; }
.pos-product.is-sold-out { opacity: .72; }
.pos-product.is-sold-out .pos-product__image img { filter: grayscale(1); }
.pos-product.is-sold-out .pos-product__add { background: #cbd5e1; box-shadow: none; }
.pos-empty { grid-column: 1 / -1; min-height: 220px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; color: #94a3b8; text-align: center; padding: 20px; }
.pos-empty i { font-size: 40px; }
.pos-empty strong { color: #475569; }
.pos-empty--compact { min-height: 120px; }

/* fixed cart bar (phones) */
.pos-cart-bar { position: fixed; inset-inline: 12px; bottom: calc(12px + var(--pos-safe-bottom)); z-index: 30; display: flex; align-items: center; gap: 12px; min-height: 60px; padding: 8px 14px; border: 0; border-radius: 16px; background: var(--pos-primary); color: #fff; box-shadow: 0 14px 30px rgba(37, 99, 235, .38); cursor: pointer; text-align: start; }
.pos-cart-bar.is-hidden, .pos-screen:not([data-view="catalog"]) .pos-cart-bar { display: none; }
.pos-cart-bar.is-bump { animation: pos-bump .35s ease; }
@keyframes pos-bump { 30% { transform: scale(1.03); } 100% { transform: none; } }
.pos-cart-bar__icon { position: relative; width: 42px; height: 42px; display: grid; place-items: center; border-radius: 12px; background: rgba(255, 255, 255, .18); font-size: 18px; }
.pos-cart-bar__icon b { position: absolute; top: -6px; inset-inline-end: -6px; min-width: 20px; height: 20px; padding: 0 5px; border-radius: 10px; background: #fff; color: var(--pos-primary); font-size: 11px; display: grid; place-items: center; }
.pos-cart-bar__text { flex: 1; display: flex; flex-direction: column; line-height: 1.25; }
.pos-cart-bar__text strong { font-size: 14px; }
.pos-cart-bar__text span { font-size: 15px; font-weight: 800; }
.pos-cart-bar__arrow { font-size: 14px; opacity: .9; }
html[dir="ltr"] .pos-cart-bar__arrow { transform: scaleX(-1); }

/* stacked screens (phones): cart, payment, success */
.pos-cart, .pos-payment, .pos-success { position: fixed; inset: 0; z-index: 40; display: flex; flex-direction: column; background: var(--pos-bg); opacity: 0; visibility: hidden; transform: translateY(18px); transition: opacity .22s ease, transform .22s ease, visibility 0s linear .22s; }
.pos-screen[data-view="cart"] .pos-cart, .pos-screen[data-view="payment"] .pos-payment, .pos-screen[data-view="success"] .pos-success { opacity: 1; visibility: visible; transform: none; transition-delay: 0s; }
.pos-cart__head, .pos-panel__head { flex: 0 0 auto; height: var(--pos-header-height); display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 0 12px; background: var(--pos-surface); border-bottom: 1px solid var(--pos-line); }
.pos-cart__head strong, .pos-panel__head strong { font-size: 16px; }
.pos-cart__body, .pos-panel__body { flex: 1; min-height: 0; overflow-y: auto; padding: 12px 14px; }
.pos-cart__foot, .pos-panel__foot { flex: 0 0 auto; display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 8px; padding: 10px 14px calc(10px + var(--pos-safe-bottom)); background: var(--pos-surface); border-top: 1px solid var(--pos-line); }
.pos-panel__foot { grid-template-columns: minmax(0, 1fr); }
.pos-panel__title { margin: 16px 0 10px; font-size: 14.5px; font-weight: 800; }

/* cart items */
.pos-cart-empty { min-height: 220px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; color: #94a3b8; text-align: center; }
.pos-cart-empty i { font-size: 40px; }
.pos-cart-empty strong { color: #475569; }
.pos-cart-item { display: flex; gap: 10px; padding: 10px; margin-bottom: 8px; background: var(--pos-surface); border: 1px solid var(--pos-line); border-radius: var(--pos-radius); }
.pos-cart-item__image { width: 56px; height: 56px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 10px; background: #f1f5f9; color: #94a3b8; overflow: hidden; }
.pos-cart-item__image img { width: 100%; height: 100%; object-fit: cover; }
.pos-cart-item__info { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.pos-cart-item__info strong { font-size: 13.5px; line-height: 1.3; }
.pos-cart-item__info small { color: var(--pos-muted); font-size: 11.5px; }
.pos-cart-item__info em { color: #b45309; font-size: 11.5px; font-style: normal; }
.pos-cart-item__unit-price { color: var(--pos-muted); font-size: 12px; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.pos-cart-item__unit { border: 1px solid var(--pos-line); border-radius: 8px; background: #fff; font-size: 11.5px; padding: 2px 6px; }
.pos-cart-item__tools { display: flex; gap: 6px; margin-top: 4px; }
.pos-cart-item__tools button { width: 28px; height: 28px; border: 1px solid var(--pos-line); border-radius: 8px; background: #fff; color: #475569; font-size: 11px; cursor: pointer; }
.pos-cart-item__tools .pos-cart-item__remove { border-color: #fecaca; }
.pos-cart-item__side { display: flex; flex-direction: column; align-items: flex-end; justify-content: space-between; gap: 6px; }
.pos-cart-item__side > b { color: var(--pos-primary); font-weight: 800; font-size: 13.5px; white-space: nowrap; }
.pos-qty { display: flex; align-items: center; gap: 4px; padding: 2px; border: 1px solid var(--pos-line); border-radius: 10px; background: #fff; }
.pos-qty button { width: 28px; height: 28px; border: 0; border-radius: 8px; background: #f1f5f9; color: var(--pos-ink); font-size: 11px; cursor: pointer; }
.pos-qty button:hover { background: var(--pos-primary-soft); color: var(--pos-primary); }
.pos-qty span { min-width: 24px; text-align: center; font-weight: 800; font-size: 14px; }
.pos-cart-item__remove { background: #fef2f2; color: var(--pos-danger); }

/* cart meta */
.pos-meta-row { display: flex; align-items: center; gap: 10px; width: 100%; margin-top: 10px; padding: 10px 12px; border: 1px solid var(--pos-line); border-radius: var(--pos-radius); background: var(--pos-surface); color: var(--pos-ink); text-align: start; cursor: pointer; }
.pos-meta-row__icon { width: 36px; height: 36px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 10px; background: var(--pos-primary-soft); color: var(--pos-primary); }
.pos-meta-row__text { flex: 1; display: flex; flex-direction: column; line-height: 1.25; }
.pos-meta-row__text small { color: var(--pos-muted); font-size: 11.5px; }
.pos-meta-row__text strong { font-size: 14px; }
.pos-meta-row > i:last-child { color: var(--pos-muted); font-size: 12px; }
.pos-meta-field { display: flex; flex-direction: column; gap: 6px; margin-top: 10px; }
.pos-meta-field > span { font-size: 12.5px; font-weight: 700; color: #475569; }
.pos-meta-field input, .pos-meta-field select { width: 100%; min-height: 44px; padding: 8px 12px; border: 1px solid var(--pos-line); border-radius: 12px; background: var(--pos-surface); color: var(--pos-ink); font-size: 14px; }
.pos-discount__row { display: flex; gap: 8px; }
.pos-discount__type { display: flex; flex: 0 0 auto; overflow: hidden; border: 1px solid var(--pos-line); border-radius: 12px; background: var(--pos-surface); }
.pos-discount__type button { min-width: 52px; border: 0; background: transparent; color: #475569; font-weight: 800; cursor: pointer; }
.pos-discount__type button.is-active { background: var(--pos-primary); color: #fff; }
.pos-discount__row input { flex: 1; }
.pos-summary { margin-top: 12px; padding: 6px 12px; background: var(--pos-surface); border: 1px solid var(--pos-line); border-radius: var(--pos-radius); }
.pos-summary > div { display: flex; justify-content: space-between; align-items: center; padding: 7px 0; color: #475569; font-size: 13.5px; }
.pos-summary > div b { font-weight: 700; color: var(--pos-ink); }
.pos-summary .is-discount b { color: var(--pos-success); }
.pos-summary .is-total { margin-top: 4px; padding-top: 10px; border-top: 1px dashed #cbd5e1; color: var(--pos-ink); font-size: 15px; }
.pos-summary .is-total b { font-size: 17px; font-weight: 800; color: var(--pos-primary); }

/* payment */
.pos-total-card { padding: 18px; text-align: center; background: var(--pos-surface); border: 1px solid var(--pos-line); border-radius: 16px; }
.pos-total-card span { display: block; color: var(--pos-muted); font-size: 13px; font-weight: 700; margin-bottom: 6px; }
.pos-total-card strong { font-size: 28px; font-weight: 800; color: var(--pos-primary); }
.pos-methods { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.pos-method { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; min-height: 84px; padding: 12px 8px; border: 1.5px solid var(--pos-line); border-radius: var(--pos-radius); background: var(--pos-surface); color: #334155; font-weight: 700; font-size: 13.5px; cursor: pointer; transition: border-color .15s, background .15s, color .15s; }
.pos-method__mark { width: 66px; height: 44px; object-fit: contain; border-radius: 8px; }
.pos-method.is-active { border-color: var(--pos-primary); background: var(--pos-primary-soft); color: var(--pos-primary); box-shadow: 0 0 0 3px rgba(37, 99, 235, .12); }
.pos-method.is-unready { opacity: .55; cursor: not-allowed; border-style: dashed; }
.pos-method.is-unready small { color: #b45309; font-size: 11px; font-weight: 700; }
.pos-field { display: flex; flex-direction: column; gap: 6px; margin: 12px 0 0; }
.pos-field > span { font-size: 12.5px; font-weight: 700; color: #475569; }
.pos-field input, .pos-field select, .pos-field textarea { width: 100%; min-height: 44px; padding: 10px 12px; border: 1px solid var(--pos-line); border-radius: 12px; background: var(--pos-surface); color: var(--pos-ink); font-size: 14px; }
.pos-field textarea { resize: vertical; }
.pos-field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.pos-amount { display: flex; align-items: center; overflow: hidden; border: 1px solid var(--pos-line); border-radius: 12px; background: var(--pos-surface); }
.pos-amount b { padding: 0 12px; color: var(--pos-muted); font-size: 13px; }
.pos-amount input { flex: 1; min-width: 0; min-height: 50px; border: 0; padding: 0 12px; font-size: 20px; font-weight: 800; color: var(--pos-ink); background: transparent; direction: ltr; text-align: start; }
.pos-quick { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.pos-quick button { padding: 8px 12px; border: 1px solid #bfdbfe; border-radius: 10px; background: var(--pos-primary-soft); color: #1d4ed8; font-weight: 700; font-size: 12.5px; cursor: pointer; }
.pos-change { display: flex; align-items: center; justify-content: space-between; margin-top: 12px; padding: 12px 14px; border-radius: 12px; background: #ecfdf5; color: #047857; font-weight: 800; }
.pos-change strong { font-size: 18px; }
.pos-change.is-short { background: #fef2f2; color: #b91c1c; }
.pos-split { margin-top: 12px; }
.pos-split__row { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr) 40px; gap: 8px; margin-bottom: 8px; }
.pos-split__row select, .pos-split__row input { min-height: 40px; padding: 6px 10px; border: 1px solid var(--pos-line); border-radius: 10px; background: var(--pos-surface); }
.pos-split__balance { display: flex; justify-content: space-between; padding: 10px 12px; border-radius: 10px; font-weight: 800; }
.pos-split__balance.is-ok { background: #ecfdf5; color: #047857; }
.pos-split__balance.is-bad { background: #fef2f2; color: #b91c1c; }

/* success */
.pos-success .pos-panel__body { display: flex; flex-direction: column; align-items: center; text-align: center; padding-top: 28px; }
.pos-success__icon { width: 92px; height: 92px; display: grid; place-items: center; border-radius: 50%; background: #dcfce7; color: var(--pos-success); font-size: 42px; margin-bottom: 14px; }
.pos-success h2 { font-size: 20px; font-weight: 800; }
.pos-success__label { margin-top: 10px; color: var(--pos-muted); font-size: 13px; }
.pos-success__number { font-size: 20px; font-weight: 800; color: var(--pos-ink); letter-spacing: .01em; direction: ltr; }
.pos-success__replay { margin-top: 8px; color: #b45309; font-size: 12.5px; }
.pos-success__details { width: 100%; margin: 18px 0 0; padding: 4px 14px; background: var(--pos-surface); border: 1px solid var(--pos-line); border-radius: 16px; text-align: start; }
.pos-success__details > div { display: flex; justify-content: space-between; gap: 12px; padding: 9px 0; border-bottom: 1px solid #f1f5f9; font-size: 13.5px; }
.pos-success__details > div:last-child { border-bottom: 0; }
.pos-success__details dt { color: var(--pos-muted); font-weight: 600; }
.pos-success__details dd { margin: 0; font-weight: 700; text-align: end; }
.pos-success__details .is-total { padding-top: 12px; border-top: 1px dashed #cbd5e1; font-size: 15px; }
.pos-success__details .is-total dd { color: var(--pos-primary); font-size: 17px; font-weight: 800; }
.pos-success__actions { width: 100%; display: grid; gap: 10px; margin-top: 18px; padding-bottom: var(--pos-safe-bottom); }

/* modals & sheets */
.pos-modal-backdrop { position: fixed; inset: 0; z-index: 70; display: flex; align-items: flex-end; justify-content: center; background: rgba(15, 23, 42, .55); }
.pos-modal-card { width: 100%; max-height: 92vh; max-height: 92dvh; display: flex; flex-direction: column; overflow: hidden; background: var(--pos-surface); border-radius: 20px 20px 0 0; box-shadow: 0 -20px 60px rgba(15, 23, 42, .25); animation: pos-sheet-in .22s ease; }
@keyframes pos-sheet-in { from { transform: translateY(24px); opacity: 0; } to { transform: none; opacity: 1; } }
.pos-modal-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 16px; border-bottom: 1px solid var(--pos-line); }
.pos-modal-head h3 { font-size: 16px; font-weight: 800; }
.pos-modal-head p { color: var(--pos-muted); font-size: 12.5px; margin-top: 2px; }
.pos-modal-body { flex: 1; min-height: 0; overflow-y: auto; padding: 14px 16px; }
.pos-modal-foot { display: flex; justify-content: flex-end; gap: 8px; padding: 12px 16px calc(12px + var(--pos-safe-bottom)); border-top: 1px solid var(--pos-line); }
.pos-modal-foot .pos-button { flex: 1; }
.pos-help { margin-top: 8px; color: var(--pos-muted); font-size: 12.5px; }
.pos-option-section { margin-bottom: 18px; }
.pos-option-section h4 { display: flex; align-items: baseline; gap: 6px; font-size: 14px; margin-bottom: 8px; }
.pos-option-section h4 small { color: var(--pos-muted); font-weight: 500; }
.pos-option-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.pos-option-grid label { position: relative; }
.pos-option-grid input { position: absolute; opacity: 0; inset: 0; }
.pos-option-grid span { display: flex; align-items: center; justify-content: space-between; gap: 6px; min-height: 46px; padding: 8px 12px; border: 1.5px solid var(--pos-line); border-radius: 12px; font-weight: 700; font-size: 13px; }
.pos-option-grid span small { color: var(--pos-muted); font-weight: 500; }
.pos-option-grid input:checked + span { border-color: var(--pos-primary); background: var(--pos-primary-soft); color: var(--pos-primary); }
.pos-list { display: flex; flex-direction: column; gap: 6px; }
.pos-list-item { display: flex; align-items: center; gap: 12px; width: 100%; padding: 10px 12px; border: 1px solid var(--pos-line); border-radius: 12px; background: var(--pos-surface); color: var(--pos-ink); text-align: start; cursor: pointer; }
.pos-list-item__icon { width: 38px; height: 38px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 10px; background: var(--pos-primary-soft); color: var(--pos-primary); font-weight: 800; }
.pos-list-item > span:last-child { display: flex; flex-direction: column; min-width: 0; }
.pos-list-item small { color: var(--pos-muted); font-size: 12px; }
.pos-list-item.is-active { border-color: var(--pos-primary); background: var(--pos-primary-soft); }
.pos-orders-filter { display: grid; grid-template-columns: minmax(0, 1fr) 140px; gap: 8px; margin-bottom: 12px; }
.pos-orders-filter input, .pos-orders-filter select { min-height: 42px; padding: 6px 12px; border: 1px solid var(--pos-line); border-radius: 12px; background: var(--pos-surface); }
.pos-orders-list { display: flex; flex-direction: column; gap: 8px; }
.pos-order { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px 12px; padding: 12px; border: 1px solid var(--pos-line); border-radius: var(--pos-radius); background: var(--pos-surface); }
.pos-order__info { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.pos-order__info strong { direction: ltr; text-align: start; font-size: 13.5px; }
.pos-order__info span, .pos-order__info small { color: var(--pos-muted); font-size: 12px; }
.pos-order__side { display: flex; flex-direction: column; align-items: flex-end; gap: 6px; }
.pos-order__side b { color: var(--pos-primary); font-weight: 800; }
.pos-order__actions { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 6px; }
.pos-order__actions button { display: inline-flex; align-items: center; gap: 6px; min-height: 36px; padding: 0 12px; border: 1px solid var(--pos-line); border-radius: 10px; background: #f8fafc; color: var(--pos-ink); font-weight: 700; font-size: 12.5px; cursor: pointer; }
.pos-order__actions button.is-danger { color: var(--pos-danger); border-color: #fecaca; background: #fef2f2; }
.pos-status-badge { padding: 4px 9px; border-radius: 999px; font-size: 11.5px; font-weight: 700; background: #f1f5f9; color: #475569; }
.pos-status-badge.is-hold { background: #fef3c7; color: #92400e; }
.pos-status-badge.is-completed { background: #d1fae5; color: #065f46; }
.pos-status-badge.is-cancelled { background: #fee2e2; color: #991b1b; }
.pos-status-badge.is-refunded, .pos-status-badge.is-partially_refunded { background: #ede9fe; color: #6d28d9; }
.pos-refund-lines { display: flex; flex-direction: column; gap: 8px; }
.pos-refund-line { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 12px; border: 1px solid var(--pos-line); border-radius: 12px; }
.pos-refund-line > span { display: flex; flex-direction: column; min-width: 0; }
.pos-refund-line small { color: var(--pos-muted); font-size: 12px; }
.pos-refund-line input { width: 92px; min-height: 40px; padding: 6px 10px; border: 1px solid var(--pos-line); border-radius: 10px; text-align: center; }
.pos-loading-inline { padding: 30px; text-align: center; color: var(--pos-muted); }
.pos-scanner video { width: 100%; aspect-ratio: 4 / 3; border-radius: 14px; background: #000; object-fit: cover; }
.pos-scanner p { margin-top: 10px; text-align: center; color: var(--pos-muted); font-size: 13px; }

/* tablet & desktop: catalog + cart side by side, payment/success as centred cards */
@media (min-width: 768px) {
    .pos-header { padding: 0 18px; }
    .pos-header__tools { display: flex; }
    .pos-header__branch { max-width: 260px; }
    .pos-main { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 14px; padding: 14px; }
    .pos-catalog { padding: 0; }
    .pos-products { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); padding-bottom: 16px; }
    .pos-cart-bar { display: none; }
    .pos-cart { position: static; opacity: 1; visibility: visible; transform: none; transition: none; background: var(--pos-surface); border: 1px solid var(--pos-line); border-radius: 18px; overflow: hidden; min-height: 0; }
    .pos-cart__head [data-view-target="catalog"] { display: none; }
    .pos-cart__body { background: var(--pos-bg); }
    .pos-payment, .pos-success { background: transparent; z-index: 60; }
    .pos-payment::before, .pos-success::before { content: ''; position: fixed; inset: 0; background: rgba(15, 23, 42, .55); z-index: -1; }
    .pos-payment { display: grid; grid-template-rows: auto minmax(0, 1fr) auto; width: min(560px, 100%); height: min(780px, calc(100vh - 48px)); margin: auto; border-radius: 20px; overflow: hidden; background: var(--pos-bg); box-shadow: 0 30px 80px rgba(15, 23, 42, .35); }
    .pos-success { display: grid; grid-template-rows: minmax(0, 1fr); width: min(520px, 100%); max-height: calc(100vh - 48px); margin: auto; border-radius: 20px; overflow: hidden; background: var(--pos-bg); box-shadow: 0 30px 80px rgba(15, 23, 42, .35); }
    .pos-success__actions { grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); }
    .pos-modal-backdrop { align-items: center; padding: 20px; }
    .pos-modal-card { width: min(640px, 100%); border-radius: 20px; box-shadow: 0 25px 70px rgba(15, 23, 42, .3); }
    .pos-modal-card.pos-small-modal { width: min(440px, 100%); }
    .pos-modal-card.pos-sheet { width: min(720px, 100%); }
    .pos-modal-foot .pos-button { flex: 0 0 auto; min-width: 140px; }
    .pos-order { grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; }
    .pos-order__actions { grid-column: auto; }
}
@media (min-width: 1200px) {
    .pos-main { grid-template-columns: minmax(0, 1fr) 400px; gap: 16px; padding: 16px; }
    .pos-products { grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 12px; }
    .pos-category { min-width: 84px; }
}
@media (max-width: 380px) {
    .pos-header__branch select { font-size: 12.5px; }
    .pos-products { gap: 8px; }
    .pos-order-types button { font-size: 12.5px; }
}

/* promotional offers: original vs. promotional line price, applied-offer rows, guarded manual override */
.pos-cart-item__was { color: #94a3b8; font-size: 11.5px; text-decoration: line-through; white-space: nowrap; }
.pos-cart-item__promo { display: inline-flex; align-items: center; gap: 4px; max-width: 150px; padding: 2px 7px; border-radius: 999px; background: #e8f8f0; color: #087a4e; font-size: 11px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pos-summary > .pos-summary__promo { color: #087a4e; font-size: 13px; }
.pos-summary > .pos-summary__promo span { display: inline-flex; align-items: center; gap: 6px; }
.pos-summary > .pos-summary__promo b { display: inline-flex; align-items: center; gap: 6px; color: #087a4e; }
.pos-summary > .pos-summary__promo.is-excluded { color: #94a3b8; }
.pos-summary__promo-off { border: 0; background: #f1f5f9; color: #64748b; width: 22px; height: 22px; border-radius: 50%; display: inline-grid; place-items: center; font-size: 11px; }
.pos-summary__promo-off:hover { background: #ffebee; color: #c62f42; }
.pos-summary > .pos-summary__pending { justify-content: flex-start; gap: 8px; color: #94a3b8; font-size: 12px; }
/* POS tax treatment (owner 2026-10-15): a ticket whose e-invoice cannot be issued -- amber warning, red when it blocks the payment */
.pos-summary > .pos-summary__pending.is-tax { align-items: flex-start; color: #b45309; background: #fffbeb; border-radius: 8px; padding: 8px 10px; line-height: 1.6; }
.pos-summary > .pos-summary__pending.is-tax.is-blocking { color: #b91c1c; background: #fef2f2; }
.pos-cart-item__info .pos-cart-item__tax { color: #087a4e; font-weight: 600; }
.pos-success__details .is-promo dt, .pos-success__details .is-promo dd { color: #087a4e; }

/* pos_workspace.css */
.posw-root{--posw-primary:#6f5ae8;--posw-border:#e5e9f2;--posw-muted:#728096;direction:rtl;color:#172033}.posw-page-head{display:flex;justify-content:space-between;gap:24px;align-items:flex-start;margin-bottom:22px}.posw-page-head h1{font-size:var(--font-2xl);margin:7px 0}.posw-page-head p{margin:0;color:var(--posw-muted)}.posw-breadcrumb{display:flex;gap:8px;align-items:center;font-size:var(--font-sm);color:var(--posw-muted)}.posw-breadcrumb i{font-size:9px}.posw-head-actions{display:flex;gap:8px;flex-wrap:wrap}.posw-metrics{display:grid;grid-template-columns:repeat(5,minmax(150px,1fr));gap:12px;margin-bottom:18px}.posw-metrics article{background:#fff;border:1px solid var(--posw-border);border-radius:14px;padding:16px;display:flex;align-items:center;gap:12px}.posw-metrics small{display:block;color:var(--posw-muted);margin-bottom:4px}.posw-metrics strong{font-size:var(--font-2xl)}.posw-metric-icon{width:42px;height:42px;border-radius:12px;background:#f0edff;color:var(--posw-primary);display:grid;place-items:center}.posw-metric-icon.green{background:#e9f9f1;color:#12945f}.posw-metric-icon.orange{background:#fff4e5;color:#d88116}.posw-metric-icon.red{background:#ffebee;color:#d83b4c}.posw-card{background:#fff;border:1px solid var(--posw-border);border-radius:15px;padding:18px;margin-bottom:16px}.posw-card>h3{font-size:var(--font-lg);margin:0 0 16px}.posw-filter{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;background:#fff;border:1px solid var(--posw-border);border-radius:14px;padding:14px;margin-bottom:16px}.posw-filter select,.posw-filter input,.posw-form-grid input,.posw-form-grid select,.posw-form-grid textarea{width:100%;border:1px solid #dce2ec;border-radius:9px;padding:10px 12px;background:#fff}.posw-filter label span,.posw-form-grid label>span{display:block;font-size:var(--font-sm);color:var(--posw-muted);margin-bottom:5px}.posw-table-scroll{overflow:auto}.posw-table{width:100%;border-collapse:collapse;white-space:nowrap}.posw-table th{font-size:var(--font-ui);color:var(--posw-muted);font-weight:600;text-align:right;background:#f8fafc;padding:12px}.posw-table td{padding:12px;border-bottom:1px solid #edf0f5;font-size:var(--font-ui)}.posw-table tbody tr:hover{background:#fafaff}.posw-status{display:inline-flex;padding:5px 9px;border-radius:20px;background:#eef1f5;color:#526175;font-size:var(--font-xs)}.posw-status.open{background:#e8f8f0;color:#098c58}.posw-status.closing{background:#fff4e4;color:#bd6d08}.posw-status.closed_difference{background:#ffebee;color:#c62f42}.posw-difference{color:#c62f42;font-weight:700}.posw-icon-btn{width:34px;height:34px;border:1px solid var(--posw-border);border-radius:8px;background:#fff;color:#536179;display:inline-grid;place-items:center}.posw-pager{display:flex;justify-content:center;align-items:center;gap:12px;padding-top:16px}.posw-pager button{border:1px solid var(--posw-border);background:#fff;border-radius:8px;width:34px;height:34px}.posw-loading,.posw-empty,.posw-error{min-height:190px;display:flex;flex-direction:column;gap:10px;align-items:center;justify-content:center;color:var(--posw-muted);text-align:center}.posw-loading i,.posw-empty i,.posw-error i{font-size:28px;color:var(--posw-primary)}.posw-detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.posw-info{display:grid;grid-template-columns:1fr 1fr;gap:12px}.posw-info div{padding:12px;background:#f8fafc;border-radius:10px}.posw-info span{display:block;font-size:var(--font-sm);color:var(--posw-muted)}.posw-info strong{display:block;margin-top:5px}.posw-totals>div{display:flex;justify-content:space-between;padding:9px 0;border-bottom:1px dashed #e2e7ee}.posw-totals .important{font-size:var(--font-md);font-weight:700}.posw-payment-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px}.posw-payment-grid article{padding:14px;background:#f8fafc;border:1px solid #edf0f5;border-radius:11px}.posw-payment-grid span,.posw-payment-grid small{display:block;color:var(--posw-muted);font-size:var(--font-xs)}.posw-payment-grid strong{display:block;margin:6px 0}.posw-timeline article{display:flex;gap:12px;padding:10px 0}.posw-timeline i{font-size:8px;color:var(--posw-primary);margin-top:6px}.posw-timeline span{display:block;color:var(--posw-muted);font-size:var(--font-sm);margin-top:3px}.posw-modal-backdrop{position:fixed;inset:0;background:rgba(22,29,43,.55);z-index:3000;display:grid;place-items:center;padding:20px}.posw-modal{width:min(720px,96vw);max-height:90vh;overflow:auto;background:#fff;border-radius:16px;box-shadow:0 25px 70px rgba(0,0,0,.22)}.posw-modal>header,.posw-modal>footer{padding:17px 20px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--posw-border)}.posw-modal>footer{border:0;border-top:1px solid var(--posw-border);justify-content:flex-end;gap:8px}.posw-modal header h3{margin:0}.posw-modal header p{margin:4px 0 0;color:var(--posw-muted)}.posw-modal header button{border:0;background:transparent;font-size:var(--font-xl)}.posw-form-grid{padding:20px;display:grid;grid-template-columns:1fr 1fr;gap:14px}.posw-form-grid .wide,.posw-form-grid fieldset.wide{grid-column:1/-1}.posw-form-grid textarea{min-height:80px}.posw-denominations{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}.posw-denominations label{background:#f8fafc;padding:8px;border-radius:9px}.posw-toast-host{position:fixed;top:78px;left:25px;z-index:5000}.posw-toast{padding:12px 16px;border-radius:10px;background:#138f5c;color:#fff;box-shadow:0 10px 30px rgba(0,0,0,.15);margin-bottom:8px}.posw-toast.error{background:#c73648}.posw-settings-layout{display:grid;grid-template-columns:220px 1fr;gap:16px}.posw-settings-tabs{background:#fff;border:1px solid var(--posw-border);border-radius:14px;padding:8px;height:max-content}.posw-settings-tabs button{width:100%;border:0;background:transparent;padding:12px;text-align:right;border-radius:9px;color:#526175}.posw-settings-tabs button i{width:25px}.posw-settings-tabs button.active{background:#f0edff;color:var(--posw-primary);font-weight:700}.posw-settings-panel{min-height:380px}.posw-section-title{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:16px}.posw-section-title h3{margin:0}.posw-section-title p{color:var(--posw-muted);margin:5px 0}.posw-note{display:flex;gap:10px;background:#f6f4ff;color:#5145a7;border-radius:10px;padding:13px;margin:14px 0}.posw-toggle-list{display:grid;gap:10px}.posw-toggle-list label{display:flex;justify-content:space-between;padding:13px;background:#f8fafc;border-radius:10px}.posw-toggle-list input{width:20px;height:20px}.posw-check-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.posw-check-grid label{display:flex;gap:7px;align-items:center;background:#f8fafc;padding:9px;border-radius:8px}.posw-active-check{display:flex;gap:8px;align-items:center}.posw-active-check input{width:auto}.pos-header-button.active{background:#e9f9f1!important;color:#087a4e!important}
@media(max-width:1100px){.posw-metrics{grid-template-columns:repeat(2,1fr)}.posw-filter{grid-template-columns:repeat(2,1fr)}}@media(max-width:760px){.posw-page-head,.posw-section-title{flex-direction:column}.posw-detail-grid,.posw-settings-layout{grid-template-columns:1fr}.posw-settings-tabs{display:flex;overflow:auto}.posw-settings-tabs button{white-space:nowrap;width:auto}.posw-form-grid,.posw-info{grid-template-columns:1fr}.posw-form-grid .wide{grid-column:auto}.posw-metrics{grid-template-columns:1fr}.posw-denominations,.posw-check-grid{grid-template-columns:repeat(2,1fr)}}
@media print{.sidebar,.top-header,.posw-head-actions,.posw-filter,.posw-settings-tabs{display:none!important}.main-content{margin:0!important}.posw-card{break-inside:avoid}.posw-root{font-size:11px}}
.posw-print-field{display:grid!important;grid-template-columns:minmax(150px,1fr) minmax(190px,2fr);align-items:center;gap:12px;padding:12px 13px;background:#f8fafc;border-radius:10px}.posw-print-field select,.posw-print-field input{width:100%;border:1px solid #dce2ec;border-radius:8px;padding:9px 10px;background:#fff}.posw-toggle-list h4{font-size:var(--font-md);font-weight:700;margin:12px 0 2px}.posw-print-links{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}@media(max-width:560px){.posw-print-field{grid-template-columns:1fr}}

/* sales-screen categories page */
.posw-catalog-settings{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;align-items:end}.posw-catalog-settings label{display:flex;flex-direction:column;gap:6px;font-size:var(--font-sm);color:var(--posw-muted);font-weight:600}.posw-catalog-settings select{min-height:42px;border:1px solid var(--posw-border);border-radius:10px;padding:6px 12px;background:#fff;color:#172033;font:inherit}.posw-catalog-switch{flex-direction:row;align-items:center;justify-content:space-between;min-height:42px;padding:0 12px;border:1px solid var(--posw-border);border-radius:10px;background:#f8fafc}.posw-catalog-table td{vertical-align:middle}.posw-catalog-table tr.is-hidden td{background:#fafafa}.posw-catalog-table tr.is-hidden .posw-catalog-name strong{color:var(--posw-muted)}.posw-catalog-table tr.is-dragging{opacity:.45}.posw-catalog-table tr.is-drop-target td{box-shadow:inset 0 3px 0 var(--posw-primary)}.posw-drag-handle{display:inline-grid;place-items:center;width:28px;height:28px;margin-inline-end:6px;border-radius:8px;color:#94a3b8;cursor:grab;background:#f1f5f9}.posw-catalog-name{display:flex;align-items:center;gap:10px;white-space:normal}.posw-catalog-name div{display:flex;flex-direction:column;gap:2px}.posw-catalog-name small{color:var(--posw-muted);font-size:var(--font-xs)}.posw-catalog-name .posw-status{width:max-content;margin-top:2px}.posw-catalog-thumb{width:42px;height:42px;flex:0 0 auto;display:grid;place-items:center;border-radius:10px;background:#eef2ff;color:var(--posw-primary);overflow:hidden}.posw-catalog-thumb img{width:100%;height:100%;object-fit:cover}.posw-catalog-image-actions{display:flex;gap:6px}.posw-catalog-image-actions label{cursor:pointer}.posw-catalog-toggle{margin:0}.posw-catalog-order{display:flex;align-items:center;gap:6px}.posw-catalog-order input{width:74px;min-height:34px;border:1px solid var(--posw-border);border-radius:8px;padding:4px 8px;text-align:center}.posw-catalog-table select{min-height:36px;border:1px solid var(--posw-border);border-radius:8px;padding:4px 10px;background:#fff;font:inherit}@media(max-width:900px){.posw-catalog-settings{grid-template-columns:1fr}}

/* payment-method marks, reconciliation and the closing screen */
.posw-method-mark{width:54px;height:36px;flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;border-radius:9px;background:#fff;border:1px solid var(--posw-border);overflow:hidden}.posw-method-mark img{width:100%;height:100%;object-fit:contain;display:block}.posw-method-mark.is-small{width:44px;height:30px;margin-bottom:8px}.posw-balance{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;font-size:var(--font-xs);font-weight:700;white-space:nowrap}.posw-balance.is-balanced{background:#e8f8f0;color:#098c58}.posw-balance.is-shortage{background:#ffebee;color:#c62f42}.posw-balance.is-overage{background:#fff4e4;color:#bd6d08}.posw-recon-list{display:grid;gap:10px}.posw-recon-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;align-items:center;gap:14px;padding:12px 14px;background:#f8fafc;border:1px solid #edf0f5;border-radius:12px}.posw-recon-row.is-shortage{border-color:#f5c2c7}.posw-recon-row.is-overage{border-color:#f8d7a8}.posw-recon-name{display:flex;flex-direction:column;min-width:0}.posw-recon-name small{color:var(--posw-muted);font-size:var(--font-xs)}.posw-recon-figures{display:flex;gap:18px}.posw-recon-figures span{display:flex;flex-direction:column;gap:2px;min-width:90px}.posw-recon-figures small{color:var(--posw-muted);font-size:var(--font-xs)}.posw-recon-figures b{font-weight:700}.posw-recon-cash{display:flex;flex-wrap:wrap;gap:8px 16px;margin:12px 0 0;padding:10px 12px;border-radius:10px;background:#fff;border:1px dashed #dce2ec;font-size:var(--font-sm);color:var(--posw-muted)}.posw-recon-cash b{color:#172033;margin-inline-start:4px}.posw-recon-cash .is-total{font-weight:700;color:#172033}.posw-recon-totals{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin-top:14px}.posw-recon-totals>div{padding:10px 12px;border-radius:10px;background:#f8fafc;border:1px solid #edf0f5}.posw-recon-totals span{display:block;color:var(--posw-muted);font-size:var(--font-xs);margin-bottom:4px}.posw-recon-totals strong{font-size:var(--font-md)}.posw-recon-totals .is-shortage{color:#c62f42}.posw-recon-totals .is-overage{color:#bd6d08}.posw-recon-totals.is-stacked{grid-template-columns:1fr;gap:6px;margin-top:0}.posw-recon-totals.is-stacked>div{display:flex;justify-content:space-between;align-items:center}.posw-recon-totals.is-stacked span{margin:0}.posw-recon-meta{margin-top:14px}
.posw-closing{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:16px;align-items:start}.posw-closing-main{display:grid;gap:12px}.posw-closing-card{background:#fff;border:1px solid var(--posw-border);border-radius:15px;padding:16px}.posw-closing-card.is-shortage{border-color:#f5c2c7}.posw-closing-card.is-overage{border-color:#f8d7a8}.posw-closing-card.is-balanced{border-color:#bfe9d3}.posw-closing-head{display:flex;align-items:center;gap:12px}.posw-closing-head>div{flex:1;display:flex;flex-direction:column;min-width:0}.posw-closing-head small{color:var(--posw-muted);font-size:var(--font-xs)}.posw-closing-figures{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:14px}.posw-closing-figures label{display:flex;flex-direction:column;gap:6px;font-size:var(--font-xs);color:var(--posw-muted);font-weight:600}.posw-closing-figures output{display:flex;align-items:center;min-height:46px;padding:0 12px;border-radius:10px;background:#f8fafc;border:1px solid #edf0f5;font-size:var(--font-md);font-weight:700;color:#172033}.posw-closing-figures output.is-shortage{color:#c62f42;background:#ffebee}.posw-closing-figures output.is-overage{color:#bd6d08;background:#fff4e4}.posw-amount{display:flex;align-items:center;overflow:hidden;border:1px solid #dce2ec;border-radius:10px;background:#fff}.posw-amount b{padding:0 10px;color:var(--posw-muted);font-size:var(--font-xs)}.posw-amount input{flex:1;min-width:0;min-height:46px;border:0;padding:0 10px;font-size:var(--font-lg);font-weight:700;direction:ltr;text-align:start;color:#172033;background:transparent}.posw-closing-figures .posw-denominations{grid-column:1/-1}.posw-denominations input{width:100%;border:1px solid #dce2ec;border-radius:8px;padding:6px 8px;margin-top:4px;text-align:center}.posw-closing-side .posw-card{position:sticky;top:16px}.posw-closing-status{display:flex;align-items:center;gap:10px;margin:14px 0;padding:12px 14px;border-radius:12px;font-weight:700}.posw-closing-status.is-pending{background:#f1f5f9;color:#475569}.posw-closing-status.is-balanced{background:#e8f8f0;color:#098c58}.posw-closing-status.is-unbalanced{background:#ffebee;color:#c62f42}.posw-closing-field{display:flex;flex-direction:column;gap:6px;margin-bottom:12px;font-size:var(--font-sm);color:var(--posw-muted);font-weight:600}.posw-closing-field select,.posw-closing-field textarea{width:100%;border:1px solid #dce2ec;border-radius:10px;padding:10px 12px;font:inherit;color:#172033;background:#fff}.posw-closing-submit{width:100%;min-height:50px;font-weight:700}
@media(max-width:900px){.posw-closing{grid-template-columns:1fr}.posw-closing-side .posw-card{position:static}.posw-closing-figures{grid-template-columns:1fr}.posw-recon-row{grid-template-columns:auto minmax(0,1fr);row-gap:10px}.posw-recon-figures{grid-column:1/-1;justify-content:space-between;gap:8px}.posw-recon-figures span{min-width:0}.posw-recon-status{grid-column:1/-1}}
@media(max-width:600px){.posw-closing-submit{position:sticky;bottom:calc(10px + env(safe-area-inset-bottom,0px));box-shadow:0 12px 28px rgba(37,99,235,.3)}.posw-denominations{grid-template-columns:repeat(3,1fr)}}
@media print{.posw-closing-side,.posw-status~a{display:none}.posw-recon-row{break-inside:avoid;border:1px solid #999}.posw-balance{border:1px solid currentColor}}

/* setup overview and tables page */
.posw-setup-title{margin:18px 0 10px;font-size:var(--font-md)}.posw-setup-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px;margin-bottom:6px}.posw-setup-card{display:flex;align-items:center;gap:12px;padding:12px 14px;background:#fff;border:1px solid var(--posw-border);border-radius:12px;color:#172033;text-decoration:none;transition:border-color .15s,box-shadow .15s}.posw-setup-card:hover{border-color:var(--posw-primary);box-shadow:0 8px 20px rgba(111,90,232,.12);color:#172033}.posw-setup-card div{display:flex;flex-direction:column;min-width:0}.posw-setup-card small{color:var(--posw-muted);font-size:var(--font-xs)}.posw-setup-card strong{font-size:var(--font-lg)}.posw-setup-card em{font-style:normal;color:var(--posw-muted);font-size:var(--font-xs);white-space:normal}.posw-setup-card.orange{border-color:#f8d7a8;background:#fffaf2}.posw-setup-card.green{border-color:#bfe9d3}.posw-table-areas{display:flex;flex-wrap:wrap;align-items:center;gap:6px;min-height:42px}

/* promotional offers (/pos/promotions): list cards, form sections, pickers, detail */
.promo-root .posw-breadcrumb a{color:inherit;text-decoration:none}.promo-filter{grid-template-columns:2fr repeat(5,minmax(130px,1fr))}.promo-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:14px;margin-bottom:16px}.promo-card{display:grid;grid-template-columns:96px minmax(0,1fr);background:#fff;border:1px solid var(--posw-border);border-radius:15px;overflow:hidden;transition:border-color .15s,box-shadow .15s}.promo-card:hover{border-color:var(--posw-primary);box-shadow:0 8px 22px rgba(111,90,232,.1)}.promo-card.is-paused,.promo-card.is-expired{opacity:.8}.promo-card__media{display:grid;place-items:center;background:#f0edff;color:var(--posw-primary);font-size:30px;text-decoration:none;min-height:120px}.promo-card__media img{width:100%;height:100%;object-fit:cover}.promo-card__body{padding:14px;display:flex;flex-direction:column;gap:8px;min-width:0}.promo-card__title{display:flex;justify-content:space-between;gap:8px;align-items:flex-start}.promo-card__title a{color:#172033;text-decoration:none;font-size:var(--font-md)}.promo-card__meta{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:var(--font-sm);color:var(--posw-muted)}.promo-card__meta i{width:14px;text-align:center;margin-inline-end:2px}.promo-card__value{color:#087a4e;font-weight:700}.promo-card__foot{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap;margin-top:auto;padding-top:8px;border-top:1px dashed #e2e7ee;font-size:var(--font-sm);color:var(--posw-muted)}.promo-actions{display:flex;gap:5px}.posw-icon-btn.is-green{color:#098c58}.posw-icon-btn.is-danger{color:#c62f42}.promo-status{display:inline-flex;padding:4px 10px;border-radius:20px;font-size:var(--font-xs);font-weight:700;white-space:nowrap;background:#eef1f5;color:#526175}.promo-status.is-active{background:#e8f8f0;color:#098c58}.promo-status.is-scheduled{background:#fff4e4;color:#bd6d08}.promo-status.is-paused{background:#ffebee;color:#c62f42}.promo-status.is-expired{background:#f1f5f9;color:#64748b}.promo-status.is-draft{background:#f0edff;color:#5145a7}
.promo-form .posw-card>h3{display:flex;align-items:center;gap:10px}.promo-form .posw-card>h3 i{color:var(--posw-primary)}.promo-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.promo-field{display:flex;flex-direction:column;gap:6px;font-size:var(--font-sm);color:var(--posw-muted);font-weight:600}.promo-field--wide{grid-column:1/-1}.promo-field input:not([type=checkbox]),.promo-field select,.promo-field textarea{width:100%;min-height:42px;border:1px solid #dce2ec;border-radius:10px;padding:8px 12px;background:#fff;color:#172033;font:inherit;font-weight:400}.promo-field textarea{min-height:64px}.promo-field small{font-weight:400;font-size:var(--font-xs)}.promo-hint{color:var(--posw-muted);margin:0}.promo-scope{display:inline-flex;background:#f1f5f9;border-radius:10px;padding:4px;gap:4px;width:max-content;max-width:100%;flex-wrap:wrap}.promo-scope button{border:0;background:transparent;border-radius:8px;padding:8px 14px;color:#526175;font-weight:600}.promo-scope button.is-active{background:#fff;color:var(--posw-primary);box-shadow:0 2px 8px rgba(0,0,0,.08)}.promo-checks{display:flex;flex-wrap:wrap;gap:8px}.promo-checks label{display:flex;align-items:center;gap:7px;background:#f8fafc;border:1px solid #edf0f5;padding:8px 12px;border-radius:9px;font-weight:400;color:#172033}.promo-switch{display:flex;align-items:center;gap:10px;font-weight:600;color:#172033}.promo-switch input{width:20px;height:20px}.promo-image{display:flex;align-items:center;gap:12px}.promo-image img,.promo-image i{width:64px;height:64px;border-radius:10px;object-fit:cover;display:grid;place-items:center;background:#f0edff;color:var(--posw-primary);font-size:24px}.promo-types{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:10px;margin-bottom:16px}.promo-type{display:flex;flex-direction:column;gap:6px;align-items:flex-start;text-align:start;padding:14px;border:1px solid var(--posw-border);border-radius:12px;background:#fff;color:#172033}.promo-type i{width:36px;height:36px;border-radius:10px;background:#f0edff;color:var(--posw-primary);display:grid;place-items:center}.promo-type small{color:var(--posw-muted);font-size:var(--font-xs)}.promo-type.is-active{border-color:var(--posw-primary);box-shadow:0 0 0 3px rgba(111,90,232,.15)}.promo-picker{border:1px solid var(--posw-border);border-radius:12px;padding:14px;margin-top:12px}.promo-picker__head{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:10px}.promo-picker__head input{min-width:240px;min-height:40px;border:1px solid #dce2ec;border-radius:10px;padding:6px 12px}.promo-chips{display:flex;flex-wrap:wrap;gap:8px;min-height:32px;align-items:center}.promo-chips em{color:var(--posw-muted);font-style:normal;font-size:var(--font-sm)}.promo-chip{display:inline-flex;align-items:center;gap:8px;background:#f0edff;color:#3f338f;border-radius:999px;padding:6px 6px 6px 12px;font-size:var(--font-sm)}.promo-chip b{font-size:var(--font-xs);background:#fff;padding:2px 7px;border-radius:999px}.promo-chip input{width:64px;border:1px solid #dce2ec;border-radius:8px;padding:3px 6px;text-align:center}.promo-chip button{border:0;background:#fff;width:24px;height:24px;border-radius:50%;color:#c62f42;display:grid;place-items:center}.promo-chips--static .promo-chip{padding-inline-end:12px}.promo-picker__results{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:6px;margin-top:10px}.promo-picker__results button{display:flex;flex-direction:column;align-items:flex-start;gap:2px;border:1px solid #edf0f5;background:#f8fafc;border-radius:9px;padding:8px 10px;text-align:start}.promo-picker__results button:hover{border-color:var(--posw-primary)}.promo-picker__results small{color:var(--posw-muted);font-size:var(--font-xs)}.promo-picker__results em{color:var(--posw-muted);font-style:normal}.promo-banner{width:100%;max-height:200px;object-fit:cover;border-radius:12px;margin-bottom:14px}
@media(max-width:1100px){.promo-filter{grid-template-columns:repeat(3,1fr)}}@media(max-width:760px){.promo-filter,.promo-fields{grid-template-columns:1fr}.promo-field--wide{grid-column:auto}.promo-grid{grid-template-columns:1fr}.promo-card{grid-template-columns:76px minmax(0,1fr)}.promo-picker__head input{min-width:0;width:100%}}

/* printer-settings.css */
.printer-page{color:#1a2941}.printer-head{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;margin-bottom:16px}.printer-head h3{font-size:var(--font-xl);font-weight:700;margin:0 0 6px}.printer-head p{color:var(--text-muted);margin:0}.printer-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:16px}.printer-summary article{background:#fff;border:1px solid #e2e8f2;border-radius:12px;padding:16px;display:flex;justify-content:space-between;align-items:center}.printer-summary small{color:#64748b}.printer-summary strong{font-size:var(--font-xl);color:#215bd8}.printer-tabs{display:flex;gap:5px;background:#fff;border:1px solid #e2e8f2;border-radius:12px;padding:7px;margin-bottom:14px;overflow:auto}.printer-tabs button{border:0;background:transparent;border-radius:8px;padding:9px 15px;color:#5b6a82;white-space:nowrap}.printer-tabs button i{margin-inline-end:7px}.printer-tabs button.active{background:#e9f0ff;color:#205ad3;font-weight:700}.printer-panel{background:#fff;border:1px solid #e2e8f2;border-radius:12px;padding:18px;min-height:210px}.printer-table-wrap{overflow:auto}.printer-table-wrap .table{min-width:760px}.printer-actions{display:flex;gap:4px;flex-wrap:wrap}.printer-empty{padding:38px 15px;text-align:center;color:#64748b}.printer-empty i{font-size:32px;color:#9baaca;display:block;margin-bottom:14px}.printer-empty h5{color:#243653}.printer-backdrop{position:fixed;inset:0;background:#14213d80;z-index:3100;display:grid;place-items:center;padding:12px}.printer-dialog{width:min(780px,100%);max-height:90vh;overflow:auto;background:#fff;border-radius:15px;box-shadow:0 25px 70px #10172c35}.printer-dialog>header,.printer-dialog>footer{padding:16px 20px;display:flex;align-items:center;justify-content:space-between;gap:8px;border-bottom:1px solid #e6ebf2}.printer-dialog>footer{border-bottom:0;border-top:1px solid #e6ebf2;justify-content:flex-end}.printer-dialog h5{margin:0 0 4px}.printer-form{padding:20px;display:grid;gap:14px}.printer-form label{display:grid;gap:6px;font-weight:600}.printer-form p{margin:0;color:#64748b}.printer-caps{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.printer-caps label{display:block;background:#f8fafc;padding:9px;border-radius:8px;font-weight:400}@media(max-width:700px){.printer-head{flex-direction:column}.printer-summary{grid-template-columns:1fr}.printer-panel{padding:10px}.printer-caps{grid-template-columns:1fr}}
.printer-connection-types{display:flex;flex-wrap:wrap;gap:7px;margin-top:9px}.printer-connection-types button{border:1px solid #d6e1f2;background:#fff;color:#35506e;border-radius:9px;padding:8px 12px}.printer-connection-types button.active{border-color:#2163dc;background:#edf4ff;color:#174db4;font-weight:700}.printer-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.printer-help{font-size:.875rem}.printer-check-panel{display:grid;gap:9px;border:1px solid #dbe6f5;border-radius:10px;background:#f8fbff;padding:13px}.printer-check-panel small{color:#64748b}.printer-form label.printer-enabled{display:flex;align-items:center;gap:8px}.printer-dialog .printer-form code{display:block;direction:ltr;text-align:left;white-space:normal;overflow-wrap:anywhere;padding:8px 10px;border-radius:7px;background:#f3f6fb;color:#284268}@media(max-width:700px){.printer-form-grid{grid-template-columns:1fr}.printer-connection-types button{flex:1 1 42%}.printer-dialog{max-height:95vh}}
.printer-assignments{border-top:1px solid #e5e9f1;margin-top:18px;padding-top:18px}.printer-assignments h5{font-size:var(--font-md);font-weight:700}.printer-assignments .table{min-width:650px}

/* templates-management.css */
.tmc-page{--tmc-blue:#1f62e8;--tmc-navy:#14213d;--tmc-muted:#6b7a90;--tmc-line:#dce5f0;--tmc-soft:#f6f8fb;--tmc-green:#15875a;--tmc-red:#c83c4d;min-width:0;color:var(--tmc-navy);direction:rtl}.tmc-loading,.tmc-load-error,.tmc-section-loading{min-height:420px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;color:var(--tmc-muted);background:#fff;border:1px solid var(--tmc-line);border-radius:14px}.tmc-loading i,.tmc-load-error>i{font-size:30px;color:var(--tmc-blue)}.tmc-page.is-busy{cursor:progress}.tmc-page.is-busy .tmc-content{opacity:.72;pointer-events:none}.tmc-header{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:16px;padding:2px}.tmc-heading{display:flex;align-items:center;gap:13px;min-width:0}.tmc-heading-icon{width:48px;height:48px;display:grid;place-items:center;flex:0 0 auto;border-radius:13px;color:#fff;background:var(--tmc-blue);box-shadow:0 7px 18px rgba(31,98,232,.18);font-size:19px}.tmc-breadcrumb{display:flex;align-items:center;gap:7px;margin-bottom:4px;color:#8090a6;font-size:10px;font-weight:700}.tmc-breadcrumb i{font-size:7px}.tmc-heading h1{margin:0;color:var(--tmc-navy);font-size:23px;font-weight:800}.tmc-heading p{margin:3px 0 0;color:var(--tmc-muted);font-size:12px}.tmc-header-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.tmc-header-actions .btn,.tmc-editor-actions .btn{min-height:39px;padding:8px 13px;font-size:11px;font-weight:800;border-radius:9px}.tmc-header-actions .btn-light,.tmc-editor-actions .btn-light{background:#fff;border:1px solid var(--tmc-line);color:#33445f}.tmc-sections{display:flex;align-items:center;gap:3px;margin-bottom:15px;padding:5px;background:#fff;border:1px solid var(--tmc-line);border-radius:12px;overflow-x:auto;scrollbar-width:thin}.tmc-sections button{display:flex;align-items:center;justify-content:center;gap:7px;min-height:39px;padding:7px 12px;border:0;border-radius:8px;background:transparent;color:#687990;font-size:11px;font-weight:800;white-space:nowrap;transition:.18s}.tmc-sections button:hover{background:#f2f6fc;color:#204b95}.tmc-sections button.active{background:#eaf1ff;color:#1859d5;box-shadow:inset 0 0 0 1px #cfe0ff}.tmc-content{min-height:430px}.tmc-library-toolbar{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:11px}.tmc-category-tabs{display:flex;align-items:center;gap:4px;min-width:0;padding:4px;background:#fff;border:1px solid var(--tmc-line);border-radius:10px;overflow-x:auto}.tmc-category-tabs button{display:flex;align-items:center;gap:6px;min-height:34px;padding:6px 13px;border:0;border-radius:7px;background:transparent;color:#67778c;font-size:10.5px;font-weight:800;white-space:nowrap}.tmc-category-tabs button small{padding:2px 5px;border-radius:999px;background:#eef1f5;color:#8995a5;font-size:7px}.tmc-category-tabs button.active{background:var(--tmc-blue);color:#fff}.tmc-category-tabs button.active small{background:rgba(255,255,255,.2);color:#fff}.tmc-category-tabs.compact{width:max-content;max-width:100%;margin:12px 0}.tmc-library-filters{display:flex;align-items:center;gap:8px}.tmc-search{position:relative;display:block;width:min(270px,31vw)}.tmc-search i{position:absolute;right:11px;top:11px;color:#9aa7b8;font-size:11px}.tmc-search input,.tmc-library-filters select,.tmc-section-heading select,.tmc-default-controls select,.tmc-default-row select,.tmc-form-grid input,.tmc-form-grid select,.tmc-form-grid textarea,.tmc-modal-form input,.tmc-modal-form select{width:100%;min-height:38px;padding:7px 11px;border:1px solid var(--tmc-line);border-radius:8px;background:#fff;color:var(--tmc-navy);font:inherit;font-size:11px;outline:none}.tmc-search input{padding-right:31px}.tmc-search input:focus,.tmc-library-filters select:focus,.tmc-form-grid input:focus,.tmc-form-grid select:focus,.tmc-form-grid textarea:focus{border-color:#82aaf7;box-shadow:0 0 0 3px #edf3ff}.tmc-library-filters select{width:175px}.tmc-library-summary{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:11px;color:var(--tmc-muted);font-size:10px}.tmc-library-summary>div{display:flex;align-items:baseline;gap:5px}.tmc-library-summary strong{color:var(--tmc-navy);font-size:17px}.tmc-library-summary p{margin:0}.tmc-library-summary i{color:var(--tmc-blue)}.tmc-gallery{display:grid;grid-template-columns:repeat(3,minmax(250px,1fr));gap:12px}.tmc-template-card{min-width:0;overflow:visible;background:#fff;border:1px solid var(--tmc-line);border-radius:13px;box-shadow:0 3px 12px rgba(21,37,62,.04);transition:.18s}.tmc-template-card:hover,.tmc-template-card.selected{border-color:#a9c5fb;box-shadow:0 8px 22px rgba(31,72,130,.1);transform:translateY(-2px)}.tmc-card-preview{position:relative;height:196px;overflow:hidden;padding:10px;background:#eef2f7;border-radius:13px 13px 0 0;border-bottom:1px solid var(--tmc-line)}.tmc-card-preview .invoice-thumb{position:absolute;top:10px;right:50%;margin:0;transform:translateX(50%) scale(.16);transform-origin:top center}.tmc-card-preview .invoice-thermal.invoice-thumb{transform:translateX(50%) scale(.5);transform-origin:top center}.tmc-paper{position:absolute;left:9px;bottom:8px;padding:3px 7px;border:1px solid rgba(255,255,255,.7);border-radius:6px;background:rgba(15,23,42,.72);color:#fff;font-size:8px;font-weight:800;backdrop-filter:blur(4px)}.tmc-card-body{padding:12px}.tmc-card-source{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px;color:#8995a5;font-size:8px;font-weight:700}.tmc-card-source>span:first-child{display:inline-flex;align-items:center;gap:5px;padding:3px 7px;border-radius:999px}.tmc-card-source .company{background:#eef4ff;color:#245ec4}.tmc-card-source .system{background:#f2efff;color:#6c4ec7}.tmc-card-title{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;min-height:43px}.tmc-card-title h3{margin:0 0 3px;color:var(--tmc-navy);font-size:13px;font-weight:800}.tmc-card-title p{margin:0;color:var(--tmc-muted);font-size:9px}.tmc-badges{display:flex;align-items:flex-end;flex-direction:column;gap:4px}.tmc-badge{display:inline-flex;align-items:center;gap:4px;width:max-content;padding:3px 7px;border-radius:999px;background:#eef2f7;color:#637187;font-size:8px;font-weight:800;white-space:nowrap}.tmc-badge.default,.tmc-badge.published{background:#e9f8f0;color:#16724e}.tmc-badge.draft{background:#fff5dd;color:#a96706}.tmc-badge.archived{background:#eef1f5;color:#69768a}.tmc-card-meta{display:flex;align-items:center;gap:10px;margin:9px 0;padding:8px 0;border-block:1px solid #edf1f5;color:#758499;font-size:8.5px}.tmc-card-meta span{display:flex;align-items:center;gap:4px}.tmc-card-actions{position:relative;display:flex;align-items:center;gap:5px}.tmc-card-actions>button,.tmc-card-actions summary,.tmc-version-actions button,.tmc-drafts button{min-height:31px;padding:6px 9px;border:1px solid var(--tmc-line);border-radius:7px;background:#fff;color:#42536d;font-size:9px;font-weight:800;list-style:none;cursor:pointer}.tmc-card-actions>button.primary,.tmc-drafts button.primary{background:var(--tmc-blue);border-color:var(--tmc-blue);color:#fff}.tmc-card-actions button:disabled,.tmc-version-actions button:disabled{opacity:.42;cursor:not-allowed}.tmc-card-actions details{position:relative}.tmc-card-actions summary{display:grid;place-items:center;width:31px;padding:0}.tmc-card-actions summary::-webkit-details-marker{display:none}.tmc-card-actions details>div{position:absolute;z-index:12;left:0;top:36px;display:grid;min-width:130px;padding:5px;background:#fff;border:1px solid var(--tmc-line);border-radius:9px;box-shadow:0 12px 30px rgba(15,29,52,.16)}.tmc-card-actions details button{padding:7px 9px;border:0;border-radius:6px;background:#fff;color:#3f5068;text-align:right;font-size:9px}.tmc-card-actions details button:hover{background:#f4f7fb}.tmc-card-actions details .danger{color:var(--tmc-red)}.tmc-empty{grid-column:1/-1;min-height:270px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:30px;background:#fff;border:1px dashed #cbd7e5;border-radius:13px;text-align:center}.tmc-empty>span{width:48px;height:48px;display:grid;place-items:center;border-radius:13px;background:#f1f5f9;color:#94a3b8;font-size:20px}.tmc-empty h3{margin:12px 0 5px;font-size:15px}.tmc-empty p{max-width:520px;margin:0;color:var(--tmc-muted);font-size:10px;line-height:1.7}.tmc-editor-head,.tmc-section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;margin-bottom:12px}.tmc-kicker{color:var(--tmc-blue);font-size:9px;font-weight:800}.tmc-editor-head h2,.tmc-section-heading h2{margin:3px 0;color:var(--tmc-navy);font-size:18px;font-weight:800}.tmc-editor-head p,.tmc-section-heading p{margin:0;color:var(--tmc-muted);font-size:10px}.tmc-editor-actions{display:flex;gap:7px}.tmc-editor-layout{display:grid;grid-template-columns:minmax(450px,.94fr) minmax(480px,1.06fr);gap:13px;align-items:start}.tmc-editor-panel,.tmc-editor-preview{min-width:0;width:100%;overflow:hidden;padding:15px;background:#fff;border:1px solid var(--tmc-line);border-radius:13px}.tmc-editor-preview{position:sticky;top:12px}.tmc-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.tmc-form-grid label,.tmc-default-controls label,.tmc-modal-form label{display:grid;gap:5px;color:#43536a;font-size:9px;font-weight:800}.tmc-form-grid .full,.tmc-modal-form .full{grid-column:1/-1}.tmc-form-grid input[type=color]{height:38px;padding:4px}.tmc-form-grid textarea{resize:vertical}.tmc-panel-title{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:14px 0 9px}.tmc-panel-title h3{margin:0;font-size:12px;font-weight:800}.tmc-panel-title p{margin:3px 0 0;color:var(--tmc-muted);font-size:8.5px}.tmc-panel-title>i{color:#8ca1bb}.tmc-blocks{display:grid;gap:6px}.tmc-block{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:9px;padding:8px;border:1px solid #e5ebf2;border-radius:9px;background:#fbfcfe}.tmc-block>span{width:31px;height:31px;display:grid;place-items:center;border-radius:8px;background:#eaf1ff;color:#2461c8;font-size:11px}.tmc-block strong{display:block;font-size:10px}.tmc-block p{margin:2px 0 0;color:var(--tmc-muted);font-size:7.5px;line-height:1.45}.tmc-switch input{display:none}.tmc-switch i{position:relative;display:block;width:31px;height:17px;border-radius:999px;background:#cfd8e4;transition:.2s}.tmc-switch i:after{content:"";position:absolute;top:3px;right:3px;width:11px;height:11px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.18);transition:.2s}.tmc-switch input:checked+i{background:var(--tmc-blue)}.tmc-switch input:checked+i:after{transform:translateX(-14px)}.tmc-inline-options{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0}.tmc-inline-options label{display:flex;align-items:center;gap:5px;padding:5px 8px;border:1px solid var(--tmc-line);border-radius:7px;color:#516177;font-size:8.5px}.tmc-editor-preview .template-preview-stage{max-height:760px;padding:12px}.tmc-editor-preview .invoice-paper{transform:scale(.72);transform-origin:top center;margin-bottom:-300px}.tmc-default-controls{display:flex;gap:10px;margin-bottom:12px;padding:12px;background:#fff;border:1px solid var(--tmc-line);border-radius:11px}.tmc-default-controls label{min-width:220px}.tmc-default-stack{display:grid;gap:7px}.tmc-default-row{display:grid;grid-template-columns:minmax(220px,.8fr) minmax(260px,1.2fr) auto;align-items:center;gap:10px;padding:10px 12px;background:#fff;border:1px solid var(--tmc-line);border-radius:10px}.tmc-default-row>div{display:flex;align-items:center;gap:9px}.tmc-default-row>div>span{width:33px;height:33px;display:grid;place-items:center;border-radius:9px;background:#eef4ff;color:#255ec3}.tmc-default-row strong,.tmc-default-row small{display:block}.tmc-default-row strong{font-size:10px}.tmc-default-row small{margin-top:2px;color:var(--tmc-muted);font-size:8px}.tmc-default-row .btn{min-height:36px;font-size:9px}.tmc-resolution,.tmc-system-notice,.tmc-form-note{display:flex;align-items:center;gap:10px;margin-top:11px;padding:11px 13px;border:1px solid #cfe0ff;border-radius:10px;background:#eff6ff;color:#285693}.tmc-resolution>i,.tmc-system-notice>i{font-size:17px}.tmc-resolution strong,.tmc-resolution span{display:block}.tmc-resolution strong{font-size:10px}.tmc-resolution span,.tmc-system-notice span,.tmc-form-note{font-size:8.5px}.tmc-section-heading select{width:290px}.tmc-version-list{display:grid;gap:8px}.tmc-version-list>article{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:11px;padding:11px 13px;background:#fff;border:1px solid var(--tmc-line);border-radius:10px}.tmc-version-number{width:38px;height:38px;display:grid;place-items:center;border-radius:10px;background:#eef4ff;color:#1e5bc6;font-size:11px;font-weight:900}.tmc-version-title{display:flex;align-items:center;gap:7px}.tmc-version-title strong{font-size:11px}.tmc-version-list p{margin:4px 0 0;color:var(--tmc-muted);font-size:8px}.tmc-version-actions{display:flex;gap:6px}.tmc-settings-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.tmc-settings-grid article{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:11px;padding:15px;background:#fff;border:1px solid var(--tmc-line);border-radius:11px}.tmc-settings-grid article>span{width:38px;height:38px;display:grid;place-items:center;border-radius:10px;background:#eef4ff;color:#225ec7}.tmc-settings-grid strong{display:block;font-size:11px}.tmc-settings-grid p{margin:4px 0 0;color:var(--tmc-muted);font-size:8.5px}.tmc-settings-grid b{padding:4px 7px;border-radius:999px;background:#eaf8f1;color:#14724e;font-size:8px}.tmc-settings-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-top:9px}.tmc-settings-stats article{display:flex;align-items:baseline;gap:7px;padding:13px;background:#fff;border:1px solid var(--tmc-line);border-radius:10px}.tmc-settings-stats strong{font-size:18px;color:var(--tmc-blue)}.tmc-settings-stats span{color:var(--tmc-muted);font-size:9px}.tmc-terms-card{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;margin-top:9px;padding:15px;background:#fff;border:1px solid var(--tmc-line);border-radius:11px}.tmc-terms-card>i{width:39px;height:39px;display:grid;place-items:center;border-radius:10px;background:#f4efff;color:#7653c8}.tmc-terms-card h3{margin:0;font-size:12px}.tmc-terms-card p{margin:4px 0 0;color:var(--tmc-muted);font-size:8.5px}.tmc-system-notice{margin:0;background:#f6f3ff;border-color:#ded4fa;color:#6047a7}.tmc-modal-overlay{position:fixed;inset:0;z-index:10070;display:flex;align-items:flex-start;justify-content:center;padding:24px;overflow:auto;background:rgba(15,27,48,.58);backdrop-filter:blur(4px)}.tmc-modal{width:min(960px,100%);overflow:hidden;background:#fff;border:1px solid rgba(255,255,255,.5);border-radius:15px;box-shadow:0 28px 80px rgba(9,22,43,.28)}.tmc-modal>header{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:15px 18px;border-bottom:1px solid var(--tmc-line)}.tmc-modal>header span{color:var(--tmc-blue);font-size:8px;font-weight:800}.tmc-modal>header h2{margin:3px 0 0;font-size:16px;font-weight:800}.tmc-modal>header>button{width:34px;height:34px;border:1px solid var(--tmc-line);border-radius:9px;background:#fff;color:#687990}.tmc-modal-actions{display:flex;align-items:center;justify-content:flex-end;gap:7px;padding:10px 18px;background:#f8fafc;border-bottom:1px solid var(--tmc-line)}.tmc-modal-actions>span{margin-left:auto;color:var(--tmc-green);font-size:8px;font-weight:800}.tmc-modal-actions .btn{font-size:9px}.tmc-modal-preview{padding:16px;background:#eef2f7;overflow:auto}.tmc-modal-form{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;padding:18px}.tmc-modal-form footer{display:flex;justify-content:flex-end;gap:8px;padding-top:8px;border-top:1px solid var(--tmc-line)}.tmc-form-note{margin:0}.tmc-section-loading{min-height:250px;border-style:dashed}.tmc-drafts{display:grid;gap:8px}.tmc-drafts>article{display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:10px;padding:12px;background:#fff;border:1px solid var(--tmc-line);border-radius:10px}.tmc-drafts>article>span{width:36px;height:36px;display:grid;place-items:center;border-radius:9px;background:#fff5dd;color:#a96706}.tmc-drafts strong{font-size:11px}.tmc-drafts p{margin:3px 0 0;color:var(--tmc-muted);font-size:8px}
@media(max-width:1300px){.tmc-gallery{grid-template-columns:repeat(2,minmax(250px,1fr))}.tmc-editor-layout{grid-template-columns:minmax(0,1fr)}.tmc-editor-preview{position:static}.tmc-editor-preview .invoice-paper{transform:scale(.86);margin-bottom:-150px}}
@media(max-width:900px){.tmc-header,.tmc-library-toolbar,.tmc-editor-head,.tmc-section-heading{align-items:flex-start;flex-direction:column}.tmc-header-actions,.tmc-library-filters,.tmc-category-tabs{width:100%;max-width:100%}.tmc-search{width:100%}.tmc-library-filters select{width:190px}.tmc-gallery{grid-template-columns:1fr}.tmc-default-row{grid-template-columns:1fr}.tmc-settings-grid{grid-template-columns:1fr}.tmc-editor-preview .invoice-paper{transform:scale(.7);margin-bottom:-330px}.tmc-version-list>article{grid-template-columns:auto 1fr}.tmc-version-actions{grid-column:2}.tmc-sections{margin-inline:-4px}}
@media(max-width:600px){.tmc-heading-icon{width:42px;height:42px}.tmc-heading h1{font-size:20px}.tmc-header-actions{display:grid;grid-template-columns:1fr 1fr}.tmc-header-actions .btn:last-child{grid-column:1/-1}.tmc-library-filters,.tmc-default-controls{align-items:stretch;flex-direction:column}.tmc-library-filters select,.tmc-default-controls label{width:100%;min-width:0}.tmc-form-grid,.tmc-modal-form{grid-template-columns:1fr}.tmc-form-grid .full,.tmc-modal-form .full{grid-column:1}.tmc-settings-stats{grid-template-columns:1fr}.tmc-terms-card{grid-template-columns:auto 1fr}.tmc-terms-card .btn{grid-column:1/-1}.tmc-modal-overlay{padding:0}.tmc-modal{min-height:100vh;border-radius:0}.tmc-editor-preview .invoice-paper{transform:scale(.46);margin-bottom:-610px}.tmc-card-preview{height:185px}.tmc-version-list>article{grid-template-columns:1fr}.tmc-version-actions{grid-column:1}.tmc-drafts>article{grid-template-columns:auto 1fr}.tmc-drafts button{grid-row:2}.tmc-library-summary{align-items:flex-start;flex-direction:column}}

/* Controlled invoice & document designer */
.tmc-library-filters{flex-wrap:wrap;justify-content:flex-end}.tmc-library-filters select{width:145px}.tmc-card-description{height:32px;overflow:hidden;margin:7px 0;color:var(--tmc-muted);font-size:8.5px;line-height:1.7}.tmc-badge.review,.tmc-badge.in_review{background:#eee9ff;color:#6544bd}.tmc-badge.changes_requested{background:#fff0e5;color:#b45309}.tmc-badge.approved{background:#e9f8f0;color:#16724e}.tmc-designer-shell{margin-inline:-10px}.tmc-designer-toolbar{position:sticky;top:0;z-index:40;display:grid;grid-template-columns:minmax(260px,1fr) auto minmax(480px,1.7fr);align-items:center;gap:12px;margin-bottom:8px;padding:9px 12px;background:#fff;border:1px solid var(--tmc-line);border-radius:12px;box-shadow:0 4px 14px rgba(20,33,61,.06)}.tmc-designer-identity{display:flex;align-items:center;gap:9px;min-width:0}.tmc-designer-identity>button{width:34px;height:34px;flex:0 0 auto;border:1px solid var(--tmc-line);border-radius:8px;background:#fff;color:#40516b}.tmc-designer-identity>div{min-width:0}.tmc-designer-identity span{display:block;color:var(--tmc-muted);font-size:8px;font-weight:800}.tmc-designer-identity input{width:min(260px,100%);padding:2px 0;border:0;border-bottom:1px solid transparent;background:transparent;color:var(--tmc-navy);font-size:13px;font-weight:900;outline:none}.tmc-designer-identity input:focus{border-color:var(--tmc-blue)}.tmc-save-state{display:inline-flex!important;align-items:center;gap:4px;margin-inline-start:5px;padding:3px 6px;border-radius:999px;font-size:7.5px!important;white-space:nowrap}.tmc-save-state.saved{background:#e9f8f0;color:#16724e}.tmc-save-state.pending{background:#fff5dd;color:#9a6707}.tmc-save-state.saving{background:#eef4ff;color:#1f5ec4}.tmc-save-state.error{background:#fff0f1;color:#b42336}.tmc-mode-toggle{display:flex;padding:3px;background:#eef2f7;border-radius:8px}.tmc-mode-toggle button{min-height:30px;padding:5px 11px;border:0;border-radius:6px;background:transparent;color:#687990;font-size:8.5px;font-weight:900}.tmc-mode-toggle button.active{background:#fff;color:var(--tmc-blue);box-shadow:0 2px 8px rgba(20,33,61,.08)}.tmc-designer-actions{display:flex;align-items:center;justify-content:flex-end;gap:5px;min-width:0;overflow-x:auto}.tmc-designer-actions button,.tmc-property-actions button,.tmc-saved-style-row button,.tmc-canvas-toolbar button,.tmc-designer-tree header button{display:inline-flex;align-items:center;justify-content:center;gap:5px;min-height:32px;padding:6px 8px;border:1px solid var(--tmc-line);border-radius:7px;background:#fff;color:#40516b;font-size:8.5px;font-weight:900;white-space:nowrap}.tmc-designer-actions button.primary{background:var(--tmc-blue);border-color:var(--tmc-blue);color:#fff}.tmc-designer-actions button:disabled,.tmc-property-actions button:disabled{opacity:.38;cursor:not-allowed}.tmc-designer-grid{display:grid;grid-template-columns:260px minmax(610px,1fr) 320px;gap:8px;align-items:start;direction:rtl}.tmc-designer-tree,.tmc-designer-properties{position:sticky;top:62px;max-height:calc(100vh - 86px);overflow:auto;background:#fff;border:1px solid var(--tmc-line);border-radius:11px;scrollbar-width:thin}.tmc-designer-tree{padding:11px}.tmc-designer-tree>header{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:9px}.tmc-designer-tree h3,.tmc-properties-head h3{margin:0;font-size:11px;font-weight:900}.tmc-designer-tree p,.tmc-properties-head p{margin:3px 0 0;color:var(--tmc-muted);font-size:7.5px}.tmc-tree-list{display:grid;gap:5px}.tmc-tree-item{display:grid;grid-template-columns:1fr 28px 28px;align-items:center;gap:3px;border:1px solid #e4eaf2;border-radius:8px;background:#fbfcfe;transition:.15s}.tmc-tree-item.selected{border-color:#8cb2fb;background:#eef4ff;box-shadow:0 0 0 2px #e0ebff}.tmc-tree-item.locked{background:#f4f5f7}.tmc-tree-item>button{height:34px;padding:0;border:0;background:transparent;color:#607089;font-size:9px}.tmc-tree-item>button:first-child{display:grid;grid-template-columns:13px 24px 1fr;align-items:center;gap:5px;padding:0 6px;text-align:right}.tmc-tree-item .drag{color:#a4afbf;cursor:grab}.tmc-tree-item>button span{width:23px;height:23px;display:grid;place-items:center;border-radius:6px;background:#eaf1ff;color:#2563c9}.tmc-tree-item strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:8.5px}.tmc-tree-help{display:flex;gap:7px;margin-top:9px;padding:8px;border-radius:8px;background:#f3f7fc;color:#6f7e91;font-size:7.5px;line-height:1.65}.tmc-designer-canvas{min-width:0;border:1px solid var(--tmc-line);border-radius:11px;background:#e9edf3;overflow:hidden}.tmc-canvas-toolbar{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 10px;background:#fff;border-bottom:1px solid var(--tmc-line)}.tmc-canvas-toolbar>div{display:flex;align-items:center;gap:4px}.tmc-canvas-toolbar button.active{background:#eaf1ff;color:#1f5ec4}.tmc-canvas-toolbar select{min-height:31px;padding:5px 8px;border:1px solid var(--tmc-line);border-radius:7px;color:#40516b;font-size:8.5px}.tmc-zoom span{min-width:40px;text-align:center;color:#57677e;font-size:8.5px;font-weight:900}.tmc-safe-area{position:relative;min-height:820px;padding:18px;overflow:auto;background-image:radial-gradient(#cbd5e1 1px,transparent 1px);background-size:16px 16px}.tmc-safe-area .tmc-guide{display:none;position:absolute;z-index:20;background:#f43f5e;pointer-events:none}.tmc-page.is-dragging .tmc-guide{display:block}.tmc-guide.vertical{top:0;bottom:0;right:50%;width:1px}.tmc-guide.horizontal{right:0;left:0;top:50%;height:1px}#tmc-designer-stage{width:max-content;min-width:100%;transform-origin:top center}#tmc-designer-stage .invoice-paper{position:relative;transform:scale(var(--designer-zoom,.72));transform-origin:top center;margin:0 auto;transition:transform .18s}#tmc-designer-stage .invoice-designer-block{position:relative;cursor:pointer;transition:outline-color .15s,box-shadow .15s}#tmc-designer-stage .invoice-designer-block:hover{outline:1px dashed #6f9cf4;outline-offset:3px}#tmc-designer-stage .invoice-designer-block.is-selected{outline:2px solid #2563eb;outline-offset:4px;box-shadow:0 0 0 7px rgba(37,99,235,.08)}#tmc-designer-stage .invoice-designer-block.is-selected:before{content:attr(data-template-block);position:absolute;z-index:5;top:-20px;right:0;padding:2px 6px;border-radius:4px;background:#2563eb;color:#fff;font:700 8px Tajawal}.tmc-designer-properties{padding:11px}.tmc-properties-head{display:flex;align-items:center;gap:8px;margin-bottom:9px}.tmc-properties-head>span{width:34px;height:34px;display:grid;place-items:center;flex:0 0 auto;border-radius:9px;background:#eaf1ff;color:#235dc4}.tmc-property-actions{display:flex;gap:4px;flex-wrap:wrap;margin-bottom:10px}.tmc-property-actions .danger{color:#b42336}.tmc-property-section,.tmc-page-properties{padding-top:10px;margin-top:10px;border-top:1px solid #edf1f5}.tmc-property-section h4,.tmc-page-properties h4{margin:0 0 8px;font-size:9.5px;font-weight:900}.tmc-property-section>p{margin:-4px 0 7px;color:var(--tmc-muted);font-size:7px}.tmc-property-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px}.tmc-property-grid.one{grid-template-columns:1fr;margin-bottom:8px}.tmc-property-grid label,.tmc-margin-grid label,.tmc-change-summary{display:grid;gap:4px;color:#526178;font-size:7.5px;font-weight:900}.tmc-property-grid input,.tmc-property-grid select,.tmc-property-grid textarea,.tmc-margin-grid input,.tmc-saved-style-row select,.tmc-change-summary textarea{width:100%;min-height:33px;padding:5px 7px;border:1px solid var(--tmc-line);border-radius:7px;background:#fff;color:#263750;font:inherit;font-size:8.5px;outline:none}.tmc-property-grid input[type=color]{padding:3px}.tmc-property-grid input:focus,.tmc-property-grid select:focus,.tmc-property-grid textarea:focus{border-color:#82aaf7;box-shadow:0 0 0 2px #edf3ff}.tmc-margin-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:5px}.tmc-column-list{display:grid;gap:4px}.tmc-column-list article{display:grid;grid-template-columns:12px 1fr auto 42px;align-items:center;gap:4px;padding:5px;border:1px solid #e5ebf2;border-radius:7px;background:#fbfcfe}.tmc-column-list article>i{color:#a4afbf;cursor:grab}.tmc-column-list input{min-width:0;height:28px;padding:4px 5px;border:1px solid var(--tmc-line);border-radius:5px;font-size:7.5px}.tmc-column-list input.width{text-align:center}.tmc-saved-style-row{display:grid;grid-template-columns:1fr auto auto;gap:4px}.tmc-saved-style-row button{padding-inline:6px}.tmc-health-head{display:flex;align-items:center;justify-content:space-between;margin-top:12px;padding-top:11px;border-top:1px solid #edf1f5}.tmc-health-head>div{display:flex;align-items:center;gap:6px}.tmc-health-head strong{font-size:9px}.tmc-health-head span{color:var(--tmc-blue);font-size:12px;font-weight:900}.tmc-health-head>i{color:#1b8b62}.tmc-health-bar{height:6px;margin:7px 0;border-radius:99px;background:#edf1f5;overflow:hidden}.tmc-health-bar i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#2563eb,#20a36c)}.tmc-health-issues{display:grid;gap:4px}.tmc-health-issues button{display:flex;align-items:flex-start;gap:5px;padding:6px;border:0;border-radius:6px;text-align:right;font-size:7.5px;line-height:1.55}.tmc-health-issues .critical{background:#fff0f1;color:#a51d30}.tmc-health-issues .warning{background:#fff7e8;color:#946105}.tmc-health-ok{margin:6px 0;padding:7px;border-radius:7px;background:#eaf8f1;color:#14724e;font-size:7.5px}.tmc-change-summary{margin-top:10px}.tmc-version-workspace{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:10px}.tmc-review-feed{padding:13px;background:#fff;border:1px solid var(--tmc-line);border-radius:10px}.tmc-review-feed h3{margin:0 0 10px;font-size:11px}.tmc-review-feed article{padding:8px 0;border-bottom:1px solid #edf1f5}.tmc-review-feed article span,.tmc-review-feed article small{display:block}.tmc-review-feed article span{font-size:9px;font-weight:900}.tmc-review-feed article small{margin-top:2px;color:var(--tmc-muted);font-size:7px}.tmc-review-feed article p{margin:5px 0 0!important;color:#45556d!important;font-size:8px!important;line-height:1.65}.tmc-health-mini{color:#1a8059;font-size:8px;font-weight:900}.tmc-brand-layout{display:grid;grid-template-columns:minmax(360px,.9fr) minmax(440px,1.1fr);gap:10px;margin-bottom:10px}.tmc-brand-card,.tmc-brand-assets{padding:15px;background:#fff;border:1px solid var(--tmc-line);border-radius:11px}.tmc-brand-card .btn{margin-top:12px}.tmc-brand-assets{display:grid;grid-template-columns:1fr 1fr;gap:8px}.tmc-brand-asset{position:relative;min-height:142px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;padding:10px;border:1px dashed #cbd7e5;border-radius:9px;background:#fafcff;color:#6c7b8f;text-align:center;cursor:pointer}.tmc-brand-asset:hover{border-color:#82aaf7;background:#f2f7ff}.tmc-brand-asset input{position:absolute;inset:0;opacity:0;cursor:pointer}.tmc-brand-asset img{max-width:110px;max-height:72px;object-fit:contain}.tmc-brand-asset>i{font-size:22px}.tmc-brand-asset b{font-size:9px}.tmc-brand-asset small{font-size:7px}.invoice-paper{padding:var(--tpl-margin-top,12mm) var(--tpl-margin-right,12mm) var(--tpl-margin-bottom,12mm) var(--tpl-margin-left,12mm);line-height:var(--tpl-line-height,1.45)}.invoice-designer-block{box-sizing:border-box;break-inside:avoid}.invoice-document-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:2mm;padding:3mm 0}.invoice-document-strip>div{padding:2.5mm;border:1px solid #e3e8ef;border-radius:2mm}.invoice-document-strip span,.invoice-document-strip strong{display:block}.invoice-document-strip span{color:#78869a;font-size:.66rem}.invoice-document-strip strong{margin-top:1mm;font-size:.76rem}.invoice-totals-block{display:flex;justify-content:flex-end}.invoice-totals-block .invoice-summary{width:75mm}.invoice-payment-summary{display:grid;grid-template-columns:1fr 1fr;gap:3mm;margin-right:auto;width:75mm}.invoice-payment-summary>div{display:flex;justify-content:space-between;gap:5mm;padding:3mm;border:1px solid #e2e8f0;border-radius:2mm;font-size:.73rem}.invoice-text-block{padding:2.5mm 0;color:#526174;font-size:.72rem}.invoice-text-block strong{color:var(--tpl-primary)}.invoice-text-block p{margin:1.2mm 0 0;white-space:pre-wrap}.invoice-qr-block{text-align:center}.invoice-qr-block .invoice-qr svg{max-width:34mm;height:auto}.invoice-signature span{min-width:55mm;text-align:center}.invoice-signature img{display:block;max-width:35mm;max-height:22mm;margin:0 auto 2mm;object-fit:contain}.invoice-copy-type{position:absolute;top:4mm;left:5mm;padding:1.5mm 3mm;border:1px solid #ccd5e1;border-radius:999px;color:#64748b;font-size:.62rem}.invoice-footer{display:flex;justify-content:center;gap:8mm}.invoice-paper.preset-modern .invoice-head,.invoice-paper.preset-saas .invoice-head{padding:6mm;border:0;border-radius:4mm;background:color-mix(in srgb,var(--tpl-primary) 8%,white)}.invoice-paper.preset-modern .invoice-meta>div,.invoice-paper.preset-saas .invoice-meta>div{padding:4mm;border:1px solid #e4eaf2;border-radius:3mm}.invoice-paper.preset-executive .invoice-head{margin:-6mm -6mm 0;padding:7mm;background:var(--tpl-primary);border:0;border-radius:2mm;color:#fff}.invoice-paper.preset-executive .invoice-logo,.invoice-paper.preset-executive .invoice-title strong{color:#fff}.invoice-paper.preset-executive .invoice-total-badge{background:#fff;color:var(--tpl-primary)}.invoice-paper.preset-minimal .invoice-head{border-width:1px}.invoice-paper.preset-minimal .invoice-total-badge{padding:0;background:transparent;color:#111827;text-align:left}.invoice-paper.preset-minimal .invoice-items th{border-block:1px solid #dbe2ea;background:#fff;color:#1f2937}.invoice-paper.preset-premium .invoice-head{grid-template-columns:1fr;text-align:center;border:3px double var(--tpl-secondary)}.invoice-paper.preset-premium .invoice-logo,.invoice-paper.preset-premium .invoice-total-badge{justify-self:center}.invoice-paper.preset-premium .invoice-total-badge{background:transparent;color:var(--tpl-primary);border:1px solid var(--tpl-secondary)}.invoice-paper.preset-arabic-corporate .invoice-head{grid-template-columns:1fr 1fr}.invoice-paper.preset-arabic-corporate .invoice-title{text-align:right}.invoice-paper.preset-arabic-corporate .invoice-total-badge{grid-column:2;grid-row:1;align-self:start}.invoice-paper.preset-arabic-corporate .invoice-logo{grid-column:1;grid-row:1}.invoice-paper.preset-retail{--tpl-gap:6px}.invoice-paper.preset-retail .invoice-head{padding-bottom:4mm}.invoice-paper.preset-retail .invoice-items th,.invoice-paper.preset-retail .invoice-items td{padding:1.7mm 1mm}.invoice-paper.preset-service .invoice-items th:nth-child(2),.invoice-paper.preset-service .invoice-items td:nth-child(2){width:48%!important}.invoice-paper.preset-zatca .invoice-head{border-bottom:4px double var(--tpl-primary)}.invoice-paper.preset-zatca .invoice-qr-block{padding:3mm;border:1px solid #b9d8c3;border-radius:3mm;background:#f4fbf6}.invoice-paper.invoice-thermal{width:80mm;min-height:150mm;padding:5mm;box-shadow:0 4px 16px rgba(15,23,42,.14)}.invoice-paper.invoice-thermal .invoice-head{grid-template-columns:1fr;text-align:center;padding-bottom:4mm}.invoice-paper.invoice-thermal .invoice-logo,.invoice-paper.invoice-thermal .invoice-total-badge{justify-self:center}.invoice-paper.invoice-thermal .invoice-meta,.invoice-paper.invoice-thermal .invoice-document-strip{grid-template-columns:1fr}.invoice-paper.invoice-thermal .invoice-items{font-size:.6rem}.invoice-paper.invoice-thermal .invoice-items th,.invoice-paper.invoice-thermal .invoice-items td{padding:1.5mm .6mm}.invoice-paper.invoice-thermal .invoice-totals-block,.invoice-paper.invoice-thermal .invoice-payment-summary{display:block;width:100%}.invoice-paper.invoice-thermal .invoice-summary{width:100%}
@media(max-width:1500px){.tmc-designer-grid{grid-template-columns:235px minmax(560px,1fr) 290px}.tmc-designer-toolbar{grid-template-columns:250px auto 1fr}.tmc-designer-actions button{padding-inline:6px}.tmc-library-filters select{width:130px}}
@media(max-width:1180px){.tmc-designer-toolbar{position:static;grid-template-columns:1fr auto}.tmc-designer-actions{grid-column:1/-1;justify-content:flex-start}.tmc-designer-grid{grid-template-columns:220px minmax(560px,1fr)}.tmc-designer-properties{position:static;grid-column:1/-1;max-height:none}.tmc-property-grid{grid-template-columns:repeat(4,1fr)}.tmc-version-workspace,.tmc-brand-layout{grid-template-columns:1fr}.tmc-designer-tree{top:10px}}
@media(max-width:820px){.tmc-designer-shell{margin:0}.tmc-designer-toolbar{grid-template-columns:1fr}.tmc-mode-toggle{width:max-content}.tmc-designer-grid{grid-template-columns:1fr}.tmc-designer-tree,.tmc-designer-properties{position:static;max-height:none}.tmc-tree-list{grid-template-columns:repeat(2,1fr)}.tmc-safe-area{min-height:620px}.tmc-property-grid{grid-template-columns:repeat(2,1fr)}.tmc-brand-assets{grid-template-columns:1fr 1fr}.invoice-document-strip{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.tmc-tree-list,.tmc-property-grid,.tmc-brand-assets{grid-template-columns:1fr}.tmc-designer-actions{flex-wrap:wrap;overflow:visible}.tmc-canvas-toolbar{align-items:stretch;flex-direction:column}.tmc-canvas-toolbar>div{width:100%}.tmc-canvas-toolbar select{min-width:0;flex:1}.tmc-safe-area{padding:8px}.tmc-margin-grid{grid-template-columns:repeat(2,1fr)}.tmc-version-workspace{display:block}.tmc-review-feed{margin-top:10px}}

/* Final responsive and thermal paper safeguards. */
.tmc-sections,.tmc-category-tabs,.tmc-designer-actions{scrollbar-width:none}
.tmc-sections::-webkit-scrollbar,.tmc-category-tabs::-webkit-scrollbar,.tmc-designer-actions::-webkit-scrollbar{display:none}
/* The continuous document (designer canvas, thumbnails) takes the paper width of its template; the preview, the print and
   the PDF use the paginated sheets of document-print.css. */
.invoice-paper.accman-template-document.invoice-thermal{width:80mm;min-height:0}
.invoice-paper.accman-template-document.invoice-thermal.paper-58mm,.invoice-paper.accman-template-document.invoice-thermal.preset-thermal-58{width:58mm}
.invoice-paper.accman-template-document.paper-a4landscape{width:297mm;min-height:210mm}
.invoice-paper.accman-template-document.paper-letter{width:216mm;min-height:279mm}

.tmc-quick-actions{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:10px;padding-bottom:9px;border-bottom:1px solid #edf1f5}
.tmc-quick-actions button,.tmc-column-move button{display:inline-flex;align-items:center;justify-content:center;gap:4px;min-height:29px;padding:5px 7px;border:1px solid var(--tmc-line);border-radius:6px;background:#fff;color:#40516b;font-size:7.5px;font-weight:900}
.tmc-quick-actions select{min-height:29px;padding:4px 7px;border:1px solid var(--tmc-line);border-radius:6px;background:#fff;color:#40516b;font-size:7.5px;font-weight:800}
.tmc-quick-actions button:disabled,.tmc-column-move button:disabled{opacity:.38}
.tmc-column-list article{grid-template-columns:12px minmax(70px,1fr) auto 42px auto}
.tmc-column-move{display:flex;gap:2px}.tmc-column-move button{width:24px;min-height:26px;padding:0}
.tmc-canvas-toolbar #tmc-preview-scenario,.tmc-canvas-toolbar #tmc-zoom-preset{max-width:145px}
.tmc-reset-template{width:100%;margin-top:8px;font-size:8px!important}
.invoice-paper{position:relative;overflow-wrap:anywhere}.invoice-paper .invoice-title strong,.invoice-paper .invoice-items td,.invoice-paper .invoice-document-strip strong{word-break:normal;overflow-wrap:anywhere}
.invoice-watermark{position:absolute;z-index:0;top:43%;right:10%;left:10%;transform:rotate(-28deg);color:color-mix(in srgb,var(--tpl-primary) 11%,transparent);font:900 68px/1 Arial,sans-serif;letter-spacing:7px;text-align:center;pointer-events:none}.invoice-designer-block,.invoice-copy-type{position:relative;z-index:1}
.invoice-paper.print-monochrome{--tpl-primary:#111!important;--tpl-secondary:#555!important;filter:grayscale(1)}
.invoice-paper.print-economy .invoice-head,.invoice-paper.print-economy .invoice-total-badge,.invoice-paper.print-economy .invoice-items th{background:#fff!important;color:#111!important;border-color:#777!important}.invoice-paper.print-economy{--tpl-primary:#222!important;--tpl-secondary:#666!important}
@media(max-width:560px){.tmc-column-list article{grid-template-columns:12px minmax(65px,1fr) auto 38px}.tmc-column-move{grid-column:2/-1;justify-content:flex-end}}

/* Fixed Arabic invoice collection: structure is locked, logo and its size stay editable. */
.tmc-badge.logo-only{background:#eef4ff;color:#235dc4}.tmc-logo-only-editor{grid-template-columns:240px minmax(610px,1fr) 300px}.tmc-logo-only-info{display:grid;gap:10px}.tmc-logo-only-lock{width:44px;height:44px;display:grid;place-items:center;border-radius:12px;background:#eef4ff;color:#2563eb;font-size:18px}.tmc-logo-only-info h3{margin:0;font-size:12px}.tmc-logo-only-info p{margin:0;color:var(--tmc-muted);font-size:8.5px;line-height:1.8}.tmc-logo-only-list{display:grid;gap:7px;margin-top:3px}.tmc-logo-only-list span{display:flex;align-items:center;gap:7px;padding:8px;border-radius:8px;background:#f7f9fc;color:#536278;font-size:8px;font-weight:800}.tmc-logo-only-list i{color:#1c8a5d}.tmc-logo-control{display:grid;gap:11px}.tmc-logo-control-head{display:flex;align-items:center;gap:9px}.tmc-logo-control-head>span{width:36px;height:36px;display:grid;place-items:center;border-radius:10px;background:#eef4ff;color:#245fc8}.tmc-logo-control-head h3{margin:0;font-size:11px}.tmc-logo-control-head p{margin:3px 0 0;color:var(--tmc-muted);font-size:7.5px}.tmc-logo-upload{position:relative;min-height:122px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:12px;border:1px dashed #b9c9dd;border-radius:10px;background:#fafcff;color:#607089;text-align:center;cursor:pointer}.tmc-logo-upload:hover{border-color:#75a1f4;background:#f2f7ff}.tmc-logo-upload input{position:absolute;inset:0;opacity:0;cursor:pointer}.tmc-logo-upload img{max-width:160px;max-height:74px;object-fit:contain}.tmc-logo-upload>i{font-size:22px;color:#7f91a8}.tmc-logo-upload b{font-size:9px}.tmc-logo-upload small{font-size:7px}.tmc-logo-size-control{padding:10px;border:1px solid #e1e8f1;border-radius:9px;background:#fff}.tmc-logo-size-control>div{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px;color:#526178;font-size:8px;font-weight:900}.tmc-logo-size-control output{padding:3px 7px;border-radius:999px;background:#eef4ff;color:#245fc8}.tmc-logo-size-control input[type=range]{width:100%;accent-color:#2563eb}.tmc-logo-size-control input[type=number]{width:100%;min-height:34px;margin-top:8px;padding:5px 8px;border:1px solid var(--tmc-line);border-radius:7px;font:inherit;font-size:9px}.tmc-logo-only-note{display:flex;gap:7px;padding:9px;border-radius:8px;background:#f0f7ff;color:#315b91;font-size:7.5px;line-height:1.7}.tmc-logo-only-actions{display:grid;gap:6px}.tmc-logo-only-actions button{min-height:34px;border:1px solid var(--tmc-line);border-radius:8px;background:#fff;color:#40516b;font-size:8.5px;font-weight:900}.tmc-logo-only-actions button:disabled{opacity:.4}.tmc-logo-only-editor #tmc-designer-stage .invoice-designer-block{cursor:default}.tmc-logo-only-editor #tmc-designer-stage .invoice-designer-block:hover{outline:0}.tmc-logo-only-editor #tmc-designer-stage .invoice-designer-block.is-selected{outline:0;box-shadow:none}.tmc-logo-only-editor #tmc-designer-stage .invoice-designer-block.is-selected:before{display:none}

.invoice-paper[class*="preset-arabic-invoice-"]{--tpl-gap:9px;background:#fff;color:#17233b}.invoice-paper[class*="preset-arabic-invoice-"] .invoice-head{min-height:25mm;padding:3mm 0;border:0;border-bottom:1.5px solid var(--tpl-primary);border-radius:0;background:#fff}.invoice-paper[class*="preset-arabic-invoice-"] .invoice-logo{font-size:1.25rem;font-weight:900;color:var(--tpl-primary)}.invoice-paper[class*="preset-arabic-invoice-"] .invoice-title span{color:var(--tpl-primary);font-size:1.45rem;font-weight:900}.invoice-paper[class*="preset-arabic-invoice-"] .invoice-title strong{margin-top:1mm;font-size:.74rem;font-weight:700}.invoice-paper[class*="preset-arabic-invoice-"] .invoice-meta{gap:3mm}.invoice-paper[class*="preset-arabic-invoice-"] .invoice-meta>div{padding:3mm;border:0;border-radius:0;background:#fff}.invoice-paper[class*="preset-arabic-invoice-"] .invoice-meta h4{padding-bottom:1.5mm;border-bottom:1px solid #dbe2ea;color:var(--tpl-primary)}.invoice-paper[class*="preset-arabic-invoice-"] .invoice-items{border:1px solid #d5dde8}.invoice-paper[class*="preset-arabic-invoice-"] .invoice-items th{background:var(--tpl-primary);color:#fff}.invoice-paper[class*="preset-arabic-invoice-"] .invoice-items td{border-bottom:1px solid #e5eaf0}.invoice-paper[class*="preset-arabic-invoice-"] .invoice-summary .grand{background:var(--tpl-primary);color:#fff}.invoice-paper[class*="preset-arabic-invoice-"] .invoice-footer{color:#718096;border-top:1px solid #e2e8f0}
.invoice-paper.preset-arabic-invoice-1 .invoice-head{grid-template-columns:1fr 1.4fr}.invoice-paper.preset-arabic-invoice-1 .invoice-title{text-align:right}.invoice-paper.preset-arabic-invoice-1 .invoice-document-strip{border-block:1px solid #d9e0e8}.invoice-paper.preset-arabic-invoice-1 .invoice-document-strip>div{border:0;border-inline-end:1px solid #e3e8ef;border-radius:0}
.invoice-paper.preset-arabic-invoice-2 .invoice-head{border-top:4px solid var(--tpl-primary);border-bottom:0}.invoice-paper.preset-arabic-invoice-2 .invoice-title{padding:3mm;border-inline-start:1px solid #dbe2ea}.invoice-paper.preset-arabic-invoice-2 .invoice-document-strip>div{padding:2mm;border:0;border-bottom:1px solid #dce3ec;border-radius:0}.invoice-paper.preset-arabic-invoice-2 .invoice-items th{background:#273449}
.invoice-paper.preset-arabic-invoice-3 .invoice-head{grid-template-columns:1fr;text-align:center;border-bottom:3px double var(--tpl-primary)}.invoice-paper.preset-arabic-invoice-3 .invoice-logo,.invoice-paper.preset-arabic-invoice-3 .invoice-title{justify-self:center;text-align:center}.invoice-paper.preset-arabic-invoice-3 .invoice-document-strip{padding:0;border:1px solid #d9e1eb}.invoice-paper.preset-arabic-invoice-3 .invoice-document-strip>div{border:0;border-inline-end:1px solid #d9e1eb;border-radius:0;background:#f8fafc}
.invoice-paper.preset-arabic-invoice-4 .invoice-head{margin:-3mm -3mm 0;padding:5mm;background:var(--tpl-primary);color:#fff}.invoice-paper.preset-arabic-invoice-4 .invoice-logo,.invoice-paper.preset-arabic-invoice-4 .invoice-title span,.invoice-paper.preset-arabic-invoice-4 .invoice-title strong{color:#fff}.invoice-paper.preset-arabic-invoice-4 .invoice-total-badge{background:#fff;color:var(--tpl-primary)}.invoice-paper.preset-arabic-invoice-4 .invoice-document-strip>div{background:#f7f9fc}.invoice-paper.preset-arabic-invoice-4 .invoice-payment-summary>div{border-color:#cfd9e7;background:#f8fafc}
.invoice-paper.preset-arabic-invoice-5 .invoice-head{border-bottom:4px double var(--tpl-primary)}.invoice-paper.preset-arabic-invoice-5 .invoice-meta>div:first-child{border-inline-end:3px solid var(--tpl-secondary)}.invoice-paper.preset-arabic-invoice-5 .invoice-qr-block{width:42mm;margin-inline-start:auto;padding:3mm;border:1px solid #c7ddd2;background:#f7fcf9}.invoice-paper.preset-arabic-invoice-5 .invoice-items th{background:#17365d}
.invoice-paper.preset-arabic-invoice-6 .invoice-head{padding:5mm;border:1px solid #d8e0ea;background:#f8fafc}.invoice-paper.preset-arabic-invoice-6 .invoice-total-badge{border-radius:0;background:var(--tpl-primary)}.invoice-paper.preset-arabic-invoice-6 .invoice-document-strip>div{border-radius:0}.invoice-paper.preset-arabic-invoice-6 .invoice-payment-summary{width:100%}.invoice-paper.preset-arabic-invoice-6 .invoice-payment-summary>div{background:#f3f6fa}.invoice-paper.preset-arabic-invoice-6 .invoice-items th{background:#111827}
.invoice-paper.preset-arabic-invoice-7{filter:grayscale(1)}.invoice-paper.preset-arabic-invoice-7 .invoice-head{grid-template-columns:1fr;text-align:center}.invoice-paper.preset-arabic-invoice-7 .invoice-logo,.invoice-paper.preset-arabic-invoice-7 .invoice-title{justify-self:center;text-align:center}.invoice-paper.preset-arabic-invoice-7 .invoice-document-strip>div,.invoice-paper.preset-arabic-invoice-7 .invoice-meta>div{padding:1.8mm}.invoice-paper.preset-arabic-invoice-7 .invoice-items th{background:#fff;color:#111;border-block:1px solid #111}.invoice-paper.preset-arabic-invoice-7 .invoice-summary .grand{background:#fff;color:#111;border-block:2px solid #111}
.invoice-paper.preset-arabic-invoice-8{border-top:5px solid var(--tpl-primary)}.invoice-paper.preset-arabic-invoice-8 .invoice-head{padding-bottom:6mm;border-bottom:1px solid var(--tpl-secondary)}.invoice-paper.preset-arabic-invoice-8 .invoice-title span{letter-spacing:.3px}.invoice-paper.preset-arabic-invoice-8 .invoice-meta>div{border-inline-start:2px solid var(--tpl-secondary);background:#f8fafc}.invoice-paper.preset-arabic-invoice-8 .invoice-items th{background:var(--tpl-primary)}.invoice-paper.preset-arabic-invoice-8 .invoice-summary{border-top:3px double var(--tpl-primary)}

/* Canonical document renderer. Keep every invoice-template surface independent
   from legacy sales/purchase table and card selectors. */
.invoice-paper.accman-template-document {
    position: relative;
    width: 210mm;
    min-height: 297mm;
    margin: 0 auto;
    padding: var(--tpl-margin-top, 12mm) var(--tpl-margin-right, 12mm) var(--tpl-margin-bottom, 12mm) var(--tpl-margin-left, 12mm);
    box-sizing: border-box;
    overflow: visible;
    background: #fff;
    color: #1d2330;
    font-family: var(--tpl-font, Tajawal), Arial, sans-serif;
    font-size: var(--tpl-size, 12px);
    line-height: var(--tpl-line-height, 1.45);
    box-shadow: 0 7px 25px rgba(21, 27, 45, .14);
    text-align: start;
}
.invoice-paper.accman-template-document *,
.invoice-paper.accman-template-document *::before,
.invoice-paper.accman-template-document *::after { box-sizing: border-box; }
.invoice-paper.accman-template-document .invoice-designer-block { width: 100%; max-width: 100%; min-width: 0; margin-block: var(--tpl-gap, 12px); }
.invoice-paper.accman-template-document .invoice-head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    align-items: center;
    gap: 12px;
    padding-bottom: 9mm;
    border-bottom: 2px solid var(--tpl-primary, #6246e5);
}
.invoice-paper.accman-template-document .invoice-logo { min-width: 0; color: var(--tpl-primary, #6246e5); font-size: 1.65rem; font-weight: 900; }
.invoice-paper.accman-template-document .invoice-logo img { display: block; max-width: 100%; object-fit: contain; }
.invoice-paper.accman-template-document .invoice-title { min-width: 0; text-align: center; }
.invoice-paper.accman-template-document .invoice-title span,
.invoice-paper.accman-template-document .invoice-title strong,
.invoice-paper.accman-template-document .invoice-title small { display: block; overflow-wrap: anywhere; }
.invoice-paper.accman-template-document .invoice-title span { font-size: 1.35rem; font-weight: 800; }
.invoice-paper.accman-template-document .invoice-title strong { margin-top: 4px; color: var(--tpl-secondary, #626a7c); font-family: Inter, Tajawal, sans-serif; unicode-bidi: isolate; }
.invoice-paper.accman-template-document .invoice-total-badge { justify-self: end; min-width: 48mm; padding: 4mm; border-radius: 3mm; color: #fff; background: var(--tpl-primary, #6246e5); }
.invoice-paper.accman-template-document .invoice-total-badge small,
.invoice-paper.accman-template-document .invoice-total-badge strong { display: block; }
.invoice-paper.accman-template-document .invoice-total-badge strong { margin-top: 2mm; font-size: 1.05rem; unicode-bidi: isolate; }
.invoice-paper.accman-template-document .invoice-meta { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7mm; padding: 8mm 0; }
.invoice-paper.accman-template-document .invoice-meta > div { min-width: 0; }
/* Thermal paper: one column, compact fields (the A4 three-column head put one letter per line on a receipt). */
.invoice-paper.accman-template-document.invoice-thermal .invoice-head { grid-template-columns: minmax(0, 1fr); gap: 2mm; padding-bottom: 3mm; text-align: center; }
.invoice-paper.accman-template-document.invoice-thermal .invoice-logo { font-size: 1.15rem; }
.invoice-paper.accman-template-document.invoice-thermal .invoice-logo img { margin-inline: auto; }
.invoice-paper.accman-template-document.invoice-thermal .invoice-title span { font-size: 1.05rem; }
.invoice-paper.accman-template-document.invoice-thermal .invoice-total-badge { justify-self: stretch; min-width: 0; padding: 2mm; }
.invoice-paper.accman-template-document.invoice-thermal .invoice-document-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1mm; padding: 1.5mm 0; }
.invoice-paper.accman-template-document.invoice-thermal .invoice-document-strip > div { padding: 1mm; }
.invoice-paper.accman-template-document.invoice-thermal .invoice-meta { grid-template-columns: minmax(0, 1fr); gap: 2mm; padding: 2mm 0; }
.invoice-paper.accman-template-document.invoice-thermal .thermal-items { table-layout: auto; width: 100%; font-size: .82em; }
.invoice-paper.accman-template-document.invoice-thermal .thermal-items th,
.invoice-paper.accman-template-document.invoice-thermal .thermal-items td { padding: 1mm .8mm; vertical-align: top; }
.invoice-paper.accman-template-document.invoice-thermal .thermal-items td[dir="ltr"], .invoice-paper.accman-template-document.invoice-thermal .thermal-items th[dir="ltr"] { white-space: nowrap; text-align: end; }
.invoice-paper.accman-template-document.invoice-thermal .thermal-items .thermal-description { width: 40%; text-align: start; overflow-wrap: anywhere; }
.invoice-paper.accman-template-document.invoice-thermal .thermal-items .thermal-description small { display: block; color: #555d6c; font-size: .9em; }
.invoice-paper.accman-template-document .invoice-meta h4 { margin: 0 0 2.5mm; color: var(--tpl-primary, #6246e5); font-size: .92rem; }
.invoice-paper.accman-template-document .invoice-meta p { margin: 1.3mm 0; color: #555d6c; font-size: .77rem; overflow-wrap: anywhere; }
.invoice-paper.accman-template-document .invoice-items {
    width: 100%;
    max-width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
    table-layout: fixed;
    font-size: .74rem;
}
.invoice-paper.accman-template-document .invoice-items th,
.invoice-paper.accman-template-document .invoice-items td { min-width: 0; max-width: 0; vertical-align: middle; line-height: 1.45; }
.invoice-paper.accman-template-document .invoice-items [style*="--invoice-column-width"] { width: var(--invoice-column-width) !important; }
.invoice-paper.accman-template-document .invoice-items th { padding: 3.2mm 2mm; color: #fff; background: var(--tpl-primary, #6246e5); font-weight: 700; overflow-wrap: anywhere; }
.invoice-paper.accman-template-document .invoice-items td { padding: 3mm 2mm; border-bottom: 1px solid #e3e5eb; white-space: normal; word-break: normal; overflow-wrap: anywhere; }
.invoice-paper.accman-template-document .invoice-items td[dir="ltr"],
.invoice-paper.accman-template-document .invoice-items th[dir="ltr"] { direction: ltr; unicode-bidi: isolate; white-space: nowrap; overflow-wrap: normal; }
.invoice-paper.accman-template-document .invoice-items .invoice-column-description,
.invoice-paper.accman-template-document .invoice-items .invoice-column-notes { text-wrap: pretty; }
.invoice-paper.accman-template-document .invoice-items tbody tr:nth-child(even) td { background: #fafaff; }
.invoice-paper.accman-template-document.table-soft .invoice-items th { color: #273449; background: color-mix(in srgb, var(--tpl-primary) 9%, white); }
.invoice-paper.accman-template-document.table-compact .invoice-items th,
.invoice-paper.accman-template-document.table-compact .invoice-items td { padding-block: 1.8mm; }
.invoice-paper.accman-template-document .invoice-summary > div { display: flex; justify-content: space-between; gap: 6mm; padding: 2.2mm 0; border-bottom: 1px solid #e7e8ed; font-size: .76rem; }
.invoice-paper.accman-template-document .invoice-summary .grand { padding: 3mm; margin: 2mm 0; border: 0; border-radius: 2mm; color: var(--tpl-primary, #6246e5); background: #f1efff; font-size: .88rem; }
.invoice-paper.accman-template-document .invoice-signature { display: flex; justify-content: space-around; gap: 12mm; margin-top: 18mm; color: #596171; }
.invoice-paper.accman-template-document .invoice-footer { margin-top: 14mm; padding-top: 4mm; border-top: 1px solid #dfe2e9; color: #858c9b; text-align: center; font-size: .68rem; }
.invoice-paper.accman-template-document bdi { direction: ltr; unicode-bidi: isolate; }

@media(max-width:1180px){.tmc-logo-only-editor{grid-template-columns:220px minmax(560px,1fr)}.tmc-logo-only-editor .tmc-designer-properties{grid-column:1/-1}}

/* ACCMAN professional print library: six production presets, all using the
   canonical renderer and data contract. Borders retain hierarchy when browser
   background graphics are disabled. */
.tmc-breadcrumb{display:flex;align-items:center;gap:7px;flex-wrap:wrap}.tmc-breadcrumb button{border:0;padding:0;background:transparent;color:var(--tmc-primary,#2563eb);font:inherit;cursor:pointer}.tmc-breadcrumb button:hover{text-decoration:underline}.tmc-breadcrumb span{color:var(--tmc-muted,#64748b);font-weight:800}
.tmc-professional-intro{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:0 0 16px;padding:20px 22px;border:1px solid #cbd5e1;border-radius:16px;background:#fff}.tmc-professional-intro span{color:#2563eb;font-size:10px;font-weight:900;letter-spacing:1px}.tmc-professional-intro h2{margin:5px 0;font-size:19px;color:#132238}.tmc-professional-intro p{max-width:720px;margin:0;color:#5b687c;font-size:12px;line-height:1.8}.tmc-professional-intro>i{display:grid;place-items:center;width:54px;height:54px;border:1px solid #bfdbfe;border-radius:14px;color:#1d4ed8;background:#eff6ff;font-size:24px}.tmc-professional-gallery .tmc-template-card{border-color:#cbd5e1}.tmc-professional-gallery .tmc-card-description{display:block;min-height:38px}
.invoice-paper.preset-accman-premium-tax{border-top:5px solid #102a43;color:#172b4d}.invoice-paper.preset-accman-premium-tax .invoice-head{padding:5mm;border:1px solid #b8c5d3;border-top:0;background:#fff}.invoice-paper.preset-accman-premium-tax .invoice-title span{font-weight:900;letter-spacing:.2px}.invoice-paper.preset-accman-premium-tax .invoice-document-strip{border:1px solid #cbd5e1;background:#f8fafc}.invoice-paper.preset-accman-premium-tax .invoice-document-strip>div{border:0;border-inline-start:1px solid #d7e0ea;border-radius:0;background:transparent}.invoice-paper.preset-accman-premium-tax .invoice-meta>div{padding:3.5mm;border:1px solid #cbd5e1;background:#fff}.invoice-paper.preset-accman-premium-tax .invoice-items{border:1px solid #9aafc1}.invoice-paper.preset-accman-premium-tax .invoice-items th{background:#102a43}.invoice-paper.preset-accman-premium-tax .invoice-summary .grand{border:1px solid #102a43;background:#fff;color:#102a43}
.invoice-paper.preset-accman-modern-invoice{border-top:4px solid #1d4ed8}.invoice-paper.preset-accman-modern-invoice .invoice-head{padding-bottom:4mm;border-bottom:1px solid #93c5fd}.invoice-paper.preset-accman-modern-invoice .invoice-total-badge{border:1px solid #1d4ed8;background:#fff;color:#1d4ed8}.invoice-paper.preset-accman-modern-invoice .invoice-document-strip>div{border-color:#bfdbfe;background:#f8fbff}.invoice-paper.preset-accman-modern-invoice .invoice-meta>div{padding:3mm;border:1px solid #dbeafe;background:#fff}.invoice-paper.preset-accman-modern-invoice .invoice-items{border-collapse:separate;border-spacing:0 1mm}.invoice-paper.preset-accman-modern-invoice .invoice-items th{border-block:1px solid #93c5fd}.invoice-paper.preset-accman-modern-invoice .invoice-summary .grand{border:1px solid #1d4ed8;background:#eff6ff;color:#1e3a8a}
.invoice-paper.preset-accman-compact-invoice{--tpl-gap:6px;font-size:.92em;border-top:3px solid #243b53}.invoice-paper.preset-accman-compact-invoice .invoice-head{min-height:18mm;padding-bottom:2mm}.invoice-paper.preset-accman-compact-invoice .invoice-title span{font-size:1.1rem}.invoice-paper.preset-accman-compact-invoice .invoice-document-strip>div,.invoice-paper.preset-accman-compact-invoice .invoice-meta>div{padding:1.6mm;border-radius:0;border:1px solid #d7e0ea;background:#fff}.invoice-paper.preset-accman-compact-invoice .invoice-meta{padding:2mm 0;gap:3mm}.invoice-paper.preset-accman-compact-invoice .invoice-items th,.invoice-paper.preset-accman-compact-invoice .invoice-items td{padding-block:1.2mm}.invoice-paper.preset-accman-compact-invoice .invoice-summary>div{padding:1.4mm 0}.invoice-paper.preset-accman-compact-invoice .invoice-footer{margin-top:6mm}
.invoice-paper.preset-accman-quotation{border-top:5px solid #15803d}.invoice-paper.preset-accman-quotation .invoice-head{padding:4mm;border-bottom:1px solid #86efac}.invoice-paper.preset-accman-quotation .invoice-total-badge{border:1px solid #15803d;background:#fff;color:#166534}.invoice-paper.preset-accman-quotation .invoice-document-strip>div{border-color:#bbf7d0;background:#f7fdf8}.invoice-paper.preset-accman-quotation .invoice-meta>div{padding:3mm;border:1px solid #d1fae5;background:#fff}.invoice-paper.preset-accman-quotation .invoice-items th{background:#166534}.invoice-paper.preset-accman-quotation .invoice-summary .grand{border:1px solid #15803d;background:#fff;color:#166534}
.invoice-paper.preset-accman-credit-note{border-top:5px solid #7f1d1d;color:#4c1010}.invoice-paper.preset-accman-credit-note .invoice-head{padding:4mm;border-bottom:2px solid #9f1239}.invoice-paper.preset-accman-credit-note .invoice-title span{color:#7f1d1d}.invoice-paper.preset-accman-credit-note .invoice-total-badge{border:1px solid #7f1d1d;background:#fff;color:#7f1d1d}.invoice-paper.preset-accman-credit-note .invoice-document-strip>div{border-color:#fecaca;background:#fffafa}.invoice-paper.preset-accman-credit-note .invoice-meta>div{padding:3mm;border:1px solid #fecaca;background:#fff}.invoice-paper.preset-accman-credit-note .invoice-items th{background:#7f1d1d}.invoice-paper.preset-accman-credit-note .invoice-summary .grand{border:1px solid #7f1d1d;background:#fff;color:#7f1d1d}
.invoice-paper.preset-accman-thermal-pos{width:80mm;min-height:0;padding:4mm 3mm;color:#111;background:#fff;border:0;font-size:11px}.invoice-paper.preset-accman-thermal-pos .invoice-head{grid-template-columns:1fr;padding-bottom:2mm;border-bottom:2px solid #111;text-align:center}.invoice-paper.preset-accman-thermal-pos .invoice-logo,.invoice-paper.preset-accman-thermal-pos .invoice-title{justify-self:center;text-align:center}.invoice-paper.preset-accman-thermal-pos .invoice-title span{font-size:1rem}.invoice-paper.preset-accman-thermal-pos .invoice-total-badge{display:none}.invoice-paper.preset-accman-thermal-pos .invoice-document-strip,.invoice-paper.preset-accman-thermal-pos .invoice-meta{grid-template-columns:1fr;padding:1mm 0;gap:0}.invoice-paper.preset-accman-thermal-pos .invoice-document-strip>div,.invoice-paper.preset-accman-thermal-pos .invoice-meta>div{padding:1.2mm 0;border:0;border-bottom:1px dashed #777;background:transparent}.invoice-paper.preset-accman-thermal-pos .invoice-items{font-size:.65rem}.invoice-paper.preset-accman-thermal-pos .invoice-items th{padding:1.2mm .5mm;color:#111;background:#fff;border-block:1px solid #111}.invoice-paper.preset-accman-thermal-pos .invoice-items td{padding:1.3mm .5mm;border-bottom:1px dashed #aaa}.invoice-paper.preset-accman-thermal-pos .invoice-summary .grand{border-block:2px solid #111;border-radius:0;background:#fff;color:#111}.invoice-paper.preset-accman-thermal-pos .invoice-footer{margin-top:4mm;border-top:1px dashed #777}
@media(max-width:680px){.tmc-professional-intro{padding:16px}.tmc-professional-intro>i{display:none}}

/* Six genuinely distinct document compositions. */
.professional-layout{width:210mm;min-height:297mm;padding:var(--tpl-margin-top) var(--tpl-margin-right) calc(var(--tpl-margin-bottom) + 10mm) var(--tpl-margin-left);font-family:var(--tpl-font),Arial,sans-serif;color:#17233b;background:#fff}.professional-layout .invoice-logo img{max-width:42mm;max-height:22mm;object-fit:contain}.professional-layout h1{margin:0;font-size:21px}.professional-layout .professional-party{display:grid;gap:1.5mm;font-size:10px;line-height:1.45}.professional-layout .professional-party>b{color:var(--tpl-primary);font-size:9px}.professional-layout .professional-party strong{font-size:13px}.professional-layout .professional-meta{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0}.professional-layout .professional-meta>span{display:grid;gap:1mm;padding:2.5mm;border:1px solid #d8e1ea;border-inline-start:0;font-size:9px}.professional-layout .professional-meta>span:first-child{border-inline-start:1px solid #d8e1ea}.professional-layout .professional-meta b{color:#64748b;font-size:8px}.professional-layout .professional-items-wrap{margin-top:6mm}.professional-layout .professional-items{border:1px solid #b7c5d4}.professional-layout .professional-items .invoice-line-index{width:6mm;text-align:center}.professional-layout .professional-items th{background:var(--tpl-primary);color:#fff}.professional-layout .professional-totals{display:grid;gap:0;min-width:68mm;border:1px solid #b7c5d4;background:#fff}.professional-layout .professional-totals>div{display:flex;justify-content:space-between;gap:6mm;padding:2.2mm 3mm;border-bottom:1px solid #e1e7ee;font-size:10px}.professional-layout .professional-totals>.total{border:1px solid var(--tpl-primary);margin:-1px;background:#fff;color:var(--tpl-primary);font-weight:900}.professional-layout .professional-note{margin-bottom:3mm;padding:3mm;border:1px solid #d7e0e9;font-size:10px}.professional-layout .professional-note p{margin:1mm 0 0;white-space:pre-wrap}.professional-layout .professional-footer{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:6mm;margin-top:7mm;padding-top:3mm;border-top:1px solid #b9c6d4;color:#64748b;font-size:8px}.professional-layout .professional-footer .invoice-qr svg{max-width:23mm}
.premium-tax-head{display:grid;grid-template-columns:1fr .95fr;gap:8mm;padding-bottom:5mm;border-bottom:3px solid #102a43}.premium-tax-head>section:first-child{display:grid;grid-template-columns:auto 1fr;gap:5mm;align-items:start}.premium-tax-title{display:grid;justify-items:end;text-align:left}.premium-tax-title h1{color:#102a43}.premium-tax-title em{font-style:normal;letter-spacing:1px;color:#526b83;font-weight:800}.premium-tax-title .professional-meta{width:100%;margin-top:4mm}.premium-tax-title .professional-meta{grid-template-columns:repeat(2,minmax(0,1fr))}.premium-tax-customer{margin-top:6mm;padding:4mm;border:1.5px solid #102a43;background:#fff}.premium-tax-bottom{display:grid;grid-template-columns:1fr 78mm;gap:8mm;margin-top:6mm;align-items:start}.premium-tax-bottom .professional-note{border-inline-start:4px solid #486581}
.modern-top{display:flex;align-items:center;justify-content:space-between;padding:3mm 0 5mm;border-bottom:1px solid #93c5fd}.modern-top h1{color:#1d4ed8;font-weight:800}.modern-top small{display:block;letter-spacing:1.2px;color:#64748b}.modern-brand{display:flex;align-items:center;gap:4mm;font-size:11px}.modern-meta-card{margin-top:5mm;border-radius:4mm;overflow:hidden}.modern-customer-row{display:grid;grid-template-columns:1fr 1fr;gap:5mm;margin:5mm 0;padding:4mm;border-radius:3mm;background:#f8fbff}.modern-bottom{display:grid;grid-template-columns:1fr 74mm;gap:8mm;margin-top:6mm}.modern-bottom .professional-totals{border-radius:3mm}.modern-invoice-layout .professional-items th{background:#eaf3ff;color:#17365d;border-block:1px solid #93c5fd}
.compact-invoice-layout{font-size:.9em}.compact-head{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:5mm;padding-bottom:2mm;border-bottom:2px solid #243b53}.compact-head>div{display:flex;align-items:center;gap:3mm}.compact-head .invoice-logo img{max-width:25mm;max-height:13mm}.compact-head h1{font-size:15px;color:#243b53}.compact-meta{margin-top:3mm}.compact-meta .professional-meta{grid-template-columns:repeat(5,minmax(0,1fr))}.compact-meta .professional-meta>span{padding:1.5mm;font-size:8px}.compact-parties{margin-top:3mm;padding:2mm 3mm;border-block:1px solid #d7e0ea}.compact-parties .professional-party{grid-template-columns:auto 1fr auto auto;align-items:center;gap:3mm}.compact-parties .professional-party>b{display:none}.compact-parties .professional-party strong{font-size:11px}.compact-invoice-layout .professional-items-wrap{margin-top:3mm}.compact-invoice-layout .professional-items{font-size:.69rem}.compact-invoice-layout .professional-items th,.compact-invoice-layout .professional-items td{padding-block:1.1mm}.compact-bottom{display:grid;grid-template-columns:70mm 1fr;gap:6mm;margin-top:4mm}.compact-bottom .professional-note{padding:2mm;margin:0;font-size:8px}.compact-bottom .professional-totals>div{padding:1.4mm 2mm;font-size:9px}.compact-invoice-layout .professional-footer{margin-top:3mm;padding-top:2mm}
.quote-masthead{display:flex;justify-content:space-between;align-items:end;padding:6mm;border:1px solid #15803d;border-bottom:5px solid #15803d}.quote-masthead>div:last-child{text-align:left;color:#166534}.quote-masthead h1{font-size:25px}.quote-masthead b{letter-spacing:1px}.quote-meta{margin:5mm 0}.quote-meta .professional-meta{grid-template-columns:repeat(4,minmax(0,1fr))}.quote-customer{padding:4mm;border:1px solid #bbf7d0;background:#fbfffc}.quote-summary{display:grid;grid-template-columns:74mm 1fr;gap:8mm;margin-top:7mm}.quotation-layout .professional-items th{background:#166534}.quote-validity{margin:3mm 0 0;padding:3mm;border:1px dashed #15803d;color:#166534;font-size:10px}.quote-footer{grid-template-columns:1fr auto;border-color:#86efac}
.credit-banner{display:flex;justify-content:space-between;align-items:center;padding:6mm;background:#fff;border:2px solid #7f1d1d;border-bottom:7px solid #7f1d1d;color:#7f1d1d}.credit-banner h1{font-size:25px}.credit-banner b{letter-spacing:1px}.credit-banner>div:last-child{padding:3mm;border:1px solid #fecaca;background:#fffafa;font-weight:900}.credit-reference{margin-top:5mm}.credit-reference .professional-meta{grid-template-columns:repeat(4,minmax(0,1fr))}.credit-parties{margin-top:4mm;padding:4mm;border-inline-start:5px solid #7f1d1d;background:#fffafa}.credit-note-layout .professional-items th{background:#7f1d1d}.credit-bottom{display:grid;grid-template-columns:1fr 78mm;gap:8mm;margin-top:7mm}.credit-bottom .professional-note{border-color:#fecaca}.credit-footer{border-color:#fecaca}

/* T01 reference composition: company panel on the left, invoice panel on the
   right, followed by a standalone customer card and split financial footer. */
.premium-reference-layout{border-top:0!important;color:#14213d}.premium-reference-head{display:grid;grid-template-columns:1.05fr .95fr;gap:7mm;align-items:stretch;padding-bottom:5mm;border-bottom:1px solid #d7e1ec}.premium-reference-company{display:grid;grid-template-columns:30mm 1fr;gap:4mm;align-items:start;padding:2mm 0;border-inline-end:1px solid #d7e1ec}.premium-reference-company .invoice-logo{display:grid;place-items:center;min-height:29mm;padding-inline-end:3mm;border-inline-end:1px solid #d7e1ec}.premium-reference-company .invoice-logo img{max-width:25mm;max-height:25mm}.premium-reference-company .professional-party{gap:1mm}.premium-reference-company .professional-party>b{font-size:8px;color:#14213d}.premium-reference-company .professional-party strong{font-size:11px}.premium-reference-company .professional-party span{font-size:8px;color:#4b5e74}.premium-reference-document{display:grid;grid-template-rows:auto 1fr;gap:4mm}.premium-reference-title{padding-inline-start:4mm;text-align:left}.premium-reference-title h1{color:#123d73;font-size:24px;line-height:1.05}.premium-reference-title b{display:block;margin-top:1mm;color:#244e80;letter-spacing:1.2px;font-size:11px}.premium-reference-document .professional-meta{grid-template-columns:repeat(2,minmax(0,1fr));border:1px solid #cad8e7}.premium-reference-document .professional-meta>span{min-height:11mm;padding:2mm 3mm;border-color:#d5e0eb;background:#fff}.premium-reference-document .professional-meta b{font-size:7.5px;color:#163c6d}.premium-reference-document .professional-meta strong{font-size:9px}.premium-reference-customer{margin-top:5mm;border:1px solid #c9d7e5;border-radius:2mm;background:#fff}.premium-reference-customer>header{display:flex;align-items:center;justify-content:space-between;padding:2mm 3mm;border-bottom:1px solid #dce5ee;color:#123d73;font-size:9px}.premium-reference-customer>.professional-party{display:grid;grid-template-columns:1.15fr 1fr 1fr;gap:3mm;padding:3mm}.premium-reference-customer .professional-party>b{display:none}.premium-reference-customer .professional-party strong{font-size:11px}.premium-reference-customer .professional-party span{font-size:8px}.premium-reference-layout .professional-items-wrap{margin-top:4mm}.premium-reference-layout .professional-items{font-size:.7rem}.premium-reference-layout .professional-items th{padding-block:2mm;background:#123d73}.premium-reference-layout .professional-items tbody tr:nth-child(even) td{background:#f9fbfd}.premium-reference-bottom{display:grid;grid-template-columns:1fr 76mm;gap:8mm;margin-top:5mm;align-items:start}.premium-reference-notes .professional-note{min-height:36mm;margin:0;border-color:#d5e0eb;background:#fff}.premium-reference-notes .professional-note:not(.terms){border-inline-start:4px solid #123d73}.premium-reference-layout .professional-totals{border-color:#d3dee9}.premium-reference-layout .professional-totals>div{min-height:8mm}.premium-reference-layout .professional-totals>.total{background:#123d73;color:#fff;border-color:#123d73}.premium-reference-footer{display:grid;grid-template-columns:34mm 1fr 30mm;gap:6mm;align-items:center;margin-top:6mm;padding-top:3mm;border-top:1px solid #c7d5e3;color:#4f6175;font-size:7.5px}.premium-reference-footer>div:nth-child(2){display:grid;gap:1mm;text-align:center}.premium-reference-footer>div:nth-child(2)>b{color:#123d73;font-size:9px}.premium-reference-qr{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:2mm}.premium-reference-qr .invoice-qr svg{max-width:22mm}.premium-reference-qr small{line-height:1.5}.premium-reference-page{text-align:left}.premium-reference-page .invoice-page-number:after{font-weight:800;color:#123d73}

/* Reference correction after visual comparison: the image is LTR-composed at
   the page level (company left, invoice panel right), while data remains RTL. */
.premium-reference-head{direction:ltr;grid-template-columns:1.12fr .88fr}.premium-reference-company,.premium-reference-document{direction:rtl}.premium-reference-company{border-inline-end:0;border-inline-start:1px solid #d7e1ec}.premium-reference-company .invoice-logo{border-inline-end:0;border-inline-start:1px solid #d7e1ec}.premium-reference-document{direction:rtl}.premium-reference-title{padding-inline:0 4mm;text-align:right}.premium-reference-title h1{font-size:22px}.premium-reference-document .professional-meta{direction:rtl}.premium-reference-document .professional-meta>span{border-inline-start:1px solid #d5e0eb}.premium-reference-customer>.professional-party{display:grid;grid-template-columns:1.4fr repeat(2,minmax(0,1fr));align-items:start;gap:2mm}.premium-reference-customer>.professional-party strong{grid-row:1/3}.premium-reference-customer>.professional-party span{display:block;padding-inline-start:2mm;border-inline-start:1px solid #e2e8f0}.premium-reference-layout .professional-items{table-layout:fixed}.premium-reference-layout .professional-items th{font-size:7px!important;line-height:1.25;white-space:normal!important;overflow-wrap:anywhere}.premium-reference-layout .professional-items th[dir="ltr"],.premium-reference-layout .professional-items td[dir="ltr"]{white-space:normal!important}.premium-reference-layout .professional-items td{font-size:8px;overflow-wrap:anywhere}.premium-reference-layout .professional-items .invoice-column-description{width:24%!important}.premium-reference-layout .professional-items .invoice-column-sku{width:10%!important}.premium-reference-layout .professional-items .invoice-line-index{width:4%!important}.premium-reference-bottom{grid-template-columns:minmax(0,1fr) 72mm}.premium-reference-notes{min-width:0}.premium-reference-layout .professional-totals{min-width:0;width:72mm}
@media(max-width:820px){.tmc-logo-only-editor{grid-template-columns:1fr}.tmc-logo-only-editor .tmc-designer-tree,.tmc-logo-only-editor .tmc-designer-properties{position:static}}

/* Exact visual family supplied by the customer: the reference image fixes the
   composition while values continue to come from the canonical renderer. */
.reference-a4{--reference-color:var(--tpl-primary);--reference-soft:#f7faff;position:relative;border:1px solid #aebed0!important;color:#13243b;background:#fff;overflow:visible}
.reference-blue{--reference-color:#06376f;--reference-soft:#f5f9fe}
.reference-green{--reference-color:#08752e;--reference-soft:#f5fbf7}
.reference-red{--reference-color:#97112a;--reference-soft:#fff7f8}
.reference-a4 .reference-head{display:grid;grid-template-columns:1.12fr .88fr;grid-template-areas:"company document";direction:ltr;gap:6mm;align-items:start;padding-bottom:4mm;border-bottom:1px solid #d2dbe5}
.reference-a4 .reference-company{grid-area:company;display:grid;grid-template-columns:30mm minmax(0,1fr);direction:ltr;gap:4mm;align-items:start;min-width:0;padding-inline-end:5mm;border-inline-end:1px solid #d8e1ea}
.reference-a4 .reference-company .invoice-logo{display:grid;place-items:center;min-height:28mm;padding-inline-end:3mm;border-inline-end:1px solid #d8e1ea;text-align:center;color:var(--reference-color)}
.reference-a4 .reference-company .invoice-logo img{max-width:27mm;max-height:25mm;object-fit:contain}
.reference-a4 .reference-company .invoice-logo strong{font-size:14px;line-height:1.2}
.reference-a4 .reference-company .professional-party{direction:rtl;align-content:start;gap:1mm;min-width:0;padding-top:1mm}
.reference-a4 .reference-company .professional-party>b{display:none}
.reference-a4 .reference-company .professional-party strong{font-size:10.5px;color:#172033}
.reference-a4 .reference-company .professional-party span{font-size:7.5px;color:#4b5f75;overflow-wrap:anywhere}
.reference-a4 .reference-document{grid-area:document;direction:rtl;display:grid;gap:3mm;min-width:0}
.reference-a4 .reference-title{text-align:right;color:var(--reference-color)}
.reference-a4 .reference-title h1{margin:0;font-size:20px;line-height:1.1;color:var(--reference-color)}
.reference-a4 .reference-title>b{display:block;margin-top:1mm;font-size:9px;letter-spacing:.8px}
.reference-a4 .reference-document .professional-meta{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border:1px solid #cbd7e3;border-radius:1.5mm;overflow:hidden}
.reference-a4 .reference-document .professional-meta>span{display:grid;gap:.5mm;min-width:0;min-height:9mm;padding:1.4mm 2mm;border:0;border-bottom:1px solid #d8e1ea;background:#fff}
.reference-a4 .reference-document .professional-meta>span:nth-last-child(-n+2){border-bottom:0}
.reference-a4 .reference-document .professional-meta b{color:var(--reference-color);font-size:7px}
.reference-a4 .reference-document .professional-meta strong{font-size:8px;overflow-wrap:anywhere}
.reference-a4 .reference-customer{margin-top:4mm;border:1px solid #c9d6e3;border-radius:1.5mm;background:#fff;overflow:hidden}
.reference-a4 .reference-customer>header{display:flex;align-items:center;justify-content:space-between;padding:1.7mm 3mm;color:#fff;background:var(--reference-color);font-size:8px}
.reference-a4 .reference-customer>.professional-party{display:grid;grid-template-columns:1.25fr repeat(3,minmax(0,1fr));gap:0;padding:3mm}
.reference-a4 .reference-customer .professional-party>b{display:none}
.reference-a4 .reference-customer .professional-party strong{grid-row:1/3;align-self:start;padding-inline-end:3mm;font-size:10.5px}
.reference-a4 .reference-customer .professional-party span{min-width:0;padding:0 2.5mm;border-inline-start:1px solid #dde5ed;color:#3f5065;font-size:7.5px;overflow-wrap:anywhere}
.reference-a4 .professional-items-wrap{margin-top:4mm}
.reference-a4 .professional-items{width:100%;table-layout:fixed;border:1px solid #bac7d4;border-collapse:collapse;font-size:7.5px}
.reference-a4 .professional-items th,.reference-a4 .professional-items td{height:8mm;padding:1.5mm .8mm;border:1px solid #d5dde6;line-height:1.3;white-space:normal!important;overflow-wrap:anywhere}
.reference-a4 .professional-items th{height:9mm;color:#fff!important;background:var(--reference-color)!important;border-color:rgba(255,255,255,.3);font-size:6.5px;font-weight:800}
.reference-a4 .professional-items tbody tr:nth-child(even) td{background:var(--reference-soft)}
.reference-a4 .professional-items .invoice-line-index{width:5%!important}
.reference-a4 .professional-items .invoice-column-description{width:23%!important;text-align:right!important}
.reference-a4 .professional-items .invoice-column-sku{width:10%!important}
.reference-a4 .reference-bottom{display:grid;grid-template-columns:minmax(0,1fr) 72mm;direction:ltr;gap:6mm;align-items:start;margin-top:4mm}
.reference-a4 .reference-notes{direction:rtl;min-width:0}
.reference-a4 .reference-notes .professional-note{min-height:17mm;margin:0 0 2mm;padding:2.5mm;border:1px solid #d2dce6;background:#fff;font-size:8px}
.reference-a4 .reference-notes .professional-note p{margin:1mm 0 0;line-height:1.6}
.reference-a4 .professional-totals{direction:rtl;width:72mm;min-width:0;border:1px solid #ccd7e2}
.reference-a4 .professional-totals>div{min-height:7mm;padding:1.7mm 2.5mm;border-bottom:1px solid #dde4eb;font-size:8px}
.reference-a4 .professional-totals>.total{margin:-1px;color:#fff;background:var(--reference-color);border-color:var(--reference-color)}
.reference-a4 .reference-footer{display:grid;grid-template-columns:44mm 1fr 24mm;direction:ltr;gap:5mm;align-items:center;margin-top:5mm;padding-top:3mm;border-top:1px solid #cbd7e3;color:#4c5e73;font-size:7px}
.reference-a4 .reference-footer>*,.reference-a4 .reference-footer-mark{direction:rtl}
.reference-a4 .reference-qr{display:grid;grid-template-columns:minmax(0,20mm) minmax(0,1fr);direction:ltr;align-items:center;gap:2mm;min-width:0}.reference-a4 .reference-qr .invoice-qr-message{margin:0;font-size:7px;line-height:1.35;overflow-wrap:anywhere}
.reference-a4 .reference-qr .invoice-qr svg{display:block;max-width:18mm;height:auto}
.reference-a4 .reference-qr small{direction:rtl;line-height:1.5}
.reference-a4 .reference-footer-mark{display:grid;gap:.5mm;text-align:center}
.reference-a4 .reference-footer-mark b{color:var(--reference-color);font-size:10px}
.reference-a4 .invoice-page-number{text-align:left}
.premium-reference-layout .reference-head{grid-template-columns:1.18fr .82fr}
.premium-reference-layout .reference-customer>.professional-party{min-height:25mm}
.premium-reference-layout .reference-notes .professional-note{min-height:28mm}
.modern-invoice-layout .reference-customer>.professional-party{min-height:23mm}
.reference-compact{padding-top:8mm;padding-right:9mm;padding-left:9mm;font-size:.92em}
.reference-compact .reference-head{grid-template-columns:1fr 1fr;gap:4mm;padding-bottom:2mm}
.reference-compact .reference-company{grid-template-columns:23mm minmax(0,1fr);gap:2mm;padding-inline-end:3mm}
.reference-compact .reference-company .invoice-logo{min-height:20mm}
.reference-compact .reference-company .invoice-logo img{max-width:20mm;max-height:18mm}
.reference-compact .reference-title h1{font-size:16px}
.reference-compact .reference-document{gap:1.5mm}
.reference-compact .reference-document .professional-meta>span{min-height:6.5mm;padding:1mm 1.5mm}
.reference-compact .reference-customer{margin-top:2mm}
.reference-compact .reference-customer>header{padding:1mm 2mm}
.reference-compact .reference-customer>.professional-party{grid-template-columns:1.4fr repeat(3,minmax(0,1fr));padding:1.8mm}
.reference-compact .professional-items-wrap{margin-top:2mm}
.reference-compact .professional-items th,.reference-compact .professional-items td{height:6.4mm;padding:1mm .6mm}
.reference-compact .reference-bottom{grid-template-columns:minmax(0,1fr) 66mm;margin-top:2mm;gap:4mm}
.reference-compact .professional-totals{width:66mm}
.reference-compact .professional-totals>div{min-height:5.5mm;padding:1mm 2mm}
.reference-compact .reference-notes .professional-note{min-height:15mm;padding:1.5mm}
.reference-compact .reference-footer{margin-top:2mm;padding-top:2mm}
.quotation-layout,.credit-note-layout{min-height:210mm}
.quotation-layout .reference-head,.credit-note-layout .reference-head{padding:4mm;border:1px solid var(--reference-color);border-bottom:4px solid var(--reference-color)}
.quotation-layout .reference-company,.credit-note-layout .reference-company{border-color:color-mix(in srgb,var(--reference-color) 25%,white)}
.quotation-layout .reference-customer>header,.credit-note-layout .reference-customer>header{color:var(--reference-color);background:#fff;border-bottom:1px solid color-mix(in srgb,var(--reference-color) 28%,white)}
.quotation-layout .reference-customer>.professional-party,.credit-note-layout .reference-customer>.professional-party{min-height:13mm;padding-block:2mm}
.quotation-layout .reference-bottom,.credit-note-layout .reference-bottom{grid-template-columns:minmax(0,1fr) 72mm}
.quote-reference-footer,.credit-reference-footer{grid-template-columns:1fr auto 24mm}
.thermal-reference-layout{width:80mm!important;min-height:0!important;padding:4mm 3mm!important;border:1px solid #444!important;box-shadow:0 3px 12px rgba(15,23,42,.12);color:#111;background:#fff;font-family:var(--tpl-font),Arial,sans-serif;font-size:9px;line-height:1.35}
.thermal-reference-layout .thermal-reference-head{display:grid;justify-items:center;gap:.8mm;padding-bottom:2mm;text-align:center;border-bottom:1px dashed #555}
.thermal-reference-layout .invoice-logo{display:grid;place-items:center;min-height:10mm;color:#111}
.thermal-reference-layout .invoice-logo img{display:block;max-width:27mm;max-height:15mm;object-fit:contain}
.thermal-reference-layout .invoice-logo strong{font-size:13px}
.thermal-reference-layout .thermal-reference-head>strong{font-size:10px}
.thermal-reference-layout .thermal-reference-head>span{font-size:7px}
.thermal-reference-layout .thermal-reference-title{display:grid;justify-items:center;gap:1mm;padding:3mm 0 2mm;text-align:center}
.thermal-reference-layout .reference-title{text-align:center}
.thermal-reference-layout .reference-title h1{margin:0;font-size:13px}
.thermal-reference-layout .reference-title b{display:block;margin-top:.5mm;font-size:7px}
.thermal-reference-layout .thermal-reference-title>b{font-size:9px}
.thermal-reference-layout .thermal-reference-meta{display:grid;gap:.8mm;padding:2mm 0;border-block:1px dashed #555}
.thermal-reference-layout .thermal-reference-meta>div{display:flex;justify-content:space-between;gap:2mm}
.thermal-reference-layout .thermal-reference-client{display:flex;justify-content:space-between;gap:2mm;padding:1.5mm 0;border-bottom:1px dashed #555}
.thermal-reference-layout .thermal-reference-items{width:100%;margin:2mm 0;border-collapse:collapse;table-layout:fixed;font-size:7px}
.thermal-reference-layout .thermal-reference-items th,.thermal-reference-layout .thermal-reference-items td{padding:1.2mm .3mm;border-bottom:1px dashed #999;text-align:center;vertical-align:top;overflow-wrap:anywhere}
.thermal-reference-layout .thermal-reference-items th:nth-child(1){width:7%}.thermal-reference-layout .thermal-reference-items th:nth-child(2){width:39%}.thermal-reference-layout .thermal-reference-items th:nth-child(3){width:14%}.thermal-reference-layout .thermal-reference-items th:nth-child(4),.thermal-reference-layout .thermal-reference-items th:nth-child(5){width:20%}
.thermal-reference-layout .thermal-description{text-align:right!important}.thermal-reference-layout .thermal-description strong,.thermal-reference-layout .thermal-description small{display:block}
.thermal-reference-layout .professional-totals{display:grid;width:100%;min-width:0;border-block:1px dashed #555}
.thermal-reference-layout .professional-totals>div{display:flex;justify-content:space-between;gap:2mm;padding:1mm 0;border:0;font-size:8px}
.thermal-reference-layout .professional-totals>.total{margin:0;padding-block:1.5mm;border-block:2px solid #111;background:#fff;color:#111;font-size:10px}
.thermal-reference-layout .thermal-reference-qr{display:grid;justify-items:center;gap:1mm;padding-top:2mm;text-align:center}
.thermal-reference-layout .thermal-reference-qr .invoice-designer-block{margin:0!important;padding:0!important;border:0!important}
.thermal-reference-layout .thermal-reference-qr .invoice-qr svg{display:block;max-width:27mm;height:auto}
.thermal-reference-layout>footer{margin-top:2mm;padding-top:2mm;border-top:1px dashed #555;text-align:center;font-size:8px}


/* ========== أنماط القوالب الستة ==========
   كل نمط يبني على هيكل reference-a4 نفسه المستخدم في قوالب ACCMAN الحالية،
   ولا يغيّر سوى الهوية اللونية ومعالجة الرأس والجدول والتذييل. */

/* الهويات اللونية */
.reference-sand{--reference-color:#8a6a3f;--reference-soft:#fbf5e9}
.reference-navy{--reference-color:#0f2747;--reference-soft:#f3f6fb}
.reference-plain{--reference-color:#111827;--reference-soft:#fafafa}
.reference-gold{--reference-color:#8a6a1c;--reference-soft:#fdf9ed}
.reference-teal{--reference-color:#0f766e;--reference-soft:#f1fbf9}

/* 1) النمط الحديث — Modern */
.style-modern-layout{--reference-color:#1e3a8a;--reference-soft:#f4f7fe;border-color:#d6dfee!important}
.style-modern-layout .reference-head{padding-bottom:5mm;border-bottom:2px solid var(--reference-color)}
.style-modern-layout .reference-company{border-inline-end:0}
.style-modern-layout .reference-company .invoice-logo{padding-bottom:2mm;border-inline-end:0;border-bottom:1.2mm solid var(--reference-color)}
.style-modern-layout .reference-title h1{font-size:22px;letter-spacing:-.2px}
.style-modern-layout .reference-document .professional-meta{border-color:#d9e2f2;border-radius:2.5mm}
.style-modern-layout .reference-customer{border-color:#d9e2f2;border-radius:2.5mm}
.style-modern-layout .professional-items{border:0}
.style-modern-layout .professional-items th{border-color:transparent;border-radius:0}
.style-modern-layout .professional-items td{border-inline:0;border-color:#e6ecf6}
.style-modern-layout .professional-totals{border-color:#d9e2f2;border-radius:2.5mm;overflow:hidden}
.style-modern-layout .professional-totals>.total{margin:0;border-radius:0}
.style-modern-layout .reference-footer{border-top-color:#d9e2f2}

/* 2) النمط الكلاسيكي — Classic */
.reference-a4.style-classic-layout{background:#fdfaf3;border-color:#d9c9a9!important;color:#3f3324}
.style-classic-layout .reference-head{grid-template-columns:1fr;grid-template-areas:"company" "document";gap:4mm;text-align:center;border-bottom:3px double var(--reference-color)}
.style-classic-layout .reference-company{grid-template-columns:1fr;justify-items:center;padding-inline-end:0;border-inline-end:0}
.style-classic-layout .reference-company .invoice-logo{min-height:auto;padding-inline-end:0;border-inline-end:0}
.style-classic-layout .reference-company .professional-party{justify-items:center;text-align:center}
.style-classic-layout .reference-title{text-align:center}
.style-classic-layout .reference-title h1{display:inline-block;padding:1.5mm 8mm;border:1px solid var(--reference-color);border-radius:1mm;background:#fff;font-size:17px}
.style-classic-layout .reference-document .professional-meta{border-color:#ddcdb0;background:#fff}
.style-classic-layout .reference-document .professional-meta>span{border-bottom-color:#e8dcc6;background:#fff}
.style-classic-layout .reference-customer{border-color:#ddcdb0;background:#fff}
.style-classic-layout .professional-items{border-color:#ddcdb0;background:#fff}
.style-classic-layout .professional-items th,.style-classic-layout .professional-items td{border-color:#e3d5bc}
.style-classic-layout .professional-items tbody tr:nth-child(even) td{background:#fbf5e9}
.style-classic-layout .reference-notes .professional-note{border-color:#ddcdb0;background:#fff}
.style-classic-layout .professional-totals{border-color:#ddcdb0;background:#fff}
.style-classic-layout .professional-totals>div{border-bottom-color:#e8dcc6}
.style-classic-layout .reference-footer{border-top:2px solid var(--reference-color)}

/* 3) النمط الاحترافي — Professional */
.style-professional-layout{padding:0!important;border-color:#c2cddc!important}
.style-professional-layout>.reference-head{gap:7mm;margin:0;padding:9mm 11mm 7mm;border-bottom:0;background:var(--reference-color);color:#fff}
.style-professional-layout .reference-company{padding-inline-end:5mm;border-inline-end:1px solid rgba(255,255,255,.28)}
.style-professional-layout .reference-company .invoice-logo{border-inline-end:1px solid rgba(255,255,255,.28);color:#fff}
.style-professional-layout .reference-company .professional-party strong{color:#fff}
.style-professional-layout .reference-company .professional-party span{color:rgba(255,255,255,.82)}
.style-professional-layout .reference-title h1,.style-professional-layout .reference-title>b{color:#fff}
.style-professional-layout .reference-document .professional-meta{border-color:rgba(255,255,255,.32)}
.style-professional-layout .reference-document .professional-meta>span{border-bottom-color:rgba(255,255,255,.24);background:rgba(255,255,255,.07)}
.style-professional-layout .reference-document .professional-meta b{color:rgba(255,255,255,.8)}
.style-professional-layout .reference-document .professional-meta strong{color:#fff}
.style-professional-layout>.reference-customer,.style-professional-layout>.professional-items-wrap,.style-professional-layout>.reference-bottom{margin-inline:11mm}
.style-professional-layout>.reference-customer{margin-top:6mm}
.style-professional-layout .professional-totals>.total{background:#1d4ed8;border-color:#1d4ed8}
.style-professional-layout>.reference-footer{grid-template-columns:44mm 1fr 24mm;margin:7mm 0 0;padding:5mm 11mm;border-top:0;background:var(--reference-color);color:rgba(255,255,255,.9)}
.style-professional-layout>.reference-footer .reference-footer-mark b{color:#fff}
.style-professional-layout>.reference-footer .reference-qr .invoice-qr svg{background:#fff;padding:1mm}

/* 4) النمط المبسط — Minimal */
.style-minimal-layout{border-color:#e3e6ea!important}
.style-minimal-layout .reference-head{padding-bottom:4mm;border-bottom:1px solid #e3e6ea}
.style-minimal-layout .reference-company,.style-minimal-layout .reference-company .invoice-logo{border-inline-end:0}
.style-minimal-layout .reference-title h1{font-size:19px;font-weight:700}
.style-minimal-layout .reference-document .professional-meta{border:0;border-radius:0}
.style-minimal-layout .reference-document .professional-meta>span{padding-inline:0;border-bottom:1px solid #eceef1;background:transparent}
.style-minimal-layout .reference-customer{border:0;border-bottom:1px solid #e3e6ea;border-radius:0}
.style-minimal-layout .reference-customer>header{color:#374151;background:transparent;border-bottom:1px solid #eceef1}
.style-minimal-layout .reference-customer .professional-party span{border-inline-start:0}
.style-minimal-layout .professional-items{border:0}
.style-minimal-layout .professional-items th{color:#111827!important;background:#f5f6f8!important;border-color:#e3e6ea;font-weight:700}
.style-minimal-layout .professional-items td{border-inline:0;border-color:#eceef1}
.style-minimal-layout .professional-items tbody tr:nth-child(even) td{background:transparent}
.style-minimal-layout .reference-notes .professional-note{border:0;border-top:1px solid #eceef1;padding-inline:0}
.style-minimal-layout .professional-totals{border-color:#e3e6ea}
.style-minimal-layout .professional-totals>div{border-bottom-color:#eceef1}
.style-minimal-layout .professional-totals>.total{color:#111827;background:transparent;border:1px solid #111827;font-weight:800}
.style-minimal-layout .reference-footer{border-top-color:#e3e6ea}

/* 5) النمط الفاخر — Luxury */
.reference-a4.style-luxury-layout{background:#fffdf7;border:1px solid var(--reference-color)!important;box-shadow:inset 0 0 0 1.2mm #fffdf7,inset 0 0 0 1.5mm #d9bf7a}
.style-luxury-layout .reference-head{grid-template-columns:1fr;grid-template-areas:"company" "document";gap:4mm;text-align:center;border-bottom:1px solid #d9bf7a}
.style-luxury-layout .reference-company{grid-template-columns:1fr;justify-items:center;padding-inline-end:0;border-inline-end:0}
.style-luxury-layout .reference-company .invoice-logo{min-height:auto;padding-inline-end:0;border-inline-end:0}
.style-luxury-layout .reference-company .professional-party{justify-items:center;text-align:center}
.style-luxury-layout .reference-title{text-align:center}
.style-luxury-layout .reference-title h1{font-size:20px;letter-spacing:.4px}
.style-luxury-layout .reference-title>b{letter-spacing:2.4px}
.style-luxury-layout .reference-document .professional-meta{border-color:#e0cb95;background:#fff}
.style-luxury-layout .reference-document .professional-meta>span{border-bottom-color:#eddfc0;background:#fff}
.style-luxury-layout .reference-customer{border-color:#e0cb95;background:#fff}
.style-luxury-layout .professional-items{border-color:#e0cb95;background:#fff}
.style-luxury-layout .professional-items th{border-color:rgba(255,255,255,.35)}
.style-luxury-layout .professional-items td{border-color:#eddfc0}
.style-luxury-layout .professional-items tbody tr:nth-child(even) td{background:#fdf9ed}
.style-luxury-layout .reference-notes .professional-note{border-color:#e0cb95;background:#fff}
.style-luxury-layout .professional-totals{border-color:#e0cb95;background:#fff}
.style-luxury-layout .professional-totals>div{border-bottom-color:#eddfc0}
.style-luxury-layout .professional-totals>.total{color:var(--reference-color);background:#fdf3dc;border-color:#d9bf7a;font-weight:900}
.style-luxury-layout .reference-footer{grid-template-columns:44mm 1fr 24mm;border-top:1px solid #d9bf7a}
.style-luxury-layout .reference-footer-mark b{font-size:11px;letter-spacing:.6px}

/* 6) النمط المدمج — Compact */
.style-compact-layout{padding:0!important;border-color:#bcd8d4!important}
.style-compact-layout>.reference-head{gap:5mm;margin:0;padding:6mm 9mm 5mm;border-bottom:0;background:var(--reference-color);color:#fff}
.style-compact-layout .reference-company{padding-inline-end:4mm;border-inline-end:1px solid rgba(255,255,255,.28)}
.style-compact-layout .reference-company .invoice-logo{min-height:20mm;border-inline-end:1px solid rgba(255,255,255,.28);color:#fff}
.style-compact-layout .reference-company .professional-party strong{color:#fff}
.style-compact-layout .reference-company .professional-party span{color:rgba(255,255,255,.82)}
.style-compact-layout .reference-title h1{font-size:17px;color:#fff}
.style-compact-layout .reference-title>b{color:rgba(255,255,255,.85)}
.style-compact-layout .reference-document .professional-meta{border-color:rgba(255,255,255,.3)}
.style-compact-layout .reference-document .professional-meta>span{min-height:7mm;border-bottom-color:rgba(255,255,255,.22);background:rgba(255,255,255,.07)}
.style-compact-layout .reference-document .professional-meta b{color:rgba(255,255,255,.8)}
.style-compact-layout .reference-document .professional-meta strong{color:#fff}
.style-compact-layout>.reference-customer,.style-compact-layout>.professional-items-wrap,.style-compact-layout>.reference-bottom{margin-inline:9mm}
.style-compact-layout>.reference-customer{margin-top:4mm}
.style-compact-layout .professional-items{font-size:7px}
.style-compact-layout .professional-items th{height:6.5mm;font-size:6px}
.style-compact-layout .professional-items td{height:6mm;padding:1mm .6mm}
.style-compact-layout .reference-notes .professional-note{min-height:13mm;padding:2mm;font-size:7.5px}
.style-compact-layout .professional-totals>div{min-height:6mm;padding:1.2mm 2.5mm;font-size:7.5px}
.style-compact-layout>.reference-footer{grid-template-columns:44mm 1fr 24mm;margin:5mm 0 0;padding:4mm 9mm;border-top:0;background:var(--reference-color);color:rgba(255,255,255,.9)}
.style-compact-layout>.reference-footer .reference-footer-mark b{color:#fff}
.style-compact-layout>.reference-footer .reference-qr .invoice-qr svg{background:#fff;padding:.8mm}


/* Print-document category landing page and protected starter library. */
.tmc-professional-intro{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:14px;padding:20px 22px;border:1px solid var(--tmc-line);border-radius:14px;background:#fff;box-shadow:0 5px 18px rgba(20,33,61,.05)}
.tmc-professional-intro span{color:var(--tmc-blue);font-size:8px;font-weight:900;letter-spacing:.11em}
.tmc-professional-intro h2{margin:5px 0 4px;font-size:19px}.tmc-professional-intro p{margin:0;color:var(--tmc-muted);font-size:10px}
.tmc-professional-intro>i{width:52px;height:52px;display:grid;place-items:center;border-radius:14px;background:#eaf1ff;color:var(--tmc-blue);font-size:21px}
.tmc-document-categories{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.tmc-document-categories>button{display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:13px;min-height:106px;padding:18px;border:1px solid var(--tmc-line);border-radius:13px;background:#fff;color:var(--tmc-navy);text-align:right;box-shadow:0 3px 12px rgba(21,37,62,.04);transition:.18s}
.tmc-document-categories>button:hover{transform:translateY(-2px);border-color:#a9c5fb;box-shadow:0 9px 24px rgba(31,72,130,.1)}
.tmc-document-categories>button>span{width:48px;height:48px;display:grid;place-items:center;border-radius:13px;background:#eaf1ff;color:var(--tmc-blue);font-size:18px}
.tmc-document-categories h3{margin:0 0 5px;font-size:14px}.tmc-document-categories p{margin:0;color:var(--tmc-muted);font-size:9px;line-height:1.7}
.tmc-document-categories b{color:var(--tmc-blue);font-size:18px;white-space:nowrap}.tmc-document-categories b small{color:var(--tmc-muted);font-size:8px}.tmc-document-categories>button>i{color:#9aabc0}
.tmc-back-categories{display:inline-flex;align-items:center;gap:6px;margin-bottom:7px;padding:0;border:0;background:transparent;color:var(--tmc-blue);font-size:9px;font-weight:900}
.tmc-starter-form{padding:16px}.tmc-starter-toolbar{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:13px}
.tmc-starter-toolbar label{display:grid;gap:5px;color:#43536a;font-size:9px;font-weight:800}.tmc-starter-toolbar input,.tmc-starter-toolbar select{width:100%;min-height:39px;padding:7px 10px;border:1px solid var(--tmc-line);border-radius:8px;background:#fff;color:var(--tmc-navy);font:inherit;font-size:10px}
.tmc-starter-gallery{display:grid;grid-template-columns:repeat(3,minmax(180px,1fr));gap:10px;max-height:510px;padding:2px 2px 12px;overflow:auto}
.tmc-starter-card{position:relative;display:grid;gap:7px;padding:9px;border:1px solid var(--tmc-line);border-radius:11px;background:#fff;cursor:pointer;transition:.18s}
.tmc-starter-card:hover,.tmc-starter-card:has(input:checked){border-color:#7ea8f7;box-shadow:0 0 0 3px #edf3ff}
.tmc-starter-card>input{position:absolute;top:10px;right:10px;z-index:2;accent-color:var(--tmc-blue)}
.tmc-starter-preview{position:relative;height:155px;overflow:hidden;border-radius:8px;background:#eef2f7}.tmc-starter-preview .invoice-thumb{position:absolute;top:8px;right:50%;margin:0;transform:translateX(50%) scale(.12);transform-origin:top center}.tmc-starter-preview .invoice-thermal.invoice-thumb{transform:translateX(50%) scale(.36)}
.tmc-starter-preview>b{position:absolute;bottom:7px;left:7px;padding:3px 6px;border-radius:5px;background:rgba(20,33,61,.78);color:#fff;font-size:7px}
.tmc-starter-card>strong{font-size:10px}.tmc-starter-card>small{min-height:29px;color:var(--tmc-muted);font-size:7.5px;line-height:1.6}.tmc-starter-form>footer{display:flex;justify-content:flex-end;gap:8px;margin-top:12px;padding-top:12px;border-top:1px solid var(--tmc-line)}

/* A5 is rendered by the same document DOM used for A4 and thermal output. */
.invoice-paper.accman-template-document.paper-a5{width:148mm;min-height:210mm;padding:var(--tpl-margin-top,9mm) var(--tpl-margin-right,9mm) var(--tpl-margin-bottom,9mm) var(--tpl-margin-left,9mm)}
.invoice-paper.accman-template-document.paper-a5 .invoice-head{min-height:22mm}.invoice-paper.accman-template-document.paper-a5 .invoice-meta{gap:2.5mm}.invoice-paper.accman-template-document.paper-a5 .invoice-items th,.invoice-paper.accman-template-document.paper-a5 .invoice-items td{padding:1.8mm}

/* Rich custom text and permission-gated advanced source fields. */
.tmc-rich-editor{overflow:hidden;border:1px solid var(--tmc-line);border-radius:9px;background:#fff}.tmc-rich-toolbar{display:flex;align-items:center;gap:3px;padding:5px;border-bottom:1px solid var(--tmc-line);background:#f7f9fc}.tmc-rich-toolbar button{width:29px;height:28px;display:grid;place-items:center;border:1px solid transparent;border-radius:6px;background:transparent;color:#42536d}.tmc-rich-toolbar button:hover{border-color:var(--tmc-line);background:#fff}.tmc-rich-toolbar select{min-height:29px;max-width:180px;margin-inline-start:auto;padding:4px 7px;border:1px solid var(--tmc-line);border-radius:6px;background:#fff;color:#42536d;font-size:8px}.tmc-rich-body{min-height:105px;padding:10px;color:#24324a;font-size:10px;line-height:1.75;outline:none}.tmc-rich-body:focus{box-shadow:inset 0 0 0 2px #d9e7ff}.tmc-rich-body[contenteditable=false]{background:#f4f6f9;color:#8a97a8}
.tmc-variables-panel{margin-top:10px;padding:10px;border:1px solid #cfe0ff;border-radius:9px;background:#f5f8ff}.tmc-variables-panel h5{margin:0 0 7px;font-size:9px}.tmc-variable-chips{display:flex;flex-wrap:wrap;gap:5px}.tmc-variable-chips button{padding:4px 7px;border:1px solid #cfe0ff;border-radius:999px;background:#fff;color:#245ec4;font-size:7px;font-weight:800}
.template-print-override{display:grid;gap:3px;min-width:220px;color:#596a82;font-size:8px;font-weight:800;text-align:right}.template-print-override select{min-height:35px;padding:6px 9px;border:1px solid var(--border-color,#dce5f0);border-radius:8px;background:#fff;color:#20314c;font:inherit;font-size:9px}
.tmc-advanced-source{margin-top:10px;padding:11px;border:1px solid #f2d6a5;border-radius:9px;background:#fffaf0}.tmc-advanced-source h4{display:flex;align-items:center;gap:6px;margin:0 0 5px;color:#8b5700}.tmc-advanced-source p{margin:0 0 9px;color:#886a34;font-size:7.5px;line-height:1.7}.tmc-advanced-source label{display:grid;gap:5px;margin-top:8px;color:#5b4930;font-size:8px;font-weight:800}.tmc-advanced-source textarea{width:100%;min-height:90px;padding:8px;border:1px solid #ead4ad;border-radius:7px;background:#fff;color:#283548;font:9px/1.6 Consolas,monospace;direction:ltr;text-align:left;resize:vertical}

@media(max-width:900px){.tmc-document-categories,.tmc-starter-toolbar{grid-template-columns:1fr}.tmc-starter-gallery{grid-template-columns:repeat(2,minmax(160px,1fr))}}
@media(max-width:560px){.tmc-document-categories>button{grid-template-columns:auto 1fr auto}.tmc-document-categories>button>i{display:none}.tmc-starter-gallery{grid-template-columns:1fr}}

/* Reference-aligned simple template editor: canvas + contextual panel + blue section rail. */
.tmc-designer-identity strong{display:block;max-width:280px;overflow:hidden;color:var(--tmc-navy);font-size:12px;font-weight:900;text-overflow:ellipsis;white-space:nowrap}
.tmc-mode-toggle button{display:inline-flex;align-items:center;gap:6px;font-size:9px}.tmc-simple-designer-grid{display:grid;grid-template-columns:minmax(610px,1fr) 350px 108px;grid-template-areas:"canvas context rail";align-items:start;gap:10px;direction:ltr}.tmc-simple-designer-grid>*{direction:rtl}.tmc-simple-designer-grid .tmc-designer-canvas{grid-area:canvas}.tmc-context-panel{grid-area:context;position:sticky;top:62px;max-height:calc(100vh - 84px);overflow:auto;background:#fff;border:1px solid var(--tmc-line);border-radius:12px;box-shadow:0 4px 16px rgba(15,35,65,.05);scrollbar-width:thin}.tmc-blue-section-nav{grid-area:rail;position:sticky;top:62px;max-height:calc(100vh - 84px);overflow:auto;padding:7px;background:#0d55bd;border:1px solid #0a489f;border-radius:12px;box-shadow:0 8px 24px rgba(13,85,189,.2);scrollbar-width:thin}.tmc-blue-section-nav button{width:100%;min-height:61px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;margin:0 0 5px;padding:7px 5px;border:1px solid transparent;border-radius:9px;background:transparent;color:#dceaff;text-align:center;transition:.16s}.tmc-blue-section-nav button:last-child{margin-bottom:0}.tmc-blue-section-nav button:hover{background:rgba(255,255,255,.1);color:#fff}.tmc-blue-section-nav button.active{background:#fff;border-color:#fff;color:#1458b7;box-shadow:0 5px 16px rgba(5,33,76,.22)}.tmc-blue-section-nav button>i{font-size:16px}.tmc-blue-section-nav button>span{font-size:9px;font-weight:900;line-height:1.35}.tmc-blue-section-nav button small{display:block;margin-top:2px;font:600 6px/1.2 Arial,sans-serif;opacity:.78;direction:ltr}.tmc-context-head{display:flex;align-items:center;gap:10px;padding:14px 15px;border-bottom:1px solid var(--tmc-line);background:#fbfdff}.tmc-context-head>span{width:38px;height:38px;display:grid;place-items:center;flex:0 0 auto;border-radius:10px;background:#eaf2ff;color:#145bc6;font-size:15px}.tmc-context-head h3{margin:0;color:#14213d;font-size:13px;font-weight:900}.tmc-context-head p{margin:3px 0 0;color:#7a899e;font:600 8px Arial,sans-serif;direction:ltr}.tmc-context-body{padding:14px}.tmc-context-form{display:grid;gap:11px}.tmc-simple-field{display:grid;gap:5px;color:#3e506a;font-size:9px;font-weight:900}.tmc-simple-field>small{color:#8290a3;font-size:7px;font-weight:600;line-height:1.6}.tmc-simple-field input,.tmc-simple-field select,.tmc-simple-field textarea,.tmc-context-form>input,.tmc-context-form>select,.tmc-formatting-form input,.tmc-formatting-form select,.tmc-formatting-form textarea{width:100%;min-height:37px;padding:7px 9px;border:1px solid #d8e2ee;border-radius:8px;background:#fff;color:#25364e;font:inherit;font-size:9px;outline:none}.tmc-simple-field input:focus,.tmc-simple-field select:focus,.tmc-context-form input:focus,.tmc-context-form select:focus,.tmc-formatting-form textarea:focus{border-color:#76a2f5;box-shadow:0 0 0 3px #edf4ff}.tmc-simple-field input[type=range]{min-height:24px;padding:0;border:0;box-shadow:none;accent-color:var(--tmc-blue)}.tmc-simple-field input[type=color],.tmc-formatting-form input[type=color]{height:39px;padding:4px}.tmc-simple-switch{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px;border:1px solid #e1e8f1;border-radius:9px;background:#fbfcfe;cursor:pointer}.tmc-simple-switch span{min-width:0}.tmc-simple-switch b,.tmc-simple-switch small{display:block}.tmc-simple-switch b{color:#34465f;font-size:9px}.tmc-simple-switch small{margin-top:3px;color:#8290a3;font-size:7px}.tmc-simple-switch input{position:absolute;opacity:0}.tmc-simple-switch>i{position:relative;width:35px;height:19px;flex:0 0 auto;border-radius:999px;background:#cbd5e1;transition:.18s}.tmc-simple-switch>i:after{content:"";position:absolute;top:3px;right:3px;width:13px;height:13px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.2);transition:.18s}.tmc-simple-switch input:checked+i{background:#1f62e8}.tmc-simple-switch input:checked+i:after{transform:translateX(-16px)}.tmc-simple-switch input:disabled+i{opacity:.45}.tmc-panel-primary,.tmc-panel-secondary{min-height:38px;padding:8px 10px;border-radius:8px;font-size:9px;font-weight:900}.tmc-panel-primary{border:1px solid var(--tmc-blue);background:var(--tmc-blue);color:#fff}.tmc-panel-secondary{border:1px solid #cdd9e7;background:#fff;color:#31547f}.tmc-panel-primary:disabled,.tmc-panel-secondary:disabled{opacity:.4}.tmc-default-status{display:flex;align-items:center;gap:8px;padding:9px;border-radius:8px;background:#f3f5f8;color:#77869a;font-size:8px;font-weight:800}.tmc-default-status.active{background:#eaf8f1;color:#14724e}.tmc-live-source{display:flex;align-items:center;gap:10px;padding:11px;border:1px solid #cfe0ff;border-radius:9px;background:#f2f7ff}.tmc-live-source>i{width:32px;height:32px;display:grid;place-items:center;flex:0 0 auto;border-radius:8px;background:#fff;color:#2765cb}.tmc-live-source b,.tmc-live-source small{display:block}.tmc-live-source b{font-size:9px}.tmc-live-source small{margin-top:3px;color:#6880a0;font-size:7px;line-height:1.6}.tmc-simple-logo-upload{position:relative;min-height:132px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:12px;border:1px dashed #b8c9dc;border-radius:10px;background:#fafcff;color:#607089;text-align:center;cursor:pointer}.tmc-simple-logo-upload img{max-width:190px;max-height:74px;object-fit:contain}.tmc-simple-logo-upload>i{font-size:24px;color:#7d91ab}.tmc-simple-logo-upload b{font-size:9px}.tmc-simple-logo-upload small{font-size:7px}.tmc-simple-logo-upload input{position:absolute;inset:0;opacity:0;cursor:pointer}.tmc-context-note{margin:0 0 10px;padding:9px;border-radius:8px;background:#f3f7fc;color:#65758b;font-size:8px;line-height:1.7}.tmc-simple-columns{display:grid;gap:6px}.tmc-simple-columns>header,.tmc-simple-columns>article{display:grid;grid-template-columns:minmax(88px,.9fr) minmax(95px,1fr) 38px minmax(90px,.7fr);align-items:center;gap:5px}.tmc-simple-columns>header{padding:0 5px;color:#7d8da2;font-size:7px;font-weight:900}.tmc-simple-columns>article{padding:7px;border:1px solid #e1e8f1;border-radius:8px;background:#fbfcfe}.tmc-simple-columns select,.tmc-simple-columns input{min-width:0;width:100%;height:31px;padding:4px 6px;border:1px solid #d8e2ee;border-radius:6px;background:#fff;color:#35465e;font-size:8px}.tmc-simple-columns>article>div{display:grid;grid-template-columns:42px 24px 24px;gap:3px}.tmc-simple-columns button{width:24px;height:31px;border:1px solid #d8e2ee;border-radius:6px;background:#fff;color:#4c6180}.tmc-labels-head,.tmc-labels-list label{display:grid;grid-template-columns:82px 1fr 1fr;align-items:center;gap:6px}.tmc-labels-head{padding:0 5px 6px;color:#8190a4;font-size:7px;font-weight:900}.tmc-labels-list{display:grid;gap:5px}.tmc-labels-list label{padding:6px;border:1px solid #e2e8f0;border-radius:8px;background:#fbfcfe}.tmc-labels-list b{overflow:hidden;color:#54657c;font:700 7px Arial,sans-serif;text-overflow:ellipsis}.tmc-labels-list input{min-width:0;height:31px;padding:5px 6px;border:1px solid #d8e2ee;border-radius:6px;background:#fff;color:#26364e;font-size:8px}.tmc-additional-list{display:grid;gap:6px;margin-bottom:9px}.tmc-additional-list article{display:grid;grid-template-columns:1fr 1fr 30px;gap:5px}.tmc-additional-list select,.tmc-additional-list input{min-width:0;height:34px;padding:5px 7px;border:1px solid #d8e2ee;border-radius:7px;background:#fff;font-size:8px}.tmc-additional-list button{border:1px solid #ffd4d8;border-radius:7px;background:#fff4f5;color:#b42336}.tmc-simple-rich-wrap{display:grid;gap:9px;margin-top:10px}.tmc-simple-rich-wrap>label{color:#3e506a;font-size:9px;font-weight:900}.tmc-simple-rich-wrap .tmc-rich-body{min-height:125px}.tmc-simple-variables{padding:10px;border:1px solid #cfe0ff;border-radius:9px;background:#f5f8ff}.tmc-simple-variables>strong{display:block;margin-bottom:7px;color:#315b91;font-size:8px}.tmc-simple-variables>div{display:flex;flex-wrap:wrap;gap:5px}.tmc-simple-variables button{display:flex;flex-direction:column;gap:2px;padding:5px 7px;border:1px solid #cfe0ff;border-radius:7px;background:#fff;color:#245ec4;text-align:right}.tmc-simple-variables button span{font-size:7.5px;font-weight:900}.tmc-simple-variables button small{font:600 6px Consolas,monospace;direction:ltr}.tmc-custom-list{display:grid;gap:5px;margin-bottom:9px}.tmc-custom-list button{display:flex;align-items:center;gap:7px;min-height:34px;padding:7px 9px;border:1px solid #dfe7f1;border-radius:8px;background:#fbfcfe;color:#4b5d75;font-size:8px;font-weight:800}.tmc-custom-list button.active{border-color:#8eb4f7;background:#eef4ff;color:#1d59bd}.tmc-formatting-form>h4{margin:5px 0 0;font-size:9px}.tmc-simple-designer .tmc-designer-canvas{border-color:#cfd8e4;border-radius:12px}.tmc-simple-designer .tmc-safe-area{min-height:940px;padding:28px;background-color:#dfe4ea;background-image:linear-gradient(135deg,rgba(255,255,255,.2) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.2) 50%,rgba(255,255,255,.2) 75%,transparent 75%,transparent);background-size:20px 20px}.tmc-simple-designer #tmc-designer-stage .invoice-paper{box-shadow:0 12px 36px rgba(15,23,42,.18)}.tmc-simple-designer #tmc-designer-stage .invoice-designer-block{cursor:default}.tmc-simple-designer #tmc-designer-stage .invoice-designer-block:hover{outline:0}.tmc-simple-designer #tmc-designer-stage .invoice-designer-block.is-selected:before{display:none}.tmc-context-panel .tmc-health-head,.tmc-context-panel .tmc-change-summary{margin-inline:14px}.tmc-context-panel .tmc-change-summary{margin-bottom:14px}.tmc-context-panel .tmc-change-summary textarea{font-size:8px}.invoice-paper.accman-template-document .invoice-items th,.invoice-paper.accman-template-document .professional-items th{border-color:var(--tpl-table-border,#dfe7f2)!important;background:var(--tpl-table-head,var(--tpl-primary))!important;color:var(--tpl-table-head-text,#fff)!important}.invoice-paper.accman-template-document .invoice-items td,.invoice-paper.accman-template-document .professional-items td{border-color:var(--tpl-table-border,#dfe7f2)!important}.invoice-paper.accman-template-document .invoice-items tbody tr:nth-child(odd) td,.invoice-paper.accman-template-document .professional-items tbody tr:nth-child(odd) td{background:var(--tpl-table-row-odd,#fff)}.invoice-paper.accman-template-document .invoice-items tbody tr:nth-child(even) td,.invoice-paper.accman-template-document .professional-items tbody tr:nth-child(even) td{background:var(--tpl-table-row-even,#f8fafc)}.invoice-simple-rich,.invoice-additional-fields{margin:3mm 0;padding:3mm;border:1px solid var(--tpl-table-border,#dfe7f2);border-radius:2mm;color:#40516b;font-size:.72rem}.invoice-simple-rich p{margin:0 0 1.5mm}.invoice-additional-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2mm}.invoice-additional-fields>div{display:flex;justify-content:space-between;gap:3mm}.invoice-additional-fields span{color:#75849a}.invoice-shipping>strong{display:block;margin-bottom:1.5mm;color:var(--tpl-primary)}
@media(max-width:1450px){.tmc-simple-designer-grid{grid-template-columns:minmax(560px,1fr) 320px 96px}.tmc-blue-section-nav button{min-height:57px}.tmc-context-body{padding:11px}}
@media(max-width:1120px){.tmc-simple-designer-grid{grid-template-columns:1fr;grid-template-areas:"rail" "context" "canvas"}.tmc-blue-section-nav{position:static;display:flex;max-height:none;overflow-x:auto}.tmc-blue-section-nav button{min-width:94px;margin:0 0 0 5px}.tmc-context-panel{position:static;max-height:none}.tmc-simple-designer .tmc-safe-area{min-height:700px}.tmc-designer-toolbar{position:static;grid-template-columns:1fr}.tmc-designer-actions{justify-content:flex-start}}
.tmc-simple-rich-wrap .tmc-rich-toolbar{flex-wrap:wrap}.tmc-simple-rich-wrap .tmc-rich-toolbar input[type=color]{width:30px;height:28px;padding:2px;border:1px solid var(--tmc-line);border-radius:6px;background:#fff}.tmc-simple-rich-wrap .tmc-rich-toolbar select{max-width:128px;margin:0}.tmc-simple-rich-wrap .tmc-rich-toolbar select:last-of-type{margin-inline-start:auto}

/* Section-specific controls shared by the simple editor and the print renderer. */
.tmc-simple-columns>header,.tmc-simple-columns>article{grid-template-columns:minmax(76px,.8fr) minmax(88px,1fr) 38px 64px minmax(90px,.75fr)}
.tmc-simple-advanced-css{margin-top:4px;padding:9px;border:1px solid #f0d7a9;border-radius:8px;background:#fffaf0}
.tmc-simple-advanced-css>summary{display:flex;align-items:center;gap:6px;color:#8b5700;font-size:9px;font-weight:900;cursor:pointer}
.tmc-simple-advanced-css[open]>summary{margin-bottom:9px}
.tmc-formatting-form>h4{padding:8px 0 4px;border-bottom:1px solid #e7edf5;color:#1c3761}
.accman-template-document{color:var(--tpl-text,#14213d)}
.accman-template-document h1,.accman-template-document h2,.accman-template-document h3,.accman-template-document h4,.accman-template-document .invoice-title strong,.accman-template-document .reference-title{font-family:var(--tpl-heading-font,var(--tpl-font)),sans-serif;color:var(--tpl-heading-color,var(--tpl-primary))}
.accman-template-document h1,.accman-template-document .invoice-title strong{font-size:var(--tpl-heading-size,16px)}
.accman-template-document .invoice-items th,.accman-template-document .invoice-items td,.accman-template-document .professional-items th,.accman-template-document .professional-items td{border-width:var(--tpl-table-border-width,1px)!important}
.accman-template-document .invoice-summary .grand,.accman-template-document:not(.thermal-reference-layout) .professional-totals .total{background:var(--tpl-total-color,var(--tpl-primary))!important}
.thermal-reference-layout .thermal-description small{font-size:.85em;font-weight:400;color:#475569}
.accman-template-document .invoice-text-block,.accman-template-document .professional-note{color:var(--tpl-notes-text,#40516b);background:var(--tpl-notes-bg,#fff)}
.accman-template-document.notes-before-totals .reference-bottom>.reference-notes{order:1}.accman-template-document.notes-before-totals .reference-bottom>.professional-totals{order:2}.accman-template-document.notes-after-totals .reference-bottom>.professional-totals{order:1}.accman-template-document.notes-after-totals .reference-bottom>.reference-notes{order:2}

/* Company logo is an original transparent asset, never a colored badge. */
.invoice-paper.accman-template-document .invoice-logo,
.invoice-paper.accman-template-document .invoice-logo::before,
.invoice-paper.accman-template-document .invoice-logo::after{background:transparent!important;background-image:none!important;box-shadow:none!important}
.invoice-paper.accman-template-document .invoice-logo img{display:block;width:auto;height:auto;max-width:min(100%,var(--document-logo-max-width,140px));max-height:var(--document-logo-max-height,80px);object-fit:contain;background:transparent!important;filter:none!important}
.invoice-paper.accman-template-document.paper-a4:not(.reference-a4):not(.invoice-thermal) .invoice-document-strip:has(>div:nth-child(5):last-child){grid-template-columns:repeat(5,minmax(0,1fr))}
.tmc-logo-system-source{cursor:default!important}
.tmc-logo-system-source img{width:auto;height:auto;object-fit:contain;background:transparent!important}
.tmc-logo-system-source a{display:inline-flex;align-items:center;justify-content:center;gap:5px;min-height:28px;padding:5px 8px;border:1px solid var(--tmc-line);border-radius:7px;background:#fff;color:var(--tmc-blue);font-size:8px;font-weight:900;text-decoration:none;cursor:pointer}
.tmc-logo-system-source a:hover{border-color:var(--tmc-blue)}

/* Template gallery: reserve card geometry and render actions in a body portal. */
.tmc-page .tmc-gallery{grid-template-columns:repeat(3,minmax(0,1fr));align-items:stretch;gap:14px}
.tmc-page .tmc-template-card{display:flex;flex-direction:column;min-width:0;overflow:hidden;transform:none!important;transition:border-color .18s,box-shadow .18s}
.tmc-page .tmc-template-card:hover,.tmc-page .tmc-template-card.selected{transform:none!important}
.tmc-page .tmc-card-preview{flex:0 0 auto;height:320px;overflow:hidden;background:var(--tmc-soft)}
.tmc-page .tmc-card-preview .invoice-thumb{top:8px;transform:translateX(50%) scale(.27);transform-origin:top center;box-shadow:0 12px 25px rgba(21,37,62,.12)}
.tmc-page .tmc-card-preview .invoice-thermal.invoice-thumb{transform:translateX(50%) scale(.5)}
.tmc-page .tmc-card-body{display:flex;flex:1 1 auto;flex-direction:column;min-width:0;padding:14px}
.tmc-page .tmc-card-title>div:first-child{min-width:0;flex:1 1 auto}
.tmc-page .tmc-card-title h3{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;max-height:39px;line-height:1.5}
.tmc-page .tmc-card-description{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;height:32px;min-height:32px;margin:8px 0;line-height:16px}
.tmc-page .tmc-card-meta{flex-wrap:wrap;min-height:36px;margin:8px 0}
.tmc-page .tmc-card-actions{margin-top:auto;min-height:38px;flex-wrap:wrap}
.tmc-page .tmc-card-actions>button{height:36px;min-height:36px;display:inline-flex;align-items:center;justify-content:center;gap:5px;white-space:nowrap}
.tmc-page .tmc-card-actions>button[aria-haspopup="menu"]{width:36px;padding:0}
.tmc-card-menu{position:fixed;z-index:10060;display:grid;min-width:185px;max-width:calc(100vw - 16px);padding:5px;background:#fff;border:1px solid var(--tmc-line);border-radius:10px;box-shadow:0 12px 30px rgba(15,29,52,.16);color:var(--tmc-navy)}
.tmc-card-menu button{height:38px;padding:8px 11px;border:0;border-radius:7px;background:#fff;color:#3f5068;text-align:start;font:inherit;font-size:11px;cursor:pointer}
.tmc-card-menu button:hover{background:var(--tmc-soft)}
.tmc-card-menu button.danger{color:var(--tmc-red)}
.tmc-card-menu button:disabled{opacity:.45;cursor:not-allowed}
@media(max-width:1300px){.tmc-page .tmc-gallery{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:900px){.tmc-page .tmc-gallery{grid-template-columns:minmax(0,1fr)}}
@media(max-width:600px){.tmc-page .tmc-card-preview{height:300px}.tmc-page .tmc-card-preview .invoice-thumb{transform:translateX(50%) scale(.25)}.tmc-page .tmc-card-actions>button.primary{flex:1 1 auto}}
.tmc-gallery-loading{padding:4px 0}
.tmc-summary-cards{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin:0 0 14px}.tmc-summary-cards article{display:flex;align-items:center;gap:10px;min-width:0;padding:12px;background:#fff;border:1px solid var(--tmc-line);border-radius:11px;box-shadow:0 3px 12px rgba(21,37,62,.035)}.tmc-summary-icon{display:grid;place-items:center;width:34px;height:34px;flex:0 0 auto;border-radius:9px;font-size:14px}.tmc-summary-icon.documents{background:#e9f1ff;color:#2563c9}.tmc-summary-icon.total{background:#f1edff;color:#7157cf}.tmc-summary-icon.active{background:#e6f8ef;color:#148458}.tmc-summary-icon.inactive{background:#fff0f2;color:#ce4050}.tmc-summary-icon.used{background:#fff5dd;color:#a46800}.tmc-summary-cards small{display:block;overflow:hidden;color:var(--tmc-muted);font-size:8px;font-weight:800;text-overflow:ellipsis;white-space:nowrap}.tmc-summary-cards strong{display:block;margin-top:2px;color:var(--tmc-navy);font-size:17px;line-height:1}.tmc-library-tabs{display:flex;align-items:center;gap:4px;margin:0 0 10px;padding:4px;background:#fff;border:1px solid var(--tmc-line);border-radius:10px;width:max-content;max-width:100%;overflow:auto}.tmc-library-tabs button{display:inline-flex;align-items:center;gap:6px;min-height:32px;padding:5px 10px;border:0;border-radius:7px;background:transparent;color:#64748b;font-size:10px;font-weight:900;white-space:nowrap}.tmc-library-tabs button.active{background:#eaf1ff;color:#1c5cd0}.tmc-library-tabs b{display:grid;place-items:center;min-width:18px;height:18px;padding:0 4px;border-radius:999px;background:#eef2f7;color:#65748a;font-size:8px}.tmc-library-tabs button.active b{background:#d8e7ff;color:#1e5fcf}.tmc-library-layout{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:12px;align-items:start}.tmc-library-layout>.tmc-selected-panel{position:sticky;top:12px}.tmc-selected-panel{overflow:hidden;background:#fff;border:1px solid var(--tmc-line);border-radius:12px;box-shadow:0 4px 15px rgba(21,37,62,.045)}.tmc-selected-panel>header{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;padding:13px;border-bottom:1px solid var(--tmc-line)}.tmc-selected-eyebrow{display:flex;align-items:center;gap:5px;color:#b88212;font-size:8px;font-weight:900}.tmc-selected-panel h2{margin:4px 0 2px;color:var(--tmc-navy);font-size:14px;font-weight:900}.tmc-selected-panel header p{margin:0;color:var(--tmc-muted);font-size:9px}.tmc-selected-preview{position:relative;height:220px;overflow:hidden;background:#eff3f8}.tmc-selected-preview .invoice-thumb{position:absolute;top:8px;right:50%;transform:translateX(50%) scale(.19);transform-origin:top center;box-shadow:0 10px 22px rgba(21,37,62,.14)}.tmc-selected-preview .invoice-thermal.invoice-thumb{transform:translateX(50%) scale(.48)}.tmc-selected-actions{display:grid;grid-template-columns:1fr 1fr;gap:7px;padding:11px;border-bottom:1px solid var(--tmc-line)}.tmc-selected-actions .btn{min-height:34px;padding:6px;font-size:9px;font-weight:900}.tmc-selected-section{padding:12px;border-bottom:1px solid var(--tmc-line)}.tmc-selected-section:last-child{border-bottom:0}.tmc-selected-section h3{display:flex;align-items:center;gap:6px;margin:0 0 9px;color:var(--tmc-navy);font-size:10px;font-weight:900}.tmc-selected-section h3 i{color:var(--tmc-blue)}.tmc-usage-list{display:grid;gap:6px}.tmc-usage-list>div{display:flex;align-items:center;gap:7px;padding:7px;border-radius:7px;background:#f8fafc}.tmc-usage-list>div>i{display:grid;place-items:center;width:25px;height:25px;border-radius:6px;background:#eaf1ff;color:#2661c7;font-size:10px}.tmc-usage-list strong,.tmc-usage-list small{display:block}.tmc-usage-list strong{color:#34445e;font-size:9px}.tmc-usage-list small{margin-top:2px;color:var(--tmc-muted);font-size:7.5px;line-height:1.45}.tmc-panel-versions{display:grid;gap:5px}.tmc-panel-versions button{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:7px;width:100%;padding:6px;border:0;border-radius:7px;background:#f8fafc;color:#506077;text-align:right}.tmc-panel-versions b{display:grid;place-items:center;width:27px;height:24px;border-radius:6px;background:#eaf1ff;color:#2160c9;font-size:8px}.tmc-panel-versions span{font-size:8px;font-weight:800}.tmc-panel-versions small{display:block;margin-top:2px;color:#8491a2;font-size:7px;font-weight:700}.tmc-panel-versions em{padding:2px 5px;border-radius:999px;background:#e8f8ef;color:#14734e;font-size:7px;font-style:normal;font-weight:900}.tmc-panel-link{margin-top:8px;padding:0;border:0;background:transparent;color:var(--tmc-blue);font-size:8px;font-weight:900}.tmc-panel-empty,.tmc-panel-loading{margin:0;padding:8px;border-radius:7px;background:#f8fafc;color:var(--tmc-muted);font-size:8px;line-height:1.6}.tmc-panel-loading i{color:var(--tmc-blue)}.tmc-page .tmc-template-card[data-action="select-template"]{cursor:pointer}.tmc-page .tmc-template-card.selected{border-color:#4d89f2;box-shadow:0 0 0 2px #dbe9ff,0 8px 18px rgba(31,98,232,.08)}
@media(max-width:1250px){.tmc-summary-cards{grid-template-columns:repeat(3,minmax(0,1fr))}.tmc-library-layout{grid-template-columns:minmax(0,1fr) 285px}.tmc-page .tmc-library-layout .tmc-gallery{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:980px){.tmc-library-layout{grid-template-columns:1fr}.tmc-library-layout>.tmc-selected-panel{position:static}.tmc-selected-panel{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.tmc-selected-panel>header,.tmc-selected-preview{grid-column:1/-1}.tmc-selected-actions{grid-column:1/-1}.tmc-selected-section{border-bottom:0;border-inline-start:1px solid var(--tmc-line)}.tmc-selected-section:last-child{border-inline-start:0}}@media(max-width:620px){.tmc-summary-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.tmc-summary-cards article:last-child{grid-column:1/-1}.tmc-library-tabs{width:100%}.tmc-library-tabs button{flex:1}.tmc-selected-panel{display:block}.tmc-selected-section{border-inline-start:0;border-bottom:1px solid var(--tmc-line)}.tmc-selected-section:last-child{border-bottom:0}.tmc-selected-preview{height:250px}}
.tmc-skeleton-heading{display:flex;justify-content:space-between;gap:20px;height:61px;margin-bottom:15px}
.tmc-skeleton-heading span:first-child{width:240px;max-width:55%;height:48px}
.tmc-skeleton-heading span:last-child{width:130px;height:39px}
.tmc-skeleton-tabs{display:flex;gap:8px;height:49px;margin-bottom:18px}
.tmc-skeleton-tabs span{width:115px;height:39px}
.tmc-skeleton-heading span,.tmc-skeleton-tabs span,.tmc-skeleton-line,.tmc-skeleton-actions{display:block;background:var(--tmc-soft);border-radius:9px}
.tmc-skeleton-card .tmc-card-body{gap:13px}
.tmc-skeleton-line{height:18px;width:82%}
.tmc-skeleton-line.short{width:48%}
.tmc-skeleton-actions{height:36px;width:100%;margin-top:auto}

/* templates-center.css */
/* ACCMAN Templates — library pages and the drag & drop editor (UI only; printed documents are styled by the layout
   renderer in document_layout.js). Every rule is scoped to .tpl-* classes. */
.tpl-center,.tpl-modal-backdrop,.tpl-floating-menu{--tpl-blue:#1f62e8;--tpl-blue-dark:#174bb5;--tpl-navy:#10284f;--tpl-green:#16a34a;--tpl-red:#dc2626;--tpl-amber:#d97706;--tpl-line:#e2e8f0;--tpl-soft:#f5f8fc;--tpl-muted:#64748b;--tpl-text:#0f172a}
.tpl-center{display:block;padding:20px 24px 32px;color:var(--tpl-text);font-family:inherit}
.tpl-center.is-busy{cursor:progress}
.tpl-center.is-busy button{pointer-events:none}
.tpl-loading,.tpl-error{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;min-height:280px;color:var(--tpl-muted)}
.tpl-error i{font-size:28px;color:var(--tpl-red)}
.tpl-breadcrumb{display:flex;flex-wrap:wrap;gap:6px;align-items:center;font-size:13px;color:var(--tpl-muted);margin-bottom:8px}
.tpl-breadcrumb a{color:var(--tpl-blue);text-decoration:none}
.tpl-breadcrumb a:hover{text-decoration:underline}
.tpl-breadcrumb b{color:var(--tpl-text);font-weight:600}
.tpl-page-head{margin-bottom:18px}
.tpl-head-row{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:12px}
.tpl-head-row h1{margin:0;font-size:24px;font-weight:800;color:var(--tpl-navy)}
.tpl-head-row p{margin:4px 0 0;color:var(--tpl-muted)}
.tpl-head-actions{display:flex;flex-wrap:wrap;gap:8px}
.tpl-banner{display:flex;gap:10px;align-items:center;padding:10px 14px;border-radius:10px;margin-bottom:16px;font-size:14px}
.tpl-banner.is-warning{background:#fff7ed;border:1px solid #fed7aa;color:#9a3412}
.tpl-muted{color:var(--tpl-muted);font-size:13px;line-height:1.6}
.tpl-warning-text{color:#b45309;font-size:13px;background:#fffbeb;border:1px solid #fde68a;border-radius:8px;padding:8px 10px;margin:8px 0}

/* Buttons */
.tpl-btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:38px;padding:0 14px;border:1px solid var(--tpl-line);border-radius:9px;background:#fff;color:var(--tpl-text);font:inherit;font-size:14px;font-weight:600;cursor:pointer;white-space:nowrap;transition:background .15s,border-color .15s,box-shadow .15s}
.tpl-btn:hover{border-color:#cbd5e1;background:var(--tpl-soft)}
.tpl-btn:focus-visible,.tpl-icon-btn:focus-visible,.tpl-card:focus-visible,.tpl-starter:focus-visible{outline:3px solid rgba(31,98,232,.35);outline-offset:2px}
.tpl-btn-primary{background:var(--tpl-blue);border-color:var(--tpl-blue);color:#fff}
.tpl-btn-primary:hover{background:var(--tpl-blue-dark);border-color:var(--tpl-blue-dark)}
.tpl-btn-primary:disabled{opacity:.5;cursor:not-allowed}
.tpl-btn-save{background:var(--tpl-green);border-color:var(--tpl-green);color:#fff}
.tpl-btn-save:hover{background:#15803d;border-color:#15803d}
.tpl-btn-sm{min-height:30px;padding:0 10px;font-size:13px}
.tpl-btn-danger-ghost{color:var(--tpl-red);border-color:#fecaca}
.tpl-btn-danger-ghost:hover{background:#fef2f2}
.tpl-icon-btn{display:inline-flex;align-items:center;justify-content:center;gap:5px;min-width:34px;height:34px;padding:0 8px;border:1px solid transparent;border-radius:8px;background:transparent;color:#334155;font:inherit;font-size:13px;cursor:pointer}
.tpl-icon-btn:hover{background:var(--tpl-soft);border-color:var(--tpl-line)}
.tpl-icon-btn.is-danger{color:var(--tpl-red)}
.tpl-link{border:0;background:none;color:var(--tpl-blue);cursor:pointer;font:inherit;font-size:12px;padding:0}

/* Page 1: document-type cards */
.tpl-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px}
.tpl-card{--tone:#1f62e8;--tone-soft:#eaf1ff;position:relative;display:flex;flex-direction:column;gap:10px;padding:18px;border:1px solid var(--tpl-line);border-radius:14px;background:#fff;box-shadow:0 1px 2px rgba(15,23,42,.05);cursor:pointer;transition:transform .15s,box-shadow .15s,border-color .15s}
.tpl-card:hover{transform:translateY(-2px);border-color:#bfd3fb;box-shadow:0 10px 24px rgba(15,23,42,.08)}
.tpl-card.tone-indigo{--tone:#4f46e5;--tone-soft:#eef2ff}.tpl-card.tone-red{--tone:#dc2626;--tone-soft:#fef2f2}.tpl-card.tone-amber{--tone:#d97706;--tone-soft:#fffbeb}.tpl-card.tone-green{--tone:#16a34a;--tone-soft:#f0fdf4}.tpl-card.tone-teal{--tone:#0d9488;--tone-soft:#f0fdfa}.tpl-card.tone-purple{--tone:#7c3aed;--tone-soft:#f5f3ff}.tpl-card.tone-slate{--tone:#475569;--tone-soft:#f1f5f9}
.tpl-card-icon{display:flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:12px;background:var(--tone-soft);color:var(--tone);font-size:22px}
.tpl-card h3{margin:0;font-size:17px;font-weight:800;color:var(--tpl-navy)}
.tpl-card-counts{margin:0;display:grid;gap:4px;font-size:14px}
.tpl-card-counts div{display:flex;gap:6px}
.tpl-card-counts dt{color:var(--tpl-muted);font-weight:500}
.tpl-card-counts dd{margin:0;font-weight:800;color:var(--tpl-text)}
.tpl-card-btn{margin-top:auto;width:100%}

/* Page 2: saved templates of a type */
.tpl-list{display:flex;flex-direction:column;gap:12px}
.tpl-row{display:grid;grid-template-columns:136px minmax(0,1fr) auto;gap:16px;align-items:center;padding:14px;border:1px solid var(--tpl-line);border-radius:14px;background:#fff;box-shadow:0 1px 2px rgba(15,23,42,.04)}
.tpl-row.is-inactive{background:#fbfcfe}
.tpl-row.is-inactive .tpl-thumb{opacity:.6}
.tpl-compatible{margin-top:18px}
.tpl-section-title{display:flex;align-items:center;gap:8px;margin:0 0 10px;font-size:15px;font-weight:800;color:var(--tpl-ink,#0f172a)}
.tpl-section-title i{color:var(--tpl-blue,#1f62e8)}
.tpl-row.is-compatible{border-style:dashed}
.tpl-thumb{width:136px;height:150px;display:flex;align-items:flex-start;justify-content:center;overflow:hidden;border:1px solid var(--tpl-line);border-radius:10px;background:#f8fafc;padding:8px}
.tpl-thumb>img{max-width:100%;max-height:100%;object-fit:contain;box-shadow:0 2px 8px rgba(15,23,42,.12);background:#fff}
.tpl-thumb-legacy{display:flex;align-items:center;justify-content:center;width:100%;height:100%;font-size:34px;color:#94a3b8}
.tpl-mini{position:relative;overflow:hidden;background:#fff;box-shadow:0 2px 8px rgba(15,23,42,.12);flex:0 0 auto}
.tpl-mini-scale{position:absolute;top:0;left:0;transform-origin:top left;direction:ltr;pointer-events:none}
.tpl-row-main{min-width:0}
.tpl-row-main h3{margin:6px 0 4px;font-size:17px;font-weight:800;color:var(--tpl-navy);overflow-wrap:anywhere}
.tpl-row-meta{margin:0;color:#334155;font-size:14px}
.tpl-row-dates{display:flex;flex-wrap:wrap;gap:4px 14px;margin:6px 0 0;color:var(--tpl-muted);font-size:13px}
.tpl-badges{display:flex;flex-wrap:wrap;gap:6px}
.tpl-badge{display:inline-flex;align-items:center;gap:4px;padding:2px 9px;border-radius:999px;font-size:12px;font-weight:700;line-height:1.7;border:1px solid transparent}
.tpl-badge.is-active{background:#dcfce7;color:#166534;border-color:#bbf7d0}
.tpl-badge.is-inactive{background:#f1f5f9;color:#475569;border-color:#e2e8f0}
.tpl-badge.is-default{background:#fef3c7;color:#92400e;border-color:#fde68a}
.tpl-badge.is-base{background:#eaf1ff;color:#1e40af;border-color:#c7d7fb}
.tpl-badge.is-branch{background:#f5f3ff;color:#5b21b6;border-color:#ddd6fe}
.tpl-badge.is-legacy{background:#fef2f2;color:#991b1b;border-color:#fecaca}
.tpl-badge.is-required{background:#fff7ed;color:#9a3412;border-color:#fed7aa;font-size:11px}
.tpl-row-actions{display:flex;flex-wrap:wrap;gap:4px;justify-content:flex-end;align-items:center;max-width:420px}
.tpl-row-actions .tpl-icon-btn{flex-direction:column;gap:2px;height:auto;min-width:64px;padding:6px 6px;font-size:12px;color:#334155}
.tpl-row-actions .tpl-icon-btn i{font-size:15px;color:var(--tpl-blue)}
.tpl-row-actions .tpl-more{min-width:34px}
.tpl-empty{display:flex;flex-direction:column;align-items:center;gap:8px;padding:48px 16px;border:1px dashed #cbd5e1;border-radius:14px;background:#fff;text-align:center}
.tpl-empty i{font-size:36px;color:#94a3b8}
.tpl-empty h3{margin:0;font-size:18px}
.tpl-empty p{margin:0;color:var(--tpl-muted)}
.tpl-floating-menu{position:fixed;z-index:3000;min-width:190px;padding:6px;border:1px solid var(--tpl-line);border-radius:10px;background:#fff;box-shadow:0 12px 32px rgba(15,23,42,.16);direction:rtl}
.tpl-floating-menu button{display:flex;align-items:center;gap:8px;width:100%;padding:9px 10px;border:0;border-radius:7px;background:transparent;font:inherit;font-size:14px;color:var(--tpl-text);cursor:pointer;text-align:start}
.tpl-floating-menu button:hover,.tpl-floating-menu button:focus{background:var(--tpl-soft);outline:none}
.tpl-floating-menu button.is-danger{color:var(--tpl-red)}

/* Modals */
.tpl-modal-backdrop{position:fixed;inset:0;z-index:2500;display:flex;align-items:center;justify-content:center;padding:18px;background:rgba(15,23,42,.45);direction:rtl}
.tpl-modal{display:flex;flex-direction:column;width:min(640px,100%);max-height:calc(100vh - 36px);border-radius:16px;background:#fff;box-shadow:0 24px 60px rgba(15,23,42,.3);overflow:hidden}
.tpl-modal.is-wide{width:min(1080px,100%)}
.tpl-modal.is-narrow{width:min(460px,100%)}
.tpl-modal-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 20px;border-bottom:1px solid var(--tpl-line)}
.tpl-modal-head h3{margin:0;font-size:18px;font-weight:800;color:var(--tpl-navy)}
.tpl-modal-body{padding:16px 20px;overflow:auto}
.tpl-modal-body p{margin-top:0}
.tpl-modal-foot{display:flex;justify-content:flex-end;gap:8px;padding:12px 20px;border-top:1px solid var(--tpl-line);background:#fafbfd}
.tpl-starter-tabs{display:flex;flex-wrap:wrap;gap:6px;padding:12px 20px 0}
.tpl-starter-tabs button,.tpl-tabs button{padding:7px 14px;border:1px solid var(--tpl-line);border-radius:999px;background:#fff;font:inherit;font-size:13px;font-weight:600;cursor:pointer;color:#334155}
.tpl-starter-tabs button.is-active,.tpl-tabs button.is-active{background:var(--tpl-blue);border-color:var(--tpl-blue);color:#fff}
.tpl-starters{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:14px}
.tpl-starter{position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;padding:12px 10px;border:2px solid var(--tpl-line);border-radius:14px;background:#f8fafc;font:inherit;cursor:pointer;text-align:center;transition:border-color .15s,box-shadow .15s}
.tpl-starter:hover{border-color:#bfd3fb}
.tpl-starter.is-selected{border-color:var(--tpl-blue);box-shadow:0 0 0 3px rgba(31,98,232,.15);background:#fff}
.tpl-starter b{font-size:14px;color:var(--tpl-navy)}
.tpl-starter small{color:var(--tpl-muted)}
.tpl-starter-check{position:absolute;top:8px;inset-inline-start:8px;display:none;align-items:center;justify-content:center;width:24px;height:24px;border-radius:50%;background:var(--tpl-blue);color:#fff;font-size:12px;z-index:2}
.tpl-starter.is-selected .tpl-starter-check{display:flex}
.tpl-starter .tpl-mini{max-height:240px}
.tpl-starter-cell{position:relative;display:flex}
.tpl-starter-cell>.tpl-starter{flex:1 1 auto;min-width:0}
.tpl-starter-preview{position:absolute;top:8px;inset-inline-end:8px;z-index:2;display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border:1px solid var(--tpl-line);border-radius:999px;background:rgba(255,255,255,.94);font:inherit;font-size:12px;font-weight:600;color:#334155;cursor:pointer}
.tpl-starter-preview:hover,.tpl-starter-preview:focus-visible{border-color:var(--tpl-blue);color:var(--tpl-blue);outline:none}
.tpl-starter-group{grid-column:1/-1;display:flex;align-items:center;gap:8px;margin:10px 0 0;padding-top:12px;border-top:1px solid var(--tpl-line);font-size:15px;color:var(--tpl-navy)}
.tpl-starter-group small{min-width:22px;padding:1px 7px;border-radius:999px;background:#eef2ff;font-size:12px;font-weight:700;color:var(--tpl-blue);text-align:center}
.tpl-starter-tabs-gap{width:1px;align-self:stretch;margin:2px 6px;background:var(--tpl-line)}
.tpl-versions{width:100%;border-collapse:collapse;font-size:14px}
.tpl-versions th,.tpl-versions td{padding:9px 8px;border-bottom:1px solid var(--tpl-line);text-align:start}
.tpl-versions th{color:var(--tpl-muted);font-weight:600}
.tpl-versions-actions{display:flex;gap:6px;justify-content:flex-end}
.tpl-branch-rows{display:flex;flex-direction:column;gap:10px}
.tpl-branch-row{display:grid;grid-template-columns:minmax(120px,220px) minmax(0,1fr);gap:12px;align-items:center}
.tpl-branch-row select,.tpl-field select,.tpl-field input,.tpl-bar-field select{min-height:36px;padding:0 10px;border:1px solid #cbd5e1;border-radius:8px;background:#fff;font:inherit;font-size:14px;color:var(--tpl-text);width:100%}
.tpl-brand-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}
.tpl-brand-item{display:flex;flex-direction:column;gap:8px;align-items:flex-start;padding:14px;border:1px solid var(--tpl-line);border-radius:12px}
.tpl-brand-preview{display:flex;align-items:center;justify-content:center;width:100%;height:120px;border:1px dashed #cbd5e1;border-radius:10px;background:repeating-conic-gradient(#f1f5f9 0 25%,#fff 0 50%) 0 0/16px 16px}
.tpl-brand-preview img{max-width:90%;max-height:100px;object-fit:contain}

/* Page 3: the editor */
.tpl-center:has(.tpl-editor){padding:0}
.tpl-editor{display:flex;flex-direction:column;height:calc(100vh - var(--app-header-height,64px));min-height:560px;background:#f1f4f9}
.tpl-editor-bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 14px;padding:10px 14px;background:#fff;border-bottom:1px solid var(--tpl-line)}
.tpl-bar-group{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.tpl-bar-title{display:flex;flex-direction:column;min-width:200px}
.tpl-bar-title small{color:var(--tpl-muted);font-size:12px}
.tpl-bar-title input{border:1px solid transparent;border-radius:7px;padding:3px 6px;font:inherit;font-size:16px;font-weight:800;color:var(--tpl-navy);background:transparent;min-width:220px}
.tpl-bar-title input:hover,.tpl-bar-title input:focus{border-color:#cbd5e1;background:#fff;outline:none}
.tpl-bar-field{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--tpl-muted)}
.tpl-bar-field select{min-height:34px;width:auto}
.tpl-bar-sep{width:1px;height:24px;background:var(--tpl-line)}
.tpl-editor-bar output{min-width:44px;text-align:center;font-size:13px;font-weight:700}
.tpl-switch{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:#334155;cursor:pointer;user-select:none}
.tpl-switch input{position:absolute;opacity:0;width:1px;height:1px}
.tpl-switch span{position:relative;width:36px;height:20px;border-radius:999px;background:#cbd5e1;transition:background .15s}
.tpl-switch span::after{content:'';position:absolute;top:2px;right:2px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.2);transition:transform .15s}
.tpl-switch input:checked+span{background:var(--tpl-green)}
.tpl-switch input:checked+span::after{transform:translateX(-16px)}
.tpl-switch input:focus-visible+span{outline:3px solid rgba(31,98,232,.35)}
.tpl-switch-sm span{width:30px;height:17px}
.tpl-switch-sm span::after{width:13px;height:13px}
.tpl-switch-sm input:checked+span{background:var(--tpl-blue)}
.tpl-switch-sm input:checked+span::after{transform:translateX(-13px)}
.tpl-editor-status{display:flex;flex-wrap:wrap;align-items:center;gap:6px 18px;padding:6px 16px;background:#f8fafc;border-bottom:1px solid var(--tpl-line);font-size:13px;color:var(--tpl-muted);min-height:32px}
.tpl-save-state{font-weight:700;color:var(--tpl-green)}
.tpl-save-state.is-dirty{color:var(--tpl-amber)}
.tpl-save-state i{font-size:9px;vertical-align:middle}
.tpl-warnings{color:#b45309;cursor:help;max-width:520px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tpl-sample-badge{color:#6d28d9;font-weight:600}
.tpl-editor-body{display:grid;grid-template-columns:320px minmax(0,1fr) 236px;flex:1 1 auto;min-height:0}
.tpl-panel{min-height:0;overflow:auto;background:#fff}
.tpl-props{border-inline-end:1px solid var(--tpl-line)}
.tpl-library{border-inline-start:1px solid var(--tpl-line);padding:12px}
.tpl-library h3{margin:0 0 10px;font-size:15px;font-weight:800;color:var(--tpl-navy)}
.tpl-library-sub{margin-top:18px!important}
.tpl-search{display:flex;align-items:center;gap:8px;padding:0 10px;min-height:36px;border:1px solid #cbd5e1;border-radius:9px;margin-bottom:10px;color:var(--tpl-muted)}
.tpl-search input{flex:1;border:0;outline:none;font:inherit;font-size:14px;background:transparent;min-width:0}
.tpl-search-sm{min-height:32px}
.tpl-library-list{display:flex;flex-direction:column;gap:4px}
.tpl-lib-item{display:flex;align-items:center;gap:10px;width:100%;padding:8px 10px;border:1px solid transparent;border-radius:9px;background:transparent;font:inherit;font-size:14px;color:#1e293b;cursor:grab;text-align:start}
.tpl-lib-item:hover{background:#f1f5ff;border-color:#dbe6fd}
.tpl-lib-item>i:first-child{width:18px;text-align:center;color:var(--tpl-blue)}
.tpl-lib-item span{flex:1}
.tpl-lib-item.is-added{cursor:pointer;color:#475569}
.tpl-lib-state{color:var(--tpl-green);font-size:12px}
.tpl-lib-required{color:#b45309;font-size:11px}
.tpl-canvas-wrap{position:relative;overflow:auto;padding:28px;background-color:#e9eef6;background-image:radial-gradient(#d4dcea 1px,transparent 1px);background-size:14px 14px;touch-action:none}
.tpl-canvas-wrap.is-drop{outline:3px dashed rgba(31,98,232,.4);outline-offset:-8px}
.tpl-canvas-zoom{width:max-content;margin:0 auto}
.tpl-canvas-page{position:relative;background:#fff;box-shadow:0 2px 6px rgba(15,23,42,.12),0 18px 40px rgba(15,23,42,.16);direction:ltr}
.tpl-canvas-page>.accman-layout-document{position:absolute;inset:0}
.tpl-canvas-page .lt-el{cursor:move}
.tpl-canvas-page .lt-el[data-locked="1"]{cursor:default}
.tpl-canvas-page .lt-el:hover{outline:1px dashed #93c5fd}
.tpl-canvas-page .lt-el.is-selected{outline:none}
.tpl-canvas-page .lt-el[data-hidden="1"]{opacity:.3}
.tpl-canvas-page .lt-el.tpl-warn{outline:1.5px dashed #ef4444!important}
.tpl-canvas-page .lt-el.tpl-overflow{outline:1px dashed #f59e0b}
.tpl-canvas-page tr.tpl-row-hidden{display:none}
.tpl-canvas-page .lt-el.tpl-flow-more::after{content:attr(data-more);position:absolute;inset-inline:0;bottom:0;height:5mm;display:flex;align-items:center;justify-content:center;background:#fff;border-top:1px dashed #cbd5e1;color:#64748b;font-size:7pt;font-weight:600;pointer-events:none}
.tpl-canvas-page .lt-el.tpl-overflow::after{content:'\2026';position:absolute;inset-inline:0;bottom:0;height:5mm;display:flex;align-items:flex-end;justify-content:center;padding-bottom:.3mm;background:linear-gradient(to bottom,rgba(255,255,255,0),#fff 70%);color:#d97706;font-weight:800;font-size:9pt;pointer-events:none}
.tpl-guides{position:absolute;inset:0;pointer-events:none;z-index:900}
.tpl-margin-guide{position:absolute;border:1px dashed rgba(99,102,241,.35)}
.tpl-band-line{position:absolute;left:0;right:0;border-top:1px dashed #a78bfa}
.tpl-band-line span{position:absolute;bottom:1px;left:4px;font-size:9px;color:#7c3aed;background:rgba(255,255,255,.85);padding:0 4px;border-radius:3px;direction:rtl}
.tpl-thermal-note{position:absolute;bottom:4px;left:0;right:0;text-align:center;font-size:9px;color:#7c3aed;direction:rtl}
.tpl-snap-line{position:absolute;background:#ec4899}
.tpl-snap-line.is-v{top:0;bottom:0;width:1px}
.tpl-snap-line.is-h{left:0;right:0;height:1px}
.tpl-selection{position:absolute;z-index:950;outline:1.5px solid var(--tpl-blue);pointer-events:none}
.tpl-selection.is-locked{outline-style:dashed;outline-color:#94a3b8}
.tpl-selection-tag{position:absolute;bottom:100%;left:-1px;margin-bottom:2px;padding:1px 6px;border-radius:4px 4px 0 0;background:var(--tpl-blue);color:#fff;font-size:10px;white-space:nowrap;direction:rtl}
.tpl-selection.is-locked .tpl-selection-tag{background:#64748b}
.tpl-handle{position:absolute;width:9px;height:9px;border:1.5px solid var(--tpl-blue);border-radius:2px;background:#fff;pointer-events:auto;touch-action:none}
.tpl-handle.h-n{top:-5px;left:calc(50% - 5px);cursor:ns-resize}.tpl-handle.h-s{bottom:-5px;left:calc(50% - 5px);cursor:ns-resize}
.tpl-handle.h-e{right:-5px;top:calc(50% - 5px);cursor:ew-resize}.tpl-handle.h-w{left:-5px;top:calc(50% - 5px);cursor:ew-resize}
.tpl-handle.h-nw{left:-5px;top:-5px;cursor:nwse-resize}.tpl-handle.h-se{right:-5px;bottom:-5px;cursor:nwse-resize}
.tpl-handle.h-ne{right:-5px;top:-5px;cursor:nesw-resize}.tpl-handle.h-sw{left:-5px;bottom:-5px;cursor:nesw-resize}

/* Properties panel */
.tpl-props-head{position:sticky;top:0;z-index:2;display:flex;flex-direction:column;gap:6px;padding:14px 14px 10px;background:#fff;border-bottom:1px solid var(--tpl-line)}
.tpl-props-head h3{margin:0;display:flex;align-items:center;gap:8px;font-size:15px;font-weight:800;color:var(--tpl-navy)}
.tpl-props-head h3 i{color:var(--tpl-blue)}
.tpl-props-head p{margin:0}
.tpl-props-actions{display:flex;flex-wrap:wrap;gap:2px}
.tpl-tabs{display:flex;gap:6px;padding:10px 14px 0}
.tpl-props-section{padding:12px 14px;border-bottom:1px solid #f1f5f9;display:flex;flex-direction:column;gap:10px}
.tpl-props-section h4{margin:0;font-size:13px;font-weight:800;color:#334155}
.tpl-field{display:flex;flex-direction:column;gap:4px;font-size:13px;color:#475569;min-width:0}
.tpl-field input[type="color"]{width:40px;min-height:30px;padding:2px;cursor:pointer}
.tpl-color-row{display:flex;align-items:center;gap:6px}
.tpl-color-row code{font-size:11px;color:var(--tpl-muted)}
.tpl-grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 10px}
.tpl-check{display:flex;align-items:flex-start;gap:8px;font-size:13px;color:#1e293b;cursor:pointer;line-height:1.5}
.tpl-check input{margin-top:3px;accent-color:var(--tpl-blue)}
.tpl-check small{color:var(--tpl-muted);margin-inline-start:4px}
.tpl-sortable{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px}
.tpl-sortable li{display:flex;align-items:center;gap:6px;padding:6px 8px;border:1px solid var(--tpl-line);border-radius:8px;background:#fff}
.tpl-sortable li.is-off{background:#fafbfc;opacity:.75}
.tpl-sortable li.is-dragging{opacity:.4;border-style:dashed}
.tpl-sortable li .tpl-check{flex:1;min-width:0}
.tpl-drag{color:#94a3b8;cursor:grab;padding:0 2px}
.tpl-lock{color:#b45309;font-size:11px}
.tpl-field-flags{display:flex;gap:3px}
.tpl-chip{padding:1px 7px;border:1px solid var(--tpl-line);border-radius:999px;background:#fff;font:inherit;font-size:11px;color:#64748b;cursor:pointer}
.tpl-chip.is-on{background:#eaf1ff;border-color:#bfd3fb;color:#1e40af;font-weight:700}
.tpl-col-props{display:flex;gap:4px}
.tpl-col-props input{width:52px;min-height:28px;padding:0 4px;border:1px solid #cbd5e1;border-radius:6px;font:inherit;font-size:12px}
.tpl-col-props select{min-height:28px;border:1px solid #cbd5e1;border-radius:6px;font:inherit;font-size:12px}
.tpl-align-row{display:flex;align-items:center;gap:4px;font-size:13px;color:#475569}
.tpl-upload{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.tpl-upload img{max-width:90px;max-height:60px;object-fit:contain;border:1px solid var(--tpl-line);border-radius:6px;background:repeating-conic-gradient(#f1f5f9 0 25%,#fff 0 50%) 0 0/12px 12px}
.tpl-label-row{display:flex;flex-direction:column;gap:4px;padding-bottom:8px;border-bottom:1px dashed #eef2f7}
.tpl-label-row small{color:var(--tpl-muted)}
.tpl-rich{display:flex;flex-direction:column;gap:4px}
.tpl-rich-label{font-size:13px;color:#475569}
.tpl-rich-bar{display:flex;flex-wrap:wrap;gap:2px;padding:4px;border:1px solid #cbd5e1;border-bottom:0;border-radius:8px 8px 0 0;background:#f8fafc}
.tpl-rich-bar button{width:28px;height:26px;border:0;border-radius:5px;background:transparent;cursor:pointer;color:#334155}
.tpl-rich-bar button:hover{background:#e2e8f0}
.tpl-rich-bar select{height:26px;border:1px solid #cbd5e1;border-radius:5px;font:inherit;font-size:12px;max-width:110px}
.tpl-rich-area{min-height:70px;max-height:200px;overflow:auto;padding:8px;border:1px solid #cbd5e1;border-radius:0 0 8px 8px;font-size:13px;line-height:1.6;outline:none;background:#fff}
.tpl-rich-area:focus{border-color:var(--tpl-blue);box-shadow:0 0 0 3px rgba(31,98,232,.12)}

@media (max-width:1180px){.tpl-editor-body{grid-template-columns:280px minmax(0,1fr) 200px}}
@media (max-width:920px){
    .tpl-center{padding:14px 12px 24px}
    .tpl-row{grid-template-columns:100px minmax(0,1fr)}
    .tpl-row-actions{grid-column:1/-1;justify-content:flex-start;max-width:none}
    .tpl-thumb{width:100px;height:112px}
    .tpl-thumb .tpl-mini{zoom:.7}
    .tpl-editor{height:auto}
    .tpl-editor-body{grid-template-columns:1fr;grid-template-rows:auto minmax(420px,70vh) auto}
    .tpl-library{order:-1;border:0;border-bottom:1px solid var(--tpl-line)}
    .tpl-library .tpl-library-list{flex-direction:row;flex-wrap:wrap}
    .tpl-library .tpl-lib-item{width:auto;border-color:var(--tpl-line)}
    .tpl-props{order:1;border:0;border-top:1px solid var(--tpl-line)}
    .tpl-canvas-wrap{order:0}
}
@media (max-width:560px){.tpl-cards{grid-template-columns:1fr}.tpl-grid-2{grid-template-columns:1fr}.tpl-branch-row{grid-template-columns:1fr}}

/* manufacturing.css */
/* BOM editor: full viewport, with a single searchable ingredient control. */
#mfg-bom-modal{padding:0!important;direction:rtl}
#mfg-bom-modal .modal-dialog.modal-fullscreen{width:100%;max-width:none;height:100%;margin:0}
#mfg-bom-modal .modal-content{height:100%;max-height:100%;border:0;border-radius:0;overflow:hidden}
#mfg-bom-modal .modal-header,#mfg-bom-modal .modal-footer{flex-shrink:0;background:#fff;padding:16px 24px;border-radius:0}
#mfg-bom-modal .modal-header .btn-close{margin-inline-start:auto;margin-inline-end:0}
#mfg-bom-modal .modal-body{overflow-y:auto;padding:24px;background:#f7f9fc}
#mfg-bom-modal .modal-footer{border-top:1px solid #e2e7ef;gap:8px}
#mfg-bom-modal .modal-footer .btn{min-height:42px;padding-inline:22px}
#mfg-bom-modal .mfg-bom-components-table th{white-space:nowrap;padding:12px 10px}
#mfg-bom-modal .mfg-bom-components-table td{padding:12px 10px;vertical-align:top}
#mfg-bom-modal .mfg-bom-material-column{min-width:280px;width:24%}
#mfg-bom-modal .mfg-line-after,#mfg-bom-modal .mfg-line-total{white-space:nowrap}
#mfg-bom-modal .mfg-line-picker{position:relative;min-width:260px}
#mfg-bom-modal .mfg-line-product-search{min-height:42px;padding-inline-end:40px;font-size:var(--font-base)}
#mfg-bom-modal .mfg-line-product-search[aria-invalid="true"]{border-color:#dc3545}
#mfg-bom-modal .mfg-line-picker-toggle{position:absolute;inset-inline-end:1px;top:1px;bottom:1px;width:36px;border:0;border-radius:6px;background:transparent;color:#64748b}
#mfg-bom-modal .mfg-line-picker-toggle:hover{background:#eff6ff;color:#2563eb}
#mfg-bom-modal .mfg-line-picker-toggle:focus-visible{outline:2px solid #2563eb;outline-offset:-3px}
#mfg-bom-modal .mfg-material-results{position:fixed;z-index:5;overflow-y:auto;overscroll-behavior:contain;background:#fff;color:#17233e;border:1px solid #cbd5e1;border-radius:10px;box-shadow:0 12px 30px rgba(15,23,42,.18);padding:4px;direction:rtl;text-align:right}
#mfg-bom-modal .mfg-material-results[hidden]{display:none!important}
#mfg-bom-modal .mfg-material-option{padding:10px 12px;border-radius:6px;cursor:pointer;min-height:52px;white-space:normal;overflow-wrap:anywhere}
#mfg-bom-modal .mfg-material-option strong,#mfg-bom-modal .mfg-material-option small{display:block}
#mfg-bom-modal .mfg-material-option strong{font-size:var(--font-ui);font-weight:600}
#mfg-bom-modal .mfg-material-option small{margin-top:4px;font-size:var(--font-xs);color:#64748b}
#mfg-bom-modal .mfg-material-option:hover,#mfg-bom-modal .mfg-material-option[aria-selected="true"]{background:#eff6ff;color:#1d4ed8}
#mfg-bom-modal .mfg-material-empty{padding:14px 12px;color:#64748b;font-size:var(--font-ui)}
@media(max-width:767px){#mfg-bom-modal .modal-header,#mfg-bom-modal .modal-footer{padding:12px}#mfg-bom-modal .modal-body{padding:12px}#mfg-bom-modal .modal-footer .btn{flex:1}#mfg-bom-modal .mfg-bom-material-column{min-width:260px}#mfg-bom-modal .mfg-line-picker{min-width:240px}}

.mfg-page,#manufacturing-orders-root,#manufacturing-boms-root,#manufacturing-materials-root{--mfg-ink:#17233e;--mfg-muted:#748096;--mfg-line:#e2e7ef;--mfg-soft:#f7f9fc;--mfg-blue:#2563eb;--mfg-purple:#6246e5;--mfg-purple-soft:#f1efff;direction:rtl;color:var(--mfg-ink)}
#manufacturing-orders-root .page-header,#manufacturing-boms-root .page-header,#manufacturing-materials-root .page-header{align-items:center;margin-bottom:18px}
#manufacturing-orders-root>.card,#manufacturing-boms-root>.card,#manufacturing-materials-root>.card,.mfg-page .card{border:1px solid var(--mfg-line)!important;border-radius:14px!important;box-shadow:0 5px 18px rgba(24,39,75,.04)!important}
#manufacturing-orders-root .table thead th,#manufacturing-boms-root .table thead th,#manufacturing-materials-root .table thead th,.mfg-table thead th{background:#f5f7fb;color:#5f6b80;font-size:var(--font-ui);font-weight:700;white-space:nowrap;border-bottom:1px solid var(--mfg-line);padding:12px 10px}
#manufacturing-orders-root .table td,#manufacturing-boms-root .table td,#manufacturing-materials-root .table td,.mfg-table td{font-size:var(--font-ui);padding:11px 10px;border-color:#edf0f5;vertical-align:middle}
.mfg-table td small{display:block;color:var(--mfg-muted);margin-top:3px}
#mfg-order-details-modal .modal-dialog{max-width:min(1380px,96vw)}
#mfg-order-details-modal .modal-content,#mfg-order-operation-modal .modal-content,#mfg-order-movement-modal .modal-content,#mfg-order-modal .modal-content{border:0;border-radius:15px;box-shadow:0 24px 65px rgba(15,23,42,.2)}
#mfg-order-details-modal .modal-body{background:#f8fafc;padding:20px}
.mfg-detail-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:14px}
.mfg-detail-head h4{font-size:var(--font-xl);font-weight:700;margin:4px 0;color:var(--mfg-ink)}
.mfg-detail-head p{font-size:var(--font-sm);color:var(--mfg-muted);margin:0}
.mfg-eyebrow{font-size:var(--font-xs);color:var(--mfg-blue);font-weight:700}
.mfg-kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:12px}
.mfg-kpi-grid article{min-height:82px;padding:13px;background:#fff;border:1px solid var(--mfg-line);border-radius:12px;display:grid;grid-template-columns:38px 1fr;grid-template-rows:auto auto;column-gap:10px;align-items:center}
.mfg-kpi-grid article>span{grid-row:1/3;width:38px;height:38px;display:grid;place-items:center;border-radius:10px;color:var(--mfg-blue);background:#eaf2ff}
.mfg-kpi-grid small{font-size:var(--font-xs);color:var(--mfg-muted)}
.mfg-kpi-grid strong{font-weight:700;font-size:var(--font-2xl);color:var(--mfg-ink)}
.mfg-reconcile{display:flex;align-items:center;gap:10px;padding:10px 13px;border-radius:10px;margin-bottom:13px;border:1px solid}
.mfg-reconcile>i{font-size:18px}.mfg-reconcile strong,.mfg-reconcile small{display:block}.mfg-reconcile strong{font-size:var(--font-sm)}.mfg-reconcile small{font-size:var(--font-xs);margin-top:2px;opacity:.82}
.mfg-reconcile.is-balanced{color:#167550;background:#eefaf5;border-color:#ccebdd}.mfg-reconcile.is-warning{color:#a45c11;background:#fff8e9;border-color:#f0d6a3}
.mfg-detail-tabs{gap:3px;flex-wrap:nowrap;overflow-x:auto;border-bottom:1px solid var(--mfg-line);background:#fff;padding:0 7px;border-radius:12px 12px 0 0}
.mfg-detail-tabs li{list-style:none}.mfg-detail-tabs .nav-link{border:0;border-bottom:2px solid transparent;border-radius:0;padding:11px 12px;color:#69758a;font-size:var(--font-xs);font-weight:700;white-space:nowrap}
.mfg-detail-tabs .nav-link.active{color:var(--mfg-blue);border-bottom-color:var(--mfg-blue);background:#fff}
.mfg-tab-content{background:#fff;border:1px solid var(--mfg-line);border-top:0;border-radius:0 0 12px 12px;min-height:260px;overflow:hidden}
.mfg-tab-content>.tab-pane{padding:14px}
.mfg-info-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.mfg-info-grid>div{min-height:72px;padding:12px;border:1px solid #e8ebf1;background:#fbfcfe;border-radius:10px}.mfg-info-grid small,.mfg-info-grid strong{display:block}.mfg-info-grid small{color:var(--mfg-muted);font-size:var(--font-xs);margin-bottom:6px}.mfg-info-grid strong{font-size:var(--font-sm)}
.mfg-timeline{padding:5px 8px}.mfg-timeline>div{display:grid;grid-template-columns:15px 1fr;gap:10px;position:relative;padding-bottom:16px}.mfg-timeline>div:not(:last-child):before{content:"";position:absolute;right:5px;top:12px;bottom:0;border-right:1px solid #d9e0ea}.mfg-timeline i{width:11px;height:11px;border-radius:50%;background:var(--mfg-blue);margin-top:4px;z-index:1}.mfg-timeline section strong,.mfg-timeline section span,.mfg-timeline section small{display:block}.mfg-timeline section strong{font-size:var(--font-sm)}.mfg-timeline section span,.mfg-timeline section small{font-size:var(--font-xs);color:var(--mfg-muted);margin-top:2px}
.mfg-ebr-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:4px 2px 14px}.mfg-ebr-toolbar strong,.mfg-ebr-toolbar small{display:block}.mfg-ebr-toolbar strong{font-size:var(--font-sm)}.mfg-ebr-toolbar small{font-size:var(--font-xs);color:var(--mfg-muted);margin-top:3px}.mfg-ebr-record{padding:13px;border:1px solid #e2e7ef;border-radius:11px;background:#fbfcfe;margin-bottom:10px}.mfg-ebr-record>header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:11px}.mfg-ebr-record>header strong,.mfg-ebr-record>header small{display:block}.mfg-ebr-record>header strong{font-size:var(--font-sm)}.mfg-ebr-record>header small{font-size:var(--font-xs);color:var(--mfg-muted);margin-top:3px}.mfg-ebr-record h6{font-size:var(--font-xs);font-weight:700;margin:14px 0 7px}.mfg-ebr-summary{display:flex;gap:8px;flex-wrap:wrap}.mfg-ebr-summary span{padding:6px 9px;border-radius:8px;background:#eef3fb;color:#627088;font-size:var(--font-xs)}
.mfg-dashboard-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.mfg-dashboard-kpis .stat-card{border:1px solid var(--mfg-line);box-shadow:none}
.mfg-attention{display:grid;gap:8px}.mfg-attention>div{display:flex;justify-content:space-between;gap:10px;padding:10px;border:1px solid #f0d7a4;background:#fff9ec;border-radius:9px;font-size:var(--font-sm)}
.mfg-report-state{padding:25px;text-align:center;color:var(--mfg-muted)}
.mfg-control-filter{margin-bottom:12px}.mfg-control-filter .form-label{font-size:var(--font-sm);font-weight:700;color:#69758a;margin-bottom:5px}.mfg-control-filter .form-control,.mfg-control-filter .form-select{min-height:38px;border-color:var(--mfg-line);font-size:var(--font-ui)}
.mfg-control-metrics{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:9px;margin:12px 0}.mfg-control-metrics article{min-height:76px;padding:11px;border:1px solid var(--mfg-line);border-radius:11px;background:#fff;display:grid;grid-template-columns:34px 1fr;grid-template-rows:1fr 1fr;column-gap:9px;align-items:center}.mfg-control-metrics article>span{grid-row:1/3;width:34px;height:34px;border-radius:9px;background:#edf4ff;color:#2563eb;display:grid;place-items:center}.mfg-control-metrics small{font-size:var(--font-xs);color:var(--mfg-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mfg-control-metrics strong{font-weight:700;font-size:var(--font-base)}.mfg-control-metrics article.is-red>span{background:#fff0f2;color:#d44358}.mfg-control-metrics article.is-orange>span{background:#fff6e8;color:#d47a18}.mfg-control-metrics article.is-purple>span{background:#f2efff;color:#7154df}
.mfg-control-layout{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:12px}.mfg-control-layout>.card{min-width:0;overflow:hidden}.mfg-control-layout .section-title,.mfg-page>.card>.section-title{min-height:55px;padding:12px 14px;border-bottom:1px solid var(--mfg-line);display:flex;align-items:center;justify-content:space-between;gap:10px}.mfg-control-layout .section-title h3,.mfg-page>.card>.section-title h3{margin:0 0 3px;font-size:var(--font-ui)}.mfg-control-layout .section-title a{font-size:var(--font-xs);text-decoration:none}.mfg-wrap-cell{min-width:220px;white-space:normal;line-height:1.65}.mfg-badge{display:inline-flex;align-items:center;min-height:23px;padding:4px 8px;border:1px solid #dfe4ec;border-radius:20px;background:#f7f8fa;color:#657085;font-size:var(--font-xs);font-weight:700;white-space:nowrap}.mfg-badge.is-danger{border-color:#f1cbd2;background:#fff1f3;color:#bd3c52}.mfg-badge.is-warning{border-color:#f0d7a7;background:#fff8e9;color:#a45e12}.mfg-badge.is-success{border-color:#c9eadb;background:#effaf5;color:#177753}.mfg-badge.is-info{border-color:#cdddf7;background:#eff5ff;color:#285fae}.mfg-icon-action{width:30px;height:30px;border:1px solid #dfe5ee;border-radius:8px;background:#fff;color:#315fb4}.mfg-mini-progress{width:90px;height:5px;background:#edf0f5;border-radius:8px;overflow:hidden}.mfg-mini-progress span{height:100%;display:block;background:#2563eb;border-radius:inherit}.mfg-capability-note{display:flex;align-items:flex-start;gap:8px;padding:9px 12px;border:1px solid #d7e3f8;background:#f3f7ff;color:#526985;border-radius:10px;font-size:var(--font-xs)}.mfg-capability-note i{color:#2563eb;margin-top:2px}
.mfg-setting-toggle{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:13px;border:1px solid #dfe5ee;border-radius:11px;background:#f9fbfe}.mfg-setting-toggle strong,.mfg-setting-toggle small{display:block}.mfg-setting-toggle strong{font-size:var(--font-sm)}.mfg-setting-toggle small{font-size:var(--font-xs);color:var(--mfg-muted);margin-top:4px}.mfg-setting-toggle .form-switch{padding:0;margin:0}.mfg-setting-toggle .form-check-input{width:42px;height:22px;margin:0}
.mfg-genealogy-search{display:grid;grid-template-columns:1fr 45px 1fr auto;gap:12px;align-items:end}.mfg-genealogy-search label>span{display:block;margin-bottom:6px;color:#657085;font-size:var(--font-sm);font-weight:700}.mfg-or{height:38px;display:grid;place-items:center;color:#9aa3b2;font-size:var(--font-xs)}.mfg-genealogy-results{margin-top:14px}.mfg-genealogy-results>h3{font-size:var(--font-ui);margin:18px 0 10px}.mfg-genealogy-node{padding:14px}.mfg-genealogy-node>header{display:flex;align-items:center;gap:10px}.mfg-genealogy-node>header>i{width:38px;height:38px;display:grid;place-items:center;border-radius:10px;background:#eaf2ff;color:#2563eb}.mfg-genealogy-node header div{flex:1}.mfg-genealogy-node header strong,.mfg-genealogy-node header small{display:block}.mfg-genealogy-node header strong{font-size:var(--font-sm)}.mfg-genealogy-node header small{font-size:var(--font-xs);color:var(--mfg-muted);margin-top:3px}.mfg-genealogy-children{margin:13px 18px 0 0;padding:10px 14px 2px 0;border-right:2px solid #dbe5f4}.mfg-genealogy-children>div>span{display:block;padding:8px 10px;margin-bottom:8px;border:1px solid #e5e9f0;border-radius:9px;background:#fbfcfe;font-size:var(--font-xs)}.mfg-genealogy-children>div>span i{color:#2563eb;margin-left:7px}.mfg-forward-grid{display:grid;gap:9px}.mfg-forward-grid>article{padding:12px;display:flex;align-items:center;gap:10px}.mfg-forward-grid>article>i{color:#2563eb}.mfg-forward-grid article small,.mfg-forward-grid article strong,.mfg-forward-grid article span{display:block}.mfg-forward-grid article small{font-size:var(--font-xs);color:var(--mfg-muted)}.mfg-forward-grid article strong{font-size:var(--font-sm)}.mfg-forward-grid article span{font-size:var(--font-xs);color:#69758a}
@media(max-width:1000px){.mfg-kpi-grid,.mfg-dashboard-kpis,.mfg-info-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:1200px){.mfg-control-metrics{grid-template-columns:repeat(4,minmax(0,1fr))}.mfg-control-layout{grid-template-columns:1fr}}
@media(max-width:1000px){.mfg-genealogy-search{grid-template-columns:1fr}.mfg-or{height:auto}.mfg-control-metrics{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:620px){.mfg-kpi-grid,.mfg-dashboard-kpis,.mfg-info-grid,.mfg-control-metrics{grid-template-columns:1fr}.mfg-detail-head{flex-direction:column}#mfg-order-details-modal .modal-body{padding:12px}#mfg-order-details-actions{overflow-x:auto;flex-wrap:nowrap;justify-content:flex-start}#mfg-order-details-actions .btn{white-space:nowrap}.mfg-control-metrics article{min-height:66px}.mfg-setting-toggle{align-items:flex-start}}
.mfg-order-kpis{margin:12px 0}.mfg-order-kpis article:nth-child(2)>span{background:#fff6e8;color:#c97818}.mfg-order-kpis article:nth-child(3)>span{background:#edf9f4;color:#1b8a62}.mfg-order-kpis article:nth-child(4)>span{background:#f1efff;color:#6246e5}.mfg-overview-timeline{margin:14px 0 0}.mfg-overview-timeline .mfg-timeline{padding-bottom:0}#mfg-order-cleanup-modal .modal-content{border:0;border-radius:14px;box-shadow:0 20px 55px rgba(15,23,42,.18)}#mfg-order-cleanup-modal .table{font-size:var(--font-ui)}#mfg-order-cleanup-modal .table th{white-space:nowrap;background:#f6f8fb}
@media print{body:has(#mfg-order-details-modal.show)>*:not(#mfg-order-details-modal){display:none!important}#mfg-order-details-modal.show{display:block!important;position:static!important;width:auto!important;height:auto!important;overflow:visible!important}#mfg-order-details-modal.show .modal-dialog{max-width:none!important;margin:0!important}#mfg-order-details-modal.show .modal-content{border:0!important;box-shadow:none!important}#mfg-order-details-modal.show .modal-header{display:flex!important;padding:0 0 12px!important}#mfg-order-details-modal.show .btn-close,#mfg-order-details-actions,.mfg-detail-tabs,.mfg-tab-footer{display:none!important}#mfg-order-details-modal.show .modal-body{background:#fff;padding:0}.mfg-tab-content>.tab-pane{display:block!important;opacity:1!important;page-break-inside:auto}.mfg-tab-content{border:0}.mfg-kpi-grid{grid-template-columns:repeat(4,1fr)}.mfg-record-section,.mfg-order-summary-card,.mfg-order-financial-strip,.mfg-kpi-grid{break-inside:avoid}}

/* Manufacturing quality governance */
.mfg-quality-page .page-header{align-items:center;margin-bottom:14px}.mfg-quality-page .header-actions{display:flex;gap:8px;flex-wrap:wrap}.mfg-quality-metrics{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:8px;margin-bottom:12px}.mfg-quality-metrics article{min-width:0;min-height:77px;padding:11px;border:1px solid var(--mfg-line);border-radius:11px;background:#fff;display:grid;grid-template-columns:32px 1fr;grid-template-rows:1fr 1fr;gap:0 8px;align-items:center}.mfg-quality-metrics article>span{grid-row:1/3;width:32px;height:32px;border-radius:9px;display:grid;place-items:center;background:#edf4ff;color:#2563eb}.mfg-quality-metrics article>small{overflow:hidden;color:var(--mfg-muted);font-size:var(--font-xs);line-height:1.5;white-space:nowrap;text-overflow:ellipsis}.mfg-quality-metrics article>strong{font-weight:700;font-size:var(--font-2xl)}.mfg-quality-metrics article.is-red>span{background:#fff0f2;color:#cf4057}.mfg-quality-metrics article.is-orange>span{background:#fff6e8;color:#cf7617}.mfg-quality-metrics article.is-purple>span{background:#f2efff;color:#7154df}.mfg-quality-metrics article.is-green>span{background:#eefaf5;color:#19835b}
.mfg-quality-workspace{overflow:hidden}.mfg-quality-toolbar{min-height:56px;padding:0 12px;border-bottom:1px solid var(--mfg-line);display:flex;align-items:center;justify-content:space-between;gap:10px}.mfg-quality-tabs{display:flex;align-self:stretch;overflow-x:auto}.mfg-quality-tabs button{position:relative;padding:0 15px;border:0;background:transparent;color:#6f7a8d;font-size:var(--font-ui);font-weight:700;white-space:nowrap}.mfg-quality-tabs button:after{content:"";position:absolute;right:12px;left:12px;bottom:0;height:2px;border-radius:3px;background:transparent}.mfg-quality-tabs button.active{color:var(--mfg-blue)}.mfg-quality-tabs button.active:after{background:var(--mfg-blue)}.mfg-quality-panel{display:none;min-height:390px}.mfg-quality-panel.active{display:block}.mfg-panel-heading{min-height:67px;padding:12px 14px;display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid #edf0f5}.mfg-panel-heading h3{margin:0 0 4px;font-size:var(--font-ui);font-weight:850}.mfg-panel-heading small{display:block;color:var(--mfg-muted);font-size:var(--font-xs)}.mfg-panel-heading .form-select{width:auto;min-width:155px}.mfg-row-actions,.mfg-inline-actions{display:inline-flex;align-items:center;gap:5px}.mfg-row-actions button,.mfg-inline-actions button{width:28px;height:28px;border:1px solid #dfe5ee;border-radius:8px;background:#fff;color:#315fb4}.mfg-inline-actions{margin-right:6px}.mfg-inline-actions button{width:25px;height:25px;font-size:var(--font-ui)}
.mfg-definition-actions{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px;padding:13px;border-bottom:1px solid var(--mfg-line);background:#fbfcfe}.mfg-definition-actions>button{display:flex;align-items:center;gap:10px;text-align:right;padding:11px;border:1px solid #dfe5ee;border-radius:10px;background:#fff;color:var(--mfg-ink)}.mfg-definition-actions>button>i{width:34px;height:34px;display:grid;place-items:center;border-radius:9px;background:#edf4ff;color:#2563eb}.mfg-definition-actions span,.mfg-definition-actions small{display:block}.mfg-definition-actions span{font-size:var(--font-ui);font-weight:700}.mfg-definition-actions small{margin-top:3px;color:var(--mfg-muted);font-size:var(--font-xs);font-weight:500}.mfg-definition-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:13px}.mfg-definition-card{overflow:hidden;border:1px solid var(--mfg-line);border-radius:11px;background:#fff}.mfg-definition-card>header{display:flex;align-items:center;gap:9px;padding:11px;background:#f8faff;border-bottom:1px solid #e8edf5}.mfg-definition-card>header>span{width:32px;height:32px;display:grid;place-items:center;border-radius:9px;background:#e9f1ff;color:#2563eb}.mfg-definition-card h3,.mfg-definition-card small{display:block;margin:0}.mfg-definition-card h3{font-size:var(--font-sm)}.mfg-definition-card small{margin-top:3px;color:var(--mfg-muted);font-size:var(--font-xs)}.mfg-definition-card>div>article{min-height:55px;padding:9px 11px;display:flex;align-items:center;justify-content:space-between;gap:10px;border-bottom:1px solid #edf0f5}.mfg-definition-card>div>article:last-child{border-bottom:0}.mfg-definition-card article strong,.mfg-definition-card article small{display:block}.mfg-definition-card article strong{font-size:var(--font-xs)}.mfg-report-state.compact{padding:18px;font-size:var(--font-xs)}
.mfg-clearance-picker{display:grid;grid-template-columns:minmax(240px,520px) auto;gap:8px;padding:14px;border-bottom:1px solid #edf0f5}.mfg-clearance-result{padding:14px}.mfg-clearance-status{display:flex;align-items:center;gap:11px;padding:13px;border:1px solid;border-radius:11px;margin-bottom:10px}.mfg-clearance-status>i{font-size:20px}.mfg-clearance-status strong,.mfg-clearance-status small{display:block}.mfg-clearance-status strong{font-size:var(--font-xs)}.mfg-clearance-status small{font-size:var(--font-xs);margin-top:3px}.mfg-clearance-status.is-ready{color:#157551;background:#eefaf5;border-color:#c9eadb}.mfg-clearance-status.is-blocked{color:#a35c11;background:#fff8e9;border-color:#efd7a7}.mfg-clearance-list{display:grid;gap:8px}.mfg-clearance-list>article{min-height:58px;padding:10px 12px;border:1px solid var(--mfg-line);border-radius:10px;display:flex;align-items:center;justify-content:space-between;gap:12px}.mfg-clearance-list article strong,.mfg-clearance-list article small{display:block}.mfg-clearance-list article strong{font-size:var(--font-xs)}.mfg-clearance-list article small{font-size:var(--font-xs);color:var(--mfg-muted);margin-top:3px}.mfg-checklist-execution{display:grid;gap:9px}.mfg-checklist-execution>label{display:block;padding:11px;border:1px solid var(--mfg-line);border-radius:10px;background:#fbfcfe}.mfg-checklist-execution label>span{display:block;margin-bottom:6px;font-size:var(--font-sm);font-weight:700}.mfg-checklist-execution label>small{display:block;margin-top:4px;color:var(--mfg-muted);font-size:var(--font-sm)}.mfg-checklist-execution .mfg-check-answer{display:flex;align-items:center;gap:9px}.mfg-checklist-execution .mfg-check-answer>span{margin:0}.mfg-quality-page .modal-content{border:0;border-radius:15px;box-shadow:0 24px 65px rgba(15,23,42,.2)}.mfg-quality-page .modal-body{background:#fbfcfe}.mfg-quality-page .modal-body .form-label{font-size:var(--font-sm);font-weight:700;color:#667287}.mfg-quality-page .modal-body .form-control,.mfg-quality-page .modal-body .form-select{min-height:40px;border-color:#dfe5ee;font-size:var(--font-ui)}.mfg-quality-page .modal-body textarea.form-control{min-height:auto}.mfg-quality-page .modal-footer{position:sticky;bottom:0;background:#fff;border-radius:0 0 15px 15px}
.mfg-attachment-list{display:grid;gap:7px}.mfg-attachment-list>a{display:flex;align-items:center;gap:9px;padding:10px;border:1px solid var(--mfg-line);border-radius:9px;background:#fff;color:var(--mfg-ink);text-decoration:none}.mfg-attachment-list>a>i:first-child{width:30px;height:30px;display:grid;place-items:center;border-radius:8px;background:#edf4ff;color:#2563eb}.mfg-attachment-list>a>span{flex:1;font-size:var(--font-xs);font-weight:700}.mfg-attachment-list>a small{display:block;margin-top:3px;color:var(--mfg-muted);font-size:var(--font-xs);font-weight:500}.mfg-row-actions sup{margin-right:-5px;color:#b13248;font-size:var(--font-ui)}
.mfg-repeat-tools{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:16px 0 8px;padding-top:12px;border-top:1px solid var(--mfg-line)}.mfg-repeat-tools strong{font-size:var(--font-xs)}.mfg-repeat-row{display:grid;grid-template-columns:1.25fr repeat(4,minmax(80px,1fr)) 1fr 34px;gap:6px;margin-bottom:7px;padding:8px;border:1px solid var(--mfg-line);border-radius:9px;background:#fff}.mfg-repeat-row.is-short{grid-template-columns:repeat(3,1fr) 34px}.mfg-repeat-row.is-checklist{grid-template-columns:1.5fr 1fr 34px}.mfg-repeat-row>button{width:34px;border:1px solid #f0ced4;border-radius:8px;background:#fff2f4;color:#bd3c52}
@media(max-width:1300px){.mfg-quality-metrics{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:900px){.mfg-quality-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.mfg-definition-actions,.mfg-definition-grid{grid-template-columns:1fr 1fr}.mfg-quality-toolbar{align-items:stretch}.mfg-quality-tabs{flex:1}.mfg-panel-heading{align-items:flex-start;flex-direction:column}.mfg-panel-heading>div:last-child{width:100%}.mfg-panel-heading .form-select{width:100%}.mfg-repeat-row,.mfg-repeat-row.is-short,.mfg-repeat-row.is-checklist{grid-template-columns:1fr 1fr}.mfg-repeat-row>button{grid-column:1/-1;width:100%;height:34px}}
@media(max-width:620px){.mfg-quality-page .page-header{align-items:flex-start}.mfg-quality-page .header-actions{width:100%}.mfg-quality-page .header-actions .btn{flex:1}.mfg-quality-metrics,.mfg-definition-actions,.mfg-definition-grid{grid-template-columns:1fr}.mfg-quality-metrics article{min-height:65px}.mfg-quality-toolbar{padding:6px;align-items:flex-start}.mfg-quality-tabs{flex-wrap:wrap;overflow-x:visible}.mfg-quality-tabs button{min-height:42px;padding:0 8px;flex:1 1 45%}.mfg-clearance-picker{grid-template-columns:1fr}.mfg-clearance-list>article{align-items:flex-start}.mfg-quality-page .modal-dialog{margin:.5rem}.mfg-quality-page .modal-body{padding:12px}}

/* Approved manufacturing workspace: dashboard, production-order detail and EBR detail only. */
.mfg-dashboard-page{max-width:1680px;margin:0 auto;padding-bottom:24px}
.mfg-dash-header{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:18px}
.mfg-dash-breadcrumb{display:block;margin-bottom:5px;color:#8691a5;font-size:var(--font-xs);font-weight:700}
.mfg-dash-header h1{margin:0;color:#17233e;font-size:var(--font-2xl);font-weight:700;line-height:1.4}
.mfg-dash-header p{margin:4px 0 0;color:#748096;font-size:var(--font-sm)}
.mfg-dash-actions{display:flex;align-items:center;gap:8px;flex-shrink:0}
.mfg-dashboard-page .btn,.mfg-order-detail-header .btn{min-height:38px;padding:8px 14px;border-radius:9px;font-size:var(--font-ui);font-weight:700;box-shadow:none}
.mfg-dashboard-page .btn-primary,.mfg-order-detail-header .btn-primary,#mfg-order-details-modal .mfg-tab-footer .btn-primary{border-color:var(--mfg-purple);background:var(--mfg-purple);color:#fff}
.mfg-dashboard-page .btn-primary:hover,.mfg-order-detail-header .btn-primary:hover,#mfg-order-details-modal .mfg-tab-footer .btn-primary:hover{border-color:#5137ce;background:#5137ce}
.mfg-dashboard-page .btn-secondary,.mfg-order-detail-header .btn-secondary{border-color:#dfe4ed;background:#fff;color:#4e5b70}
.mfg-dash-kpis{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;margin-bottom:12px}
.mfg-dash-kpis article{min-width:0;min-height:96px;padding:13px;border:1px solid var(--mfg-line);border-radius:12px;background:#fff;box-shadow:0 4px 14px rgba(23,35,62,.035);display:flex;align-items:flex-start;gap:11px}
.mfg-dash-kpis article>span{width:38px;height:38px;display:grid;place-items:center;flex:0 0 38px;border-radius:10px;font-size:var(--font-base)}
.mfg-dash-kpis article>div{min-width:0}.mfg-dash-kpis small,.mfg-dash-kpis strong,.mfg-dash-kpis em{display:block}
.mfg-dash-kpis small{overflow:hidden;color:#6d788c;font-size:var(--font-xs);font-weight:700;line-height:1.6;white-space:nowrap;text-overflow:ellipsis}
.mfg-dash-kpis strong{margin:3px 0 1px;color:#15213b;font-weight:700;font-size:var(--font-2xl);line-height:1.3;white-space:nowrap}
.mfg-dash-kpis em{overflow:hidden;color:#97a0af;font-size:var(--font-xs);font-style:normal;white-space:nowrap;text-overflow:ellipsis}
.mfg-dash-kpis .is-blue>span{background:#edf4ff;color:#2866ce}.mfg-dash-kpis .is-purple>span{background:#f1efff;color:#6246e5}.mfg-dash-kpis .is-amber>span{background:#fff6e8;color:#cf7819}.mfg-dash-kpis .is-green>span{background:#edf9f4;color:#1b8a62}.mfg-dash-kpis .is-red>span{background:#fff0f2;color:#cf4057}.mfg-dash-kpis .is-neutral>span{background:#f0f3f7;color:#607088}
.mfg-dash-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:12px}
.mfg-dash-card{min-width:0;border:1px solid var(--mfg-line);border-radius:13px;background:#fff;box-shadow:0 5px 16px rgba(23,35,62,.035);overflow:hidden}
.mfg-dash-card.is-orders{grid-column:span 8}.mfg-dash-card.is-status{grid-column:span 4}.mfg-dash-card.is-trend{grid-column:span 8}.mfg-dash-card.is-alerts{grid-column:span 4}.mfg-dash-card.is-delayed{grid-column:span 12}
.mfg-dash-card>header{min-height:64px;padding:12px 15px;border-bottom:1px solid #edf0f5;display:flex;align-items:center;justify-content:space-between;gap:12px}
.mfg-dash-card>header h2{margin:0;color:#1d2944;font-size:var(--font-ui);font-weight:700}.mfg-dash-card>header p{margin:3px 0 0;color:#8b95a7;font-size:var(--font-xs)}
.mfg-dash-card>header a{color:var(--mfg-purple);font-size:var(--font-xs);font-weight:700;text-decoration:none;white-space:nowrap}
.mfg-dash-card>header a i{margin-right:4px}
.mfg-dash-table{width:100%;border-collapse:collapse}
.mfg-dash-table th{padding:10px 13px;background:#f8f9fc;color:#626e82;font-size:var(--font-ui);font-weight:700;white-space:nowrap}
.mfg-dash-table td{height:47px;padding:9px 13px;border-top:1px solid #eef1f5;color:#39465c;font-size:var(--font-ui);vertical-align:middle;white-space:nowrap}
.mfg-dash-table td strong,.mfg-dash-table td small{display:block}.mfg-dash-table td strong{color:#202c45;font-size:var(--font-ui)}.mfg-dash-table td small{margin-top:2px;color:#9099a8;font-size:var(--font-xs)}.mfg-dash-table td a{color:#345ca5;font-weight:700;text-decoration:none}
.mfg-dash-progress{width:100px;height:6px;margin-bottom:4px;border-radius:6px;background:#edf0f5;overflow:hidden}.mfg-dash-progress span{display:block;height:100%;border-radius:inherit;background:#2e6dd7}
.mfg-dashboard-page .status-pill{display:inline-flex;align-items:center;min-height:24px;padding:4px 9px;border-radius:20px;font-size:var(--font-xs);font-weight:700}.mfg-dashboard-page .status-pill.success{background:#edf9f4;color:#1b7d59}.mfg-dashboard-page .status-pill.info{background:#edf4ff;color:#2860b5}.mfg-dashboard-page .status-pill.warning{background:#fff7e9;color:#a86618}.mfg-dashboard-page .status-pill.danger{background:#fff0f2;color:#bd3e53}.mfg-dashboard-page .status-pill:not(.success):not(.info):not(.warning):not(.danger){background:#f1efff;color:#6046cc}
.mfg-dash-empty{min-height:116px;display:flex;align-items:center;justify-content:center;gap:8px;color:#8792a4;font-size:var(--font-xs)}.mfg-dash-empty i{color:#64ad8d}.mfg-dash-empty.compact{min-height:48px}
.mfg-status-chart{min-height:248px;padding:18px;display:flex;align-items:center;justify-content:center;gap:24px}
.mfg-donut{width:138px;height:138px;display:grid;place-items:center;flex:0 0 138px;border-radius:50%}.mfg-donut>div{width:88px;height:88px;display:grid;place-content:center;text-align:center;border-radius:50%;background:#fff;box-shadow:0 0 0 1px #eef1f5}.mfg-donut strong,.mfg-donut span{display:block}.mfg-donut strong{font-weight:700;font-size:var(--font-xl)}.mfg-donut span{color:#8a94a5;font-size:var(--font-xs)}
.mfg-status-legend{min-width:116px;display:grid;gap:9px}.mfg-status-legend>div{display:grid;grid-template-columns:8px 1fr auto;align-items:center;gap:7px;color:#69758a;font-size:var(--font-sm)}.mfg-status-legend i{width:7px;height:7px;border-radius:50%}.mfg-status-legend strong{color:#22304b;font-size:var(--font-sm)}
.mfg-trend-chart{padding:14px 18px 12px}.mfg-trend-chart svg{width:100%;height:160px;overflow:visible}.mfg-trend-chart line{stroke:#e8ecf2;stroke-width:1}.mfg-trend-chart polyline{fill:none;stroke:var(--mfg-purple);stroke-width:3;stroke-linecap:round;stroke-linejoin:round}.mfg-trend-chart circle{fill:#fff;stroke:var(--mfg-purple);stroke-width:3}
.mfg-trend-labels{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;text-align:center}.mfg-trend-labels span,.mfg-trend-labels strong{display:block}.mfg-trend-labels span{color:#929baa;font-size:var(--font-sm)}.mfg-trend-labels strong{margin-top:2px;color:#4b586e;font-size:var(--font-sm)}
.mfg-alert-list{padding:11px;display:grid;gap:8px}.mfg-alert-list article{min-height:58px;padding:9px;border:1px solid;border-radius:10px;display:grid;grid-template-columns:32px 1fr;gap:9px;align-items:center}.mfg-alert-list article>i{width:32px;height:32px;display:grid;place-items:center;border-radius:9px}.mfg-alert-list strong,.mfg-alert-list span{display:block}.mfg-alert-list strong{font-size:var(--font-xs)}.mfg-alert-list span{margin-top:3px;color:#778296;font-size:var(--font-xs)}.mfg-alert-list .is-critical{border-color:#f0ccd3;background:#fff7f8}.mfg-alert-list .is-critical>i{background:#ffe9ed;color:#c43f55}.mfg-alert-list .is-warning{border-color:#efddba;background:#fffbf3}.mfg-alert-list .is-warning>i{background:#fff0d5;color:#bc721a}

#mfg-order-details-modal{--mfg-purple:#6246e5;--mfg-purple-soft:#f1efff;--mfg-ink:#17233e;--mfg-muted:#748096;--mfg-line:#e2e7ef;direction:rtl}
#mfg-order-details-modal .modal-dialog{max-width:min(1380px,96vw)}
.mfg-order-detail-header{min-height:78px;padding:12px 18px;border-bottom:1px solid #e5e9ef;background:#fff;align-items:center}
.mfg-order-detail-title>span{display:block;margin-bottom:3px;color:#8b95a7;font-size:var(--font-xs);font-weight:700}.mfg-order-detail-title h5{margin:0;color:#1b2741;font-size:var(--font-lg);font-weight:700}.mfg-order-detail-title small{display:block;margin-top:3px;color:#7b8699;font-size:var(--font-xs)}
.mfg-order-detail-head-actions{display:flex;align-items:center;gap:12px}.mfg-order-detail-head-actions>#mfg-order-details-actions{display:flex;align-items:center;gap:7px}.mfg-order-detail-head-actions .btn-close{margin:0;padding:7px;border-radius:8px;background-size:10px}
.mfg-order-detail-header .dropdown-menu{min-width:210px;padding:6px;border-color:#e1e6ee;border-radius:10px;box-shadow:0 12px 30px rgba(23,35,62,.12);text-align:right}.mfg-order-detail-header .dropdown-item{display:flex;align-items:center;gap:9px;min-height:36px;padding:7px 9px;border-radius:7px;color:#3e4b61;font-size:var(--font-ui);font-weight:700}.mfg-order-detail-header .dropdown-item:hover{background:#f6f7fb}.mfg-order-detail-header .dropdown-item i{width:16px;color:#6c7890;text-align:center}
.mfg-order-summary-card{padding:15px 16px;border:1px solid #e0e5ed;border-radius:13px;background:#fff;box-shadow:0 4px 15px rgba(23,35,62,.025)}
.mfg-order-summary-main{display:grid;grid-template-columns:42px minmax(0,1fr) auto;align-items:center;gap:11px}.mfg-order-product-icon{width:42px;height:42px;display:grid;place-items:center;border-radius:11px;background:var(--mfg-purple-soft);color:var(--mfg-purple);font-size:16px}.mfg-order-summary-main>div:nth-child(2)>span{display:block;color:#8993a4;font-size:var(--font-xs)}.mfg-order-summary-main h3{margin:2px 0 0;color:#1b2740;font-size:var(--font-base);font-weight:700}.mfg-order-summary-main p{margin:2px 0 0;color:#8590a2;font-size:var(--font-xs)}
.mfg-state-badge{display:inline-flex;align-items:center;gap:5px;min-height:24px;padding:4px 9px;border:1px solid;border-radius:20px;font-size:var(--font-xs);font-weight:700;white-space:nowrap}.mfg-state-badge.is-success{border-color:#cce9dd;background:#eefaf5;color:#177653}.mfg-state-badge.is-info{border-color:#cbdcf5;background:#eff5ff;color:#2b61ae}.mfg-state-badge.is-warning{border-color:#efdab1;background:#fff8e9;color:#a56012}.mfg-state-badge.is-danger{border-color:#f0cbd2;background:#fff1f3;color:#b83b50}.mfg-state-badge.is-neutral{border-color:#dfe4ec;background:#f6f7f9;color:#69758a}
.mfg-order-progress{margin:12px 0 3px;padding-top:10px;border-top:1px solid #edf0f4}.mfg-order-progress>div{display:flex;align-items:center;justify-content:space-between;margin-bottom:5px;color:#778296;font-size:var(--font-xs)}.mfg-order-progress strong{color:#26334d;font-size:var(--font-xs)}.mfg-order-progress>i{display:block;height:6px;border-radius:8px;background:#eceff4;overflow:hidden}.mfg-order-progress>i>span{display:block;height:100%;border-radius:inherit;background:var(--mfg-purple)}
.mfg-order-summary-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));margin:13px 0 0;padding:0;border-top:1px solid #edf0f4}.mfg-order-summary-grid>div{min-width:0;padding:10px 11px 0;border-left:1px solid #edf0f4}.mfg-order-summary-grid>div:last-child{border-left:0}.mfg-order-summary-grid dt{color:#8993a5;font-size:var(--font-xs);font-weight:600}.mfg-order-summary-grid dd{overflow:hidden;margin:4px 0 0;color:#26334c;font-size:var(--font-xs);font-weight:700;white-space:nowrap;text-overflow:ellipsis}
.mfg-order-financial-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin:10px 0}.mfg-order-financial-strip article{min-height:62px;padding:10px 12px;border:1px solid #e2e6ed;border-radius:11px;background:#fff;display:flex;align-items:center;gap:10px}.mfg-order-financial-strip article>span{width:34px;height:34px;display:grid;place-items:center;flex:0 0 34px;border-radius:9px;background:#f1efff;color:#6246e5}.mfg-order-financial-strip small,.mfg-order-financial-strip strong{display:block}.mfg-order-financial-strip small{color:#8993a4;font-size:var(--font-xs)}.mfg-order-financial-strip strong{margin-top:3px;color:#25324b;font-size:var(--font-sm);font-weight:700}
#mfg-order-details-modal .mfg-reconcile{margin-bottom:10px}.mfg-detail-tabs .nav-link.active{color:var(--mfg-purple);border-bottom-color:var(--mfg-purple)}
.mfg-tab-footer{padding:10px 0 0;text-align:left}.mfg-record-section{margin-bottom:12px;border:1px solid #e4e8ef;border-radius:11px;overflow:hidden}.mfg-record-section:last-child{margin-bottom:0}.mfg-record-section>header{min-height:54px;padding:10px 12px;border-bottom:1px solid #e9edf3;background:#fafbfc;display:flex;align-items:center;gap:9px}.mfg-record-section>header>i{width:31px;height:31px;display:grid;place-items:center;border-radius:8px;background:#f1efff;color:#6246e5}.mfg-record-section h4{margin:0;color:#24314a;font-size:var(--font-xs);font-weight:700}.mfg-record-section p{margin:2px 0 0;color:#8993a5;font-size:var(--font-xs)}
.mfg-output-waste-preview{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.75rem;padding:1rem;border:1px solid #dbe6f5;border-radius:14px;background:linear-gradient(135deg,#f8fbff,#f6f4ff)}.mfg-output-waste-preview>div{display:flex;min-width:0;flex-direction:column;gap:.25rem}.mfg-output-waste-preview span{color:#64748b;font-size:var(--font-sm)}.mfg-output-waste-preview strong{color:#172554;font-size:var(--font-base);overflow-wrap:anywhere}
#mfg-ebr-content.mfg-report-state{min-height:210px;display:grid;place-content:center;gap:6px;text-align:center}.mfg-report-state>i{color:#7760dc;font-size:27px}.mfg-report-state>strong,.mfg-report-state>span{display:block}.mfg-report-state>strong{color:#293650;font-size:var(--font-sm)}.mfg-report-state>span{color:#8a94a5;font-size:var(--font-xs)}
.mfg-ebr-detail{margin-bottom:14px;border:1px solid #dfe4ec;border-radius:13px;background:#fff;overflow:hidden;box-shadow:0 4px 16px rgba(23,35,62,.035)}.mfg-ebr-detail:last-child{margin-bottom:0}.mfg-ebr-head{min-height:76px;padding:12px 14px;border-bottom:1px solid #e6eaf0;display:flex;align-items:center;justify-content:space-between;gap:12px}.mfg-ebr-identity{display:flex;align-items:center;gap:10px}.mfg-ebr-identity>span{width:40px;height:40px;display:grid;place-items:center;border-radius:10px;background:#f1efff;color:#6246e5;font-size:var(--font-base)}.mfg-ebr-identity small,.mfg-ebr-identity h3,.mfg-ebr-identity p{display:block}.mfg-ebr-identity small{color:#8b95a7;font-size:var(--font-xs)}.mfg-ebr-identity h3{margin:1px 0;color:#1e2a44;font-size:var(--font-base);font-weight:700}.mfg-ebr-identity p{margin:2px 0 0;color:#7d889b;font-size:var(--font-xs)}.mfg-ebr-head-status{display:flex;align-items:center;gap:6px}
.mfg-ebr-tabs{min-height:46px;padding:0 8px;border-bottom:1px solid #e6eaf0;background:#fafbfc;display:flex;align-items:stretch;overflow-x:auto}.mfg-ebr-tabs button{position:relative;min-width:76px;padding:0 11px;border:0;background:transparent;color:#7a8598;font-size:var(--font-ui);font-weight:700;white-space:nowrap}.mfg-ebr-tabs button:after{content:"";position:absolute;right:10px;bottom:0;left:10px;height:2px;border-radius:3px;background:transparent}.mfg-ebr-tabs button.active{color:#6246e5}.mfg-ebr-tabs button.active:after{background:#6246e5}
.mfg-ebr-panel{display:none;min-height:230px;padding:14px}.mfg-ebr-panel.active{display:block}.mfg-ebr-summary-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.mfg-ebr-summary-grid>article{border:1px solid #e4e8ef;border-radius:11px;overflow:hidden}.mfg-ebr-summary-grid article>header{min-height:45px;padding:9px 11px;border-bottom:1px solid #e9edf3;background:#fafbfc;display:flex;align-items:center;gap:7px}.mfg-ebr-summary-grid article>header i{color:#6246e5}.mfg-ebr-summary-grid h4{margin:0;color:#26334b;font-size:var(--font-xs);font-weight:700}.mfg-ebr-summary-grid dl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));margin:0}.mfg-ebr-summary-grid dl>div{min-width:0;padding:9px 11px;border-bottom:1px solid #edf0f4}.mfg-ebr-summary-grid dt{color:#8b95a6;font-size:var(--font-xs);font-weight:600}.mfg-ebr-summary-grid dd{overflow:hidden;margin:3px 0 0;color:#28354e;font-size:var(--font-xs);font-weight:700;white-space:nowrap;text-overflow:ellipsis}
.mfg-ebr-facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:10px}.mfg-ebr-facts span{min-height:42px;padding:8px 10px;border:1px solid #e5e9ef;border-radius:9px;background:#fbfcfe;color:#748095;font-size:var(--font-xs);display:flex;align-items:center;gap:7px}.mfg-ebr-facts i{color:#6246e5}.mfg-ebr-facts b{margin-right:auto;color:#26334c;font-size:var(--font-xs)}.mfg-ebr-approvals{display:grid;gap:8px}.mfg-ebr-approvals article{min-height:58px;padding:9px 11px;border:1px solid #e2e7ee;border-radius:10px;background:#fbfcfe;display:grid;grid-template-columns:34px minmax(0,1fr) auto auto;align-items:center;gap:9px}.mfg-ebr-approvals article>span{width:34px;height:34px;display:grid;place-items:center;border-radius:9px;background:#edf9f4;color:#19815b}.mfg-ebr-approvals strong,.mfg-ebr-approvals small{display:block}.mfg-ebr-approvals strong{font-size:var(--font-xs)}.mfg-ebr-approvals small{margin-top:2px;color:#8a94a5;font-size:var(--font-xs)}.mfg-ebr-approvals time{color:#778296;font-size:var(--font-xs)}.mfg-ebr-approvals em{padding:4px 7px;border-radius:14px;background:#edf9f4;color:#177653;font-size:var(--font-xs);font-style:normal;font-weight:700}

@media(max-width:1320px){.mfg-dash-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}.mfg-order-summary-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.mfg-order-summary-grid>div:nth-child(3){border-left:0}}
@media(max-width:1000px){.mfg-dash-card.is-orders,.mfg-dash-card.is-status,.mfg-dash-card.is-trend,.mfg-dash-card.is-alerts,.mfg-dash-card.is-delayed{grid-column:span 12}.mfg-order-financial-strip{grid-template-columns:1fr 1fr 1fr}.mfg-ebr-facts{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:768px){.mfg-dash-header{align-items:flex-start;flex-direction:column}.mfg-dash-actions{width:100%}.mfg-dash-actions .btn{flex:1}.mfg-status-chart{min-height:210px}.mfg-order-detail-header{align-items:flex-start;flex-direction:column}.mfg-order-detail-head-actions{width:100%;justify-content:space-between}.mfg-order-summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.mfg-order-summary-grid>div{border-left:1px solid #edf0f4}.mfg-order-summary-grid>div:nth-child(2n){border-left:0}.mfg-order-financial-strip{grid-template-columns:1fr}.mfg-ebr-summary-grid{grid-template-columns:1fr}.mfg-output-waste-preview{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:520px){.mfg-dash-kpis{grid-template-columns:1fr}.mfg-dash-kpis article{min-height:82px}.mfg-dash-actions{flex-direction:column}.mfg-dash-actions .btn{width:100%}.mfg-status-chart{align-items:center;flex-direction:column}.mfg-donut{width:120px;height:120px;flex-basis:120px}.mfg-status-legend{width:100%}.mfg-trend-chart{padding-inline:8px}.mfg-order-detail-header{padding:11px}.mfg-order-detail-head-actions>#mfg-order-details-actions{min-width:0;flex:1}.mfg-order-detail-head-actions>#mfg-order-details-actions>.btn,.mfg-order-detail-head-actions>#mfg-order-details-actions>.dropdown{flex:1}.mfg-order-detail-head-actions>#mfg-order-details-actions .btn{width:100%}.mfg-order-summary-main{grid-template-columns:38px minmax(0,1fr)}.mfg-order-summary-main>.mfg-state-badge{grid-column:1/-1;justify-self:start}.mfg-order-summary-grid{grid-template-columns:1fr}.mfg-order-summary-grid>div,.mfg-order-summary-grid>div:nth-child(2n){border-left:0}.mfg-ebr-head{align-items:flex-start;flex-direction:column}.mfg-ebr-head-status{width:100%;flex-wrap:wrap}.mfg-ebr-summary-grid dl{grid-template-columns:1fr}.mfg-ebr-facts{grid-template-columns:1fr 1fr}.mfg-ebr-approvals article{grid-template-columns:34px minmax(0,1fr)}.mfg-ebr-approvals time,.mfg-ebr-approvals em{grid-column:2}}

/* Production operation workspace */
.mfg-operation-modal{--mfg-operation-accent:#5b45dc;--mfg-operation-accent-soft:#f2f0ff;--mfg-operation-ink:#17233e;--mfg-operation-muted:#69758a;--mfg-operation-line:#e3e8f0;direction:rtl}
.mfg-operation-modal .mfg-operation-dialog{width:min(980px,calc(100vw - 32px));max-width:980px;height:calc(100dvh - 32px);margin:16px auto}
.mfg-operation-modal .modal-content{height:100%;max-height:none;border:1px solid rgba(255,255,255,.75);border-radius:18px;background:#f8fafc;box-shadow:0 28px 85px rgba(15,23,42,.28)}
.mfg-operation-header{min-height:88px;padding:17px 22px;border-bottom:1px solid var(--mfg-operation-line);background:#fff;align-items:flex-start}
.mfg-operation-heading{min-width:0}.mfg-operation-kicker{display:inline-flex;align-items:center;gap:6px;margin-bottom:4px;color:var(--mfg-operation-accent);font-size:var(--font-xs);font-weight:700}.mfg-operation-heading h5{margin:0;color:var(--mfg-operation-ink);font-size:var(--font-2xl);font-weight:700;line-height:1.35}.mfg-operation-heading small{display:block;margin-top:4px;color:var(--mfg-operation-muted);font-size:var(--font-xs);line-height:1.55}
.mfg-operation-header .btn-close{margin:0;padding:9px;border-radius:9px;background-size:11px}
.mfg-operation-context{display:grid;grid-template-columns:1fr 2fr 1fr;border-bottom:1px solid var(--mfg-operation-line);background:#fff}
.mfg-operation-context>div{min-width:0;padding:11px 18px;border-left:1px solid #edf0f4}.mfg-operation-context>div:last-child{border-left:0}.mfg-operation-context span,.mfg-operation-context strong{display:block}.mfg-operation-context span{margin-bottom:3px;color:#8a94a6;font-size:var(--font-xs);font-weight:700}.mfg-operation-context strong{overflow:hidden;color:#26334c;font-size:var(--font-sm);font-weight:700;white-space:nowrap;text-overflow:ellipsis}
.mfg-operation-modal .modal-body{padding:20px 22px;background:#f8fafc}
.mfg-operation-modal #mfg-operation-form{margin:0}.mfg-operation-modal #mfg-operation-form>.mfg-form-field{padding-inline:6px}
.mfg-operation-step{overflow:hidden;padding:0;border:1px solid var(--mfg-operation-line);border-radius:14px;background:#fff;box-shadow:0 5px 18px rgba(23,35,62,.035)}
.mfg-operation-step>header{display:flex;align-items:flex-start;gap:11px;padding:13px 15px;border-bottom:1px solid #edf0f4;background:#fbfcfe}
.mfg-operation-step>header>span{width:28px;height:28px;display:grid;place-items:center;flex:0 0 28px;border:1px solid #d8d4ff;border-radius:9px;background:var(--mfg-operation-accent-soft);color:var(--mfg-operation-accent);font-weight:700;font-size:var(--font-sm);line-height:1}
.mfg-operation-step>header h6{margin:0;color:#26334c;font-size:var(--font-ui);font-weight:700}.mfg-operation-step>header p{margin:3px 0 0;color:#7c879a;font-size:var(--font-sm);line-height:1.5}
.mfg-operation-step.is-active>header{background:linear-gradient(135deg,#fbfbff,#f6f8ff)}
.mfg-operation-step-body{padding:16px 15px 18px}.mfg-operation-step .form-label{margin-bottom:6px;color:#364258;font-size:var(--font-sm);font-weight:700}.mfg-operation-step .form-control,.mfg-operation-step .form-select{min-height:44px;border-color:#d9e0ea;border-radius:9px;background-color:#fff;color:#202d45;font-size:var(--font-ui);box-shadow:none}.mfg-operation-step .form-control:focus,.mfg-operation-step .form-select:focus{border-color:#8f82ed;box-shadow:0 0 0 3px rgba(91,69,220,.11)}.mfg-operation-step .form-control[readonly]{background:#f4f6f9;color:#667085}
.mfg-operation-summary-step>.mfg-output-waste-preview{margin:15px;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;padding:0;border:0;background:transparent}
.mfg-operation-summary-step .mfg-output-waste-preview>div{min-height:72px;padding:12px;border:1px solid #e1e6ef;border-radius:11px;background:#f9fbfe;justify-content:center}.mfg-operation-summary-step .mfg-output-waste-preview>div:nth-child(2){border-color:#cfe9df;background:#f1fbf6}.mfg-operation-summary-step .mfg-output-waste-preview>div:nth-child(3){border-color:#f0d0d6;background:#fff5f6}.mfg-operation-summary-step .mfg-output-waste-preview span{color:#758196;font-size:var(--font-xs);font-weight:700}.mfg-operation-summary-step .mfg-output-waste-preview strong{margin-top:4px;color:#23314b;font-size:var(--font-ui);font-weight:700}
.mfg-operation-disposition-step>.row{margin:0;padding:16px 15px 18px}.mfg-operation-disposition-step .alert{margin-bottom:2px;border-color:#cfe0f5;background:#f2f7fd;color:#365b85;font-size:var(--font-sm)}
.mfg-operation-footer{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:76px;padding:13px 22px;border-top:1px solid var(--mfg-operation-line);background:#fff}.mfg-operation-footer>p{display:flex;align-items:center;gap:7px;margin:0;color:#7b8799;font-size:var(--font-sm)}.mfg-operation-footer>p i{color:var(--mfg-operation-accent)}.mfg-operation-footer>div{display:flex;gap:8px}.mfg-operation-footer .btn{min-width:104px;min-height:41px;border-radius:9px;font-size:var(--font-ui);font-weight:700}.mfg-operation-footer .btn-primary{min-width:164px;border-color:var(--mfg-operation-accent);background:var(--mfg-operation-accent)}.mfg-operation-footer .btn-primary:hover{border-color:#4e38ca;background:#4e38ca}

@media(max-width:760px){.mfg-operation-modal .mfg-operation-dialog{width:auto;height:calc(100dvh - 12px);margin:6px}.mfg-operation-modal .modal-content{border-radius:14px}.mfg-operation-header{min-height:80px;padding:14px}.mfg-operation-heading h5{font-size:var(--font-lg)}.mfg-operation-context{grid-template-columns:1fr 1fr}.mfg-operation-context>div{padding:9px 12px}.mfg-operation-context>div:nth-child(2){border-left:0}.mfg-operation-context>div:nth-child(3){grid-column:1/-1;border-top:1px solid #edf0f4}.mfg-operation-modal .modal-body{padding:12px}.mfg-operation-summary-step>.mfg-output-waste-preview{grid-template-columns:repeat(2,minmax(0,1fr));margin:12px}.mfg-operation-footer{align-items:stretch;flex-direction:column;padding:11px 14px}.mfg-operation-footer>p{display:none}.mfg-operation-footer>div{width:100%}.mfg-operation-footer .btn{flex:1}.mfg-operation-footer .btn-primary{min-width:0}}
@media(max-width:480px){.mfg-operation-summary-step>.mfg-output-waste-preview{grid-template-columns:1fr}.mfg-operation-step>header{padding:11px 12px}.mfg-operation-step-body,.mfg-operation-disposition-step>.row{padding:12px}.mfg-operation-context{grid-template-columns:1fr}.mfg-operation-context>div,.mfg-operation-context>div:nth-child(2){grid-column:auto;border-left:0;border-top:1px solid #edf0f4}.mfg-operation-context>div:first-child{border-top:0}}

/* system_accounts.css */
.system-accounts-page{--sa-navy:#10264b;--sa-blue:#1769e0;--sa-border:#dfe6ef;--sa-muted:#6b7890;color:var(--sa-navy);font-family:inherit}.system-accounts-loading{min-height:260px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:14px;border:1px solid var(--sa-border);border-radius:14px;background:#fff;color:var(--sa-muted);font-size:var(--font-base)}.system-accounts-loading i{font-size:1.8rem;color:var(--sa-blue)}.system-accounts-header{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:22px}.system-accounts-header nav{font-size:var(--font-sm);color:#7b879b;margin-bottom:10px}.system-accounts-header nav i{font-size:.65rem;margin:0 6px}.system-accounts-header h1{font-size:var(--font-2xl);font-weight:750;margin:0 0 6px;display:flex;align-items:center;gap:10px}.system-accounts-header h1>span{width:38px;height:38px;border-radius:10px;display:inline-flex;align-items:center;justify-content:center;background:#eaf2ff;color:var(--sa-blue)}.system-accounts-header p{font-size:var(--font-base);color:var(--sa-muted);margin:0}.system-header-actions{display:flex;gap:9px;flex-wrap:wrap}.system-health-section{border:1px solid var(--sa-border);border-radius:14px;background:#fff;overflow:hidden;margin-bottom:18px}.system-health-head{padding:16px 18px;display:flex;align-items:center;justify-content:space-between;gap:20px;border-bottom:1px solid var(--sa-border);background:#f8fbff}.system-health-head.is-ready{background:#f3fbf6}.system-health-status{display:flex;align-items:center;gap:11px}.system-health-status>span{width:42px;height:42px;border-radius:11px;display:inline-flex;align-items:center;justify-content:center;background:#e8f7ee;color:#168947}.system-health-head.needs-review .system-health-status>span{background:#fff4df;color:#b66a00}.system-health-status small,.system-health-status strong{display:block}.system-health-status small{font-size:var(--font-xs);color:var(--sa-muted);margin-bottom:2px}.system-health-status strong{font-size:var(--font-2xl)}.system-health-note{font-size:var(--font-xs);color:var(--sa-muted)}.system-health-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0}.system-health-card{display:flex;align-items:center;gap:11px;padding:16px 18px;border-inline-start:1px solid var(--sa-border)}.system-health-card:first-child{border-inline-start:0}.system-health-card>span{width:36px;height:36px;border-radius:9px;display:inline-flex;align-items:center;justify-content:center;background:#edf3fb;color:#42648f}.system-health-card.tone-success>span{background:#e9f7ee;color:#198754}.system-health-card.tone-warning>span{background:#fff4df;color:#b66a00}.system-health-card.tone-danger>span{background:#fff0f1;color:#dc3545}.system-health-card small,.system-health-card strong{display:block}.system-health-card small{font-size:var(--font-xs);color:var(--sa-muted);margin-bottom:2px}.system-health-card strong{font-size:var(--font-lg);font-variant-numeric:tabular-nums}.system-warning-box{display:flex;gap:12px;padding:13px 16px;border:1px solid #f4d394;background:#fff9ed;border-radius:12px;color:#76521a;margin-bottom:18px;font-size:var(--font-ui)}.system-warning-box>i{color:#c57900;margin-top:2px}.system-warning-box ul{margin:5px 0 0;padding-right:18px}.system-section-card{border:1px solid var(--sa-border);border-radius:14px;background:#fff;overflow:hidden}.system-section-title{display:flex;align-items:center;gap:12px;padding:16px 18px;border-bottom:1px solid var(--sa-border)}.system-section-title>span{width:40px;height:40px;border-radius:10px;display:inline-flex;align-items:center;justify-content:center;background:#eaf2ff;color:var(--sa-blue)}.system-section-title h2{font-size:var(--font-md);margin:0 0 3px;font-weight:750}.system-section-title p{font-size:var(--font-sm);color:var(--sa-muted);margin:0}.system-accounts-table{width:100%;border-collapse:collapse;min-width:1180px;font-size:var(--font-ui)}.system-accounts-table th{padding:11px 13px;background:#f5f8fc;color:#344766;font-weight:700;border-bottom:1px solid var(--sa-border);white-space:nowrap}.system-accounts-table td{padding:13px;border-bottom:1px solid #edf1f6;vertical-align:middle}.system-accounts-table tr:last-child td{border-bottom:0}.system-accounts-table tbody tr:hover{background:#fbfdff}.system-accounts-table small{display:block;color:var(--sa-muted);font-size:var(--font-xs);margin-top:4px}.system-purpose{display:flex;align-items:center;gap:6px;white-space:nowrap}.system-info{border:0;background:transparent;color:#8291a8;padding:2px;cursor:help}.system-info:hover{color:var(--sa-blue)}.system-type-badge,.system-managed-badge,.system-linked-badge,.system-status{display:inline-flex;align-items:center;gap:5px;border-radius:999px;white-space:nowrap}.system-type-badge{padding:5px 8px;background:#f1f5fa;color:#465978;font-size:var(--font-xs)}.system-managed-badge{padding:4px 7px;background:#eaf2ff;color:#1769e0;font-size:var(--font-xs)}.system-linked-badge{padding:4px 7px;background:#f2edff;color:#6f42c1;font-size:var(--font-xs)}.system-account{display:flex;flex-direction:column;align-items:flex-start;gap:5px}.system-path{max-width:270px;line-height:1.55}.system-status{padding:5px 9px;font-size:var(--font-xs);font-weight:700}.system-status.ready{background:#eaf8ef;color:#168447}.system-status.review{background:#fff3df;color:#a96300}.system-missing{color:#d23c4b;font-weight:700}.system-accounts-footer{margin-top:14px;padding:10px 13px;border-radius:10px;background:#f4f8ff;color:#57708f;font-size:var(--font-sm)}.system-accounts-footer i{color:var(--sa-blue);margin-left:6px}.system-search{position:relative}.system-search i{position:absolute;right:13px;top:14px;color:#8291a8}.system-search input{padding-right:38px;height:44px}.system-account-results{margin-top:10px;border:1px solid var(--sa-border);border-radius:10px;max-height:275px;overflow:auto}.system-account-option{width:100%;display:flex;align-items:center;justify-content:space-between;gap:10px;border:0;border-bottom:1px solid #edf1f6;background:#fff;padding:11px 12px;text-align:right;color:var(--sa-navy)}.system-account-option:last-child{border-bottom:0}.system-account-option span,.system-account-option small{display:block}.system-account-option small{font-size:var(--font-xs);color:var(--sa-muted);margin-top:3px}.system-account-option>i{opacity:0;color:#198754}.system-account-option:hover,.system-account-option.selected{background:#f2f7ff}.system-account-option.selected>i{opacity:1}.system-create-box{margin-top:12px;padding:11px 12px;background:#f8fafc;border:1px dashed #cbd6e4;border-radius:10px;display:flex;align-items:center;justify-content:space-between;gap:12px}.system-create-box strong,.system-create-box small{display:block}.system-create-box small{font-size:var(--font-xs);color:var(--sa-muted);margin-top:3px}@media(max-width:991px){.system-accounts-header{align-items:flex-start;flex-direction:column}.system-health-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.system-health-card:nth-child(3){border-top:1px solid var(--sa-border)}.system-health-card:nth-child(4){border-top:1px solid var(--sa-border)}}@media(max-width:575px){.system-accounts-header h1{font-size:var(--font-2xl)}.system-header-actions,.system-header-actions .btn{width:100%}.system-health-head{align-items:flex-start;flex-direction:column}.system-health-grid{grid-template-columns:1fr}.system-health-card{border-inline-start:0;border-top:1px solid var(--sa-border)!important}.system-health-card:first-child{border-top:0!important}.system-create-box{align-items:flex-start;flex-direction:column}.system-create-box .btn{width:100%}}

/* accounting-settings-landing.css */
.accounting-settings-landing{--asl-green:#198754;--asl-green-soft:#edf8f1;--asl-ink:#263447;--asl-muted:#6c7a89;--asl-line:#dfe7e2;direction:rtl;color:var(--asl-ink)}
.accounting-settings-landing__header{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:24px;padding-bottom:18px;border-bottom:1px solid var(--asl-line)}
.accounting-settings-landing__breadcrumb{display:flex;align-items:center;gap:7px;color:var(--asl-muted);font-size:var(--font-xs);margin-bottom:10px}.accounting-settings-landing__breadcrumb i{font-size:.62rem}.accounting-settings-landing__breadcrumb strong{color:var(--asl-green)}
.accounting-settings-landing__title{display:flex;align-items:center;gap:12px}.accounting-settings-landing__title-icon{width:44px;height:44px;display:grid;place-items:center;border-radius:10px;background:var(--asl-green-soft);color:var(--asl-green);font-size:1.1rem}.accounting-settings-landing__title h1{margin:0 0 5px;font-size:var(--font-2xl);font-weight:750;color:var(--asl-ink)}.accounting-settings-landing__title p{margin:0;color:var(--asl-muted);font-size:var(--font-base)}
.accounting-settings-landing__actions{display:flex;gap:8px;flex-wrap:wrap}.accounting-settings-landing__actions .btn{min-height:40px;box-shadow:none}
.accounting-settings-landing__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.accounting-settings-card{position:relative;min-height:154px;display:flex;align-items:flex-start;gap:13px;padding:20px;text-decoration:none;color:inherit;background:#fff;border:1px solid var(--asl-line);border-radius:12px;box-shadow:0 2px 8px rgba(27,54,42,.035);transition:border-color .16s ease,box-shadow .16s ease,transform .16s ease}.accounting-settings-card:hover{color:inherit;border-color:#9fcfb0;box-shadow:0 8px 20px rgba(27,84,50,.1);transform:translateY(-2px)}.accounting-settings-card:focus-visible{outline:3px solid rgba(25,135,84,.3);outline-offset:3px}.accounting-settings-card__icon{width:42px;height:42px;flex:0 0 42px;display:grid;place-items:center;border-radius:10px;background:var(--asl-green-soft);color:var(--asl-green);font-size:1.05rem}.accounting-settings-card__content{padding-inline-end:15px}.accounting-settings-card__content strong,.accounting-settings-card__content small{display:block}.accounting-settings-card__content strong{font-size:var(--font-md);color:var(--asl-ink);margin:1px 0 8px}.accounting-settings-card__content small{color:var(--asl-muted);line-height:1.65;font-size:var(--font-sm)}.accounting-settings-card__arrow{position:absolute;left:18px;bottom:18px;color:#8ca198;font-size:var(--font-ui);transition:transform .16s ease}.accounting-settings-card:hover .accounting-settings-card__arrow{color:var(--asl-green);transform:translateX(-4px)}
@media(max-width:1100px){.accounting-settings-landing__grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:700px){.accounting-settings-landing__header{align-items:flex-start;flex-direction:column;gap:15px}.accounting-settings-landing__actions,.accounting-settings-landing__actions .btn{width:100%}.accounting-settings-landing__grid{grid-template-columns:1fr;gap:11px}.accounting-settings-card{min-height:132px;padding:17px}.accounting-settings-landing__title h1{font-size:var(--font-2xl)}.accounting-settings-landing__title p{font-size:var(--font-ui)}.accounting-settings-card__arrow{left:16px;bottom:16px}}

/* personal-account-settings.css */
.pas-page{--pas-primary:#6252d8;--pas-primary-dark:#4938bd;--pas-soft:#f1efff;--pas-blue:#3979dc;--pas-text:#202b3c;--pas-muted:#718096;--pas-line:#e7eaf1;direction:inherit;color:var(--pas-text)}
.pas-loading,.pas-error{min-height:420px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;text-align:center;color:var(--pas-muted);background:#fff;border:1px solid var(--pas-line);border-radius:18px}.pas-loading i,.pas-error>i{font-size:32px;color:var(--pas-primary)}.pas-loading strong{font-size:var(--font-lg);color:var(--pas-text)}.pas-error h2{font-size:var(--font-xl);margin:5px 0}.pas-error p{margin:0 0 8px}
.pas-header{display:flex;justify-content:space-between;align-items:center;gap:24px;margin-bottom:20px;padding:24px 26px;background:linear-gradient(125deg,#fff 32%,#f6f4ff);border:1px solid #e7e3ff;border-radius:18px;box-shadow:0 10px 30px rgba(57,45,145,.06)}.pas-heading{display:flex;align-items:center;gap:15px}.pas-heading__icon{width:52px;height:52px;display:grid;place-items:center;border-radius:15px;background:linear-gradient(135deg,var(--pas-primary),var(--pas-blue));color:#fff;font-size:20px;box-shadow:0 9px 20px rgba(98,82,216,.24)}.pas-eyebrow{margin:0 0 3px!important;color:var(--pas-primary)!important;font-size:var(--font-xs) !important;font-weight:700;letter-spacing:.04em}.pas-heading h1{margin:0 0 5px;font-size:var(--font-2xl);font-weight:700}.pas-heading p{margin:0;color:var(--pas-muted);font-size:var(--font-ui)}.pas-identity-card{display:flex;align-items:center;gap:11px;min-width:310px;padding:12px 14px;background:rgba(255,255,255,.84);border:1px solid #e5e1fb;border-radius:14px}.pas-identity-card>div{min-width:0;flex:1}.pas-identity-card strong,.pas-identity-card small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.pas-identity-card strong{font-size:var(--font-ui)}.pas-identity-card small{margin-top:3px;color:var(--pas-muted);font-size:var(--font-xs);text-align:right}.pas-avatar{width:42px;height:42px;flex:0 0 42px;display:grid;place-items:center;border-radius:50%;background:linear-gradient(135deg,#ebe8ff,#dce9ff);color:var(--pas-primary-dark);font-weight:850}.pas-status,.pas-current-session{display:inline-flex;align-items:center;gap:6px;color:#16855b;font-size:var(--font-xs);font-weight:700;white-space:nowrap}.pas-status i,.pas-current-session i{font-size:6px}
.pas-message{display:flex;align-items:center;gap:9px;margin-bottom:16px;padding:13px 15px;border-radius:12px;font-size:var(--font-ui)}.pas-message.success{color:#126e4d;background:#eaf8f1;border:1px solid #c8ead9}.pas-message.error{color:#a62f3c;background:#fff0f2;border:1px solid #f3ccd2}
.pas-shell{display:grid;grid-template-columns:255px minmax(0,1fr);gap:18px;align-items:start}.pas-tabs{position:sticky;top:82px;padding:9px;background:#fff;border:1px solid var(--pas-line);border-radius:16px;box-shadow:0 7px 24px rgba(35,45,70,.05)}.pas-tabs button{width:100%;display:flex;align-items:center;gap:11px;padding:13px;border:0;border-radius:11px;background:transparent;color:#637087;text-align:right;transition:.16s ease}.pas-tabs button+button{margin-top:4px}.pas-tabs button>i{width:35px;height:35px;display:grid;place-items:center;border-radius:10px;background:#f5f6fa;color:#8690a2}.pas-tabs button span,.pas-tabs button strong,.pas-tabs button small{display:block}.pas-tabs button span{min-width:0}.pas-tabs button strong{font-size:var(--font-ui)}.pas-tabs button small{margin-top:3px;color:#98a0ae;font-size:var(--font-xs)}.pas-tabs button.active{color:var(--pas-primary-dark);background:var(--pas-soft)}.pas-tabs button.active>i{background:#fff;color:var(--pas-primary);box-shadow:0 4px 12px rgba(98,82,216,.12)}
.pas-content{min-width:0;background:#fff;border:1px solid var(--pas-line);border-radius:18px;box-shadow:0 9px 28px rgba(35,45,70,.045);overflow:hidden}.pas-panel{display:none;padding:25px}.pas-panel.active{display:block}.pas-section-title{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;margin-bottom:23px;padding-bottom:18px;border-bottom:1px solid var(--pas-line)}.pas-section-title h2{margin:0 0 6px;font-size:var(--font-lg);font-weight:700}.pas-section-title p{margin:0;color:var(--pas-muted);font-size:var(--font-sm)}.pas-safe-badge{display:inline-flex;align-items:center;gap:6px;padding:7px 10px;border-radius:20px;background:#eef7ff;color:#3371b6;font-size:var(--font-xs);font-weight:700;white-space:nowrap}
.pas-profile-layout{display:grid;grid-template-columns:190px minmax(0,1fr);gap:26px}.pas-photo-card{display:flex;flex-direction:column;align-items:center;padding:22px 15px;background:linear-gradient(155deg,#faf9ff,#f6f9ff);border:1px solid #ebe8fb;border-radius:15px;text-align:center}.pas-avatar--large{width:82px;height:82px;flex-basis:82px;margin-bottom:12px;font-size:25px;box-shadow:0 8px 20px rgba(80,68,175,.13)}.pas-photo-card strong{font-size:var(--font-ui)}.pas-photo-card p{margin:9px 0 13px;color:var(--pas-muted);font-size:var(--font-xs);line-height:1.7}.pas-unavailable{padding:6px 8px;border-radius:8px;background:#fff;color:#7b8492;font-size:var(--font-xs);border:1px solid var(--pas-line)}
.pas-form{min-width:0}.pas-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:17px}.pas-form label{display:block}.pas-form label>span{display:block;margin-bottom:6px;color:#4f5d70;font-size:var(--font-sm);font-weight:750}.pas-form label>small{display:block;margin-top:5px;color:#929aaa;font-size:var(--font-sm)}.pas-form .form-control{min-height:43px;border-color:#dfe3eb;border-radius:10px;font-size:var(--font-ui);box-shadow:none}.pas-form .form-control:focus{border-color:#8f83e8;box-shadow:0 0 0 3px rgba(98,82,216,.1)}.pas-form .form-control:disabled{background:#f7f8fa;color:#7f8795}.pas-field-error{color:#b83242!important}.pas-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:23px;padding-top:18px;border-top:1px solid var(--pas-line)}.pas-actions .btn{min-width:115px;min-height:40px;border-radius:9px;font-size:var(--font-ui);font-weight:750}.pas-actions .btn-primary{background:var(--pas-primary);border-color:var(--pas-primary)}.pas-actions .btn-primary:hover{background:var(--pas-primary-dark)}
.pas-password-form{max-width:650px}.pas-password-form>label{margin-top:16px}.pas-security-note{display:flex;align-items:flex-start;gap:12px;padding:14px;background:#f5f3ff;border:1px solid #e5e0ff;border-radius:12px}.pas-security-note>i{width:34px;height:34px;display:grid;place-items:center;border-radius:10px;background:#fff;color:var(--pas-primary)}.pas-security-note strong{font-size:var(--font-xs)}.pas-security-note p{margin:3px 0 0;color:var(--pas-muted);font-size:var(--font-xs)}.pas-password-input{position:relative}.pas-password-input input{padding-left:43px}.pas-password-input button{position:absolute;left:5px;top:5px;width:34px;height:33px;border:0;border-radius:8px;background:#f3f4f8;color:#788396}
.pas-session-card{display:flex;align-items:center;gap:14px;padding:17px;border:1px solid #dfe7f5;border-radius:14px;background:#fbfcff}.pas-session-icon{width:45px;height:45px;display:grid;place-items:center;border-radius:12px;background:#edf4ff;color:var(--pas-blue);font-size:17px}.pas-session-card>div{flex:1}.pas-session-card strong,.pas-session-card small{display:block}.pas-session-card strong{font-size:var(--font-sm)}.pas-session-card small{margin-top:4px;color:var(--pas-muted);font-size:var(--font-xs)}.pas-security-actions{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:14px;padding:17px;border:1px solid #f0d7dc;border-radius:14px;background:#fffafb}.pas-security-actions strong{font-size:var(--font-ui)}.pas-security-actions p{margin:4px 0 0;color:var(--pas-muted);font-size:var(--font-ui)}.pas-security-actions .btn{font-size:var(--font-ui);white-space:nowrap}.pas-capabilities{margin-top:24px}.pas-capabilities h3{font-size:var(--font-base);margin:0 0 12px}.pas-capability-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.pas-capability-grid article{display:flex;align-items:center;gap:10px;padding:13px;border:1px solid var(--pas-line);border-radius:12px}.pas-capability-grid article>i{width:33px;height:33px;display:grid;place-items:center;border-radius:9px;background:#f5f6fa;color:#858e9d}.pas-capability-grid article>div{flex:1}.pas-capability-grid strong,.pas-capability-grid small{display:block}.pas-capability-grid strong{font-size:var(--font-sm)}.pas-capability-grid small{margin-top:3px;color:var(--pas-muted);font-size:var(--font-xs)}.pas-capability-grid article>span{padding:4px 7px;border-radius:12px;background:#f1f2f5;color:#7d8592;font-size:var(--font-xs);font-weight:700}.pas-capability-grid article>span.supported{background:#eaf8f1;color:#16855b}
.pas-preferences{margin-top:30px;padding-top:26px;border-top:1px solid var(--pas-line)}.pas-section-kicker{display:block;margin-bottom:5px;color:var(--pas-primary);font-size:var(--font-xs);font-weight:850;letter-spacing:.04em}.pas-preferences-heading{margin-bottom:18px}.pas-preference-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.pas-preference-card{padding:18px;border:1px solid #e5e8f0;border-radius:15px;background:linear-gradient(155deg,#fff,#fbfcff)}.pas-preference-card>header{display:flex;align-items:flex-start;gap:11px;margin-bottom:18px}.pas-preference-card>header>span{width:38px;height:38px;flex:0 0 38px;display:grid;place-items:center;border-radius:11px;background:var(--pas-soft);color:var(--pas-primary)}.pas-preference-card h3{margin:1px 0 4px;font-size:var(--font-base);font-weight:700}.pas-preference-card header p{margin:0;color:var(--pas-muted);font-size:var(--font-xs)}.pas-preference-card .pas-form-grid{grid-template-columns:1fr;gap:14px}.pas-preference-card .form-select{min-height:43px;border-color:#dfe3eb;border-radius:10px;font-size:var(--font-ui);box-shadow:none}.pas-preference-card .form-select:focus{border-color:#8f83e8;box-shadow:0 0 0 3px rgba(98,82,216,.1)}.pas-currency-field{grid-column:1/-1}.pas-currency-field select:disabled{background:#f5f6f8;color:#566174;opacity:1}.pas-currency-protection{display:flex;align-items:flex-start;gap:8px;padding:10px 11px;border-radius:10px;font-size:var(--font-ui);line-height:1.65}.pas-currency-protection.is-locked{color:#8a5b19;background:#fff8e7;border:1px solid #f1dfb5}.pas-currency-protection.is-open{color:#166e51;background:#edf9f4;border:1px solid #ccebdd}.pas-currency-protection i{margin-top:2px}.pas-preference-preview{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:16px;padding:15px 17px;border:1px solid #ddd9fb;border-radius:14px;background:linear-gradient(120deg,#f7f5ff,#f7fbff)}.pas-preference-preview>div{display:flex;align-items:center;gap:10px}.pas-preview-icon{width:36px;height:36px;display:grid;place-items:center;border-radius:10px;background:#fff;color:var(--pas-primary)}.pas-preference-preview strong,.pas-preference-preview small{display:block}.pas-preference-preview strong{font-size:var(--font-sm)}.pas-preference-preview small{margin-top:3px;color:var(--pas-muted);font-size:var(--font-xs)}.pas-preference-preview dl{display:flex;align-items:center;gap:8px;margin:0}.pas-preference-preview dl>div{min-width:120px;padding:8px 11px;border-radius:10px;background:#fff;border:1px solid #ebe9f7}.pas-preference-preview dt{color:var(--pas-muted);font-size:var(--font-xs)}.pas-preference-preview dd{margin:3px 0 0;color:var(--pas-text);font-size:var(--font-sm);font-weight:700;direction:ltr;text-align:start;unicode-bidi:isolate}.pas-preferences .pas-actions{margin-top:18px}
html[dir="ltr"] .pas-tabs button,html[dir="ltr"] .pas-identity-card small{text-align:left}html[dir="ltr"] .pas-password-input input{padding-right:43px;padding-left:12px}html[dir="ltr"] .pas-password-input button{right:5px;left:auto}
@media(max-width:1050px){.pas-header{align-items:flex-start}.pas-identity-card{min-width:280px}.pas-shell{grid-template-columns:215px minmax(0,1fr)}.pas-profile-layout{grid-template-columns:160px minmax(0,1fr)}}
@media(max-width:980px){.pas-preference-grid{grid-template-columns:1fr}.pas-preference-preview{align-items:flex-start;flex-direction:column}.pas-preference-preview dl{width:100%}.pas-preference-preview dl>div{flex:1;min-width:0}}
@media(max-width:820px){.pas-header{flex-direction:column}.pas-identity-card{width:100%;min-width:0}.pas-shell{grid-template-columns:1fr}.pas-tabs{position:static;display:flex;overflow-x:auto}.pas-tabs button{min-width:190px}.pas-tabs button+button{margin:0 4px 0 0}.pas-profile-layout{grid-template-columns:1fr}.pas-photo-card{display:grid;grid-template-columns:auto 1fr;column-gap:13px;text-align:start}.pas-photo-card .pas-avatar{grid-row:1/4}.pas-photo-card p{margin:4px 0}.pas-unavailable{justify-self:start}.pas-form-grid,.pas-capability-grid{grid-template-columns:1fr}}
@media(max-width:560px){.pas-header{padding:18px}.pas-heading{align-items:flex-start}.pas-heading h1{font-size:var(--font-2xl)}.pas-heading__icon{width:45px;height:45px}.pas-identity-card{align-items:flex-start;flex-wrap:wrap}.pas-status{margin-inline-start:53px}.pas-panel{padding:17px}.pas-section-title,.pas-security-actions{flex-direction:column}.pas-safe-badge{align-self:flex-start}.pas-actions{position:sticky;bottom:0;margin-inline:-17px;margin-bottom:-17px;padding:12px 17px;background:#fff;z-index:2}.pas-actions .btn{flex:1;min-width:0}.pas-session-card{align-items:flex-start;flex-wrap:wrap}.pas-current-session{margin-inline-start:59px}.pas-tabs button{min-width:165px}.pas-preference-card{padding:14px}.pas-preference-preview dl{display:grid;grid-template-columns:1fr 1fr}.pas-preference-preview dl>div:last-child{grid-column:1/-1}}

/* Profile avatar upload. */
.pas-avatar{overflow:hidden}
.pas-avatar img{width:100%;height:100%;display:block;object-fit:cover}
.pas-avatar.has-image{background:#fff;border:1px solid #e0e5ef}
.pas-avatar-upload{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-width:116px;font-size:11px;font-weight:800}
.pas-avatar-upload:disabled{cursor:wait;opacity:.7}

/* zatca.css */
.zatca-page{display:grid;gap:1.25rem}.zatca-loading{padding:4rem;text-align:center;color:var(--text-muted,#667085)}.zatca-head{display:flex;justify-content:space-between;gap:1rem;align-items:flex-start}.zatca-head nav{font-size:var(--font-ui);color:#667085;margin-bottom:.6rem}.zatca-head nav i{margin:0 .45rem}.zatca-head h1{font-size:var(--font-2xl);margin:0 0 .35rem}.zatca-head h1 i{color:#176b4d;margin-left:.5rem}.zatca-head p{margin:0;color:#667085}.zatca-gate{display:flex;justify-content:space-between;align-items:center;padding:1rem 1.2rem;border-radius:14px;border:1px solid}.zatca-gate div{display:grid}.zatca-gate span{font-size:var(--font-base)}.zatca-gate.is-blocked{background:#fff3f2;border-color:#f6c9c5;color:#9b2720}.zatca-gate.is-ready{background:#ecfdf3;border-color:#abe6c6;color:#176b4d}.zatca-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(145px,1fr));gap:.8rem}.zatca-kpis article{background:#fff;border:1px solid #e8ebf1;border-radius:14px;padding:1rem;box-shadow:0 5px 18px rgba(16,24,40,.04)}.zatca-kpis small{display:block;color:#667085}.zatca-kpis strong{font-size:var(--font-2xl)}.zatca-grid{display:grid;grid-template-columns:2fr 1fr;gap:1rem}.zatca-card{background:#fff;border:1px solid #e8ebf1;border-radius:16px;padding:1.1rem;box-shadow:0 6px 22px rgba(16,24,40,.045)}.zatca-card>header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:1rem}.zatca-card h2{font-size:var(--font-lg);margin:0}.zatca-card header p{font-size:var(--font-ui);color:#667085;margin:.2rem 0 0}.zatca-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem}.zatca-card label{display:grid;gap:.3rem;font-size:var(--font-sm)}.zatca-card input,.zatca-card select{border:1px solid #d7dce5;border-radius:9px;padding:.65rem;background:#fff}.zatca-entitlements{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:1rem}.zatca-egs-list{display:grid;gap:.75rem}.zatca-egs-list article{display:grid;grid-template-columns:1fr auto;gap:.8rem;padding:1rem;border:1px solid #e8ebf1;border-radius:12px}.zatca-egs-list article>div{display:grid;gap:.2rem}.zatca-egs-list small{color:#667085}.zatca-egs-list footer{grid-column:1/-1;display:flex;gap:.45rem;flex-wrap:wrap}.zatca-egs-list footer button{border:1px solid #bfd7cf;color:#176b4d;background:#f4fbf8;border-radius:8px;padding:.45rem .7rem}.zatca-empty{text-align:center;color:#667085;padding:2rem}.si-zatca-panel-grid{display:grid;grid-template-columns:auto 1fr;gap:1.25rem;align-items:start}.si-zatca-qr img{width:190px;height:190px;border:10px solid #fff;box-shadow:0 3px 16px rgba(16,24,40,.12)}@media(max-width:900px){.zatca-grid{grid-template-columns:1fr}.zatca-form-grid{grid-template-columns:1fr}.zatca-head{display:grid}}@media(max-width:720px){.si-zatca-panel-grid{grid-template-columns:1fr}.si-zatca-qr{text-align:center}}

.saas-zatca-primary-card{position:relative;overflow:hidden;color:#fff;background:linear-gradient(135deg,#102a43 0%,#176b4d 58%,#1f8a62 100%)}.saas-zatca-primary-card:before{content:"";position:absolute;inset:-40% auto auto -8%;width:360px;height:360px;border-radius:50%;background:rgba(255,255,255,.07)}.saas-zatca-primary-card .card-body{position:relative;z-index:1}.saas-zatca-primary-card .saas-zatca-description{max-width:900px;color:rgba(255,255,255,.82);line-height:1.8}.saas-zatca-eyebrow{display:inline-block;margin-bottom:.45rem;padding:.25rem .65rem;border:1px solid rgba(255,255,255,.25);border-radius:999px;font-size:var(--font-xs);color:rgba(255,255,255,.86);background:rgba(255,255,255,.08)}.saas-zatca-metric{display:flex;flex-direction:column;gap:.2rem;padding:.85rem 1rem;border:1px solid #e7ebf0;border-radius:12px;background:#fff;color:#102a43}.saas-zatca-primary-card .saas-zatca-metric{border-color:rgba(255,255,255,.17);background:rgba(255,255,255,.1);color:#fff}.saas-zatca-metric i{margin-bottom:.2rem;color:#1f8a62}.saas-zatca-primary-card .saas-zatca-metric i{color:#a9f2d6}.saas-zatca-metric small{color:#667085}.saas-zatca-primary-card .saas-zatca-metric small{color:rgba(255,255,255,.7)}.saas-zatca-metric strong{overflow-wrap:anywhere}.saas-invoice-policy-card{border-inline-start:4px solid #3164d5!important}.saas-policy-option{display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:95px;padding:1rem;border:1px solid #e7ebf0;border-radius:12px;background:#fbfcfe;cursor:pointer}.saas-policy-option strong,.saas-policy-option small{display:block}.saas-policy-option small{margin-top:.35rem;color:#667085;line-height:1.45}.saas-policy-option .form-check-input{width:2.5em;height:1.25em}.saas-policy-option:has(.form-check-input:checked){border-color:#b7c9f4;background:#f5f8ff}@media(max-width:720px){.saas-zatca-primary-card .card-body{padding:1.25rem!important}.saas-policy-option{min-height:auto}}
.card.saas-zatca-primary-card{background:linear-gradient(135deg,#102a43 0%,#176b4d 58%,#1f8a62 100%)}

/* zatca_general.css */
.ei-page{--ei-navy:#153b64;--ei-blue:#1f5ea8;--ei-green:#147a58;--ei-border:#e3e8ef;--ei-muted:#667085;display:grid;gap:1rem;color:#172b4d}
.ei-page-head{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;padding:.25rem 0}
.ei-page-head h1{margin:.2rem 0 .35rem;font-size:var(--font-2xl);font-weight:700;color:#102a43}
.ei-page-head p{margin:0;color:var(--ei-muted);line-height:1.7}
.ei-eyebrow{display:inline-flex;align-items:center;gap:.4rem;margin-top:.75rem;color:var(--ei-blue);font-size:var(--font-xs);font-weight:700}
.ei-breadcrumb{display:flex;align-items:center;flex-wrap:wrap;gap:.45rem;color:#8490a2;font-size:var(--font-xs)}
.ei-breadcrumb a{color:#64748b;text-decoration:none}
.ei-breadcrumb a:hover{color:var(--ei-blue)}
.ei-breadcrumb strong{color:#344054}
.ei-breadcrumb i{font-size:.58rem}
.ei-summary-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.75rem}
.ei-summary-grid article{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:.75rem;min-height:92px;padding:1rem;background:#fff;border:1px solid var(--ei-border);border-radius:15px;box-shadow:0 5px 20px rgba(16,42,67,.045)}
.ei-summary-grid article>div{display:grid;gap:.2rem;min-width:0}
.ei-summary-grid small{color:var(--ei-muted);font-size:var(--font-xs)}
.ei-summary-grid strong{font-size:var(--font-base);overflow-wrap:anywhere}
.ei-summary-icon{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;font-size:1rem}
.ei-summary-icon.is-green{color:#087a55;background:#eaf8f2}
.ei-summary-icon.is-blue{color:#245ca6;background:#edf4ff}
.ei-summary-icon.is-purple{color:#6d45a6;background:#f3effb}
.ei-summary-icon.is-orange{color:#b86516;background:#fff3e6}
.ei-status{display:inline-flex;align-items:center;justify-content:center;width:max-content;max-width:100%;padding:.28rem .55rem;border-radius:999px;font-size:var(--font-xs);font-weight:700;white-space:nowrap}
.ei-status.is-success{color:#087a55;background:#eaf8f2}
.ei-status.is-info{color:#225aa5;background:#edf4ff}
.ei-status.is-warning{color:#9a5a13;background:#fff3df}
.ei-status.is-danger{color:#b42318;background:#fff0ee}
.ei-status.is-muted{color:#667085;background:#f0f2f5}
.ei-layout{display:grid;grid-template-columns:280px minmax(0,1fr);gap:1rem;align-items:start}
.ei-sidebar{display:grid;gap:.8rem;position:sticky;top:1rem}
.ei-section-nav,.ei-scope-card{background:#fff;border:1px solid var(--ei-border);border-radius:15px;box-shadow:0 5px 20px rgba(16,42,67,.04)}
.ei-section-nav{overflow:hidden;padding:.55rem}
.ei-section-nav>span{display:block;padding:.65rem .7rem .8rem;color:#475467;font-size:var(--font-sm);font-weight:700}
.ei-section-nav a{display:grid;grid-template-columns:22px 1fr auto;align-items:center;gap:.65rem;padding:.72rem .75rem;border-radius:10px;color:#475467;text-decoration:none;font-size:var(--font-ui)}
.ei-section-nav a>i:first-child{color:#8090a4;text-align:center}
.ei-section-nav a>i:last-child{font-size:.62rem;color:#a0a9b6}
.ei-section-nav a:hover{background:#f6f8fb;color:var(--ei-navy)}
.ei-section-nav a.active{color:#fff;background:linear-gradient(135deg,#173f6b,#245f9d);box-shadow:0 5px 14px rgba(31,94,168,.2)}
.ei-section-nav a.active i{color:#fff}
.ei-scope-card{display:flex;align-items:center;gap:.7rem;padding:.9rem}
.ei-scope-card>i{display:grid;place-items:center;width:36px;height:36px;border-radius:10px;color:var(--ei-green);background:#eaf8f2}
.ei-scope-card div{display:grid;gap:.15rem}
.ei-scope-card strong{font-size:var(--font-ui)}
.ei-scope-card span{color:var(--ei-muted);font-size:var(--font-sm)}
.ei-main{display:grid;gap:1rem;min-width:0}
.ei-entitlement-banner{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:.85rem;padding:1rem 1.1rem;border:1px solid #f2d4ae;border-radius:15px;background:#fff9ef}
.ei-entitlement-banner.is-enabled{border-color:#b7e4d2;background:#f0faf6}
.ei-entitlement-banner>span{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;color:#a25a12;background:#fff1d8}
.ei-entitlement-banner.is-enabled>span{color:#087a55;background:#dcf4e9}
.ei-entitlement-banner strong{font-size:var(--font-base)}
.ei-entitlement-banner p{margin:.25rem 0 0;color:#667085;font-size:var(--font-sm);line-height:1.6}
#ei-general-form{display:grid;gap:1rem}
.ei-card,.ei-readiness-card,.ei-parent-card,.ei-placeholder{background:#fff;border:1px solid var(--ei-border);border-radius:16px;box-shadow:0 6px 22px rgba(16,42,67,.045)}
.ei-card{overflow:hidden}
.ei-card>header{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem 1.15rem;border-bottom:1px solid #edf0f4}
.ei-card>header>div{display:flex;align-items:center;gap:.75rem}
.ei-card h2,.ei-readiness-card h2{margin:0;color:#173b64;font-size:var(--font-md);font-weight:700}
.ei-card header p,.ei-readiness-card p{margin:.22rem 0 0;color:var(--ei-muted);font-size:var(--font-sm)}
.ei-card-icon{display:grid;place-items:center;width:39px;height:39px;border-radius:11px;color:var(--ei-blue);background:#edf4ff}
.ei-card-icon.is-green{color:#087a55;background:#eaf8f2}
.ei-card-icon.is-purple{color:#6d45a6;background:#f3effb}
.ei-card-icon.is-orange{color:#b86516;background:#fff3e6}
.ei-dirty{display:none;align-items:center;gap:.35rem;color:#a15c0f;font-size:var(--font-sm);font-weight:700}
.ei-dirty.is-visible{display:inline-flex}
.ei-dirty i{font-size:.45rem}
.ei-setting-list{display:grid}
.ei-setting-row{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem 1.15rem;border-bottom:1px solid #edf0f4}
.ei-setting-row:last-child{border-bottom:0}
.ei-setting-row>div{min-width:0}
.ei-setting-row strong{display:block;font-size:var(--font-base);color:#243b53}
.ei-setting-row p{margin:.25rem 0 0;color:var(--ei-muted);font-size:var(--font-sm);line-height:1.55}
.ei-setting-row.is-readonly{background:#fbfcfe}
.ei-toggle-row{cursor:pointer}
.ei-toggle-row:has(input:focus-visible){outline:3px solid rgba(31,94,168,.16);outline-offset:-3px}
.ei-switch{position:relative;display:inline-flex;flex:0 0 auto}
.ei-switch input{position:absolute;opacity:0;pointer-events:none}
.ei-switch span{position:relative;width:44px;height:24px;border-radius:999px;background:#cdd4de;transition:.2s}
.ei-switch span:after{content:"";position:absolute;top:3px;right:3px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 1px 4px rgba(16,24,40,.3);transition:.2s}
.ei-switch input:checked+span{background:var(--ei-green)}
.ei-switch input:checked+span:after{transform:translateX(-20px)}
.ei-switch input:disabled+span{opacity:.55}
.ei-two-columns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}
.ei-readiness-card{padding:1.1rem}
.ei-readiness-card>header{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;margin-bottom:.85rem}
.ei-readiness-warning{display:flex;align-items:flex-start;gap:.65rem;padding:.75rem;border-radius:10px;color:#8d4e0a;background:#fff7e8;font-size:var(--font-sm);line-height:1.55}
.ei-readiness-list{display:grid;gap:.45rem;margin:.85rem 0 0;padding:0;list-style:none}
.ei-readiness-list li{display:flex;align-items:center;gap:.5rem;padding:.55rem .65rem;border:1px solid #f1e0d0;border-radius:9px;color:#6b4b2e;background:#fffdfa;font-size:var(--font-sm)}
.ei-readiness-list i{color:#cf6d22}
.ei-readiness-ready{display:flex;align-items:center;gap:.6rem;padding:.8rem;color:#087a55;background:#eaf8f2;border-radius:10px;font-size:var(--font-ui);font-weight:700}
.ei-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem}
.ei-facts div{display:grid;gap:.2rem;padding:.75rem;border:1px solid #edf0f4;border-radius:10px;background:#fbfcfe}
.ei-facts small{color:var(--ei-muted);font-size:var(--font-xs)}
.ei-facts strong{font-size:var(--font-ui);overflow-wrap:anywhere}
.ei-table-wrap{overflow:auto}
.ei-support-table{width:100%;border-collapse:collapse;font-size:var(--font-ui)}
.ei-support-table th,.ei-support-table td{padding:.8rem 1rem;text-align:right;border-bottom:1px solid #edf0f4;vertical-align:middle}
.ei-support-table th{color:#475467;background:#f8fafc;font-size:var(--font-ui)}
.ei-support-table td:first-child strong,.ei-support-table td:first-child small{display:block}
.ei-support-table td:first-child small{margin-top:.2rem;color:var(--ei-muted)}
.ei-support-table code{color:#4b5565;font-size:var(--font-ui)}
.ei-actions{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem 1.15rem;border-top:1px solid var(--ei-border);background:#fbfcfe}
.ei-actions>div{display:flex;gap:.6rem}
.ei-saved-note,.ei-permission-note{display:flex;align-items:center;gap:.4rem;color:var(--ei-muted);font-size:var(--font-xs)}
.ei-saved-note i{color:var(--ei-green)}
.ei-permission-note{color:#9a5a13}
.ei-parent-card{padding:1.2rem}
.ei-parent-card header{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;margin-bottom:1rem}
.ei-parent-card h1,.ei-placeholder h1{margin:.2rem 0 .35rem;color:#153b64;font-size:var(--font-2xl)}
.ei-parent-card p,.ei-placeholder p{margin:0;color:var(--ei-muted)}
.ei-parent-card nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.8rem}
.ei-parent-card nav a{display:flex;align-items:center;gap:.75rem;padding:1rem;border:1px solid var(--ei-border);border-radius:12px;color:#29435f;text-decoration:none;background:#fbfcfe}
.ei-parent-card nav a:hover{border-color:#b8cee5;background:#f2f7fc}
.ei-parent-card nav i{color:var(--ei-blue)}
.ei-parent-card nav a span{display:grid;gap:.2rem}
.ei-parent-card nav a small{color:var(--ei-muted);font-size:var(--font-xs);font-weight:400}
.ei-parent-note{margin-top:1rem;padding:.8rem;border-radius:10px;color:#6b4b2e;background:#fff8ea;font-size:var(--font-xs)}
.ei-placeholder{padding:1.2rem}
.ei-submission-banner{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:1rem;padding:1rem 1.15rem;border:1px solid #badcf8;border-radius:16px;background:linear-gradient(135deg,#eff8ff,#f8fbff);color:#174a75}.ei-submission-banner>i{display:grid;place-items:center;width:46px;height:46px;border-radius:13px;background:#d9edff;font-size:1.25rem}.ei-submission-banner strong{display:block;font-weight:850;letter-spacing:.02em}.ei-submission-banner p{margin:.25rem 0 0;color:#45657d;line-height:1.65}
.ei-submission-summary{display:grid;grid-template-columns:repeat(8,minmax(120px,1fr));gap:.65rem;overflow-x:auto;padding-bottom:.2rem}.ei-submission-summary article{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:.55rem;min-width:145px;padding:.8rem;background:#fff;border:1px solid var(--ei-border);border-radius:14px}.ei-submission-summary article>.ei-status{grid-column:1/-1;justify-self:start}.ei-submission-summary article>div{display:grid;gap:.1rem}.ei-submission-summary article small{color:var(--ei-muted);font-size:var(--font-xs)}.ei-submission-summary article strong{font-size:var(--font-2xl)}.ei-submission-summary .ei-summary-icon{width:38px;height:38px}
.ei-submission-tools{display:flex;gap:.45rem;flex-wrap:wrap}.ei-submission-filters{display:grid;grid-template-columns:repeat(5,minmax(145px,1fr));gap:.65rem}.ei-submission-filters input,.ei-submission-filters select{min-width:0;width:100%;height:42px;padding:.5rem .7rem;border:1px solid #cfd8e4;border-radius:10px;background:#fff;color:#243b53}.ei-submission-filters .btn{min-height:42px}
.ei-submission-table-wrap{width:100%;overflow:auto}.ei-submission-table{width:100%;min-width:850px;border-collapse:collapse}.ei-submission-table th{padding:.7rem;text-align:right;color:#52697f;font-size:var(--font-ui);background:#f6f8fb;border-bottom:1px solid var(--ei-border)}.ei-submission-table td{padding:.8rem .7rem;vertical-align:top;border-bottom:1px solid #edf0f4}.ei-submission-table td>strong,.ei-submission-table td>small{display:block}.ei-submission-table td>small{margin-top:.3rem;color:var(--ei-muted);font-size:var(--font-xs);line-height:1.5}.ei-submission-table .btn-link{display:block;padding:.3rem 0;text-decoration:none}.ei-submission-empty{display:grid;place-items:center;gap:.4rem;min-height:120px;padding:1.25rem;color:#73879c;text-align:center}.ei-submission-empty>i{font-size:1.7rem;color:#a8b8c8}.ei-submission-candidates{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.55rem}.ei-submission-candidates article{display:flex;align-items:center;justify-content:space-between;gap:.7rem;padding:.75rem;border:1px solid #e4eaf0;border-radius:11px}.ei-submission-candidates article>div{display:grid;gap:.2rem;min-width:0}.ei-submission-candidates small{color:var(--ei-muted);overflow-wrap:anywhere}.ei-submission-detail{margin-top:1rem;scroll-margin-top:1rem}.ei-submission-timeline{display:grid;gap:.65rem;margin-top:1rem}.ei-submission-timeline article{display:grid;grid-template-columns:auto minmax(0,1fr);gap:.7rem;padding:.7rem;border-right:2px solid #d9e6f2}.ei-submission-timeline article>i{font-size:.55rem;color:#357bb8;margin-top:.35rem}.ei-submission-timeline article>div{display:grid;gap:.2rem}.ei-submission-timeline small,.ei-submission-timeline p{margin:0;color:var(--ei-muted)}
.ei-placeholder>div{display:grid;grid-template-columns:280px minmax(0,1fr);gap:1rem;margin-top:1rem}
.ei-placeholder main{display:grid;place-items:center;min-height:320px;padding:2rem;text-align:center;border:1px dashed #cfd8e4;border-radius:14px;background:#fbfcfe}
.ei-placeholder main i{font-size:2rem;color:#8aa2bd}
.ei-load-error{display:grid;place-items:center;gap:.65rem;min-height:300px;padding:2rem;text-align:center;background:#fff;border:1px solid var(--ei-border);border-radius:16px}
.ei-load-error>i{font-size:2rem;color:#b42318}

.ei-seller-page #ei-seller-form{display:grid;gap:1rem}
.ei-profile-origin-note{display:flex;align-items:flex-start;gap:.8rem;padding:1rem 1.1rem;border:1px solid #b8d4ee;border-radius:14px;color:#254b73;background:#f1f7fd}
.ei-profile-origin-note>i{margin-top:.15rem;color:#1f5ea8}
.ei-profile-origin-note strong{display:block;font-size:var(--font-sm)}
.ei-profile-origin-note p{margin:.2rem 0 0;color:#57708b;font-size:var(--font-xs);line-height:1.65}
.ei-profile-reference{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.65rem;padding:1rem 1.15rem;border-bottom:1px solid #edf0f4;background:#fbfcfe}
.ei-profile-reference>div{display:grid;gap:.2rem;min-width:0;padding:.7rem;border:1px solid #e7ebf0;border-radius:10px;background:#fff}
.ei-profile-reference small{color:var(--ei-muted);font-size:var(--font-xs)}
.ei-profile-reference strong,.ei-profile-reference bdi{font-size:var(--font-ui);overflow-wrap:anywhere}
.ei-profile-form-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;padding:1.1rem 1.15rem}
.ei-profile-field{display:flex;flex-direction:column;gap:.42rem;min-width:0;margin:0}
.ei-profile-field>span{color:#344054;font-size:var(--font-ui);font-weight:700}
.ei-profile-field>span small{margin-right:.25rem;color:#98a2b3;font-size:var(--font-xs);font-weight:500}
.ei-profile-field input,.ei-profile-field select,.ei-branch-context select{width:100%;min-width:0;height:42px;padding:.55rem .7rem;border:1px solid #d7dee8;border-radius:9px;color:#243b53;background:#fff;font-size:var(--font-ui);outline:0;transition:.18s}
.ei-profile-field input:focus,.ei-profile-field select:focus,.ei-branch-context select:focus{border-color:#5a8fc7;box-shadow:0 0 0 3px rgba(31,94,168,.11)}
.ei-profile-field input:disabled,.ei-profile-field select:disabled{color:#667085;background:#f4f6f8}
.ei-profile-field.has-error input,.ei-profile-field.has-error select{border-color:#d92d20;background:#fffafa}
.ei-profile-field.has-error input:focus,.ei-profile-field.has-error select:focus{box-shadow:0 0 0 3px rgba(217,45,32,.1)}
.ei-required{color:#d92d20}
.ei-field-error{min-height:1em;color:#b42318;font-size:var(--font-ui);font-style:normal;line-height:1.4}
.ei-field-hint{color:#667085;font-size:var(--font-xs);line-height:1.45}
.ei-field-source{display:flex;align-items:center;gap:.3rem;color:#8b96a7;font-size:var(--font-ui);direction:ltr;justify-content:flex-end;overflow-wrap:anywhere}
.ei-profile-field.is-readonly{padding:.65rem;border:1px dashed #d7dee8;border-radius:9px;background:#fafbfc}
.ei-readonly-value{min-height:42px;padding:.65rem .7rem;border-radius:8px;color:#667085;background:#f0f2f5;font-size:var(--font-sm)}
.ei-branch-context{display:grid;gap:1rem;padding:1.05rem 1.15rem}
.ei-branch-context label{display:grid;gap:.4rem;margin:0}
.ei-branch-context label span{color:#344054;font-size:var(--font-sm);font-weight:700}
.ei-branch-context dl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem;margin:0}
.ei-branch-context dl>div{display:grid;gap:.2rem;min-width:0;padding:.7rem;border:1px solid #edf0f4;border-radius:9px;background:#fbfcfe}
.ei-branch-context dt{color:var(--ei-muted);font-size:var(--font-xs);font-weight:500}
.ei-branch-context dd{margin:0;color:#344054;font-size:var(--font-sm);font-weight:700;overflow-wrap:anywhere}
.ei-profile-readiness-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.55rem;margin-bottom:.85rem}
.ei-profile-readiness-list article{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:.65rem;min-width:0;padding:.7rem .75rem;border:1px solid #e4e9f0;border-radius:10px;background:#fbfcfe}
.ei-profile-readiness-list article>i{color:#667085}
.ei-profile-readiness-list article.is-success{border-color:#cce9dd;background:#f5fbf8}.ei-profile-readiness-list article.is-success>i{color:#087a55}
.ei-profile-readiness-list article.is-warning{border-color:#f1ddbd;background:#fffbf4}.ei-profile-readiness-list article.is-warning>i{color:#b86516}
.ei-profile-readiness-list article.is-danger{border-color:#f0c5c0;background:#fff8f7}.ei-profile-readiness-list article.is-danger>i{color:#b42318}
.ei-profile-readiness-list article>div{display:grid;gap:.18rem;min-width:0}
.ei-profile-readiness-list strong{color:#344054;font-size:var(--font-sm);line-height:1.45}
.ei-profile-readiness-list small{color:#7c8797;font-size:var(--font-xs);overflow-wrap:anywhere}

.ei-derived-banner{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:.85rem;padding:1rem 1.1rem;border:1px solid #b8d4ee;border-radius:15px;color:#254b73;background:#f2f7fd}
.ei-derived-banner>span{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;color:#1f5ea8;background:#e2eefb}
.ei-derived-banner>.ei-status{min-width:max-content}
.ei-derived-banner strong{font-size:var(--font-base)}
.ei-derived-banner p{margin:.25rem 0 0;color:#57708b;font-size:var(--font-sm);line-height:1.65}
.ei-document-map-list{display:grid}
.ei-document-map{display:grid;grid-template-columns:minmax(180px,1.25fr) minmax(145px,.9fr) minmax(180px,1fr) minmax(210px,1.3fr) auto;align-items:center;gap:.85rem;min-width:0;padding:.9rem 1.1rem;border-bottom:1px solid #edf0f4}
.ei-document-map:last-child{border-bottom:0}
.ei-document-map>div{display:grid;gap:.25rem;min-width:0}
.ei-document-map small{color:#7a8696;font-size:var(--font-xs)}
.ei-document-map strong{color:#344054;font-size:var(--font-sm);line-height:1.5;overflow-wrap:anywhere}
.ei-document-map p{display:flex;flex-wrap:wrap;gap:.25rem;margin:0}
.ei-document-map p bdi,.ei-document-map-title bdi,.ei-classification-rules bdi,.ei-note-support bdi,.ei-operational-grid bdi{display:inline-flex;width:100%;max-width:100%;padding:.18rem .38rem;border-radius:5px;color:#516173;background:#f0f3f6;font-weight:600;font-size:var(--font-xs);line-height:1.4;font-family:var(--font-family-mono);overflow-wrap:anywhere;word-break:break-word;white-space:normal}
.ei-document-map-title{grid-template-columns:auto minmax(0,1fr)!important;align-items:center}
.ei-document-map-title>span{display:grid;place-items:center;width:34px;height:34px;border-radius:9px;color:#087a55;background:#eaf8f2}
.ei-document-map-state{justify-items:end}
.ei-document-map-state small{display:flex;align-items:center;gap:.25rem}
.ei-classification-rules{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem;padding:1rem 1.1rem}
.ei-classification-rules article{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:start;gap:.7rem;min-width:0;padding:.8rem;border:1px solid #e7ebf0;border-radius:11px;background:#fbfcfe}
.ei-classification-rules article>div{display:grid;gap:.35rem;min-width:0}
.ei-classification-rules strong{color:#344054;font-size:var(--font-sm);line-height:1.65}
.ei-note-support-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}
.ei-note-support{min-width:0;padding:1rem 1.1rem;border:1px solid var(--ei-border);border-radius:15px;background:#fff;box-shadow:0 6px 22px rgba(16,42,67,.045)}
.ei-note-support>header{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:.65rem;margin-bottom:.8rem}
.ei-note-support>header>span:first-child{display:grid;place-items:center;width:38px;height:38px;border-radius:10px;color:#6d45a6;background:#f3effb}
.ei-note-support h3{margin:0;color:#173b64;font-size:var(--font-sm)}
.ei-note-support header p{margin:.18rem 0 0;color:#667085;font-size:var(--font-xs)}
.ei-note-support dl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.55rem;margin:0}
.ei-note-support dl>div{display:grid;gap:.2rem;min-width:0;padding:.65rem;border:1px solid #edf0f4;border-radius:9px;background:#fbfcfe}
.ei-note-support dt{color:#7a8696;font-size:var(--font-xs);font-weight:500}
.ei-note-support dd{margin:0;color:#344054;font-size:var(--font-xs);font-weight:700;line-height:1.5;overflow-wrap:anywhere}
.ei-operational-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem;padding:1rem 1.1rem}
.ei-operational-grid article{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:.65rem;min-width:0;padding:.7rem;border:1px solid #e7ebf0;border-radius:10px;background:#fbfcfe}
.ei-operational-grid article>i{color:#667085}
.ei-operational-grid article>div{display:grid;gap:.22rem;min-width:0}
.ei-operational-grid strong{color:#344054;font-size:var(--font-sm)}
.ei-operational-grid p{margin:0;color:#7a8696;font-size:var(--font-xs);line-height:1.45;overflow-wrap:anywhere}
.ei-return-note{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:.75rem;margin:0 1.1rem 1rem;padding:.8rem;border:1px solid #f0d9b7;border-radius:10px;color:#7a4b16;background:#fff9ef}
.ei-return-note>i{color:#b86516}
.ei-return-note strong{font-size:var(--font-xs)}
.ei-return-note p{margin:.18rem 0 0;font-size:var(--font-xs);line-height:1.55}
.ei-return-note>span{font-size:var(--font-xs);font-weight:700;white-space:nowrap}
.ei-document-readiness{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.55rem;margin-bottom:.85rem}
.ei-document-readiness article{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:.6rem;min-width:0;padding:.7rem;border:1px solid #e4e9f0;border-radius:10px;background:#fbfcfe}
.ei-document-readiness article>i{color:#667085}
.ei-document-readiness article.is-success{border-color:#cce9dd;background:#f5fbf8}.ei-document-readiness article.is-success>i{color:#087a55}
.ei-document-readiness article.is-warning{border-color:#f1ddbd;background:#fffbf4}.ei-document-readiness article.is-warning>i{color:#b86516}
.ei-document-readiness article.is-danger{border-color:#f0c5c0;background:#fff8f7}.ei-document-readiness article.is-danger>i{color:#b42318}
.ei-document-readiness article.is-info{border-color:#c8dff3;background:#f4f9fd}.ei-document-readiness article.is-info>i{color:#1f5ea8}
.ei-document-readiness article>div{display:grid;gap:.2rem;min-width:0}
.ei-document-readiness strong{color:#344054;font-size:var(--font-sm);line-height:1.45}
.ei-document-readiness bdi{color:#7a8696;font-weight:600;font-size:var(--font-xs);line-height:1.4;font-family:var(--font-family-mono);overflow-wrap:anywhere}

.ei-legal-selector{display:flex;align-items:flex-end;justify-content:space-between;gap:1rem;padding:1rem 1.1rem;border:1px solid var(--ei-border);border-radius:15px;background:#fff;box-shadow:0 6px 22px rgba(16,42,67,.045)}
.ei-legal-selector>div{display:grid;gap:.4rem;min-width:0;flex:1}
.ei-legal-selector label{color:#344054;font-size:var(--font-ui);font-weight:700}
.ei-legal-selector select{width:100%;min-width:0;height:43px;padding:.55rem .75rem;border:1px solid #d7dee8;border-radius:9px;color:#243b53;background:#fff;font-size:var(--font-ui)}
.ei-legal-selector small{color:#7a8696;font-size:var(--font-xs);line-height:1.5}
.ei-legal-snapshot-banner{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:.8rem;padding:.9rem 1rem;border:1px solid #f0d7af;border-radius:14px;color:#815018;background:#fff9ef}
.ei-legal-snapshot-banner.is-immutable{border-color:#bdd9ee;color:#24527c;background:#f2f8fd}
.ei-legal-snapshot-banner>i{display:grid;place-items:center;width:40px;height:40px;border-radius:11px;background:rgba(255,255,255,.72)}
.ei-legal-snapshot-banner strong{font-weight:700;font-size:var(--font-sm);line-height:1.4;font-family:var(--font-family-mono)}
.ei-legal-snapshot-banner p{margin:.2rem 0 0;color:#667085;font-size:var(--font-sm);line-height:1.55}
.ei-legal-status-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.65rem;padding:1rem 1.1rem}
.ei-legal-status{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:start;gap:.55rem;min-width:0;padding:.75rem;border:1px solid #e7ebf0;border-radius:10px;background:#fbfcfe}
.ei-legal-status>i{margin-top:.15rem;color:#667085}.ei-legal-status.is-success{border-color:#cce9dd;background:#f5fbf8}.ei-legal-status.is-success>i{color:#087a55}.ei-legal-status.is-danger{border-color:#f0c5c0;background:#fff8f7}.ei-legal-status.is-danger>i{color:#b42318}
.ei-legal-status div{display:grid;gap:.12rem;min-width:0}.ei-legal-status small{color:#7a8696;font-size:var(--font-xs)}.ei-legal-status strong{color:#344054;font-size:var(--font-xs)}.ei-legal-status p{margin:.1rem 0 0;color:#7a8696;font-size:var(--font-xs);line-height:1.45}
.ei-legal-facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.65rem;padding:0 1.1rem 1rem}
.ei-legal-facts>div{display:grid;gap:.25rem;min-width:0;padding:.72rem;border:1px solid #edf0f4;border-radius:9px;background:#fff}
.ei-legal-facts small{color:#7a8696;font-size:var(--font-xs)}.ei-legal-facts strong{color:#344054;font-size:var(--font-sm);overflow-wrap:anywhere}.ei-legal-facts bdi{color:#667085;font-weight:600;font-size:var(--font-xs);line-height:1.45;font-family:var(--font-family-mono);overflow-wrap:anywhere}
.ei-legal-validation{padding:1rem 1.1rem}.ei-legal-validation-pass{display:flex;align-items:center;gap:.7rem;padding:.85rem;border:1px solid #cce9dd;border-radius:10px;color:#087a55;background:#f5fbf8}.ei-legal-validation-pass>div{display:grid;gap:.18rem}.ei-legal-validation-pass strong{font-size:var(--font-sm)}.ei-legal-validation-pass span{color:#52766a;font-size:var(--font-xs)}
.ei-legal-validation-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.55rem}.ei-legal-validation-list article{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:start;gap:.55rem;min-width:0;padding:.72rem;border:1px solid #f0c5c0;border-radius:10px;background:#fff8f7}.ei-legal-validation-list article>i{margin-top:.15rem;color:#b42318}.ei-legal-validation-list article>div{display:grid;gap:.2rem;min-width:0}.ei-legal-validation-list strong{color:#7f2c25;font-size:var(--font-sm);line-height:1.5}.ei-legal-validation-list bdi{color:#9f4037;font-weight:700;font-size:var(--font-xs);line-height:1.4;font-family:var(--font-family-mono);overflow-wrap:anywhere}.ei-legal-validation-list small{color:#936a66;font-size:var(--font-xs);direction:ltr;text-align:right;overflow-wrap:anywhere}
.ei-legal-artifacts{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(300px,.65fr);gap:1rem}.ei-legal-artifacts>.ei-card{min-width:0}.ei-legal-xml,.ei-legal-qr{min-height:300px;padding:1rem}.ei-legal-xml pre{max-width:100%;height:360px;margin:0;padding:1rem;overflow:auto;border:1px solid #d9e0e8;border-radius:10px;color:#cfe8ff;background:#102a43;font-weight:500;font-size:var(--font-sm);line-height:1.65;font-family:var(--font-family-mono);text-align:left;direction:ltr;white-space:pre}.ei-legal-copy{display:flex;align-items:center;justify-content:space-between;gap:.7rem;margin-bottom:.55rem}.ei-legal-copy span{color:#667085;font-size:var(--font-xs)}.ei-legal-copy button{border:0;border-radius:7px;padding:.35rem .55rem;color:#245ca6;background:#edf4ff;font-size:var(--font-ui)}.ei-legal-artifact-empty{display:grid;place-items:center;align-content:center;gap:.6rem;min-height:260px;padding:1rem;border:1px dashed #ccd6e1;border-radius:11px;color:#7a8696;background:#fafbfd;text-align:center;font-size:var(--font-sm)}.ei-legal-artifact-empty i{font-size:2rem;color:#8aa2bd}
.ei-legal-qr{display:grid;place-items:center;align-content:center;gap:.65rem;text-align:center}.ei-legal-qr-image{display:grid;place-items:center;width:min(100%,250px);aspect-ratio:1;padding:.6rem;border:1px solid #e1e7ee;border-radius:13px;background:#fff;box-shadow:0 5px 16px rgba(16,42,67,.08)}.ei-legal-qr-image img{display:block;max-width:100%;height:auto}.ei-legal-qr code{display:block;max-width:100%;max-height:85px;padding:.55rem;overflow:auto;color:#516173;background:#f3f5f8;font-size:var(--font-xs);word-break:break-all}.ei-legal-disclaimer{display:flex;align-items:flex-start;gap:.45rem;margin:0 1rem 1rem;padding:.7rem;border-radius:9px;color:#6d581e;background:#fff9e9;font-size:var(--font-xs);line-height:1.5}
.ei-legal-snapshot-action{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem 1.1rem;border:1px solid #bdd9ee;border-radius:15px;background:#f5faff}.ei-legal-snapshot-action>div{display:flex;align-items:center;gap:.75rem;min-width:0}.ei-legal-snapshot-action>div>i{display:grid;place-items:center;flex:0 0 auto;width:40px;height:40px;border-radius:11px;color:#245ca6;background:#e7f1fb}.ei-legal-snapshot-action strong{display:block;color:#254b73;font-size:var(--font-ui)}.ei-legal-snapshot-action p{margin:.2rem 0 0;color:#667085;font-size:var(--font-ui);line-height:1.5}

.ei-egs-external-banner{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:.85rem;padding:1rem 1.1rem;border:1px solid #bad8ed;border-radius:15px;color:#254b73;background:#f2f8fd}
.ei-egs-external-banner>i{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;color:#245ca6;background:#e2eefb}
.ei-egs-external-banner strong{font-weight:700;font-size:var(--font-sm);line-height:1.4;font-family:var(--font-family-mono)}.ei-egs-external-banner p{margin:.22rem 0 0;color:#57708b;font-size:var(--font-sm);line-height:1.55}
.ei-egs-unit-list{display:grid;gap:.55rem;padding:1rem 1.1rem}.ei-egs-unit-list>button{display:flex;align-items:center;justify-content:space-between;gap:.8rem;width:100%;padding:.8rem;border:1px solid #e1e7ee;border-radius:11px;color:#344054;background:#fbfcfe;text-align:right;transition:.16s}.ei-egs-unit-list>button:hover{border-color:#b8cee5;background:#f5f9fd}.ei-egs-unit-list>button.active{border-color:#7aa6d1;background:#edf5fc;box-shadow:0 0 0 3px rgba(31,94,168,.08)}.ei-egs-unit-list button>span:first-child{display:grid;gap:.2rem;min-width:0}.ei-egs-unit-list strong{font-size:var(--font-sm)}.ei-egs-unit-list small{color:#667085;font-size:var(--font-xs);overflow-wrap:anywhere}
#ei-egs-form .ei-profile-form-grid>label{display:flex;flex-direction:column;gap:.42rem;min-width:0;margin:0}#ei-egs-form .ei-profile-form-grid>label>span{color:#344054;font-size:var(--font-sm);font-weight:700}#ei-egs-form input,#ei-egs-form select,.ei-otp-preview input{width:100%;min-width:0;height:42px;padding:.55rem .7rem;border:1px solid #d7dee8;border-radius:9px;color:#243b53;background:#fff;font-size:var(--font-ui);outline:0}#ei-egs-form input:focus,#ei-egs-form select:focus{border-color:#5a8fc7;box-shadow:0 0 0 3px rgba(31,94,168,.11)}
.ei-form-actions{display:flex;align-items:center;justify-content:flex-end;gap:.6rem;padding:1rem 1.15rem;border-top:1px solid #edf0f4;background:#fbfcfe}
.ei-egs-state-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem}.ei-egs-state{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:.65rem;min-width:0;padding:.8rem;border:1px solid #e2e8f0;border-radius:12px;background:#fff;box-shadow:0 5px 18px rgba(16,42,67,.035)}.ei-egs-state>div{display:grid;gap:.12rem;min-width:0}.ei-egs-state small{color:#7a8696;font-size:var(--font-xs)}.ei-egs-state strong{color:#344054;font-size:var(--font-sm);overflow-wrap:anywhere}.ei-egs-state p{margin:.1rem 0 0;color:#7a8696;font-size:var(--font-xs);line-height:1.4;overflow-wrap:anywhere}
.ei-egs-columns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.ei-egs-columns>.ei-card{min-width:0}.ei-egs-columns .ei-facts{padding:1rem 1.1rem;margin:0}.ei-egs-columns .btn{margin:0 1.1rem 1rem}.ei-egs-blocker{margin:0 1.1rem 1rem;padding:.7rem;border-radius:9px;color:#8a4d12;background:#fff7e8;font-size:var(--font-xs);line-height:1.5}
.ei-otp-preview{display:grid;gap:.45rem;padding:1rem 1.1rem;margin:0}.ei-otp-preview span{color:#344054;font-weight:700;font-size:var(--font-sm);line-height:1.4;font-family:var(--font-family-mono)}.ei-otp-preview input:disabled{letter-spacing:.5rem;color:#667085;background:#f2f4f7}
.ei-egs-readiness-summary,.ei-egs-security-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.65rem;padding:1rem 1.1rem}.ei-egs-readiness-summary>div,.ei-egs-security-grid>div{display:grid;gap:.22rem;min-width:0;padding:.72rem;border:1px solid #e7ebf0;border-radius:9px;background:#fbfcfe}.ei-egs-readiness-summary small,.ei-egs-security-grid small{color:#7a8696;font-size:var(--font-xs)}.ei-egs-readiness-summary strong,.ei-egs-security-grid strong{color:#344054;font-size:var(--font-sm);line-height:1.45;overflow-wrap:anywhere}
.ei-egs-checklist{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem;padding:0 1.1rem 1rem}.ei-egs-checklist>div{display:flex;align-items:center;gap:.5rem;min-width:0;padding:.65rem;border:1px solid #efcfc9;border-radius:9px;color:#8a3830;background:#fff9f8;font-size:var(--font-xs)}.ei-egs-checklist>div.is-info{border-color:#c7dff1;color:#285779;background:#f4f9fd}.ei-egs-checklist>div.is-ready{border-color:#cce9dd;color:#087a55;background:#f5fbf8}.ei-egs-checklist bdi{font-weight:700;font-size:var(--font-xs);line-height:1.4;font-family:var(--font-family-mono);overflow-wrap:anywhere}

/* Legacy three-step company onboarding rules retained only as source history;
   the approved five-step flow below is the sole active visual definition.
.zc-page{--zc-blue:#225fa8;--zc-green:#11805c;--zc-amber:#b86a15;--zc-red:#b42318;max-width:1420px;margin:0 auto;gap:1.2rem}
.zc-head{padding:.35rem .15rem}.zc-head h1{font-size:clamp(1.45rem,2.1vw,2rem)}
.zc-safety{display:inline-flex;align-items:center;gap:.45rem;padding:.55rem .8rem;border:1px solid #cfe1f2;border-radius:999px;color:#285f92;background:#f4f9fe;font-size:.72rem;font-weight:800;white-space:nowrap}
.zc-progress{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;margin:0;padding:1rem 1.2rem;list-style:none;border:1px solid #e2e8f0;border-radius:18px;background:#fff;box-shadow:0 8px 26px rgba(16,42,67,.055)}
.zc-progress li{position:relative;display:flex;align-items:center;gap:.72rem;min-width:0;padding:.2rem 0}.zc-progress li:not(:last-child):after{content:"";position:absolute;left:14px;right:56px;top:23px;height:2px;background:#e4e8ed}
.zc-progress li>span{position:relative;z-index:1;display:grid;place-items:center;flex:0 0 auto;width:42px;height:42px;border:2px solid #d8dee7;border-radius:50%;color:#8b96a6;background:#fff;font-size:.82rem;font-weight:900}.zc-progress li>div{display:grid;gap:.12rem;min-width:0}.zc-progress small{color:#8a94a3;font-size:.62rem}.zc-progress strong{color:#667085;font-size:.82rem}
.zc-progress li.is-done>span{border-color:#bce4d5;color:#087a55;background:#e9f8f2}.zc-progress li.is-done strong{color:#087a55}.zc-progress li.is-done:not(:last-child):after{background:#bce4d5}.zc-progress li.is-current>span{border-color:#79a9d8;color:#fff;background:linear-gradient(135deg,#1b4d82,#2d73b8);box-shadow:0 0 0 5px #edf5fc}.zc-progress li.is-current strong{color:#1d548b}
.zc-main{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:1rem;align-items:start}.zc-company-card,.zc-status-card,.zc-branch-card,.zc-technical{border:1px solid #e2e8f0;border-radius:18px;background:#fff;box-shadow:0 8px 27px rgba(16,42,67,.055)}
.zc-company-card{overflow:hidden}.zc-company-card>header{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:.75rem;padding:1rem 1.1rem;border-bottom:1px solid #edf0f4}.zc-company-card h2,.zc-status-card h2,.zc-branch-card h2{margin:0;color:#173b64;font-size:1rem;font-weight:850}.zc-company-card header p,.zc-branch-card p{margin:.2rem 0 0;color:#6b7789;font-size:.7rem;line-height:1.55}.zc-company-card header a{color:#2463a1;font-size:.7rem;font-weight:800;text-decoration:none}
.zc-card-icon{display:grid;place-items:center;width:41px;height:41px;border-radius:12px}.zc-card-icon.is-blue{color:#245ca6;background:#edf4ff}.zc-card-icon.is-green{color:#087a55;background:#eaf8f2}.zc-company-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.58rem;margin:0;padding:1rem 1.1rem}.zc-company-facts>div{display:grid;gap:.22rem;min-width:0;padding:.7rem .75rem;border:1px solid #edf0f4;border-radius:10px;background:#fbfcfe}.zc-company-facts>div.is-wide{grid-column:1/-1}.zc-company-facts dt{color:#7a8696;font-size:.62rem}.zc-company-facts dd{margin:0;color:#344054;font-size:.73rem;font-weight:800;line-height:1.55;overflow-wrap:anywhere}.zc-profile-result{display:flex;align-items:center;gap:.55rem;margin:0 1.1rem 1rem;padding:.78rem;border-radius:11px;font-size:.7rem;line-height:1.55}.zc-profile-result.is-success{border:1px solid #cce9dd;color:#087a55;background:#f3fbf7}.zc-profile-result.is-warning{border:1px solid #f0d9b7;color:#955511;background:#fff9ef}
.zc-status-card{grid-row:span 2;overflow:hidden}.zc-status-card.is-success{border-color:#bde2d3}.zc-status-card.is-warning{border-color:#ecd7b9}.zc-status-card.is-danger{border-color:#edcac6}.zc-status-visual{display:grid;place-items:center;padding:1.5rem 1.2rem 1.15rem;text-align:center;background:linear-gradient(180deg,#fbfdff,#fff)}.zc-status-visual>span{display:grid;place-items:center;width:70px;height:70px;margin-bottom:.75rem;border-radius:22px;font-size:1.55rem}.zc-status-card.is-success .zc-status-visual>span{color:#087a55;background:#e7f7f0}.zc-status-card.is-warning .zc-status-visual>span{color:#a96114;background:#fff3df}.zc-status-card.is-danger .zc-status-visual>span{color:#b42318;background:#fff0ee}.zc-status-visual small{color:#7a8696;font-size:.68rem}.zc-status-visual h2{margin:.25rem 0;font-size:1.25rem}.zc-status-visual p{max-width:560px;margin:.2rem 0 0;color:#667085;font-size:.74rem;line-height:1.65}.zc-status-issues{display:grid;gap:.45rem;width:min(100%,560px);margin:.8rem 0 0;padding:0;list-style:none;text-align:right}.zc-status-issues li{display:flex;align-items:flex-start;gap:.45rem;padding:.55rem .65rem;border:1px solid #f0d9b7;border-radius:10px;color:#955511;background:#fff9ef;font-size:.69rem;line-height:1.55}.zc-status-issues i{margin-top:.2rem}
.zc-status-summary{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.55rem;padding:0 1.1rem 1rem}.zc-status-summary article{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:start;gap:.6rem;min-width:0;padding:.72rem;border:1px solid #edf0f4;border-radius:11px;background:#fbfcfe}.zc-status-summary article>i{margin-top:.12rem;color:#55708c}.zc-status-summary article>div{display:grid;gap:.12rem;min-width:0}.zc-status-summary small{color:#7a8696;font-size:.6rem}.zc-status-summary strong{color:#344054;font-size:.69rem;line-height:1.45}.zc-status-summary em{color:#8a94a3;font-size:.56rem;font-style:normal}.zc-primary-action{display:grid;justify-items:center;gap:.5rem;padding:1rem 1.1rem;border-top:1px solid #edf0f4;background:#fbfcfe}.zc-primary-action .btn{min-width:min(100%,280px);border-radius:11px;font-size:.8rem;font-weight:850}.zc-primary-action .btn.is-loading{opacity:.7;pointer-events:none}.zc-primary-action small{color:#8a5a1f;font-size:.62rem;text-align:center}
.zc-branch-card{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:.75rem;padding:1rem 1.1rem}.zc-branch-card>strong{padding:.35rem .6rem;border-radius:999px;color:#087a55;background:#eaf8f2;font-size:.7rem;white-space:nowrap}.zc-technical{grid-column:1/-1;overflow:hidden}.zc-technical>summary{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem 1.1rem;cursor:pointer;list-style:none}.zc-technical>summary::-webkit-details-marker{display:none}.zc-technical>summary>span{display:grid;grid-template-columns:auto auto;align-items:center;justify-content:start;gap:.18rem .55rem}.zc-technical>summary>span>i{grid-row:1/3;display:grid;place-items:center;width:38px;height:38px;border-radius:10px;color:#56657a;background:#f1f3f6}.zc-technical>summary b{color:#344054;font-size:.8rem}.zc-technical>summary small{color:#8a94a3;font-size:.61rem}.zc-technical[open]>summary{border-bottom:1px solid #edf0f4}.zc-technical[open]>summary>i{transform:rotate(180deg)}.zc-technical-body{display:grid;gap:1rem;padding:1rem 1.1rem;background:#fbfcfe}
.zc-tech-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.55rem}.zc-tech-grid article{display:grid;gap:.2rem;padding:.68rem;border:1px solid #e4e8ee;border-radius:9px;background:#fff}.zc-tech-grid small{color:#7a8696;font-size:.59rem}.zc-tech-grid strong{color:#344054;font-size:.74rem}.zc-unit-list{display:grid;gap:.55rem}.zc-unit-list>article{display:grid;grid-template-columns:minmax(160px,.7fr) minmax(0,1.3fr);gap:.75rem;padding:.75rem;border:1px solid #e4e8ee;border-radius:10px;background:#fff}.zc-unit-list>article>div{display:grid;align-content:start;gap:.2rem}.zc-unit-list strong{font-size:.72rem;color:#344054}.zc-unit-list small{color:#7a8696;font-size:.61rem}.zc-unit-list dl{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.45rem;margin:0}.zc-unit-list dl>div{display:grid;gap:.15rem;min-width:0}.zc-unit-list dt{color:#7a8696;font-size:.56rem}.zc-unit-list dd{margin:0}.zc-unit-list code{display:block;max-width:100%;padding:.18rem .28rem;color:#516173;background:#f1f3f5;font-size:.54rem;overflow-wrap:anywhere}.zc-tech-empty{margin:0;color:#7a8696;font-size:.7rem}.zc-tech-blockers{padding:.8rem;border:1px solid #efd4cf;border-radius:10px;color:#8c3a32;background:#fff8f7}.zc-tech-blockers h3{margin:0 0 .5rem;font-size:.72rem}.zc-tech-blockers ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.35rem;margin:0;padding:0;list-style:none}.zc-tech-blockers li{display:flex;align-items:flex-start;gap:.4rem;font-size:.6rem;line-height:1.45}.zc-tech-links{display:flex;flex-wrap:wrap;gap:.45rem}.zc-tech-links a{padding:.45rem .62rem;border:1px solid #dce2e9;border-radius:8px;color:#52677e;background:#fff;font-size:.62rem;font-weight:750;text-decoration:none}
.zc-modal[hidden]{display:none}.zc-modal{position:fixed;z-index:1200;inset:0;display:grid;place-items:center;padding:1rem;background:rgba(15,30,48,.54);backdrop-filter:blur(3px)}.zc-modal-card{position:relative;display:grid;justify-items:stretch;width:min(100%,440px);padding:1.35rem;border-radius:18px;background:#fff;box-shadow:0 28px 70px rgba(10,28,45,.25);text-align:center}.zc-modal-close{position:absolute;top:.75rem;left:.75rem;display:grid;place-items:center;width:32px;height:32px;border:0;border-radius:50%;color:#667085;background:#f1f3f5}.zc-modal-icon{display:grid;place-items:center;justify-self:center;width:54px;height:54px;margin-bottom:.65rem;border-radius:15px;color:#245ca6;background:#edf4ff;font-size:1.15rem}.zc-modal-card h2{margin:.2rem 0;color:#173b64;font-size:1rem}.zc-modal-card>p{margin:.25rem 0 1rem;color:#667085;font-size:.72rem}.zc-modal-card form{display:grid;gap:.7rem;text-align:right}.zc-modal-card label{display:grid;gap:.35rem}.zc-modal-card label span{color:#344054;font-size:.7rem;font-weight:800}.zc-modal-card input{width:100%;height:45px;padding:.6rem .75rem;border:1px solid #d4dbe5;border-radius:10px;font-size:1rem;letter-spacing:.2rem;text-align:center;outline:0}.zc-modal-card input:focus{border-color:#5a8fc7;box-shadow:0 0 0 3px rgba(31,94,168,.11)}.zc-modal-card>small{margin-top:.65rem;color:#8a94a3;font-size:.59rem}
.zc-portal-steps{display:grid;gap:.55rem;margin:0 0 1rem;padding:0;list-style:none;text-align:right}.zc-portal-steps li{display:flex;align-items:center;gap:.6rem;padding:.62rem .7rem;border:1px solid #e6ebf1;border-radius:10px;color:#344054;background:#fbfcfe;font-size:.7rem;font-weight:750}.zc-portal-steps li span{display:grid;place-items:center;flex:0 0 auto;width:25px;height:25px;border-radius:50%;color:#245ca6;background:#e9f2ff;font-size:.65rem;font-weight:900}.zc-modal-actions{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:.55rem}.zc-modal-actions .btn{border-radius:10px;font-size:.72rem;font-weight:800}.zc-portal-helper{color:#667085!important}.zc-otp-waiting{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:start;gap:.75rem;width:100%;padding:.2rem;text-align:right}.zc-waiting-icon{display:grid;place-items:center;width:44px;height:44px;border-radius:13px;color:#245ca6;background:#eaf3ff}.zc-waiting-copy{display:grid;gap:.18rem}.zc-waiting-copy h3{margin:0;color:#173b64;font-size:.92rem}.zc-waiting-copy p{margin:0;color:#667085;font-size:.68rem;line-height:1.55}.zc-otp-waiting form{grid-column:1/-1;display:grid;gap:.65rem;width:100%}.zc-otp-waiting label{display:grid;gap:.35rem}.zc-otp-waiting label span{color:#344054;font-size:.7rem;font-weight:850}.zc-otp-waiting input{width:100%;height:46px;padding:.55rem .75rem;border:1px solid #cad4e0;border-radius:11px;background:#fff;font-size:1rem;letter-spacing:.18rem;text-align:center;outline:0}.zc-otp-waiting input:focus{border-color:#5a8fc7;box-shadow:0 0 0 3px rgba(31,94,168,.11)}.zc-otp-waiting input:disabled{color:#667085;background:#f1f4f7}.zc-otp-actions{display:grid;grid-template-columns:1.1fr 1fr auto;gap:.5rem}.zc-primary-action .zc-otp-actions .btn{width:100%;min-width:0;font-size:.7rem}.zc-otp-error{display:flex;align-items:flex-start;gap:.45rem;padding:.65rem .7rem;border:1px solid #f0c5c0;border-radius:9px;color:#9c3028;background:#fff7f6;font-size:.66rem;line-height:1.5}.zc-portal-fallback{display:flex;align-items:center;justify-content:center;gap:.4rem;padding:.6rem;border:1px dashed #8fb5dc;border-radius:9px;color:#245ca6;background:#f4f9ff;font-size:.67rem;font-weight:800;text-decoration:none}.zc-otp-waiting form>small{display:flex;align-items:center;justify-content:center;gap:.35rem;color:#7a8696;font-size:.59rem;line-height:1.45;text-align:center}

*/
@media(max-width:1600px){.ei-legal-page .ei-summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:1500px){.ei-document-map{grid-template-columns:minmax(165px,1.2fr) minmax(135px,.9fr) minmax(165px,1fr)}.ei-document-map>div:nth-child(4){grid-column:1/3}.ei-document-map-state{grid-column:3;grid-row:2}.ei-derived-banner{grid-template-columns:auto minmax(0,1fr)}.ei-derived-banner>.ei-status{grid-column:2;min-width:0;width:max-content;white-space:normal}}
@media(max-width:1200px){.ei-summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.ei-parent-card nav{grid-template-columns:repeat(2,minmax(0,1fr))}.ei-profile-form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.ei-legal-status-grid,.ei-legal-facts{grid-template-columns:repeat(2,minmax(0,1fr))}.ei-submission-filters{grid-template-columns:repeat(3,minmax(140px,1fr))}}
@media(max-width:1050px){.zc-main{grid-template-columns:1fr}.zc-status-card{grid-row:auto}.zc-technical{grid-column:auto}.zc-tech-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:1100px){.ei-layout,.ei-placeholder>div{grid-template-columns:1fr}.ei-sidebar{position:static}.ei-section-nav{display:flex;flex-wrap:wrap;gap:.3rem;overflow:visible}.ei-section-nav>span{display:none}.ei-section-nav a{grid-template-columns:auto auto;white-space:normal}.ei-section-nav a>i:last-child{display:none}.ei-scope-card{display:none}}
@media(max-width:980px){.ei-layout,.ei-placeholder>div{grid-template-columns:1fr}.ei-sidebar{position:static}.ei-section-nav{display:flex;flex-wrap:wrap;gap:.3rem;overflow:visible}.ei-section-nav>span{display:none}.ei-section-nav a{grid-template-columns:auto auto;white-space:normal}.ei-section-nav a>i:last-child{display:none}.ei-scope-card{display:none}.ei-two-columns,.ei-legal-artifacts,.ei-egs-columns{grid-template-columns:1fr}.ei-egs-readiness-summary,.ei-egs-security-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:720px){.ei-page-head,.ei-card>header,.ei-actions,.ei-readiness-card>header,.ei-parent-card header,.ei-legal-selector,.ei-legal-snapshot-action{align-items:stretch;flex-direction:column}.ei-summary-grid,.ei-parent-card nav,.ei-profile-reference,.ei-profile-form-grid,.ei-profile-readiness-list,.ei-classification-rules,.ei-note-support-grid,.ei-operational-grid,.ei-document-readiness,.ei-legal-status-grid,.ei-legal-facts,.ei-legal-validation-list,.ei-egs-state-grid,.ei-egs-readiness-summary,.ei-egs-security-grid,.ei-egs-checklist{grid-template-columns:1fr}.ei-summary-grid article{min-height:auto}.ei-entitlement-banner,.ei-derived-banner,.ei-egs-external-banner,.ei-submission-banner{grid-template-columns:auto 1fr}.ei-entitlement-banner>.ei-status,.ei-derived-banner>.ei-status,.ei-egs-external-banner>.ei-status,.ei-submission-banner>.ei-status{grid-column:1/-1}.ei-setting-row{align-items:flex-start}.ei-actions>div{width:100%;display:grid;grid-template-columns:1fr 1fr}.ei-actions .btn,.ei-legal-selector .btn,.ei-legal-snapshot-action .btn{width:100%}.ei-facts,.ei-branch-context dl,.ei-note-support dl{grid-template-columns:1fr}.ei-support-table{min-width:650px}.ei-page-head h1{font-size:var(--font-2xl)}.ei-profile-readiness-list article,.ei-document-readiness article{grid-template-columns:auto minmax(0,1fr)}.ei-profile-readiness-list article>.ei-status,.ei-document-readiness article>.ei-status{grid-column:2}.ei-document-map{grid-template-columns:1fr;align-items:start}.ei-document-map>div:nth-child(4),.ei-document-map-state{grid-column:auto;grid-row:auto}.ei-document-map-state{justify-items:start}.ei-return-note{grid-template-columns:auto minmax(0,1fr)}.ei-return-note>span{grid-column:2}.ei-legal-xml pre{height:300px}.ei-legal-qr-image{width:min(100%,220px)}.ei-egs-state{grid-template-columns:auto minmax(0,1fr)}.ei-egs-state>.ei-status{grid-column:2}.ei-form-actions{display:grid;grid-template-columns:1fr 1fr}.ei-form-actions .btn{width:100%}.ei-submission-filters,.ei-submission-candidates{grid-template-columns:1fr}.ei-submission-tools{display:grid}.ei-submission-tools .btn{width:100%}}
@media(max-width:720px){.zc-head{gap:.75rem}.zc-safety{width:max-content;max-width:100%;white-space:normal}.zc-progress{padding:.85rem .75rem}.zc-progress li{display:grid;justify-items:center;text-align:center;gap:.4rem}.zc-progress li:not(:last-child):after{left:calc(-50% + 25px);right:calc(50% + 25px);top:22px}.zc-progress li>div{justify-items:center}.zc-progress small{display:none}.zc-progress strong{font-size:var(--font-xs)}.zc-company-card>header{grid-template-columns:auto minmax(0,1fr)}.zc-company-card header a{grid-column:2}.zc-company-facts,.zc-status-summary,.zc-tech-grid,.zc-unit-list dl,.zc-tech-blockers ul{grid-template-columns:1fr}.zc-company-facts>div.is-wide{grid-column:auto}.zc-branch-card{grid-template-columns:auto minmax(0,1fr)}.zc-branch-card>strong{grid-column:2;width:max-content}.zc-unit-list>article{grid-template-columns:1fr}.zc-primary-action .btn{width:100%;min-width:0}.zc-otp-actions,.zc-modal-actions{grid-template-columns:1fr}.zc-otp-waiting{grid-template-columns:1fr;justify-items:center;text-align:center}.zc-otp-waiting form{grid-column:auto;width:100%;text-align:right}.zc-waiting-copy{text-align:center}.zc-modal-card{max-height:calc(100dvh - 2rem);overflow:auto;padding:1.1rem}.zc-portal-steps li{font-size:var(--font-xs)}}
@media(min-width:721px) and (max-width:820px){.ei-legal-page .ei-summary-grid{grid-template-columns:1fr}}

/* Electronic Invoice Settings onboarding — scoped to the internal ZATCA page. */
.zc-page {
    /* ACCMAN aliases and approved page-only semantic colors. */
    --zc-primary: var(--brand, var(--primary, #2463eb));
    --zc-primary-hover: var(--brand-dark, var(--primary-hover, #1748bd));
    --zc-primary-soft: var(--primary-light, #eff6ff);
    --zc-card: var(--bg-surface, #ffffff);
    --zc-card-soft: var(--surface-soft, #f8fafc);
    --zc-heading: var(--ink-strong, var(--text-main, #10213f));
    --zc-text: var(--ink, var(--text-main, #253858));
    --zc-muted: var(--muted, var(--text-muted, #6b7b93));
    --zc-border: var(--line, var(--border-color, #e7ecf3));
    --zc-border-strong: #dce4ef;
    --zc-white: #ffffff;
    --zc-success: #087a55;
    --zc-success-soft: #eaf8f2;
    --zc-success-border: #b8e2d2;
    --zc-warning: #8d551a;
    --zc-warning-soft: #fff9ef;
    --zc-warning-border: #efd7b5;
    --zc-danger: #b42318;
    --zc-danger-soft: #fff1ef;
    --zc-danger-border: #efc3bd;
    --zc-neutral-soft: #eff3f7;
    --zc-pending: #8792a2;
    --zc-primary-border: #4d86e8;
    --zc-progress-line: #e1e7ef;
    --zc-overlay: rgba(15, 30, 48, .54);
    --zc-focus-ring: rgba(36, 99, 235, .1);
    --zc-progress-shadow: 0 7px 22px rgba(16, 42, 67, .05);
    --zc-card-shadow: 0 10px 30px rgba(16, 42, 67, .055);
    --zc-primary-shadow: 0 6px 14px rgba(36, 99, 235, .2);
    --zc-modal-shadow: 0 28px 70px rgba(10, 28, 45, .25);
    display: grid;
    gap: 1.2rem;
    max-width: 1420px;
    margin: 0 auto;
    color: var(--zc-text);
}

.zc-page .btn-primary {
    border-color: var(--zc-primary);
    color: var(--zc-white);
    background: var(--zc-primary);
    box-shadow: var(--zc-primary-shadow);
}
.zc-page .btn-primary:hover,
.zc-page .btn-primary:focus {
    border-color: var(--zc-primary-hover);
    color: var(--zc-white);
    background: var(--zc-primary-hover);
}
.zc-page .btn-outline-primary {
    border-color: var(--zc-primary);
    color: var(--zc-primary);
    background: var(--zc-card);
}
.zc-page .btn-outline-primary:hover,
.zc-page .btn-outline-primary:focus {
    border-color: var(--zc-primary);
    color: var(--zc-white);
    background: var(--zc-primary);
}

.zc-head { padding: .2rem 0; }
.zc-head h1 { margin-top: .45rem; color: var(--zc-heading); font-size: var(--font-2xl); }
.zc-head p { max-width: none !important; margin-top: .35rem !important; color: var(--zc-muted) !important; font-size: var(--font-ui) !important; }

.zc-stepper-shell { max-width: 100%; overflow-x: auto; overscroll-behavior-inline: contain; padding: 3px 3px 8px; scrollbar-width: thin; }
.zc-progress { display: grid; grid-template-columns: repeat(5, minmax(142px, 1fr)); min-width: 760px; margin: 0; padding: 1rem 1.2rem; border: 1px solid var(--zc-border-strong); border-radius: 16px; background: var(--zc-card); box-shadow: var(--zc-progress-shadow); list-style: none; }
.zc-progress li { position: relative; display: flex; align-items: center; gap: .65rem; min-width: 0; padding: .2rem .15rem; }
.zc-progress li:not(:last-child)::after { content: ""; position: absolute; z-index: 0; inset-inline-start: 43px; inset-inline-end: -16px; top: 22px; height: 2px; background: var(--zc-progress-line); }
.zc-progress li > span { position: relative; z-index: 1; display: grid; place-items: center; flex: 0 0 auto; width: 40px; height: 40px; border: 2px solid var(--zc-border-strong); border-radius: 50%; color: var(--zc-pending); background: var(--zc-card); font-size: var(--font-ui); font-weight: 700; }
.zc-progress li > div { display: grid; gap: .08rem; min-width: 0; }
.zc-progress small { color: var(--zc-muted); font-size: var(--font-xs); }
.zc-progress strong { color: var(--zc-muted); font-size: var(--font-sm); line-height: 1.35; }
.zc-progress li.is-done > span { border-color: var(--zc-success-border); color: var(--zc-success); background: var(--zc-success-soft); }
.zc-progress li.is-done strong { color: var(--zc-success); }
.zc-progress li.is-done:not(:last-child)::after { background: var(--zc-success-border); }
.zc-progress li.is-current > span,
.zc-progress li.is-final > span { border-color: var(--zc-primary); color: var(--zc-white); background: var(--zc-primary); box-shadow: 0 0 0 5px var(--zc-primary-soft); }
.zc-progress li.is-current strong,
.zc-progress li.is-final strong { color: var(--zc-primary-hover); }
.zc-progress li.is-error > span { border-color: var(--zc-danger-border); color: var(--zc-danger); background: var(--zc-danger-soft); }
.zc-progress li.is-error strong { color: var(--zc-danger); }

.zc-main { display: block; width: 100%; }
.zc-flow-card,
.zc-state-card { width: min(100%, 1040px); margin: 0 auto; border: 1px solid var(--zc-border); border-radius: 17px; background: var(--zc-card); box-shadow: var(--zc-card-shadow); overflow: hidden; }
.zc-state-card { display: grid; justify-items: center; gap: .45rem; padding: 2.4rem 1.5rem; text-align: center; }
.zc-state-card > small { color: var(--zc-muted); font-size: var(--font-xs); font-weight: 700; }
.zc-state-card h2 { margin: 0; color: var(--zc-heading); font-size: var(--font-2xl); font-weight: 700; }
.zc-state-card > p { max-width: 660px; margin: .1rem 0; color: var(--zc-muted); font-size: var(--font-ui); line-height: 1.7; }
.zc-state-icon { display: grid; place-items: center; width: 72px; height: 72px; margin-bottom: .35rem; border-radius: 22px; font-size: 1.55rem; }
.zc-state-icon.is-muted { color: var(--zc-muted); background: var(--zc-neutral-soft); }
.zc-state-icon.is-blue { color: var(--zc-primary); background: var(--zc-primary-soft); }
.zc-state-icon.is-success { color: var(--zc-success); background: var(--zc-success-soft); }
.zc-start-card > .btn { min-width: min(100%, 440px); margin-top: .75rem; border-radius: 11px; font-size: var(--font-ui); font-weight: 850; }

.zc-issue-list { display: grid; gap: .45rem; width: min(100%, 680px); margin: .55rem 0 0; padding: 0; list-style: none; text-align: start; }
.zc-issue-list li { display: flex; align-items: flex-start; gap: .5rem; padding: .6rem .7rem; border: 1px solid var(--zc-warning-border); border-radius: 9px; color: var(--zc-warning); background: var(--zc-warning-soft); font-size: var(--font-sm); line-height: 1.55; }
.zc-issue-list i { margin-top: .16rem; }

.zc-flow-card-head { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: .8rem; padding: 1.1rem 1.2rem; border-bottom: 1px solid var(--zc-border); background: var(--zc-card-soft); }
.zc-flow-card-head > div { min-width: 0; }
.zc-flow-card-head small { color: var(--zc-primary); font-size: var(--font-xs); font-weight: 850; }
.zc-flow-card-head h2 { margin: .12rem 0 0; color: var(--zc-heading); font-size: var(--font-lg); font-weight: 700; }
.zc-flow-card-head p { margin: .25rem 0 0; color: var(--zc-muted); font-size: var(--font-sm); line-height: 1.6; }
.zc-flow-card-head > a { display: inline-flex; align-items: center; gap: .4rem; color: var(--zc-primary); font-size: var(--font-sm); font-weight: 700; text-decoration: none; white-space: nowrap; }
.zc-card-icon { display: grid; place-items: center; width: 43px; height: 43px; border-radius: 12px; }
.zc-card-icon.is-blue { color: var(--zc-primary); background: var(--zc-primary-soft); }

.zc-company-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .6rem; margin: 0; padding: 1.05rem 1.2rem; }
.zc-company-facts > div { display: grid; gap: .24rem; min-width: 0; padding: .72rem .8rem; border: 1px solid var(--zc-border); border-radius: 10px; background: var(--zc-card-soft); }
.zc-company-facts > div.is-wide { grid-column: span 2; }
.zc-company-facts dt { color: var(--zc-muted); font-size: var(--font-xs); }
.zc-company-facts dd { margin: 0; color: var(--zc-text); font-size: var(--font-sm); font-weight: 700; line-height: 1.5; overflow-wrap: anywhere; }

.zc-profile-result { display: flex; align-items: flex-start; gap: .6rem; margin: 0 1.2rem 1rem; padding: .82rem; border-radius: 11px; font-size: var(--font-sm); line-height: 1.55; }
.zc-profile-result > i { margin-top: .15rem; }
.zc-profile-result > div { display: grid; gap: .25rem; }
.zc-profile-result strong { font-size: var(--font-sm); }
.zc-profile-result ul { display: grid; gap: .2rem; margin: .2rem 0 0; padding-inline-start: 1.1rem; }
.zc-profile-result p { margin: .2rem 0 0; }
.zc-profile-result.is-success { border: 1px solid var(--zc-success-border); color: var(--zc-success); background: var(--zc-success-soft); }
.zc-profile-result.is-warning { border: 1px solid var(--zc-warning-border); color: var(--zc-warning); background: var(--zc-warning-soft); }

.zc-flow-actions { display: flex; align-items: center; justify-content: flex-start; gap: .6rem; padding: 1rem 1.2rem; border-top: 1px solid var(--zc-border); background: var(--zc-card-soft); }
.zc-flow-actions.is-single { justify-content: center; }
.zc-flow-actions .btn { min-width: 128px; border-radius: 10px; font-size: var(--font-ui); font-weight: 850; }
.zc-flow-actions .btn-primary { min-width: 150px; }
.zc-inline-error,
.zc-inline-warning { display: flex; align-items: flex-start; gap: .55rem; margin: .9rem 1.2rem 0; padding: .75rem .8rem; border-radius: 10px; font-size: var(--font-sm); line-height: 1.55; }
.zc-inline-error { border: 1px solid var(--zc-danger-border); color: var(--zc-danger); background: var(--zc-danger-soft); }
.zc-inline-warning { border: 1px solid var(--zc-warning-border); color: var(--zc-warning); background: var(--zc-warning-soft); }
.zc-inline-error i,
.zc-inline-warning i { margin-top: .18rem; }

.zc-otp-card > form { display: grid; gap: .85rem; width: min(100%, 680px); margin: 0 auto; padding: 1.25rem; }
.zc-portal-button { justify-self: start; border-radius: 10px; font-size: var(--font-ui); font-weight: 700; }
.zc-otp-field { display: grid; gap: .4rem; }
.zc-otp-field > span { color: var(--zc-text); font-size: var(--font-ui); font-weight: 850; }
.zc-otp-field > input { width: 100%; height: 58px; padding: .65rem 1rem; border: 1px solid var(--zc-border-strong); border-radius: 12px; color: var(--zc-heading); background: var(--zc-card); font-weight:700;font-size:var(--font-xl);line-height:1;font-family:var(--font-family-mono); letter-spacing: .42rem; text-align: center; direction: ltr; outline: 0; }
.zc-otp-field > input:focus { border-color: var(--zc-primary-border); box-shadow: 0 0 0 4px var(--zc-focus-ring); }
.zc-otp-field > input:disabled { color: var(--zc-pending); background: var(--zc-neutral-soft); }
.zc-otp-field > small,
.zc-security-note { color: var(--zc-muted); }
.zc-otp-field > small { font-size: var(--font-xs); }
.zc-confirmation { display: flex; align-items: flex-start; gap: .5rem; color: var(--zc-text); font-size: var(--font-sm); line-height: 1.55; }
.zc-confirmation input { flex: 0 0 auto; margin-top: .18rem; accent-color: var(--zc-primary); }
.zc-security-note { display: flex; align-items: flex-start; gap: .4rem; font-size: var(--font-xs); line-height: 1.55; }
.zc-otp-card .zc-flow-actions { margin: 0 -1.25rem -1.25rem; padding: 1rem 1.25rem; }
.zc-otp-card .zc-inline-error,
.zc-otp-card .zc-inline-warning { margin: 0; }
.zc-portal-fallback { display: flex; align-items: center; justify-content: center; gap: .4rem; margin: 0 1.2rem 1rem; padding: .65rem; border: 1px dashed var(--zc-primary-border); border-radius: 9px; color: var(--zc-primary); background: var(--zc-primary-soft); font-size: var(--font-xs); font-weight: 700; text-decoration: none; }

.zc-verification-card { padding-bottom: 0; }
.zc-verification-list { display: grid; gap: .55rem; margin: 0; padding: 1.1rem 1.2rem; list-style: none; }
.zc-verification-list li { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: start; gap: .7rem; padding: .8rem; border: 1px solid var(--zc-border); border-radius: 11px; background: var(--zc-card-soft); }
.zc-verification-list li > span { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; color: var(--zc-pending); background: var(--zc-neutral-soft); font-size: var(--font-xs); }
.zc-verification-list li > div { display: grid; gap: .16rem; }
.zc-verification-list strong { color: var(--zc-text); font-size: var(--font-sm); }
.zc-verification-list small { color: var(--zc-muted); font-size: var(--font-xs); line-height: 1.5; }
.zc-verification-list li.is-done > span { color: var(--zc-success); background: var(--zc-success-soft); }
.zc-verification-list li.is-current > span { color: var(--zc-primary); background: var(--zc-primary-soft); }
.zc-verification-list li.is-review > span { color: var(--zc-warning); background: var(--zc-warning-soft); }
.zc-verification-list li.is-error > span { color: var(--zc-danger); background: var(--zc-danger-soft); }

.zc-connection-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6rem; width: min(100%, 760px); margin: 1rem 0 0; padding: 0; }
.zc-connection-facts > div { display: grid; gap: .2rem; min-width: 0; padding: .75rem; border: 1px solid var(--zc-border); border-radius: 10px; background: var(--zc-card-soft); text-align: start; }
.zc-connection-facts > div.is-wide { grid-column: 1/-1; }
.zc-connection-facts dt { color: var(--zc-muted); font-size: var(--font-xs); }
.zc-connection-facts dd { margin: 0; color: var(--zc-text); font-size: var(--font-sm); font-weight: 700; overflow-wrap: anywhere; }
.zc-environment { justify-self: start; padding: .25rem .55rem; border-radius: 999px; }
.zc-environment.is-sandbox { color: var(--zc-primary); background: var(--zc-primary-soft); }
.zc-environment.is-production { color: var(--zc-success); background: var(--zc-success-soft); }
.zc-complete-card .zc-flow-actions { width: min(100%, 760px); margin: 1rem 0 -2.4rem; padding: 1rem 0; background: transparent; }

.zc-modal[hidden] { display: none; }
.zc-modal { position: fixed; z-index: 1200; inset: 0; display: grid; place-items: center; padding: 1rem; background: var(--zc-overlay); backdrop-filter: blur(3px); }
.zc-modal-card { position: relative; display: grid; justify-items: stretch; width: min(100%, 440px); padding: 1.35rem; border: 1px solid var(--zc-border); border-radius: 18px; background: var(--zc-card); box-shadow: var(--zc-modal-shadow); text-align: center; }
.zc-modal-close { position: absolute; top: .75rem; left: .75rem; display: grid; place-items: center; width: 32px; height: 32px; border: 0; border-radius: 50%; color: var(--zc-muted); background: var(--zc-neutral-soft); }
.zc-modal-icon { display: grid; place-items: center; justify-self: center; width: 54px; height: 54px; margin-bottom: .65rem; border-radius: 15px; color: var(--zc-primary); background: var(--zc-primary-soft); font-size: 1.15rem; }
.zc-modal-card h2 { margin: .2rem 0; color: var(--zc-heading); font-size: var(--font-md); }
.zc-modal-card > p { margin: .25rem 0 1rem; color: var(--zc-muted); font-size: var(--font-sm); }
.zc-modal-card > small { margin-top: .65rem; color: var(--zc-muted); font-size: var(--font-xs); }
.zc-portal-steps { display: grid; gap: .55rem; margin: 0 0 1rem; padding: 0; list-style: none; text-align: right; }
.zc-portal-steps li { display: flex; align-items: center; gap: .6rem; padding: .62rem .7rem; border: 1px solid var(--zc-border); border-radius: 10px; color: var(--zc-text); background: var(--zc-card-soft); font-size: var(--font-sm); font-weight: 750; }
.zc-portal-steps li span { display: grid; place-items: center; flex: 0 0 auto; width: 25px; height: 25px; border-radius: 50%; color: var(--zc-primary); background: var(--zc-primary-soft); font-size: var(--font-xs); font-weight: 700; }
.zc-modal-actions { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: .55rem; }
.zc-modal-actions .btn { border-radius: 10px; font-size: var(--font-ui); font-weight: 700; }

@media (max-width: 900px) {
    .zc-company-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .zc-company-facts > div.is-wide { grid-column: 1/-1; }
    .zc-flow-card-head { grid-template-columns: auto minmax(0, 1fr); }
    .zc-flow-card-head > a { grid-column: 2; justify-self: start; }
    .zc-stepper-shell { margin-inline: -.2rem; }
}
@media (max-width: 640px) {
    .zc-page { gap: .9rem; }
    .zc-head h1 { font-size: var(--font-2xl); }
    .zc-head p { font-size: var(--font-sm) !important; }
    .zc-progress { min-width: 680px; padding: .85rem; }
    .zc-progress li { gap: .45rem; }
    .zc-progress li > span { width: 36px; height: 36px; }
    .zc-progress li:not(:last-child)::after { inset-inline-start: 39px; top: 20px; }
    .zc-progress strong { font-size: var(--font-xs); }
    .zc-progress small { display: none; }
    .zc-flow-card-head { align-items: start; padding: 1rem; }
    .zc-flow-card-head > a { grid-column: 1/-1; }
    .zc-company-facts,
    .zc-connection-facts { grid-template-columns: 1fr; padding: 1rem; }
    .zc-company-facts > div.is-wide,
    .zc-connection-facts > div.is-wide { grid-column: auto; }
    .zc-profile-result,
    .zc-inline-error,
    .zc-inline-warning { margin-inline: 1rem; }
    .zc-flow-actions { display: grid; grid-template-columns: 1fr 1fr; padding: 1rem; }
    .zc-flow-actions .btn { width: 100%; min-width: 0; }
    .zc-state-card { padding: 1.7rem 1rem; }
    .zc-start-card > .btn { white-space: normal; }
    .zc-otp-card > form { padding: 1rem; }
    .zc-otp-card .zc-flow-actions { margin: 0 -1rem -1rem; padding: 1rem; }
    .zc-otp-field > input { font-size: var(--font-lg); letter-spacing: .25rem; }
    .zc-verification-list { padding: 1rem; }
    .zc-complete-card .zc-flow-actions { margin-bottom: -1.7rem; }
    .zc-modal-card { max-height: calc(100dvh - 2rem); overflow: auto; padding: 1.1rem; }
    .zc-modal-actions { grid-template-columns: 1fr; }
}

/* zatca_connection_reference.css */
/* Approved ZATCA connection UI. Scoped to /sales/settings/e-invoicing. */
.zcr-page {
    --zcr-primary: var(--primary, #2563eb);
    --zcr-primary-hover: var(--primary-hover, #1d4ed8);
    --zcr-primary-soft: var(--primary-light, #eff6ff);
    --zcr-primary-border: #bfdbfe;
    --zcr-production: #059669;
    --zcr-production-hover: #047857;
    --zcr-production-soft: #f0fdf8;
    --zcr-production-border: #c7eedf;
    --zcr-danger: #dc2626;
    --zcr-danger-soft: #fff1f2;
    --zcr-danger-border: #fecdd3;
    --zcr-surface: var(--bg-surface, #ffffff);
    --zcr-surface-soft: var(--bg-app, #f8fafc);
    --zcr-heading: var(--text-main, #1e293b);
    --zcr-text: var(--text-main, #334155);
    --zcr-muted: var(--text-muted, #64748b);
    --zcr-line: var(--border-color, #e2e8f0);
    --zcr-shadow: 0 8px 24px rgba(15, 23, 42, .055);
    display: grid;
    gap: 14px;
    width: 100%;
    max-width: 1440px;
    margin: 0 auto;
    color: var(--zcr-text);
    direction: rtl;
}

.zcr-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    padding: 0 4px 4px;
}

.zcr-title-block { min-width: 0; }
.zcr-title-block h1 {
    margin: 8px 0 3px;
    color: var(--zcr-heading);
    font-size: var(--font-2xl);
    font-weight: 700;
}
.zcr-title-block p {
    margin: 0;
    color: var(--zcr-muted);
    font-size: var(--font-sm);
    line-height: 1.65;
}

.zcr-authority {
    display: flex;
    align-items: center;
    gap: 9px;
    flex: 0 0 auto;
    margin-top: 25px;
}
.zcr-authority-mark {
    display: grid;
    place-items: center;
    width: 43px;
    height: 43px;
    border-radius: 13px;
    color: var(--zcr-production);
    background: var(--zcr-production-soft);
    font-size: var(--font-xl);
}
.zcr-authority-copy { display: grid; gap: 1px; }
.zcr-authority-copy strong { color: var(--zcr-heading); font-size: var(--font-xs); font-weight: 700; white-space: nowrap; }
.zcr-authority-copy small { color: var(--zcr-muted); font-size: var(--font-xs); direction: ltr; white-space: nowrap; }

.zcr-info-banner {
    display: flex;
    align-items: center;
    gap: 9px;
    min-height: 43px;
    padding: 9px 12px;
    border: 1px solid var(--zcr-primary-border);
    border-radius: 8px;
    color: var(--zcr-primary-hover);
    background: var(--zcr-primary-soft);
    font-size: var(--font-sm);
    line-height: 1.7;
}
.zcr-info-banner > i { flex: 0 0 auto; color: var(--zcr-primary); font-size: .95rem; }

.zcr-environment-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    align-items: stretch;
}

.zcr-environment-card {
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 282px;
    padding: 18px;
    border: 1px solid var(--zcr-line);
    border-radius: 12px;
    background: var(--zcr-surface);
    box-shadow: var(--zcr-shadow);
}
.zcr-environment-card.is-production { border-color: var(--zcr-production-border); background: var(--zcr-production-soft); }
.zcr-environment-card.is-sandbox { border-color: var(--zcr-primary-border); background: var(--zcr-surface); }

.zcr-environment-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    min-height: 88px;
}
.zcr-environment-heading { display: flex; align-items: flex-start; gap: 11px; min-width: 0; }
.zcr-environment-icon {
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    width: 36px;
    height: 36px;
    border-radius: 10px;
    font-size: 1rem;
}
.is-production .zcr-environment-icon { color: var(--zcr-production); background: var(--zcr-surface); }
.is-sandbox .zcr-environment-icon { color: var(--zcr-primary); background: var(--zcr-primary-soft); }
.zcr-environment-heading h2 { margin: 2px 0 7px; color: var(--zcr-heading); font-size: var(--font-md); font-weight: 700; }
.zcr-environment-heading p { max-width: 430px; margin: 0; color: var(--zcr-muted); font-size: var(--font-sm); line-height: 1.75; }
.zcr-env-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex: 0 0 auto;
    padding: 6px 10px;
    border: 1px solid;
    border-radius: 8px;
    font-size: var(--font-xs);
    font-weight: 700;
    white-space: nowrap;
}
.is-production .zcr-env-badge { border-color: var(--zcr-production-border); color: var(--zcr-production); background: var(--zcr-surface); }
.is-sandbox .zcr-env-badge { border-color: var(--zcr-primary-border); color: var(--zcr-primary); background: var(--zcr-primary-soft); }

.zcr-status-strip {
    display: flex;
    align-items: center;
    min-height: 73px;
    margin: 10px 0 17px;
    padding: 12px 14px;
    border: 1px solid;
    border-radius: 9px;
}
.zcr-status-strip.is-danger { border-color: var(--zcr-danger-border); color: var(--zcr-danger); background: var(--zcr-danger-soft); }
.zcr-status-strip.is-success { border-color: var(--zcr-production-border); color: var(--zcr-production); background: var(--zcr-production-soft); }
.zcr-status-copy { display: grid; gap: 5px; }
.zcr-status-copy strong { display: flex; align-items: center; gap: 7px; font-size: var(--font-xs); font-weight: 700; }
.zcr-status-copy small { color: var(--zcr-muted); font-size: var(--font-xs); line-height: 1.5; }
.zcr-status-dot { width: 8px; height: 8px; border-radius: 50%; background: currentColor; }

.zcr-subscription-gate {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin: 0 0 12px;
    padding: 8px 10px;
    border: 1px solid var(--zcr-primary-border);
    border-radius: 8px;
    color: var(--zcr-muted);
    background: var(--zcr-primary-soft);
    font-size: var(--font-xs);
    line-height: 1.55;
}
.zcr-subscription-gate span { display: flex; align-items: center; gap: 6px; }
.zcr-subscription-gate i { color: var(--zcr-primary); }
.zcr-subscription-gate a { flex: 0 0 auto; color: var(--zcr-primary-hover); font-weight: 700; text-decoration: none; white-space: nowrap; }
.zcr-subscription-gate a:hover { text-decoration: underline; }

.zcr-start,
.zcr-portal-action,
.zcr-complete-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    min-height: 46px;
    padding: 10px 14px;
    border: 1px solid;
    border-radius: 8px;
    color: #ffffff;
    font-family: inherit;
    font-size: var(--font-ui);
    font-weight: 700;
    cursor: pointer;
}
.zcr-start { margin-top: auto; }
.zcr-start.is-sandbox,
.zcr-portal-action,
.zcr-complete-action { border-color: var(--zcr-primary); background: var(--zcr-primary); }
.zcr-start.is-sandbox:hover,
.zcr-portal-action:hover,
.zcr-complete-action:hover { border-color: var(--zcr-primary-hover); background: var(--zcr-primary-hover); }
.zcr-start.is-production { border-color: var(--zcr-production); background: var(--zcr-production); }
.zcr-start.is-production:hover { border-color: var(--zcr-production-hover); background: var(--zcr-production-hover); }
.zcr-start:disabled,
.zcr-portal-action:disabled,
.zcr-complete-action:disabled { cursor: not-allowed; opacity: .62; }
.zcr-start.is-locked { border-color: var(--zcr-line); color: var(--zcr-muted); background: var(--zcr-surface-soft); opacity: 1; }

.zcr-activation-wrap { display: grid; place-items: start center; }
.zcr-activation-card {
    width: min(100%, 1040px);
    padding: 20px;
    border: 1px solid var(--zcr-primary-border);
    border-radius: 12px;
    background: var(--zcr-surface);
    box-shadow: var(--zcr-shadow);
}
.zcr-activation-card.is-production { border-color: var(--zcr-production-border); }
.zcr-back {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin: 0 0 17px;
    padding: 0;
    border: 0;
    color: var(--zcr-primary);
    background: transparent;
    font-family: inherit;
    font-size: var(--font-sm);
    font-weight: 850;
    cursor: pointer;
}
.zcr-back:hover { color: var(--zcr-primary-hover); }
.zcr-activation-card > header {
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr) auto;
    align-items: start;
    gap: 11px;
    margin-bottom: 12px;
}
.zcr-activation-card h2 { margin: 2px 0 6px; color: var(--zcr-heading); font-size: var(--font-md); font-weight: 700; }
.zcr-activation-card > header p { margin: 0; color: var(--zcr-muted); font-size: var(--font-sm); line-height: 1.7; }
.zcr-activation-card .zcr-status-strip { margin: 0 0 8px; }
.zcr-activation-section { padding: 18px 2px; border-top: 1px solid var(--zcr-line); }
.zcr-activation-section > header { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 13px; }
.zcr-activation-section > header > div { display: flex; align-items: center; gap: 8px; }
.zcr-activation-section > header i { color: var(--zcr-primary); }
.is-production .zcr-activation-section > header i { color: var(--zcr-production); }
.zcr-activation-section h3 { margin: 0; color: var(--zcr-heading); font-size: var(--font-base); font-weight: 700; }
.zcr-section-state { padding: 5px 9px; border: 1px solid; border-radius: 999px; font-size: var(--font-xs); font-weight: 700; }
.zcr-section-state.is-ready { border-color: var(--zcr-production-border); color: var(--zcr-production); background: var(--zcr-production-soft); }
.zcr-section-state.is-missing { border-color: var(--zcr-danger-border); color: var(--zcr-danger); background: var(--zcr-danger-soft); }
.zcr-activation-card .zc-company-facts { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 16px; padding: 0; }
.zcr-activation-card .zc-company-facts > div,
.zcr-activation-card .zc-company-facts > div.is-wide { grid-column: auto; padding: 9px 2px; border: 0; border-bottom: 1px solid var(--zcr-line); border-radius: 0; background: transparent; }
.zcr-company-missing { display: flex; align-items: flex-start; gap: 9px; margin-bottom: 13px; padding: 11px 12px; border: 1px solid var(--zcr-danger-border); border-radius: 8px; color: var(--zcr-danger); background: var(--zcr-danger-soft); }
.zcr-company-missing > i { margin-top: 2px; }
.zcr-company-missing strong { font-size: var(--font-sm); font-weight: 700; }
.zcr-company-missing p { margin: 2px 0 0; color: var(--zcr-muted); font-size: var(--font-xs); line-height: 1.6; }
.zcr-company-form { display: grid; gap: 12px; }
.zcr-company-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 11px; }
.zcr-activation-card label { display: grid; gap: 6px; }
.zcr-activation-card label > span { color: var(--zcr-heading); font-size: var(--font-sm); font-weight: 850; }
.zcr-activation-card label > span b { color: var(--zcr-danger); }
.zcr-activation-card input,
.zcr-activation-card select {
    width: 100%;
    height: 44px;
    padding: 9px 12px;
    border: 1px solid var(--zcr-line);
    border-radius: 8px;
    color: var(--zcr-text);
    background: var(--zcr-surface);
    font-weight:750;font-size:var(--font-ui);line-height:1.2;
    text-align: right;
    outline: 0;
}
.zcr-activation-card input:focus,
.zcr-activation-card select:focus { border-color: var(--zcr-primary); box-shadow: 0 0 0 3px rgba(37, 99, 235, .11); }
.zcr-company-field em { min-height: 14px; color: var(--zcr-danger); font-size: var(--font-ui); font-style: normal; }
.zcr-company-field.has-error input,
.zcr-company-field.has-error select { border-color: var(--zcr-danger); }
.zcr-company-save {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    justify-self: start;
    min-width: 178px;
    min-height: 42px;
    padding: 9px 14px;
    border: 1px solid var(--zcr-primary);
    border-radius: 8px;
    color: #ffffff;
    background: var(--zcr-primary);
    font-family: inherit;
    font-size: var(--font-sm);
    font-weight: 700;
    cursor: pointer;
}
.zcr-company-save:disabled { cursor: not-allowed; opacity: .62; }
.zcr-otp-help { margin: 0 0 12px; color: var(--zcr-muted); font-size: var(--font-xs); line-height: 1.7; }
.zcr-portal-action { width: auto; min-width: 270px; margin-bottom: 14px; }
#zcr-otp-form { display: grid; grid-template-columns: minmax(0, 1fr) 150px; gap: 10px; align-items: end; }
.zcr-complete-action.is-production { border-color: var(--zcr-production); background: var(--zcr-production); }
.zcr-activation-success { display: flex; align-items: center; gap: 11px; padding: 18px; border: 1px solid var(--zcr-production-border); border-radius: 9px; color: var(--zcr-production); background: var(--zcr-production-soft); }
.zcr-activation-success > i { font-size: 1.35rem; }
.zcr-activation-success strong { display: block; font-size: var(--font-ui); font-weight: 700; }
.zcr-activation-success p { margin: 3px 0 0; color: var(--zcr-muted); font-size: var(--font-xs); }
.zcr-activation-message,
.zcr-activation-error { margin: 12px 0 0; padding: 9px 11px; border-radius: 8px; font-size: var(--font-xs); line-height: 1.6; }
.zcr-activation-message { display: flex; align-items: center; gap: 7px; color: var(--zcr-muted); background: var(--zcr-surface-soft); }
.zcr-activation-error { display: flex; align-items: center; gap: 7px; border: 1px solid var(--zcr-danger-border); color: var(--zcr-danger); background: var(--zcr-danger-soft); }

@media (max-width: 1020px) {
    .zcr-environment-grid { grid-template-columns: 1fr; }
}

@media (max-width: 700px) {
    .zcr-header { display: grid; }
    .zcr-authority { margin-top: 0; }
    .zcr-environment-card { min-height: 270px; }
    .zcr-activation-card .zc-company-facts,
    .zcr-company-fields,
    #zcr-otp-form { grid-template-columns: 1fr; }
    .zcr-portal-action,
    .zcr-company-save { width: 100%; min-width: 0; }
}

@media (max-width: 460px) {
    .zcr-page { gap: 10px; }
    .zcr-environment-card,
    .zcr-activation-card { padding: 14px; }
    .zcr-environment-head,
    .zcr-activation-card > header { grid-template-columns: 36px minmax(0, 1fr); }
    .zcr-environment-head { display: grid; }
    .zcr-env-badge { grid-column: 1 / -1; justify-self: start; }
    .zcr-subscription-gate { align-items: flex-start; flex-direction: column; }
}

/* professional-ui.css */
/* ACCMAN professional UI foundation.
   Loaded last to normalize the shared shell and Bootstrap primitives without
   changing any screen's business behaviour. */
:root {
    --ui-canvas: #f7fafe;
    --ui-surface: #ffffff;
    --ui-surface-muted: #f8fafc;
    --ui-ink: #172033;
    --ui-muted: #667085;
    --ui-line: #e2e8f0;
    --ui-line-strong: #cfd8e6;
    --ui-brand: #2563eb;
    --ui-brand-strong: #1d4ed8;
    --ui-brand-soft: #eff6ff;
    --ui-danger: #dc2626;
    --ui-success: #059669;
    --ui-warning: #d97706;
    --ui-radius-sm: 9px;
    --ui-radius: 12px;
    --ui-radius-lg: 16px;
    --ui-shadow-card: 0 1px 2px rgba(15, 23, 42, .03), 0 8px 24px rgba(15, 23, 42, .045);
    --ui-shadow-float: 0 24px 72px rgba(15, 23, 42, .20);
}

html {
    background: var(--ui-canvas);
    color-scheme: light;
}

body {
    background: var(--ui-canvas);
    color: var(--ui-ink);
}

.topbar {
    position: sticky;
    top: 0;
    z-index: 1040;
    background: rgba(255, 255, 255, .96);
    backdrop-filter: blur(14px);
}

.main-content {
    padding: 24px clamp(16px, 2vw, 32px) 40px;
}

.main-content > section,
.main-content > .container-fluid {
    width: min(100%, 1760px);
    margin-inline: auto;
}

.page-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 20px;
}

.page-header h1,
.page-header h2 {
    margin: 0;
    color: var(--ui-ink);
    font-size: var(--font-2xl);
    font-weight: var(--weight-bold);
    line-height: var(--line-height-tight);
    letter-spacing: 0;
}

.page-header p {
    max-width: 760px;
    margin: 5px 0 0;
    color: var(--ui-muted);
    font-size: var(--font-sm);
}

.header-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 9px;
    flex-wrap: wrap;
}

.card {
    border: 1px solid var(--ui-line);
    border-radius: var(--ui-radius-lg);
    background: var(--ui-surface);
    box-shadow: var(--ui-shadow-card);
}

.card:has(> .card-body),
.card:has(> .card-header),
.card:has(> .table-responsive) {
    padding: 0;
}

.card:hover {
    box-shadow: var(--ui-shadow-card);
}

.card-header {
    min-height: 54px;
    padding: 14px 18px;
    border-bottom: 1px solid var(--ui-line);
    background: var(--ui-surface-muted);
    color: var(--ui-ink);
    font-size: var(--font-md);
    font-weight: var(--weight-semibold);
}

.card-body {
    padding: 20px;
}

.btn {
    min-height: 40px;
    padding: 8px 16px;
    border-radius: var(--ui-radius-sm);
    font-size: var(--font-ui);
    font-weight: var(--weight-semibold);
    line-height: 1.25;
    box-shadow: none;
}

.btn-sm {
    min-height: 34px;
    padding: 6px 12px;
    font-size: var(--font-sm);
}

.btn-primary {
    border-color: var(--ui-brand);
    background: var(--ui-brand);
    color: #fff;
}

.btn-primary:hover,
.btn-primary:focus-visible {
    border-color: var(--ui-brand-strong);
    background: var(--ui-brand-strong);
    color: #fff;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, .16);
}

.btn-secondary,
.btn-light {
    border: 1px solid var(--ui-line-strong);
    background: var(--ui-surface);
    color: #344054;
}

.btn-secondary:hover,
.btn-light:hover {
    border-color: #b8c4d4;
    background: var(--ui-surface-muted);
    color: var(--ui-ink);
}

.form-label {
    margin-bottom: 7px;
    color: #344054;
    font-size: var(--font-sm);
    font-weight: var(--weight-semibold);
}

.form-control,
.form-select {
    min-height: 43px;
    padding: 9px 12px;
    border: 1px solid var(--ui-line-strong);
    border-radius: var(--ui-radius-sm);
    background-color: var(--ui-surface);
    color: var(--ui-ink);
    font-size: var(--font-ui);
    box-shadow: none;
}

textarea.form-control {
    min-height: 84px;
    resize: vertical;
}

.form-control:focus,
.form-select:focus {
    border-color: #7aa7f8;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, .12);
}

.form-control[readonly],
.form-control:disabled,
.form-select:disabled {
    border-color: var(--ui-line);
    background: #f3f6fa;
    color: #667085;
    opacity: 1;
}

.form-text,
.text-muted {
    color: var(--ui-muted) !important;
}

.table-responsive {
    border-radius: inherit;
    scrollbar-color: #cbd5e1 transparent;
    scrollbar-width: thin;
}

.table {
    margin-bottom: 0;
    color: #344054;
    font-size: var(--font-ui);
    line-height: var(--line-height-tight);
}

.table > :not(caption) > * > * {
    padding: 13px 14px;
    border-bottom-color: #edf1f5;
    vertical-align: middle;
}

.table thead th,
.table-light th {
    border-bottom: 1px solid var(--ui-line);
    background: #f7f9fc;
    color: #596579;
    font-size: var(--font-ui);
    font-weight: var(--weight-semibold);
    letter-spacing: 0;
    text-transform: none;
    white-space: nowrap;
}

.table-hover > tbody > tr:hover > * {
    background: #f8fbff;
}

.dropdown-menu {
    max-height: min(430px, 70vh);
    padding: 7px;
    overflow-y: auto;
    border: 1px solid var(--ui-line);
    border-radius: 12px;
    background: var(--ui-surface);
    box-shadow: 0 16px 42px rgba(15, 23, 42, .16);
}

.dropdown-item {
    min-height: 38px;
    padding: 8px 10px;
    border-radius: 8px;
    color: #344054;
    font-size: var(--font-ui);
}

.dropdown-item:hover,
.dropdown-item:focus {
    background: var(--ui-brand-soft);
    color: var(--ui-brand-strong);
}

.modal {
    --bs-modal-zindex: 1080;
}

.modal-backdrop {
    --bs-backdrop-zindex: 1075;
    --bs-backdrop-bg: #0f172a;
    --bs-backdrop-opacity: .54;
}

.custom-modal-overlay,
.glass-overlay,
.item-drawer-overlay,
.payment-method-drawer-overlay,
.template-modal-overlay,
.iw-modal-backdrop,
.posw-modal-backdrop,
.pos-modal-backdrop,
.pi-modal-overlay,
.subscription-modal-backdrop,
.tmc-modal-overlay {
    background-color: rgba(15, 23, 42, .54);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
}

.modal-dialog {
    margin: 16px auto;
}

.modal-content {
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, .72);
    border-radius: 18px;
    background: var(--ui-surface);
    box-shadow: var(--ui-shadow-float);
}

.modal-header {
    min-height: 72px;
    padding: 16px 20px;
    border-bottom: 1px solid var(--ui-line);
    background: var(--ui-surface);
}

.modal-title {
    color: var(--ui-ink);
    font-size: var(--font-lg);
    font-weight: var(--weight-semibold);
}

.modal-header small {
    display: block;
    max-width: 720px;
    margin-top: 3px;
    color: var(--ui-muted);
    font-size: var(--font-sm);
}

.modal-body {
    padding: 20px;
    background: #f8fafc;
}

.modal-footer {
    min-height: 70px;
    padding: 13px 20px;
    border-top: 1px solid var(--ui-line);
    background: var(--ui-surface);
    gap: 8px;
}

.btn-close {
    flex: 0 0 auto;
    padding: 10px;
    border-radius: 9px;
}

.alert {
    border-radius: 12px;
    font-size: var(--font-ui);
}

.badge,
.status-pill {
    font-size: var(--font-xs);
    font-weight: var(--weight-semibold);
}

:focus-visible {
    outline: 3px solid rgba(37, 99, 235, .22);
    outline-offset: 2px;
}

@media (max-width: 940px) {
    .page-header {
        flex-direction: column;
    }

    .header-actions {
        width: 100%;
        justify-content: flex-start;
    }

    .modal-dialog {
        width: auto;
        max-width: none;
        margin: 10px;
    }
}

@media (max-width: 620px) {
    body {
        font-size: var(--font-ui);
    }

    .main-content {
        padding: 16px 12px 28px;
    }

    .page-header h1,
    .page-header h2 {
        font-size: var(--font-xl);
    }

    .header-actions .btn,
    .header-actions a.btn {
        flex: 1 1 150px;
    }

    .card-body,
    .modal-body {
        padding: 14px;
    }

    .modal-dialog {
        margin: 6px;
    }

    .modal-content {
        border-radius: 14px;
    }

    .modal-header,
    .modal-footer {
        padding-inline: 14px;
    }
}

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

/* document-print.css */
/* ACCMAN canonical document output: preview = print = PDF.
   paginateTemplateDocument() (app.js) splits the renderer's <article> into .accman-page sheets of the exact paper size
   inside .accman-document-pages. The rules below give those sheets their geometry and their printed appearance in every
   medium, so the preview shows what prints. Printing copies the same sheets into .accman-print-host and prints only that
   host on a @page of the sheet size. There is no print-only document styling. */

/* ---- Sheets: paper size and margins, identical on screen, on paper and in the PDF -------------------------------- */
.accman-document-pages {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8mm;
    width: max-content;
    min-width: 100%;
    margin: 0 auto;
}
.accman-document-pages > .accman-page.accman-template-document {
    position: relative;
    flex: 0 0 auto;
    width: var(--page-width, 210mm);
    height: var(--page-height, 297mm);
    min-height: 0;
    max-width: none;
    margin: 0;
    padding: var(--tpl-margin-top, 12mm) var(--tpl-margin-right, 12mm) var(--tpl-margin-bottom, 12mm) var(--tpl-margin-left, 12mm);
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(15, 23, 42, .12), 0 10px 30px rgba(15, 23, 42, .14);
    print-color-adjust: exact;
    -webkit-print-color-adjust: exact;
}
/* While a sheet is being filled it grows with its content; a block that cannot split keeps a taller sheet. */
.accman-document-pages > .accman-page.accman-template-document.is-filling,
.accman-document-pages > .accman-page.accman-template-document.is-oversized { height: auto; min-height: 0; overflow: visible; }
/* Thermal paper has no fixed length: the receipt is as long as its content (the print measures it). */
.accman-document-pages.is-thermal > .accman-page.accman-template-document {
    height: auto;
    overflow: visible;
    padding: var(--tpl-margin-top, 3mm) var(--tpl-margin-right, 3mm) var(--tpl-margin-bottom, 3mm) var(--tpl-margin-left, 3mm);
}
.accman-document-pages.is-thermal > .accman-page.preset-accman-thermal-pos { padding: 4mm 3mm; }
.accman-document-pages > .accman-page.accman-template-document.style-professional-layout,
.accman-document-pages > .accman-page.accman-template-document.style-compact-layout { padding: 0; }
.accman-page > .accman-page-number {
    position: absolute;
    right: var(--tpl-margin-right, 12mm);
    bottom: 3mm;
    left: var(--tpl-margin-left, 12mm);
    color: #64748b;
    font-size: 8px;
    text-align: center;
}
.accman-page .invoice-page-number { color: #64748b; font-size: 8px; white-space: nowrap; }
/* The POS receipt preview is the POS receipt document itself, in a frame of the paper width. */
.accman-document-pages > .accman-frame-page { width: var(--page-width, 80mm); background: #fff; box-shadow: 0 1px 3px rgba(15, 23, 42, .12), 0 10px 30px rgba(15, 23, 42, .14); }
.accman-frame-page > iframe { display: block; width: 100%; min-height: 60mm; border: 0; background: #fff; }

/* ---- Printed appearance of a sheet (the same in the preview) ---------------------------------------------------- */
.accman-page .invoice-designer-block { outline: 0; box-shadow: none; }
.accman-page .invoice-footer { position: static; inset: auto; }
.accman-page .invoice-items:not(.thermal-items) { table-layout: fixed; }
.accman-page .invoice-items td.invoice-column-sku[dir="ltr"] { white-space: normal; overflow-wrap: anywhere; word-break: break-word; }
.accman-page.print-monochrome { filter: grayscale(1); }
.accman-page.print-economy * { box-shadow: none !important; background-image: none !important; }
.accman-page.accman-template-document:not(.invoice-thermal):not(.reference-a4) .invoice-designer-block { margin-block: 3px; }
.accman-page.accman-template-document:not(.invoice-thermal):not(.reference-a4) .invoice-head { grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr); padding-bottom: 4mm; }
.accman-page.accman-template-document:not(.invoice-thermal):not(.reference-a4) .invoice-document-strip { padding-block: 1.2mm; }
.accman-page.accman-template-document:not(.invoice-thermal):not(.reference-a4) .invoice-document-strip > div { padding: 1.2mm; }
.accman-page.accman-template-document:not(.invoice-thermal):not(.reference-a4) .invoice-meta { gap: 3mm; padding-block: 2mm; }
.accman-page.accman-template-document:not(.invoice-thermal):not(.reference-a4) .invoice-meta h4 { margin-bottom: 1mm; }
.accman-page.accman-template-document:not(.invoice-thermal):not(.reference-a4) .invoice-meta p { margin-block: .6mm; }
.accman-page.accman-template-document:not(.invoice-thermal):not(.reference-a4) .invoice-items th,
.accman-page.accman-template-document:not(.invoice-thermal):not(.reference-a4) .invoice-items td { padding-block: 1.5mm; }
.accman-page.accman-template-document:not(.invoice-thermal):not(.reference-a4) .invoice-qr-block .invoice-qr svg { width: 20mm; max-width: 20mm; height: auto; }
.accman-page.accman-template-document:not(.invoice-thermal):not(.reference-a4) .invoice-signature { margin-top: 2mm; }
.accman-page.accman-template-document:not(.invoice-thermal):not(.reference-a4) .invoice-footer { margin-top: 2mm; padding-top: 2mm; }
/* Printed tables use a white header with ruled borders (ink-friendly), so the preview shows them that way too. */
.accman-page.preset-accman-premium-tax .invoice-items th,
.accman-page.preset-accman-modern-invoice .invoice-items th,
.accman-page.preset-accman-quotation .invoice-items th,
.accman-page.preset-accman-credit-note .invoice-items th { color: #111; background: #fff; border-block: 1px solid currentColor; }
.accman-page.professional-layout .professional-items th,
.accman-page.premium-reference-layout .professional-items th { color: #111; background: #fff; border-block: 1px solid #111; }
.accman-page.reference-a4 { border: 0; }
.accman-page.reference-a4 .professional-items th { color: #111; background: #fff; border-color: #111; }
.accman-page.reference-a4 .reference-customer > header,
.accman-page.reference-a4 .professional-totals > .total { color: #111; background: #fff; border: 1px solid #111; }
.accman-page.reference-a4 .reference-footer { position: static; }

/* ---- The document viewer (screen) ------------------------------------------------------------------------------- */
.accman-viewer.template-modal-overlay { padding: 18px; }
.accman-viewer-shell {
    display: flex;
    flex-direction: column;
    width: min(1180px, 100%);
    height: min(94vh, 1100px);
    overflow: hidden;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 24px 60px rgba(15, 23, 42, .28);
}
.accman-viewer.is-fullscreen { padding: 0; }
.accman-viewer.is-fullscreen .accman-viewer-shell { width: 100vw; height: 100vh; border-radius: 0; }
.accman-viewer-head { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; padding: 14px 18px; border-bottom: 1px solid #e2e8f0; }
.accman-viewer-title { min-width: 0; }
.accman-viewer-title h3 { margin: 0; color: #0f172a; font-size: var(--font-lg, 1.05rem); font-weight: 700; }
.accman-viewer-meta { margin: 2px 0 0; color: #64748b; font-size: var(--font-sm, .82rem); }
.accman-viewer-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.accman-viewer-actions .btn { display: inline-flex; align-items: center; gap: 6px; }
.accman-viewer-choice { display: inline-flex; align-items: center; gap: 6px; margin: 0; color: #475569; font-size: var(--font-sm, .82rem); }
.accman-viewer-choice select { height: 34px; border: 1px solid #cbd5e1; border-radius: 8px; padding-inline: 8px; background: #fff; }
.accman-viewer-toolbar { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px 16px; padding: 8px 18px; border-bottom: 1px solid #e2e8f0; background: #f8fafc; }
.accman-viewer-group { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
.accman-viewer-toolbar button { display: inline-flex; align-items: center; gap: 5px; min-width: 32px; height: 32px; padding: 0 10px; border: 1px solid #dbe5f1; border-radius: 8px; background: #fff; color: #334155; font-size: var(--font-sm, .82rem); }
.accman-viewer-toolbar button:hover:not(:disabled), .accman-viewer-toolbar button[aria-pressed="true"] { border-color: var(--primary, #2563eb); color: var(--primary, #2563eb); }
.accman-viewer-toolbar button:disabled { opacity: .45; }
.accman-viewer-toolbar output, .accman-viewer-toolbar [data-viewer-page] { min-width: 56px; color: #0f172a; font-variant-numeric: tabular-nums; font-weight: 600; text-align: center; }
.accman-viewer-paper { padding: 4px 10px; border-radius: 999px; background: #e8f0fe; color: #1e40af; font-size: var(--font-xs, .75rem); font-weight: 700; }
.accman-viewer-note { display: flex; align-items: center; gap: 6px; margin: 0; padding: 8px 18px; border-bottom: 1px solid #fde68a; background: #fffbeb; color: #92400e; font-size: var(--font-sm, .82rem); }
.accman-viewer-stage { flex: 1 1 auto; min-height: 0; overflow: auto; padding: 24px; background: #e5e9f0; }
.accman-viewer-status { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 240px; color: #475569; }
.accman-viewer-status.is-error { color: #b91c1c; }
.accman-viewer-render { width: max-content; margin: 0 auto; }
@media (max-width: 760px) {
    .accman-viewer.template-modal-overlay { padding: 0; }
    .accman-viewer-shell { width: 100vw; height: 100vh; border-radius: 0; }
    .accman-viewer-head, .accman-viewer-toolbar { padding-inline: 12px; }
    .accman-viewer-stage { padding: 12px; }
}

/* The print copy is laid out off screen (so its images are decoded) and is the only thing printed. */
@media screen {
    .accman-print-host { position: fixed; top: 0; left: -400vw; pointer-events: none; }
}
@media print {
    body.accman-template-printing { margin: 0 !important; padding: 0 !important; background: #fff !important; }
    body.accman-template-printing:has(> .accman-print-host) > :not(.accman-print-host) { display: none !important; }
    .accman-print-host { position: static; display: block; }
    .accman-print-host .accman-document-pages { display: block; width: auto; min-width: 0; gap: 0; zoom: 1; }
    /* Half a millimetre under the sheet height so a rounding difference never pushes an empty page. */
    .accman-print-host .accman-document-pages:not(.is-thermal) > .accman-page.accman-template-document { height: calc(var(--page-height, 297mm) - .5mm); }
    /* A block that could not be split keeps a taller sheet: it flows onto the next page rather than being cut off. */
    .accman-print-host .accman-document-pages:not(.is-thermal) > .accman-page.accman-template-document.is-oversized { height: auto; overflow: visible; }
    .accman-print-host .accman-page.accman-template-document { margin: 0; box-shadow: none; break-after: page; page-break-after: always; }
    .accman-print-host .accman-page.accman-template-document:last-child { break-after: auto; page-break-after: auto; }
    /* A document printed as one continuous article (the A5/A4 POS popup) keeps its table headers and rows whole. */
    body.accman-template-printing .template-print-source .invoice-items thead,
    body.accman-template-printing .template-print-source .professional-items thead { display: table-header-group; }
    body.accman-template-printing .template-print-source .invoice-items tr,
    body.accman-template-printing .template-print-source .professional-items tr { break-inside: avoid; page-break-inside: avoid; }
}

/* api-integrations.css */
#api-integrations-root{--api-border:#e2e8f0;--api-muted:#64748b;--api-bg:#f8fafc;--api-navy:#0f172a;direction:rtl;color:var(--api-navy)}
.api-loading-card,.api-loading{min-height:180px;display:flex;align-items:center;justify-content:center;gap:12px;color:var(--api-muted);background:#fff;border:1px solid var(--api-border);border-radius:14px}
.api-loading-card i{font-size:1.5rem;color:var(--bs-primary)}
.api-management-header{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:4px 2px 20px}.api-management-header h3{font-weight:700;margin:5px 0;font-size:var(--font-2xl)}.api-management-header p{margin:0;color:var(--api-muted)}.api-eyebrow{font-size:var(--font-xs);font-weight:700;color:var(--bs-primary);letter-spacing:.02em}.api-add-store{min-height:44px;border-radius:10px;padding-inline:20px;font-weight:700;white-space:nowrap}
.api-summary-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px;margin-bottom:18px}.api-summary-card{background:#fff;border:1px solid var(--api-border);border-radius:13px;padding:17px;display:flex;align-items:center;gap:13px;min-width:0;box-shadow:0 4px 14px rgba(15,23,42,.035)}.api-summary-card small{display:block;color:var(--api-muted);font-size:var(--font-xs);margin-bottom:4px}.api-summary-card strong{font-size:var(--font-2xl)}.api-summary-icon{width:42px;height:42px;border-radius:11px;display:grid;place-items:center;color:#2563eb;background:#eff6ff;flex:0 0 auto}.api-summary-icon.is-success{color:#059669;background:#ecfdf5}.api-summary-icon.is-warning{color:#d97706;background:#fffbeb}.api-summary-icon.is-info{color:#0891b2;background:#ecfeff}.api-summary-icon.is-danger{color:#dc2626;background:#fef2f2}
.api-subtabs{display:flex;gap:5px;background:#fff;border:1px solid var(--api-border);border-radius:12px;padding:6px;margin-bottom:14px}.api-subtabs button{border:0;background:transparent;color:var(--api-muted);font-weight:700;padding:10px 16px;border-radius:8px}.api-subtabs button.active{background:#eff6ff;color:#2563eb}
.api-panel{background:#fff;border:1px solid var(--api-border);border-radius:14px;overflow:hidden;box-shadow:0 5px 18px rgba(15,23,42,.035)}.api-table-head{padding:20px 22px 15px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--api-border)}.api-table-head h4{font-size:var(--font-md);font-weight:700;margin:0 0 4px}.api-table-head p{color:var(--api-muted);font-size:var(--font-ui);margin:0}.api-table-head>span{font-size:var(--font-sm);background:var(--api-bg);padding:6px 10px;border-radius:8px;color:var(--api-muted)}
.api-stores-table,.api-logs-table{margin:0;white-space:nowrap;font-size:var(--font-ui)}.api-stores-table thead th,.api-logs-table thead th{background:var(--api-bg);color:#475569;border-bottom:1px solid var(--api-border);padding:12px;font-weight:700}.api-stores-table tbody td,.api-logs-table tbody td{padding:13px 12px;border-color:#eef2f7;vertical-align:middle}.api-stores-table tbody tr:hover,.api-logs-table tbody tr:hover{background:#fbfdff}.api-stores-table td:first-child strong{display:block;max-width:185px;overflow:hidden;text-overflow:ellipsis}
.api-ready-label{display:flex;align-items:center;gap:4px;margin-top:4px;font-size:var(--font-sm)}.api-ready-label.is-ready{color:#059669}.api-ready-label.is-pending{color:#d97706}.api-status-badge{display:inline-flex;align-items:center;gap:5px;padding:5px 8px;border-radius:999px;font-size:var(--font-xs);font-weight:700}.api-status-badge.is-success{background:#ecfdf5;color:#047857}.api-status-badge.is-warning{background:#fff7ed;color:#c2410c}.api-status-badge.is-danger{background:#fef2f2;color:#b91c1c}.api-scope-count{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:8px;background:#eef2ff;color:#4338ca;font-weight:700}
.api-copy-value{max-width:170px;border:0;background:transparent;color:#2563eb;display:inline-flex;gap:7px;align-items:center;padding:0}.api-copy-value bdi{overflow:hidden;text-overflow:ellipsis}.api-copy-value:hover{text-decoration:underline}.api-empty{padding:58px;display:flex;flex-direction:column;align-items:center;gap:8px;color:var(--api-muted)}.api-empty i{font-size:2rem;color:#94a3b8}.api-empty strong{color:#334155;font-size:var(--font-md)}
.api-rate-strip{margin-top:14px;background:#fff;border:1px solid var(--api-border);border-radius:12px;padding:13px 18px;display:flex;align-items:center;gap:25px;color:var(--api-muted);font-size:var(--font-sm)}.api-rate-strip>div{display:flex;align-items:center;gap:8px;color:#334155;margin-inline-end:auto}.api-rate-strip i{color:var(--bs-primary)}
.api-form-section{border-top:1px solid var(--api-border);margin-top:22px;padding-top:20px}.api-form-section h6{font-weight:700}.api-form-section>p{color:var(--api-muted);font-size:var(--font-ui)}.api-scope-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.api-scope-options label{display:grid;grid-template-columns:auto 1fr;column-gap:8px;align-items:center;border:1px solid var(--api-border);border-radius:10px;padding:11px;cursor:pointer}.api-scope-options label small{grid-column:2;color:var(--api-muted);direction:ltr;text-align:right;font-size:var(--font-xs)}.api-scope-options label:has(input:checked){background:#eff6ff;border-color:#93c5fd}.api-payment-list{display:grid;gap:8px}.api-payment-row{display:grid;grid-template-columns:minmax(180px,1fr) minmax(220px,1fr);gap:15px;align-items:center;background:var(--api-bg);border:1px solid var(--api-border);border-radius:10px;padding:10px}.api-payment-row small{display:block;color:var(--api-muted);font-size:var(--font-xs);margin-top:3px}.api-readonly-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:20px}.api-readonly-grid>div{background:var(--api-bg);border:1px solid var(--api-border);border-radius:10px;padding:12px}.api-readonly-grid small{display:block;color:var(--api-muted);font-size:var(--font-xs);margin-bottom:4px}
.api-detail-top{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.api-detail-top>div{border:1px solid var(--api-border);border-radius:11px;padding:13px;min-height:75px}.api-detail-top small{display:block;color:var(--api-muted);margin-bottom:7px}.api-checklist{margin-top:16px;border:1px solid var(--api-border);border-radius:12px;padding:16px}.api-checklist h6{font-weight:700}.api-checklist>div{display:flex;flex-wrap:wrap;gap:8px}.api-checklist span{display:inline-flex;gap:6px;align-items:center;padding:6px 9px;border-radius:8px;background:var(--api-bg);font-size:var(--font-sm)}.api-checklist .ok{color:#047857}.api-checklist .warn{color:#b45309}.api-checklist .bad{color:#b91c1c}.api-notices{margin-top:12px}.api-notices p{margin:6px 0;padding:10px;border-radius:8px;background:#fffbeb;color:#92400e;font-size:var(--font-sm)}.api-notices i{margin-left:7px}.api-mapping-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.api-mapping-cards>div{display:flex;justify-content:space-between;align-items:center;border:1px solid var(--api-border);padding:11px;border-radius:9px}.api-mapping-cards span{color:#059669;display:flex;align-items:center;gap:6px}
.api-developer{margin-top:18px;border:1px solid var(--api-border);border-radius:12px;overflow:hidden}.api-developer summary{padding:14px;background:var(--api-bg);cursor:pointer;font-weight:700}.api-developer-grid{padding:14px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.api-developer-grid>div{border:1px solid var(--api-border);border-radius:9px;padding:10px;min-width:0}.api-developer-grid .full{grid-column:1/-1}.api-developer-grid small{display:block;color:var(--api-muted);margin-bottom:5px}.api-developer-grid bdi{display:block;direction:ltr;text-align:left;overflow-wrap:anywhere;font-family:var(--font-family-mono);font-size:var(--font-sm)}.api-secret-head{background:#f8fafc}.api-modal-icon{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:9px;background:#eff6ff;color:#2563eb}
.api-log-filters{display:grid;grid-template-columns:1.2fr 1fr 1fr 1.2fr .8fr auto;gap:8px;padding:14px 18px;border-bottom:1px solid var(--api-border)}.api-logs-table td:nth-child(3) bdi{display:block;max-width:230px;overflow:hidden;text-overflow:ellipsis;direction:ltr;text-align:left}.api-pagination{padding:12px 18px;display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--api-border);color:var(--api-muted);font-size:var(--font-sm)}.api-pagination>div{display:flex;gap:5px}
@media(max-width:1300px){.api-summary-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.api-log-filters{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:768px){.api-management-header{align-items:flex-start;flex-direction:column}.api-add-store{width:100%}.api-summary-grid{grid-template-columns:1fr 1fr}.api-scope-options,.api-detail-top,.api-developer-grid,.api-mapping-cards{grid-template-columns:1fr}.api-developer-grid .full{grid-column:auto}.api-payment-row{grid-template-columns:1fr}.api-log-filters{grid-template-columns:1fr 1fr}.api-rate-strip{align-items:flex-start;flex-direction:column;gap:8px}.api-rate-strip>div{margin-inline-end:0}.api-readonly-grid{grid-template-columns:1fr}}
@media(max-width:480px){.api-summary-grid,.api-log-filters{grid-template-columns:1fr}.api-summary-card{padding:13px}}

/* landing.css */
/* Public website — white canvas, dark ink, one accent (the app's --primary); scoped to .landing-root so the SPA shell is untouched. */
:root {
    --landing-ink: #0f172a;
    --landing-navy: #0b1a3a;
    --landing-blue: var(--primary, #2563eb);
    --landing-blue-dark: var(--primary-hover, #1d4ed8);
    --landing-blue-soft: #eaf1ff;
    --landing-muted: #55657f;
    --landing-line: #e5eaf2;
    --landing-page: #ffffff;
    --landing-tint: #f7f9fc;
    --landing-radius: 18px;
    --landing-shadow: 0 30px 70px rgba(15, 23, 42, .12);
    --landing-ease: cubic-bezier(.22, 1, .36, 1);
    --landing-fast: 180ms;
    --landing-slow: 640ms;
    --landing-header-height: 76px;
    --landing-gap: clamp(72px, 9vw, 130px);
}

html { scroll-behavior: smooth; scroll-padding-top: calc(var(--landing-header-height) + 16px); }
body.landing-mode { margin: 0; overflow-x: hidden; background: var(--landing-page); color: var(--landing-ink); font-family: var(--font-family); }
body.landing-modal-open { overflow: hidden; }
.landing-root { min-height: 100vh; overflow-x: clip; font-family: var(--font-family); color: var(--landing-ink); background: var(--landing-page); line-height: 1.75; }
.landing-root *, .landing-root *::before, .landing-root *::after { box-sizing: border-box; }
.landing-root img { max-width: 100%; height: auto; display: block; }
.landing-root h1, .landing-root h2, .landing-root h3 { margin: 0; color: var(--landing-navy); font-weight: 800; line-height: 1.22; letter-spacing: -.01em; }
.landing-root p { margin: 0; }
.landing-root a { color: inherit; }
.landing-root :focus-visible { outline: 3px solid rgba(37, 99, 235, .45); outline-offset: 3px; border-radius: 10px; }
.landing-container { width: min(1200px, calc(100% - 32px)); margin-inline: auto; }
.landing-section { padding-block: var(--landing-gap); }
.landing-title { text-align: center; font-size: clamp(1.8rem, 3.2vw, 2.5rem); margin-bottom: clamp(36px, 5vw, 64px); }
.landing-kicker { display: inline-block; margin-bottom: 14px; color: var(--landing-blue); font-size: .9rem; font-weight: 700; letter-spacing: .02em; }

/* buttons and links */
.landing-btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 48px; padding: 0 22px; border-radius: 10px; border: 1px solid transparent; font: 700 .98rem/1 var(--font-family); text-decoration: none; cursor: pointer; white-space: nowrap; transition: transform var(--landing-fast) var(--landing-ease), box-shadow var(--landing-fast) var(--landing-ease), background var(--landing-fast), color var(--landing-fast); }
.landing-btn--sm { min-height: 42px; padding-inline: 18px; font-size: .9rem; }
.landing-btn--wide { min-height: 58px; padding-inline: 32px; font-size: 1.05rem; width: min(100%, 420px); }
.landing-btn--hero { min-height: 64px; padding-inline: 40px; font-size: 1.15rem; width: min(100%, 520px); }
.landing-btn--primary { color: #fff; background: var(--landing-blue); border-color: var(--landing-blue); box-shadow: 0 12px 28px rgba(37, 99, 235, .22); }
.landing-btn--primary:hover { background: var(--landing-blue-dark); transform: translateY(-2px); box-shadow: 0 18px 36px rgba(37, 99, 235, .3); color: #fff; }
.landing-btn--ghost { color: var(--landing-navy); background: #fff; border-color: var(--landing-line); }
.landing-btn--ghost:hover { color: var(--landing-blue); border-color: #bfd3f2; transform: translateY(-2px); }
.landing-link { display: inline-flex; align-items: center; gap: 8px; margin-top: 16px; color: var(--landing-blue); font-weight: 700; text-decoration: none; }
.landing-link:hover { text-decoration: underline; }
.landing-icon-btn { display: inline-grid; place-items: center; width: 42px; height: 42px; border: 0; border-radius: 10px; background: transparent; color: var(--landing-navy); font-size: 1.05rem; cursor: pointer; transition: background var(--landing-fast); }
.landing-icon-btn:hover { background: var(--landing-tint); }

/* header */
.landing-header { position: sticky; top: 0; z-index: 40; background: rgba(255, 255, 255, .98); border-bottom: 1px solid transparent; transition: border-color var(--landing-fast), box-shadow var(--landing-fast); }
.landing-header.is-compact { border-color: var(--landing-line); box-shadow: 0 8px 24px rgba(15, 23, 42, .06); }
.landing-header__inner { display: flex; align-items: center; gap: 28px; min-height: var(--landing-header-height); }
.landing-brand { display: inline-flex; align-items: center; }
.landing-brand img { width: 150px; height: auto; }
.landing-nav { display: flex; align-items: center; gap: 4px; margin-inline-end: auto; }
.landing-nav > a { padding: 8px 12px; border-radius: 8px; color: var(--landing-ink); font-size: .95rem; font-weight: 600; text-decoration: none; transition: color var(--landing-fast), background var(--landing-fast); }
.landing-nav > a:hover { color: var(--landing-blue); background: var(--landing-tint); }
.landing-nav__mobile { display: none; }
.landing-header__actions { display: flex; align-items: center; gap: 10px; }
.landing-header__login { display: inline-flex; align-items: center; gap: 8px; padding: 8px 12px; border-radius: 8px; color: var(--landing-ink); font-size: .92rem; font-weight: 600; text-decoration: none; }
.landing-header__login:hover { color: var(--landing-blue); }
.landing-header__cta { display: grid; justify-items: center; gap: 2px; }
.landing-header__cta small { color: var(--landing-blue); font-size: .7rem; font-weight: 600; line-height: 1; }
.landing-menu-toggle { display: none; }
.landing-drawer-backdrop { display: none; }

/* preview bar (console draft) */
.landing-preview-bar { position: sticky; top: 0; z-index: 41; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 20px; padding: 10px 24px; background: var(--landing-navy); color: #fff; font-size: .9rem; }
.landing-preview-bar i { margin-inline-end: 8px; color: #93c5fd; }
.landing-preview-bar a { display: inline-flex; align-items: center; gap: 8px; color: #fff; font-weight: 700; }
.is-preview .landing-header { top: 44px; }

/* hero */
.landing-hero { padding: clamp(56px, 8vw, 104px) 0 clamp(40px, 5vw, 64px); text-align: center; }
.landing-hero__inner { display: grid; justify-items: center; gap: 22px; }
.landing-hero h1 { max-width: 1000px; font-size: clamp(2.1rem, 4.6vw, 3.5rem); line-height: 1.2; }
.landing-hero__text { max-width: 860px; color: var(--landing-muted); font-size: clamp(1rem, 1.35vw, 1.15rem); line-height: 1.9; }
.landing-hero__cta { display: flex; justify-content: center; width: 100%; margin-top: 8px; }
.landing-trust { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 26px; margin: 0; padding: 0; list-style: none; color: var(--landing-ink); font-size: .95rem; font-weight: 600; }
.landing-trust li { display: inline-flex; align-items: center; gap: 8px; }
.landing-trust i { color: var(--landing-blue); font-size: .7rem; }
.landing-compliance { display: inline-flex; align-items: center; gap: 10px; margin-top: 10px; padding: 10px 18px; border: 1px solid var(--landing-line); border-radius: 999px; color: var(--landing-muted); font-size: .88rem; }
.landing-compliance i { color: var(--landing-blue); }

/* real screens */
.landing-frame { margin: 0; border-radius: var(--landing-radius); background: #fff; border: 1px solid var(--landing-line); box-shadow: var(--landing-shadow); overflow: hidden; }
.landing-frame__bar { display: flex; align-items: center; gap: 7px; padding: 10px 16px; background: #f4f6fa; border-bottom: 1px solid var(--landing-line); }
.landing-frame__bar span { width: 10px; height: 10px; border-radius: 50%; background: #d7deea; }
.landing-frame__bar i { margin-inline-start: auto; color: #9aa7bd; font-size: .72rem; font-style: normal; direction: ltr; }
.landing-frame__body { display: block; width: 100%; padding: 0; border: 0; background: none; cursor: zoom-in; }
.landing-frame__body img { width: 100%; }
.landing-showcase { padding-bottom: clamp(24px, 4vw, 48px); }
.landing-showcase__caption { margin-top: 18px; text-align: center; color: var(--landing-muted); font-size: .92rem; }
.landing-phone { position: relative; margin: 0; width: min(340px, 82%); padding: 12px; border-radius: 46px; background: #0f172a; box-shadow: 0 40px 80px rgba(15, 23, 42, .28), inset 0 0 0 2px #334155; }
.landing-phone::before { content: ''; position: absolute; top: 12px; left: 50%; width: 38%; height: 22px; border-radius: 0 0 16px 16px; background: #0f172a; transform: translateX(-50%); z-index: 1; }
.landing-phone__screen { border-radius: 36px; overflow: hidden; background: #fff; aspect-ratio: 390 / 844; }
.landing-phone__screen picture { display: block; height: 100%; }
.landing-phone__screen img { width: 100%; height: 100%; object-fit: cover; object-position: top; }

/* feature sections */
.landing-feature__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); align-items: center; gap: clamp(40px, 6vw, 96px); }
.landing-feature.is-flipped .landing-feature__visual { order: -1; }
.landing-feature h2 { font-size: clamp(1.85rem, 3.3vw, 2.7rem); }
.landing-feature__subtitle { margin-top: 14px; color: var(--landing-ink); font-size: 1.08rem; font-weight: 700; }
.landing-blocks { display: grid; gap: 22px; margin-top: 28px; }
.landing-block { padding-block: 4px; }
.landing-block h3 { font-size: 1.05rem; margin-bottom: 8px; }
.landing-block p { color: var(--landing-muted); font-size: .97rem; }
.landing-checklist { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 22px; margin: 26px 0 0; padding: 0; list-style: none; }
.landing-checklist li { display: flex; align-items: flex-start; gap: 10px; color: var(--landing-ink); font-size: .95rem; font-weight: 600; }
.landing-checklist i { margin-top: 5px; color: var(--landing-blue); font-size: .95rem; }
.landing-feature__copy .landing-btn { margin-top: 34px; }
.landing-feature__visual { position: relative; }
.landing-frame--main { position: relative; z-index: 1; }
.landing-feature__visual.has-secondary { padding-bottom: 22%; }
.landing-feature__visual.has-secondary .landing-frame--main { width: 82%; margin-inline-start: auto; }
.landing-frame--secondary { position: absolute; z-index: 2; width: 58%; bottom: 0; inset-inline-start: 0; box-shadow: 0 36px 80px rgba(15, 23, 42, .22); }
.landing-feature.is-flipped .landing-feature__visual.has-secondary .landing-frame--main { margin-inline-start: 0; margin-inline-end: auto; }
.landing-feature.is-flipped .landing-frame--secondary { inset-inline-start: auto; inset-inline-end: 0; }

/* custom images (media library): responsive, lazy, never stretched — object-fit follows the section configuration */
.landing-media { position: relative; margin: 0; border-radius: var(--landing-radius); background: var(--landing-tint); box-shadow: var(--landing-shadow); overflow: hidden; }
.landing-media .landing-photo { display: block; width: 100%; height: auto; }
.landing-media .landing-photo.is-fit-cover { aspect-ratio: 16 / 10; object-fit: cover; }
.landing-media .landing-photo.is-fit-contain { max-height: 640px; object-fit: contain; }
.landing-media--wide .landing-photo.is-fit-cover { aspect-ratio: 21 / 9; }
.landing-media--apps { width: min(420px, 100%); }
.landing-media.is-photo-missing { min-height: 220px; background: radial-gradient(circle at 30% 30%, rgba(37, 99, 235, .18), transparent 55%), var(--landing-tint); }
.landing-media.is-photo-missing .landing-photo { display: none; }
.landing-app__icon { width: 40px; height: 40px; border-radius: 10px; object-fit: cover; }
.landing-apps.is-flipped .landing-apps__visual { order: -1; }

/* photo banners */
.landing-banner { position: relative; display: flex; align-items: center; min-height: clamp(400px, 42vw, 560px); background: var(--landing-navy); color: #fff; overflow: hidden; isolation: isolate; }
.landing-banner__photo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; z-index: -2; }
.landing-banner::before { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(to left, rgba(11, 26, 58, .92) 0%, rgba(11, 26, 58, .72) 38%, rgba(11, 26, 58, .1) 68%, rgba(11, 26, 58, 0) 100%); }
[dir="ltr"] .landing-banner::before { background: linear-gradient(to right, rgba(11, 26, 58, .92) 0%, rgba(11, 26, 58, .72) 38%, rgba(11, 26, 58, .1) 68%, rgba(11, 26, 58, 0) 100%); }
.landing-banner.is-end::before { background: linear-gradient(to right, rgba(11, 26, 58, .92) 0%, rgba(11, 26, 58, .72) 38%, rgba(11, 26, 58, .1) 68%, rgba(11, 26, 58, 0) 100%); }
[dir="ltr"] .landing-banner.is-end::before { background: linear-gradient(to left, rgba(11, 26, 58, .92) 0%, rgba(11, 26, 58, .72) 38%, rgba(11, 26, 58, .1) 68%, rgba(11, 26, 58, 0) 100%); }
.landing-banner.is-photo-missing { background: radial-gradient(circle at 80% 20%, rgba(37, 99, 235, .45), transparent 45%), radial-gradient(circle at 20% 90%, rgba(37, 99, 235, .3), transparent 40%), var(--landing-navy); }
.landing-banner.is-photo-missing .landing-banner__photo { display: none; }
.landing-banner__inner { position: relative; display: flex; }
.landing-banner.is-end .landing-banner__inner { justify-content: flex-end; }
.landing-banner__copy { max-width: 520px; padding-block: 64px; }
.landing-banner h2 { color: #fff; font-size: clamp(1.9rem, 3.8vw, 3rem); }
.landing-banner p { margin-top: 14px; color: rgba(255, 255, 255, .86); font-size: 1.02rem; }
.landing-banner__link { display: inline-flex; align-items: center; gap: 8px; margin-top: 22px; color: #fff; font-weight: 700; text-decoration: none; }
.landing-banner__link:hover { text-decoration: underline; }

/* apps */
.landing-apps__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: clamp(40px, 6vw, 96px); }
.landing-apps h2 { font-size: clamp(1.85rem, 3.3vw, 2.7rem); }
.landing-apps__text { margin-top: 16px; color: var(--landing-muted); font-size: 1.02rem; }
.landing-app-list { display: grid; gap: 6px; margin-top: 28px; }
.landing-app { border-bottom: 1px solid var(--landing-line); }
.landing-app summary { display: flex; align-items: center; gap: 14px; padding: 14px 4px; list-style: none; cursor: pointer; font-weight: 700; }
.landing-app summary::-webkit-details-marker { display: none; }
.landing-app summary > i:first-child { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 10px; background: var(--landing-blue-soft); color: var(--landing-blue); font-size: 1rem; }
.landing-app__chevron { margin-inline-start: auto; color: var(--landing-muted); font-size: .8rem; transition: transform var(--landing-fast); }
.landing-app[open] .landing-app__chevron { transform: rotate(180deg); }
.landing-app__body { padding: 0 58px 18px; }
.landing-app__body p { color: var(--landing-muted); font-size: .95rem; }
.landing-app__stores { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 14px; }
.landing-store { display: inline-flex; align-items: center; gap: 10px; padding: 7px 14px; border-radius: 9px; background: #111827; color: #fff; text-decoration: none; direction: ltr; }
.landing-store i { font-size: 1.35rem; }
.landing-store span { display: grid; line-height: 1.1; font-weight: 700; font-size: .92rem; }
.landing-store small { font-size: .62rem; font-weight: 500; opacity: .85; }
.landing-soon { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; padding: 8px 14px; border-radius: 9px; background: var(--landing-tint); color: var(--landing-muted); font-size: .88rem; font-weight: 600; }
.landing-soon bdi { white-space: nowrap; }
.landing-apps__visual { display: flex; justify-content: center; }
.landing-apps__visual .landing-phone { transform: rotate(-4deg); }

/* heading + text */
.landing-text__inner { display: grid; gap: 34px; max-width: 900px; margin-inline: auto; }
.landing-text__copy { text-align: center; }
.landing-text__copy h2 { font-size: clamp(1.85rem, 3.3vw, 2.7rem); }
.landing-text__copy p { margin-top: 16px; color: var(--landing-muted); font-size: 1.05rem; }
.landing-text__copy .landing-btn { margin-top: 28px; }

/* video */
.landing-video__copy { max-width: 760px; margin: 0 auto 30px; text-align: center; }
.landing-video__copy h2 { font-size: clamp(1.85rem, 3.3vw, 2.7rem); }
.landing-video__copy p { margin-top: 14px; color: var(--landing-muted); font-size: 1.02rem; }
.landing-video__frame { position: relative; display: grid; place-items: center; width: min(960px, 100%); aspect-ratio: 16 / 9; margin-inline: auto; border-radius: var(--landing-radius); background: var(--landing-navy); box-shadow: var(--landing-shadow); overflow: hidden; }
.landing-video__poster { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.landing-video__frame.is-photo-missing .landing-video__poster { display: none; }
.landing-video__play { position: relative; z-index: 1; display: grid; place-items: center; width: 84px; height: 84px; border: 0; border-radius: 50%; background: var(--landing-blue); color: #fff; font-size: 1.6rem; box-shadow: 0 18px 40px rgba(15, 23, 42, .35); cursor: pointer; transition: transform var(--landing-fast), background var(--landing-fast); }
.landing-video__play:hover { transform: scale(1.06); background: var(--landing-blue-dark); }
.landing-video__play i { margin-inline-start: 4px; }
.landing-video__frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

/* call to action */
.landing-cta { position: relative; padding: clamp(56px, 8vw, 110px) 0; background: var(--landing-navy); color: #fff; overflow: hidden; isolation: isolate; text-align: center; }
.landing-cta.has-photo::before { content: ''; position: absolute; inset: 0; z-index: -1; background: rgba(11, 26, 58, .74); }
.landing-cta.is-photo-missing .landing-banner__photo { display: none; }
.landing-cta__inner { display: grid; justify-items: center; gap: 16px; max-width: 760px; }
.landing-cta h2 { color: #fff; font-size: clamp(1.9rem, 3.8vw, 3rem); }
.landing-cta p { color: rgba(255, 255, 255, .86); font-size: 1.05rem; }
.landing-cta .landing-btn { margin-top: 12px; }

/* flexible section: media left / right / top / bottom / background */
.landing-flexible { position: relative; isolation: isolate; }
.landing-flexible__grid { display: grid; gap: clamp(32px, 5vw, 80px); align-items: center; }
.landing-flexible.is-media-left .landing-flexible__grid, .landing-flexible.is-media-right .landing-flexible__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.landing-flexible.is-flipped .landing-flexible__visual { order: -1; }
.landing-flexible.is-media-top .landing-flexible__grid, .landing-flexible.is-media-bottom .landing-flexible__grid, .landing-flexible.is-media-none .landing-flexible__grid, .landing-flexible.is-media-background .landing-flexible__grid { grid-template-columns: 1fr; max-width: 900px; }
.landing-flexible.is-media-top .landing-flexible__copy, .landing-flexible.is-media-bottom .landing-flexible__copy, .landing-flexible.is-media-none .landing-flexible__copy { text-align: center; }
.landing-flexible.is-media-top .landing-checklist, .landing-flexible.is-media-bottom .landing-checklist, .landing-flexible.is-media-none .landing-checklist { justify-items: start; max-width: 640px; margin-inline: auto; }
.landing-flexible h2 { font-size: clamp(1.85rem, 3.3vw, 2.7rem); }
.landing-flexible__body { margin-top: 16px; color: var(--landing-muted); font-size: 1.02rem; }
.landing-flexible__copy .landing-btn { margin-top: 30px; }
.landing-flexible.is-media-background { padding: clamp(64px, 9vw, 130px) 0; background: var(--landing-navy); color: #fff; overflow: hidden; }
.landing-flexible.is-media-background::before { content: ''; position: absolute; inset: 0; z-index: -1; background: rgba(11, 26, 58, .74); }
.landing-flexible.is-media-background.is-photo-missing .landing-banner__photo { display: none; }
.landing-flexible.is-media-background h2, .landing-flexible.is-media-background .landing-checklist li { color: #fff; }
.landing-flexible.is-media-background .landing-flexible__body, .landing-flexible.is-media-background .landing-feature__subtitle { color: rgba(255, 255, 255, .86); }
.landing-flexible.is-media-background .landing-kicker { color: rgba(255, 255, 255, .8); }

/* audience tiles */
.landing-audience__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.landing-tile { position: relative; display: flex; flex-direction: column; justify-content: center; min-height: clamp(300px, 30vw, 420px); padding: clamp(32px, 5vw, 72px); color: #fff; overflow: hidden; }
.landing-tile h2 { color: #fff; font-size: clamp(1.6rem, 2.8vw, 2.4rem); }
.landing-tile p { margin-top: 12px; max-width: 460px; color: rgba(255, 255, 255, .82); font-size: 1rem; }
.landing-tile__kicker { margin-bottom: 12px; color: rgba(255, 255, 255, .75); font-size: .88rem; font-weight: 600; }
.landing-tile--brand { background: repeating-linear-gradient(135deg, rgba(255, 255, 255, .06) 0 14px, transparent 14px 28px), var(--landing-blue); }
.landing-tile--dark { background: var(--landing-navy); }
.landing-tile--image { padding: 0; background: #1e293b; }
.landing-tile--image img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.landing-tile--image.is-photo-missing { background: radial-gradient(circle at 30% 30%, rgba(37, 99, 235, .55), transparent 55%), #1e293b; }
.landing-tile--image.is-photo-missing img { display: none; }
.landing-tile .landing-btn { align-self: flex-start; margin-top: 26px; }

/* why + help */
.landing-why { background: var(--landing-page); }
.landing-why__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid var(--landing-line); }
.landing-why__item { padding: clamp(28px, 3vw, 44px) clamp(20px, 2.6vw, 36px); border-inline-start: 1px solid var(--landing-line); }
.landing-why__item:first-child { border-inline-start: 0; }
.landing-why__item > i { display: block; margin-bottom: 20px; color: var(--landing-blue); font-size: 1.9rem; }
.landing-why__item h3 { font-size: 1.15rem; margin-bottom: 10px; }
.landing-why__item p { color: var(--landing-muted); font-size: .96rem; }
.landing-help { background: var(--landing-tint); }
.landing-help__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.landing-help__item { padding: 32px 28px; border: 1px solid var(--landing-line); border-radius: var(--landing-radius); background: #fff; }
.landing-help__icon { display: grid; place-items: center; width: 52px; height: 52px; margin-bottom: 18px; border-radius: 14px; background: var(--landing-blue-soft); color: var(--landing-blue); font-size: 1.25rem; }
.landing-help__item h3 { font-size: 1.15rem; margin-bottom: 8px; }
.landing-help__item p { color: var(--landing-muted); font-size: .95rem; }

/* footer */
.landing-footer { padding: clamp(56px, 7vw, 88px) 0 28px; border-top: 1px solid var(--landing-line); background: #fff; }
.landing-footer__grid { display: grid; grid-template-columns: 1.5fr repeat(4, minmax(0, 1fr)); gap: 40px; }
.landing-footer__brand img { width: 140px; }
.landing-footer__brand p { margin-top: 18px; max-width: 360px; color: var(--landing-muted); font-size: .92rem; }
.landing-footer__label { display: block; margin-bottom: 10px; font-size: .85rem; font-weight: 700; color: var(--landing-navy); }
.landing-footer__apps { margin-top: 26px; }
.landing-footer__stores { display: flex; flex-wrap: wrap; gap: 8px; }
.landing-footer__stores .landing-store { padding: 5px 10px; }
.landing-footer__stores .landing-store i { font-size: 1.1rem; }
.landing-footer__stores .landing-store span { font-size: .8rem; }
.landing-footer__social { margin-top: 22px; }
.landing-footer__social div { display: flex; gap: 8px; }
.landing-footer__social a { display: grid; place-items: center; width: 36px; height: 36px; border: 1px solid var(--landing-line); border-radius: 9px; color: var(--landing-navy); text-decoration: none; }
.landing-footer__social a:hover { color: var(--landing-blue); border-color: #bfd3f2; }
.landing-footer__col h2 { margin-bottom: 12px; font-size: .95rem; }
.landing-footer__col a { display: block; padding: 3px 0; color: var(--landing-muted); font-size: .9rem; text-decoration: none; }
.landing-footer__col a:hover { color: var(--landing-blue); }
.landing-footer__bottom { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-top: 48px; padding-top: 22px; border-top: 1px solid var(--landing-line); color: var(--landing-muted); font-size: .86rem; }
.landing-footer__lang { display: inline-flex; align-items: center; gap: 8px; padding: 6px 10px; border: 0; border-radius: 8px; background: transparent; color: var(--landing-navy); font: 600 .88rem var(--font-family); cursor: pointer; }
.landing-footer__lang:hover { background: var(--landing-tint); }

/* dialogs: plans, demo request, screenshot zoom */
.landing-dialog { position: fixed; inset: 0; z-index: 90; display: grid; place-items: center; padding: 20px; background: rgba(15, 23, 42, .62); backdrop-filter: blur(4px); animation: landing-fade var(--landing-fast) ease-out; font-family: var(--font-family); }
.landing-dialog__panel { position: relative; width: min(100%, 720px); max-height: calc(100vh - 40px); overflow: auto; border-radius: 20px; background: #fff; box-shadow: var(--landing-shadow); animation: landing-rise 260ms var(--landing-ease); }
.landing-dialog--plans .landing-dialog__panel { width: min(100%, 1040px); }
.landing-dialog--screen .landing-dialog__panel { width: min(100%, 1240px); background: transparent; box-shadow: none; overflow: visible; }
.landing-dialog__close { position: absolute; top: 14px; inset-inline-end: 14px; z-index: 2; display: grid; place-items: center; width: 40px; height: 40px; border: 0; border-radius: 50%; background: var(--landing-tint); color: var(--landing-navy); font-size: 1.05rem; cursor: pointer; }
.landing-dialog--screen .landing-dialog__close { top: -48px; inset-inline-end: 0; background: #fff; }
.landing-dialog__body { padding: 36px clamp(20px, 4vw, 44px) 32px; }
.landing-dialog--screen .landing-dialog__body { padding: 0; }
.landing-dialog--screen img { border-radius: 14px; box-shadow: var(--landing-shadow); }
.landing-dialog--screen p { margin-top: 12px; text-align: center; color: #fff; font-size: .95rem; }
.landing-dialog h2 { font-size: 1.6rem; margin-bottom: 8px; }
.landing-dialog__body > p { color: var(--landing-muted); font-size: .96rem; }
.landing-plans__toggle { display: inline-flex; margin: 22px 0 18px; padding: 4px; border: 1px solid var(--landing-line); border-radius: 12px; background: var(--landing-tint); }
.landing-plans__toggle button { min-width: 96px; padding: 8px 14px; border: 0; border-radius: 9px; background: transparent; color: var(--landing-muted); font: 700 .9rem var(--font-family); cursor: pointer; }
.landing-plans__toggle button.is-active { background: #fff; color: var(--landing-navy); box-shadow: 0 4px 12px rgba(15, 23, 42, .08); }
.landing-plans { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 16px; }
.landing-plans__loading { grid-column: 1 / -1; padding: 40px; text-align: center; color: var(--landing-muted); }
.landing-plan { position: relative; display: flex; flex-direction: column; padding: 24px 22px; border: 1px solid var(--landing-line); border-radius: 16px; background: #fff; }
.landing-plan.is-recommended { border-color: var(--landing-blue); box-shadow: 0 18px 40px rgba(37, 99, 235, .14); }
.landing-plan__badge { position: absolute; top: -12px; inset-inline-start: 18px; padding: 4px 12px; border-radius: 999px; background: var(--landing-blue); color: #fff; font-size: .72rem; font-weight: 700; }
.landing-plan h3 { font-size: 1.15rem; }
.landing-plan > p { margin-top: 6px; color: var(--landing-muted); font-size: .86rem; }
.landing-plan__price { margin-top: 16px; display: grid; }
.landing-plan__price strong { color: var(--landing-navy); font-size: 1.8rem; line-height: 1.1; }
.landing-plan__price small { font-size: .95rem; color: var(--landing-muted); }
.landing-plan__price span { color: var(--landing-muted); font-size: .82rem; }
.landing-plan__saving { margin-top: 6px; color: #15803d; font-size: .8rem; font-weight: 700; }
.landing-plan__limits { margin: 18px 0 20px; padding: 0; list-style: none; display: grid; gap: 8px; font-size: .88rem; }
.landing-plan__limits li { display: flex; justify-content: space-between; gap: 12px; color: var(--landing-muted); }
.landing-plan__limits strong { color: var(--landing-navy); }
.landing-plan .landing-btn { margin-top: auto; }
.landing-demo { margin-top: 22px; }
.landing-demo__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.landing-demo label { display: grid; gap: 6px; font-size: .88rem; font-weight: 700; color: var(--landing-navy); }
.landing-demo label.is-wide { grid-column: 1 / -1; }
.landing-demo input, .landing-demo textarea { width: 100%; padding: 11px 14px; border: 1px solid var(--landing-line); border-radius: 10px; font: 500 .95rem var(--font-family); color: var(--landing-ink); background: #fff; transition: border-color var(--landing-fast), box-shadow var(--landing-fast); }
.landing-demo input:focus, .landing-demo textarea:focus { outline: 0; border-color: var(--landing-blue); box-shadow: 0 0 0 4px rgba(37, 99, 235, .12); }
.landing-honeypot { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.landing-demo__status { min-height: 22px; margin: 12px 0; font-size: .9rem; font-weight: 600; }
.landing-demo__status.is-success { color: #15803d; }
.landing-demo__status.is-error { color: #b91c1c; }
.landing-demo .landing-btn--wide { width: 100%; }

/* motion */
.reveal { opacity: 0; transform: translateY(18px); transition: opacity var(--landing-slow) var(--landing-ease), transform var(--landing-slow) var(--landing-ease); transition-delay: var(--delay, 0ms); }
.reveal.is-visible { opacity: 1; transform: none; }
@keyframes landing-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes landing-rise { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) {
    .landing-root *, .landing-dialog { transition: none; animation: none; }
    .reveal { opacity: 1; transform: none; }
    html { scroll-behavior: auto; }
}

/* responsive */
@media (max-width: 1100px) {
    .landing-footer__grid { grid-template-columns: 1.4fr repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 960px) {
    .landing-nav { position: fixed; top: 0; bottom: 0; inset-inline-start: 0; z-index: 60; width: min(340px, 86vw); flex-direction: column; align-items: stretch; gap: 4px; margin: 0; padding: 96px 20px 24px; background: #fff; box-shadow: 0 0 60px rgba(15, 23, 42, .16); transform: translateX(100%); transition: transform 280ms var(--landing-ease); }
    [dir="ltr"] .landing-nav { transform: translateX(-100%); }
    .landing-menu-open .landing-nav { transform: none; }
    .landing-nav > a { padding: 12px 14px; font-size: 1.02rem; }
    .landing-nav__mobile { display: grid; gap: 10px; margin-top: 20px; }
    .landing-drawer-backdrop { display: block; position: fixed; inset: 0; z-index: 50; background: rgba(15, 23, 42, .45); opacity: 0; pointer-events: none; transition: opacity var(--landing-fast); }
    .landing-menu-open .landing-drawer-backdrop { opacity: 1; pointer-events: auto; }
    .landing-menu-toggle { display: inline-grid; position: relative; z-index: 70; }
    .landing-header__login { display: none; }
    .landing-header__cta small { display: none; }
    .landing-feature__grid, .landing-apps__grid { grid-template-columns: 1fr; }
    .landing-feature.is-flipped .landing-feature__visual { order: 0; }
    .landing-feature__visual.has-secondary { padding-bottom: 0; }
    .landing-feature__visual.has-secondary .landing-frame--main { width: 100%; }
    .landing-frame--secondary { display: none; }
    .landing-why__grid { grid-template-columns: 1fr; border-top: 0; }
    .landing-why__item { border-inline-start: 0; border-top: 1px solid var(--landing-line); padding-inline: 0; }
    .landing-help__grid { grid-template-columns: 1fr; }
    .landing-apps__visual { order: -1; }
    .landing-apps__visual .landing-phone { transform: none; width: min(280px, 70%); }
    .landing-flexible.is-media-left .landing-flexible__grid, .landing-flexible.is-media-right .landing-flexible__grid { grid-template-columns: 1fr; }
    .landing-flexible.is-flipped .landing-flexible__visual { order: 0; }
    .landing-video__play { width: 64px; height: 64px; font-size: 1.2rem; }
}
@media (max-width: 720px) {
    .landing-header__inner { gap: 12px; }
    .landing-brand img { width: 124px; }
    .landing-header__cta .landing-btn { min-height: 38px; padding-inline: 12px; font-size: .8rem; }
    .landing-hero { padding-top: 44px; }
    .landing-hero__inner { gap: 18px; }
    .landing-trust { gap: 6px 16px; font-size: .88rem; }
    .landing-checklist { grid-template-columns: 1fr; }
    .landing-banner { min-height: 420px; align-items: flex-end; }
    .landing-banner::before, [dir="ltr"] .landing-banner::before, .landing-banner.is-end::before, [dir="ltr"] .landing-banner.is-end::before { background: linear-gradient(to top, rgba(11, 26, 58, .94) 0%, rgba(11, 26, 58, .7) 50%, rgba(11, 26, 58, .05) 100%); }
    .landing-banner__copy { padding-block: 40px; }
    .landing-audience__grid { grid-template-columns: 1fr; }
    .landing-tile { min-height: 260px; }
    .landing-tile--image { min-height: 300px; }
    .landing-footer__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; }
    .landing-footer__brand { grid-column: 1 / -1; }
    .landing-demo__grid { grid-template-columns: 1fr; }
    .landing-dialog { padding: 12px; }
    .landing-dialog__body { padding: 30px 18px 24px; }
    .landing-app__body { padding-inline: 4px; }
}
@media (max-width: 420px) {
    .landing-container { width: calc(100% - 32px); }
    .landing-header__cta { display: none; }
    .landing-hero h1 { font-size: 1.9rem; }
    .landing-footer__grid { grid-template-columns: 1fr; }
    .landing-preview-bar { font-size: .8rem; padding-inline: 16px; }
}

/* seasonal-themes.css */
/* Seasonal themes — a visual layer over the existing design system (SaaS → المظهر والثيمات).
 * seasonal_theme.js puts validated --season-* custom properties on <html data-seasonal-theme> and these rules map them
 * onto the shell's own tokens (--primary, --ui-brand, --sidebar-*). Only accents change: header, sidebar, buttons,
 * the dashboard banner, the login background and light decorations — never layout, menus, forms, tables or routes.
 * Screen media only: invoices, PDFs, POS receipts and every other print keep their own template engine. The POS screen
 * and the SaaS console are excluded. The SaaS preview (.season-preview) reuses the same variables on a container. */

@media screen {
    /* ---- tokens --------------------------------------------------------------------------------------------- */
    html[data-seasonal-theme] body:not(.saas-console-mode):not(.pos-active) {
        --primary: var(--season-primary);
        --primary-hover: var(--season-primary-hover);
        --primary-light: var(--season-primary-light);
        --secondary: var(--season-secondary);
        --ui-brand: var(--season-button);
        --ui-brand-strong: var(--season-primary-hover);
        --ui-brand-soft: var(--season-primary-light);
        --ui-canvas: var(--season-background);
        --bg-app: var(--season-background);
        --sidebar-accent: var(--season-primary);
        --sidebar-icon: var(--season-primary);
        --sidebar-active-bg: var(--season-sidebar-active-bg);
        --sidebar-active-text: var(--season-sidebar-active-text);
        --sidebar-bg: var(--season-sidebar-bg);
        --bg-sidebar: var(--season-sidebar-bg);
    }

    html[data-seasonal-sidebar="dark"] body:not(.saas-console-mode):not(.pos-active) {
        --sidebar-text-main: var(--season-sidebar-text);
        --sidebar-text-secondary: color-mix(in srgb, var(--season-sidebar-text) 80%, transparent);
        --sidebar-hover-bg: color-mix(in srgb, var(--season-sidebar-text) 11%, transparent);
        --bg-sidebar-hover: color-mix(in srgb, var(--season-sidebar-text) 11%, transparent);
        --sidebar-module-open: color-mix(in srgb, var(--season-sidebar-text) 7%, transparent);
        --sidebar-submenu-bg: color-mix(in srgb, #000 14%, var(--season-sidebar-bg));
        --sidebar-icon: color-mix(in srgb, var(--season-sidebar-text) 70%, var(--season-card-accent));
        --sidebar-border: color-mix(in srgb, var(--season-sidebar-text) 15%, transparent);
        --sidebar-brand: var(--season-sidebar-text);
        --sidebar-scrollbar: color-mix(in srgb, var(--season-sidebar-text) 28%, transparent);
    }

    /* The dark ACCMAN wordmark would disappear on a dark seasonal sidebar. */
    html[data-seasonal-sidebar="dark"] body:not(.saas-console-mode):not(.pos-active) .sidebar-brand-logo { filter: brightness(0) invert(1); }
    html[data-seasonal-sidebar="dark"] body:not(.saas-console-mode):not(.pos-active) .sidebar .nav-section-title.text-muted { color: color-mix(in srgb, var(--season-sidebar-text) 62%, transparent) !important; }
    /* The signed-in user block at the foot of the sidebar has a hard-coded white surface in layout.css. */
    html[data-seasonal-sidebar="dark"] body:not(.saas-console-mode):not(.pos-active) .sidebar-user { background: color-mix(in srgb, #000 16%, var(--season-sidebar-bg)); }
    html[data-seasonal-sidebar="dark"] body:not(.saas-console-mode):not(.pos-active) .sidebar-user__avatar { background: color-mix(in srgb, var(--season-sidebar-text) 16%, transparent); color: var(--season-sidebar-text); }
    html[data-seasonal-sidebar="light"] body:not(.saas-console-mode):not(.pos-active) .sidebar-user { background: var(--season-sidebar-bg); }

    /* ---- decorative pattern (header of the sidebar and the top bar, never behind content) ---------------------- */
    html[data-seasonal-pattern="on"][data-seasonal-sidebar="dark"] body:not(.saas-console-mode):not(.pos-active) .sidebar-header {
        background-image: linear-gradient(color-mix(in srgb, var(--season-sidebar-bg) 40%, transparent), color-mix(in srgb, var(--season-sidebar-bg) 40%, transparent)), var(--season-pattern-image);
        background-size: auto, 64px 64px;
        background-repeat: no-repeat, repeat;
    }

    /* ---- top bar ------------------------------------------------------------------------------------------ */
    html[data-seasonal-theme] body:not(.saas-console-mode):not(.pos-active) .topbar { border-bottom: 3px solid var(--season-header-accent); }
    html[data-seasonal-header="accent"] body:not(.saas-console-mode):not(.pos-active) .topbar { background: color-mix(in srgb, var(--season-header-bg) 96%, transparent); }
    html[data-seasonal-header="solid"] body:not(.saas-console-mode):not(.pos-active) .topbar {
        background: linear-gradient(90deg, var(--season-header-bg), color-mix(in srgb, var(--season-header-bg) 80%, #000));
        color: var(--season-header-text);
        backdrop-filter: none;
        isolation: isolate;
    }
    html[data-seasonal-header="solid"][data-seasonal-pattern="on"] body:not(.saas-console-mode):not(.pos-active) .topbar::before {
        content: "";
        position: absolute;
        inset: 0;
        z-index: -1;
        background-image: var(--season-pattern-image);
        background-size: 56px 56px;
        opacity: .3;
        pointer-events: none;
    }
    html[data-seasonal-header="solid"] body:not(.saas-console-mode):not(.pos-active) .topbar .text-muted,
    html[data-seasonal-header="solid"] body:not(.saas-console-mode):not(.pos-active) .topbar small { color: color-mix(in srgb, var(--season-header-text) 80%, transparent) !important; }
    html[data-seasonal-header="solid"] body:not(.saas-console-mode):not(.pos-active) .topbar #current-user-name { color: var(--season-header-text); }
    html[data-seasonal-header="solid"] body:not(.saas-console-mode):not(.pos-active) .topbar .btn-secondary {
        background: color-mix(in srgb, var(--season-header-text) 14%, transparent);
        border-color: color-mix(in srgb, var(--season-header-text) 22%, transparent);
        color: var(--season-header-text);
    }
    html[data-seasonal-header="solid"] body:not(.saas-console-mode):not(.pos-active) .topbar .btn-secondary:hover,
    html[data-seasonal-header="solid"] body:not(.saas-console-mode):not(.pos-active) .topbar .btn-secondary:focus-visible { background: color-mix(in srgb, var(--season-header-text) 24%, transparent); color: var(--season-header-text); }
    html[data-seasonal-header="solid"] body:not(.saas-console-mode):not(.pos-active) .topbar .btn-link.text-muted { color: var(--season-header-text) !important; }
    /* Menus opened from the bar keep the default surface and ink. */
    html[data-seasonal-header="solid"] body:not(.saas-console-mode):not(.pos-active) .topbar .dropdown-menu,
    html[data-seasonal-header="solid"] body:not(.saas-console-mode):not(.pos-active) .topbar .app-notifications-panel { color: var(--text-main); }
    html[data-seasonal-header="solid"] body:not(.saas-console-mode):not(.pos-active) .topbar .dropdown-menu .text-muted,
    html[data-seasonal-header="solid"] body:not(.saas-console-mode):not(.pos-active) .topbar .dropdown-menu small,
    html[data-seasonal-header="solid"] body:not(.saas-console-mode):not(.pos-active) .topbar .app-notifications-panel .text-muted,
    html[data-seasonal-header="solid"] body:not(.saas-console-mode):not(.pos-active) .topbar .app-notifications-panel small { color: var(--text-muted) !important; }

    /* ---- dashboard banner --------------------------------------------------------------------------------- */
    .season-banner {
        position: relative;
        isolation: isolate;
        overflow: hidden;
        display: flex;
        align-items: center;
        gap: 18px;
        min-height: 150px;
        padding: 22px 30px;
        border-radius: var(--border-radius-lg, 12px);
        color: var(--season-banner-text, #fff);
        background: linear-gradient(90deg, var(--season-primary-hover, #1d4ed8), var(--season-primary, #2563eb));
        box-shadow: var(--shadow-sm);
    }
    .season-banner__art {
        position: absolute;
        inset: 0;
        z-index: -2;
        background: var(--season-banner-image) left center / cover no-repeat;
    }
    /* The artwork keeps its decoration on the far side of the wording (mirrored for English). */
    html[dir="ltr"] .season-banner__art { transform: scaleX(-1); }
    .season-banner::after {
        content: "";
        position: absolute;
        inset: 0;
        z-index: -1;
        background: linear-gradient(to left, color-mix(in srgb, var(--season-primary-hover, #1d4ed8) 78%, transparent) 0%, color-mix(in srgb, var(--season-primary-hover, #1d4ed8) 30%, transparent) 55%, transparent 80%);
    }
    html[dir="ltr"] .season-banner::after { background: linear-gradient(to right, color-mix(in srgb, var(--season-primary-hover, #1d4ed8) 78%, transparent) 0%, color-mix(in srgb, var(--season-primary-hover, #1d4ed8) 30%, transparent) 55%, transparent 80%); }
    .season-banner__badge {
        flex: none;
        width: 72px;
        height: 72px;
        border-radius: 50%;
        background: var(--season-badge-image) center / contain no-repeat;
        box-shadow: 0 6px 18px rgb(0 0 0 / .18);
    }
    .season-banner__copy { display: flex; flex-direction: column; gap: 6px; min-width: 0; text-shadow: 0 1px 2px rgb(0 0 0 / .25); }
    .season-banner__copy strong { font-size: clamp(22px, 2.6vw, 34px); font-weight: var(--weight-bold, 700); line-height: 1.25; }
    .season-banner__copy span { font-size: var(--font-md, 16px); opacity: .95; }

    /* ---- login -------------------------------------------------------------------------------------------- */
    /* The artwork is composed as a full-page background (decoration on the edges, calm in the middle), so it spans
       both columns of the login screen; the form card keeps its own white surface. */
    html[data-seasonal-login="on"] .auth-login-experience {
        background: var(--season-login-image) center / cover no-repeat, var(--season-background);
    }
    html[data-seasonal-login="on"] .auth-login-experience .auth-brand-panel,
    html[data-seasonal-login="on"] .auth-login-experience .auth-form-panel { background: transparent; }
    html[data-seasonal-login="on"] .auth-brand-panel::before { display: none; }
    html[data-seasonal-login="on"] .auth-brand-panel .auth-brand-orb,
    html[data-seasonal-login="on"] .auth-brand-panel .auth-ledger-grid { display: none; }
    /* The artwork stays visible: the occasion caption sits at the top, the brand copy becomes one compact card at the
       bottom (the benefit pills and the footer line are hidden while a theme is shown). */
    html[data-seasonal-login="on"] .auth-brand-panel { display: flex; flex-direction: column; }
    html[data-seasonal-login="on"] .auth-brand-panel .auth-brand-content {
        min-height: 0;
        margin-top: auto;
        padding: 22px 24px;
        background: color-mix(in srgb, var(--season-primary-hover) 84%, transparent);
        border: 1px solid rgb(255 255 255 / .18);
        border-radius: 20px;
        backdrop-filter: blur(6px);
        box-shadow: 0 18px 48px rgb(0 0 0 / .22);
        max-width: 560px;
    }
    html[data-seasonal-login="on"] .auth-brand-panel .auth-brand-message { margin: 16px 0 0; }
    html[data-seasonal-login="on"] .auth-brand-panel .auth-brand-message p,
    html[data-seasonal-login="on"] .auth-brand-panel .auth-benefits,
    html[data-seasonal-login="on"] .auth-brand-panel .auth-brand-foot { display: none; }
    html[data-seasonal-theme][data-seasonal-login="off"] .auth-form-panel {
        background-image: linear-gradient(rgb(247 250 249 / .55), rgb(247 250 249 / .55)), var(--season-pattern-image);
        background-size: auto, 72px 72px;
    }
    /* The login screen's own accent tokens (auth.css) follow the theme; the fields, labels and layout do not change. */
    html[data-seasonal-theme] .auth-overlay {
        --auth-green: var(--season-primary);
        --auth-green-dark: var(--season-primary-hover);
        --auth-green-soft: var(--season-primary-light);
    }
    html[data-seasonal-theme] .auth-primary-btn { background: linear-gradient(135deg, var(--season-button), var(--season-primary-hover)); border-color: var(--season-primary-hover); }
    html[data-seasonal-theme] .auth-primary-btn:hover,
    html[data-seasonal-theme] .auth-primary-btn:focus-visible { background: var(--season-primary-hover); }
    html[data-seasonal-theme] .auth-text-link { color: var(--season-primary-hover); }

    .auth-season-caption {
        display: flex;
        align-items: center;
        gap: 14px;
        color: #fff;
        text-shadow: 0 1px 2px rgb(0 0 0 / .3);
    }
    .auth-season-caption--panel {
        position: relative;
        z-index: 2;
        align-self: flex-start;
        max-width: 560px;
        margin-bottom: 18px;
        padding: 14px 18px;
        border-radius: 18px;
        background: color-mix(in srgb, var(--season-primary-hover) 82%, transparent);
        border: 1px solid rgb(255 255 255 / .2);
        backdrop-filter: blur(6px);
    }
    .auth-season-badge { flex: none; width: 56px; height: 56px; border-radius: 50%; background: var(--season-badge-image) center / contain no-repeat; }
    .auth-season-copy { display: flex; flex-direction: column; gap: 2px; }
    .auth-season-copy strong { font-size: 22px; font-weight: 700; line-height: 1.3; }
    .auth-season-copy span { font-size: 14px; opacity: .95; }
    .auth-season-caption--compact { display: none; }

    /* Phones and the ACCMAN WebView: the brand panel is hidden, so the artwork moves behind the form. */
    @media (max-width: 800px) {
        html[data-seasonal-login="on"] .auth-login-experience { background: var(--season-background); }
        html[data-seasonal-login="on"] .auth-login-experience .auth-form-panel {
            background: linear-gradient(rgb(255 255 255 / .42), rgb(255 255 255 / .62)), var(--season-login-image) center / cover no-repeat;
        }
        .auth-season-caption--compact {
            display: flex;
            margin: 0 auto 14px;
            max-width: 440px;
            padding: 10px 14px;
            border-radius: 14px;
            background: color-mix(in srgb, var(--season-primary-hover) 88%, transparent);
        }
        .auth-season-caption--compact .auth-season-badge { width: 40px; height: 40px; }
        .auth-season-caption--compact strong { font-size: 17px; }
        .auth-season-caption--compact span { font-size: 12.5px; }
        .season-banner { min-height: 112px; padding: 16px 18px; gap: 12px; }
        /* Narrow banners crop the artwork under the wording: a stronger veil keeps the title readable. */
        .season-banner::after { background: linear-gradient(to left, color-mix(in srgb, var(--season-primary-hover, #1d4ed8) 90%, transparent) 0%, color-mix(in srgb, var(--season-primary-hover, #1d4ed8) 62%, transparent) 70%, color-mix(in srgb, var(--season-primary-hover, #1d4ed8) 25%, transparent) 100%); }
        html[dir="ltr"] .season-banner::after { background: linear-gradient(to right, color-mix(in srgb, var(--season-primary-hover, #1d4ed8) 90%, transparent) 0%, color-mix(in srgb, var(--season-primary-hover, #1d4ed8) 62%, transparent) 70%, color-mix(in srgb, var(--season-primary-hover, #1d4ed8) 25%, transparent) 100%); }
        .season-banner__badge { width: 48px; height: 48px; }
    }

    @media (prefers-reduced-transparency: reduce) {
        .auth-season-caption--panel, html[data-seasonal-login="on"] .auth-brand-panel .auth-brand-content { backdrop-filter: none; }
    }

    /* ---- SaaS preview frames (the same variables on a container; nothing global changes) ---------------------- */
    .season-preview { --preview-radius: 14px; border: 1px solid var(--border-color); border-radius: var(--preview-radius); overflow: hidden; background: #f1f5f9; }
    .season-preview__login { position: relative; display: grid; grid-template-columns: 1fr 1fr; min-height: 360px; direction: ltr; }
    .season-preview__login-art { position: relative; background: var(--season-login-image) center / cover no-repeat, var(--season-primary-hover); display: flex; align-items: flex-end; padding: 18px; }
    .season-preview__login-art .auth-season-caption { direction: rtl; padding: 10px 12px; gap: 10px; margin: 0; }
    .season-preview .auth-season-badge { width: 40px; height: 40px; }
    .season-preview .auth-season-copy strong { font-size: 16px; }
    .season-preview .auth-season-copy span { font-size: 12px; }
    .season-preview__login-form { display: flex; align-items: center; justify-content: center; padding: 24px; background: #f7faf9; background-image: var(--season-pattern-image); background-size: 64px; }
    .season-preview__card { width: min(280px, 100%); background: #fff; border-radius: 16px; box-shadow: 0 12px 32px rgb(15 23 42 / .12); padding: 20px; direction: rtl; display: grid; gap: 10px; }
    .season-preview__card img { width: 120px; margin: 0 auto 6px; }
    .season-preview__input { height: 34px; border: 1px solid #dbe3ea; border-radius: 9px; background: #fff; }
    .season-preview__button { height: 36px; border-radius: 9px; background: linear-gradient(135deg, var(--season-button), var(--season-primary-hover)); }
    .season-preview__app { display: grid; grid-template-columns: 1fr 150px; min-height: 380px; background: var(--season-background); direction: rtl; }
    .season-preview__app--dark-sidebar .season-preview__sidebar { background: var(--season-sidebar-bg); color: var(--season-sidebar-text); }
    .season-preview__sidebar { order: 2; background: var(--season-sidebar-bg); color: var(--season-sidebar-text); padding: 12px 10px; display: grid; align-content: start; gap: 6px; border-inline-start: 1px solid rgb(15 23 42 / .08); }
    .season-preview__sidebar-brand { height: 44px; background-image: var(--season-pattern-image); background-size: 40px; border-radius: 8px; display: flex; align-items: center; justify-content: center; font-weight: 700; letter-spacing: 1px; }
    .season-preview__nav { height: 24px; border-radius: 7px; background: color-mix(in srgb, currentColor 10%, transparent); }
    .season-preview__nav.is-active { background: var(--season-sidebar-active-bg); }
    .season-preview__main { order: 1; display: grid; grid-template-rows: auto 1fr; min-width: 0; }
    .season-preview__topbar { height: 46px; display: flex; align-items: center; justify-content: space-between; padding: 0 14px; background: var(--season-header-bg); color: var(--season-header-text); border-bottom: 3px solid var(--season-header-accent); }
    /* As in the shell: the light header and the light sidebar keep the design system's own ink. */
    .season-preview__app:not(.season-preview__app--solid-header) .season-preview__topbar { color: #1e293b; }
    .season-preview__app:not(.season-preview__app--dark-sidebar) .season-preview__sidebar { color: #1e293b; }
    .season-preview__topbar span { width: 26px; height: 26px; border-radius: 50%; background: color-mix(in srgb, currentColor 18%, transparent); display: inline-block; margin-inline-start: 6px; }
    .season-preview__content { padding: 14px; display: grid; gap: 12px; align-content: start; }
    .season-preview__content .season-banner { min-height: 110px; padding: 14px 18px; }
    .season-preview__content .season-banner__copy strong { font-size: 20px; }
    .season-preview__kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
    .season-preview__kpis i { height: 54px; border-radius: 10px; background: #fff; border-top: 3px solid var(--season-card-accent); box-shadow: 0 1px 2px rgb(15 23 42 / .06); }
    .season-preview__chart { height: 110px; border-radius: 10px; background: #fff; box-shadow: 0 1px 2px rgb(15 23 42 / .06); }
    .season-preview--mobile { max-width: 360px; margin-inline: auto; }
    .season-preview--mobile .season-preview__app { grid-template-columns: 1fr; }
    .season-preview--mobile .season-preview__sidebar { display: none; }
    .season-preview--mobile .season-preview__login { grid-template-columns: 1fr; }
    .season-preview--mobile .season-preview__login-art { min-height: 120px; }
    .season-preview--mobile .season-preview__kpis { grid-template-columns: repeat(2, 1fr); }

    /* ---- SaaS: Appearance & Themes pages ------------------------------------------------------------------ */
    .season-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 16px; }
    .season-card { display: flex; flex-direction: column; background: var(--bg-surface, #fff); border: 1px solid var(--border-color); border-radius: 14px; overflow: hidden; box-shadow: var(--shadow-sm); }
    .season-card__thumb { position: relative; aspect-ratio: 16 / 9; background: #e2e8f0 center / cover no-repeat; }
    .season-card__thumb .season-status { position: absolute; top: 10px; inset-inline-start: 10px; }
    .season-card__system { position: absolute; top: 10px; inset-inline-end: 10px; background: rgb(15 23 42 / .72); color: #fff; font-size: 12px; border-radius: 999px; padding: 2px 10px; }
    .season-card__body { padding: 12px 14px; display: grid; gap: 6px; flex: 1; }
    .season-card__body h3 { font-size: var(--font-md, 16px); margin: 0; font-weight: 700; }
    .season-card__meta { color: var(--text-muted); font-size: var(--font-sm, 13.5px); display: flex; flex-wrap: wrap; gap: 4px 12px; }
    .season-card__meta i { margin-inline-end: 4px; }
    .season-card__swatches { display: flex; gap: 6px; }
    .season-card__swatches span { width: 18px; height: 18px; border-radius: 50%; border: 1px solid rgb(15 23 42 / .12); }
    .season-card__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; padding: 10px 12px 12px; border-top: 1px solid var(--border-color); }
    .season-card__actions .saas-btn { font-size: var(--font-sm, 13.5px); padding: 5px 10px; min-height: 32px; gap: 6px; }
    .season-card__actions .dropdown { margin-inline-start: auto; }
    .season-status { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 600; border-radius: 999px; padding: 3px 10px; background: #fff; border: 1px solid currentColor; }
    .season-status::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: currentColor; }
    .season-status--active { color: #047857; }
    .season-status--scheduled { color: #1d4ed8; }
    .season-status--awaiting { color: #b45309; }
    .season-status--inactive { color: #475569; }
    .season-status--expired { color: #9f1239; }
    .season-status--draft { color: #6b7280; border-style: dashed; }
    .season-toolbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 14px; }
    .season-filter { display: flex; flex-wrap: wrap; gap: 6px; }
    .season-filter .btn.active { background: var(--primary-light); color: var(--primary-hover); border-color: var(--primary); }
    .season-editor { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 18px; align-items: start; }
    .season-editor__panel { background: var(--bg-surface, #fff); border: 1px solid var(--border-color); border-radius: 14px; padding: 16px; }
    .season-editor__tabs { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 14px; border-bottom: 1px solid var(--border-color); padding-bottom: 10px; }
    .season-editor__tabs button { border: 0; background: transparent; padding: 6px 12px; border-radius: 8px; color: var(--text-muted); font-weight: 600; }
    .season-editor__tabs button[aria-selected="true"] { background: var(--primary-light); color: var(--primary-hover); }
    .season-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
    .season-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .season-field { display: grid; gap: 4px; font-size: var(--font-sm, 13.5px); }
    .season-field > span { font-weight: 600; color: var(--text-main); }
    .season-field small { color: var(--text-muted); }
    .season-field--wide { grid-column: 1 / -1; }
    .season-color { display: flex; align-items: center; gap: 8px; }
    .season-color input[type="color"] { width: 42px; height: 34px; padding: 2px; border-radius: 8px; border: 1px solid var(--border-color); background: #fff; }
    .season-color input[type="text"] { direction: ltr; font-family: var(--font-family-mono); }
    .season-image-slot { display: grid; grid-template-columns: 96px 1fr; gap: 10px; align-items: center; border: 1px dashed var(--border-color); border-radius: 10px; padding: 8px; }
    .season-image-slot__thumb { width: 96px; height: 60px; border-radius: 8px; background: #e2e8f0 center / cover no-repeat; }
    .season-image-slot__thumb.is-contain { background-size: contain; }
    .season-lock { display: flex; gap: 8px; align-items: flex-start; padding: 10px 12px; border-radius: 10px; background: #fffbeb; color: #92400e; font-size: var(--font-sm, 13.5px); margin-bottom: 12px; }
    .season-warning { display: flex; gap: 8px; align-items: flex-start; padding: 10px 12px; border-radius: 10px; background: #fef2f2; color: #991b1b; font-size: var(--font-sm, 13.5px); margin: 10px 0; }
    .season-scope-picker { display: grid; gap: 8px; }
    .season-chips { display: flex; flex-wrap: wrap; gap: 6px; }
    .season-chip { display: inline-flex; align-items: center; gap: 6px; background: var(--primary-light); color: var(--primary-hover); border-radius: 999px; padding: 3px 10px; font-size: 13px; }
    .season-chip button { border: 0; background: transparent; color: inherit; padding: 0; line-height: 1; }
    .season-results { display: grid; gap: 4px; max-height: 180px; overflow: auto; }
    .season-results button { text-align: start; border: 1px solid var(--border-color); background: #fff; border-radius: 8px; padding: 6px 10px; }
    .season-preview-tabs { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 10px; }
    .season-preview-tabs button { border: 1px solid var(--border-color); background: #fff; border-radius: 8px; padding: 6px 12px; font-size: 13px; }
    .season-preview-tabs button[aria-selected="true"] { border-color: var(--primary); color: var(--primary-hover); background: var(--primary-light); }
    .season-default { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; }
    .season-log-details { font-size: 12.5px; color: var(--text-muted); max-width: 520px; white-space: normal; word-break: break-word; }
    .season-appearance-card { display: grid; grid-template-columns: 180px 1fr; gap: 16px; align-items: center; border: 1px solid var(--border-color); border-radius: 14px; padding: 14px; background: var(--bg-surface, #fff); }
    .season-appearance-card__thumb { aspect-ratio: 16 / 9; border-radius: 10px; background: #e2e8f0 center / cover no-repeat; }
    .season-switch { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 14px; border: 1px solid var(--border-color); border-radius: 12px; margin-top: 12px; }
    @media (max-width: 1100px) { .season-editor { grid-template-columns: 1fr; } }
    @media (max-width: 720px) {
        .season-grid, .season-grid--3, .season-default { grid-template-columns: 1fr; }
        .season-appearance-card { grid-template-columns: 1fr; }
        .season-preview__login { grid-template-columns: 1fr; }
        .season-preview__app { grid-template-columns: 1fr; }
        .season-preview__sidebar { display: none; }
    }
}