:root {
  color-scheme: light;
  --ink: #202a35;
  --muted: #718096;
  --line: #e4eaf1;
  --surface: #ffffff;
  --page: #f4f7fb;
  --blue: #1769aa;
  --blue-dark: #104f82;
  --radius: 14px;
}

* { box-sizing: border-box; }
html { min-height: 100%; background: var(--page); }
body { min-height: 100vh; margin: 0; color: var(--ink); background: var(--page); font-family: "Segoe UI", system-ui, sans-serif; }
a { color: var(--blue); text-decoration: none; }
a:hover { color: var(--blue-dark); }
.topbar { min-height: 70px; padding: 0 4vw; display: flex; align-items: center; justify-content: space-between; gap: 28px; background: var(--surface); border-bottom: 1px solid var(--line); }
.brand { display: inline-flex; align-items: center; gap: 10px; color: var(--ink); font-size: 19px; font-weight: 750; white-space: nowrap; }
.brand-mark { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 16px; color: white; background: linear-gradient(145deg, #287fc0, #125382); font-weight: 800; letter-spacing: -.08em; }
.brand-mark.small { width: 34px; height: 34px; border-radius: 11px; font-size: 13px; }
.main-nav { display: flex; flex: 1; justify-content: center; gap: 7px; }
.main-nav a { padding: 10px 12px; border-radius: 9px; color: #455568; font-size: 14px; font-weight: 600; white-space: nowrap; }
.main-nav a:hover { background: #edf4fa; color: var(--blue-dark); }
.account-menu { display: flex; align-items: center; justify-content: flex-end; gap: 10px; white-space: nowrap; }
.account-name { font-size: 13px; font-weight: 650; }
.account-role { color: var(--muted); font-size: 12px; }
.app-container { max-width: 1500px; margin: 0 auto; padding: 34px 4vw 64px; }
.page-heading { display: flex; justify-content: space-between; align-items: center; margin-bottom: 22px; }
.page-heading h1, .login-card h1 { margin: 0; font-weight: 750; letter-spacing: -.035em; }
.eyebrow { margin: 0 0 5px; color: var(--blue); font-size: 11px; font-weight: 800; letter-spacing: .12em; }
.muted { margin: 7px 0 0; color: var(--muted); }
.metric-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(155px, 1fr)); gap: 14px; }
.metric-card, .panel, .form-card, .login-card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: 0 3px 12px #233e5808; }
.metric-card { min-height: 102px; padding: 17px 19px; display: flex; flex-direction: column; gap: 8px; }
.metric-card span { color: var(--muted); font-size: 12px; font-weight: 650; }
.metric-card strong { font-size: 23px; letter-spacing: -.025em; }
.content-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.chart-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.chart-panel { min-width: 0; overflow: hidden; }
.bar-chart { display: flex; align-items: flex-end; justify-content: space-around; gap: 8px; height: 215px; padding: 14px 3px 0; border-bottom: 1px solid var(--line); }
.bar-column { display: flex; flex: 1; min-width: 0; height: 100%; flex-direction: column; align-items: center; justify-content: flex-end; gap: 6px; }
.bar-value, .bar-label { overflow: hidden; max-width: 100%; color: var(--muted); font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.bar { width: min(34px, 75%); min-height: 3px; border-radius: 6px 6px 0 0; }
.sales-bar { background: linear-gradient(180deg, #55a7dd, #1769aa); }
.orders-bar { background: linear-gradient(180deg, #73c6a0, #248355); }
.panel { min-width: 0; padding: 18px 20px; }
.panel-heading { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 12px; }
.panel-heading h2 { margin: 0; font-size: 16px; font-weight: 700; }
.panel-heading > span { color: var(--muted); font-size: 12px; }
.panel .table { margin: 0; font-size: 12px; }
.panel .table thead { color: var(--muted); }
.empty-state { padding: 22px 0; color: var(--muted); text-align: center; }
.login-shell { min-height: 100vh; display: grid; place-items: center; padding: 22px; }
.login-card { width: min(100%, 420px); padding: 34px; }
.login-card .brand-mark { margin-bottom: 22px; }
.login-card h1 { font-size: 28px; }
.login-card label:not(.remember-row) { display: block; margin: 14px 0 6px; font-size: 13px; font-weight: 650; }
.remember-row { display: flex; gap: 9px; align-items: center; margin-top: 16px; color: #536276; font-size: 13px; }
.remember-row input { width: 16px; height: 16px; }
.form-card { padding: 22px; margin-bottom: 18px; }
.form-card h2 { margin: 0 0 16px; font-size: 17px; font-weight: 700; }
.table { --bs-table-bg: transparent; }
.table:not(.print-items):not(.size-list) { border-collapse: collapse; color: #535a64; font-size: 10px; vertical-align: middle; }
.table:not(.print-items):not(.size-list) thead { color: #9298a2; background: #fcfcfd; }
.table:not(.print-items):not(.size-list) th { height: 39px; padding: 0 11px; border-bottom: 1px solid #eef0f2; font-size: 9px; font-weight: 600; white-space: nowrap; }
.table:not(.print-items):not(.size-list) td { height: 54px; padding: 7px 11px; border-top: 1px solid #f0f1f3; color: #535a64; }
.table:not(.print-items):not(.size-list) tbody tr:hover { background: #fafbfc; }
.table-responsive { border-top: 1px solid #eef0f2; }
.field-label { display: block; margin-bottom: 6px; font-size: 13px; font-weight: 650; }
.validation-summary-valid { display: none; }
.section-tabs { display: flex; gap: 7px; margin: 0 0 18px; overflow-x: auto; }
.section-tabs a { padding: 9px 13px; border: 1px solid var(--line); border-radius: 9px; background: var(--surface); color: #455568; font-size: 13px; font-weight: 650; white-space: nowrap; }
.section-tabs a.active { border-color: var(--blue); color: white; background: var(--blue); }
.admin-grid { display: block; }
.admin-catalog-actions { display: flex; align-items: center; gap: 10px; }
.admin-editor-modal .modal-content { border: 1px solid var(--line); border-radius: var(--radius); color: var(--ink); background: var(--surface); }
.admin-editor-modal .modal-dialog { height: auto; max-height: calc(100vh - 2rem); margin: 1rem auto; }
.admin-editor-modal .modal-dialog { max-width: 520px; }
.admin-editor-modal[data-section="products"] .modal-dialog { max-width: 720px; }
.admin-editor-modal[data-section="users"] .modal-dialog { max-width: 640px; }
.admin-editor-modal .modal-content { height: auto; max-height: calc(100vh - 2rem); overflow: hidden; }
.admin-editor-modal .modal-header,
.admin-editor-modal .modal-footer { flex: 0 0 auto; }
.admin-editor-modal .modal-body { min-height: 0; max-height: calc(100vh - 11rem); flex: 0 1 auto; overflow-y: auto; overscroll-behavior: contain; }
.admin-editor-modal .modal-header,
.admin-editor-modal .modal-footer { border-color: var(--line); }
.admin-editor-modal .modal-header .btn-close { margin-left: auto; }
.admin-editor-modal .form-stack { gap: 9px; }
.admin-editor-modal .form-stack > label:not(.checkbox-row) { margin-top: 3px; }
.admin-editor-modal .form-stack input:not([type="checkbox"]),
.admin-editor-modal .form-stack select,
.admin-editor-modal .form-stack textarea { border-color: var(--line); color: var(--ink); background: var(--surface); }
.card-panel { min-width: 0; padding: 20px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); box-shadow: 0 3px 12px #233e5808; }
.card-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 15px; }
.card-heading h2 { margin: 0; font-size: 18px; font-weight: 700; }
.count-badge { display: grid; min-width: 32px; height: 32px; place-items: center; padding: 0 8px; border-radius: 18px; background: #edf4fa; color: var(--blue-dark); font-size: 12px; font-weight: 700; }
.data-table { margin: 0; font-size: 13px; vertical-align: middle; }
.data-table th { color: var(--muted); font-size: 11px; text-transform: uppercase; }
.table-actions { display: flex; align-items: center; justify-content: flex-end; gap: 6px; white-space: nowrap; }
.table-actions form { display: inline-flex; margin: 0; }
.table-actions .btn { display: inline-flex; min-height: 29px; align-items: center; justify-content: center; padding: 4px 8px; border-radius: 6px; font-size: 11px; line-height: 1.2; text-align: center; }
.status-pill { display: inline-block; padding: 4px 8px; border-radius: 12px; font-size: 11px; font-weight: 700; }
.status-active { color: #17623c; background: #e3f5eb; }
.status-inactive { color: #7a4c10; background: #fff0d6; }
.form-stack { display: grid; gap: 7px; }
.form-stack > label:not(.checkbox-row) { margin-top: 4px; font-size: 12px; font-weight: 650; }
.form-stack input:not([type="checkbox"]), .form-stack select, .form-stack textarea { width: 100%; min-width: 0; padding: 9px 10px; border: 1px solid #d5dee8; border-radius: 8px; background: white; color: var(--ink); }
.report-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.report-card { display: flex; min-height: 300px; flex-direction: column; align-items: flex-start; }
.report-card-icon { display: grid; width: 42px; height: 42px; place-items: center; margin-bottom: 19px; border-radius: 12px; color: #1769aa; background: #eaf4fb; }
.report-card-icon.baking { color: #26734d; background: #eaf6ef; }
.report-card-icon svg { width: 21px; height: 21px; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.report-card h2 { margin: 0; font-size: 19px; font-weight: 750; }
.report-card > .muted { max-width: 480px; margin-bottom: 22px; line-height: 1.55; }
.report-form { display: grid; width: 100%; grid-template-columns: minmax(0, 1fr); gap: 9px; margin-top: auto; }
.report-form .field-label { margin: 0; }
.report-form .form-control { max-width: 300px; }
.report-form .btn { justify-self: start; margin-top: 4px; }
.report-note { display: flex; align-items: center; justify-content: space-between; gap: 15px; margin-top: 18px; padding: 17px 20px; border: 1px solid var(--line); border-radius: var(--radius); background: #fff; }
.report-note div { display: grid; gap: 4px; }
.report-note strong { font-size: 14px; }
.report-note span { color: var(--muted); font-size: 12px; }
.checkbox-row { display: flex; align-items: center; gap: 8px; margin: 7px 0; font-size: 13px; font-weight: 600; }
.checkbox-row input { width: 16px; height: 16px; }
code { color: var(--blue-dark); }
.print-actions { display: flex; justify-content: flex-end; gap: 8px; margin-bottom: 16px; }
.print-document { max-width: 900px; margin: 0 auto; padding: 34px; border: 1px solid var(--line); border-radius: var(--radius); background: white; box-shadow: 0 3px 12px #233e5808; }
.print-title { display: flex; align-items: center; gap: 16px; padding-bottom: 20px; border-bottom: 2px solid var(--line); }
.print-title h1 { margin: 0; font-size: 24px; }
.print-title > strong { margin-left: auto; font-size: 20px; }
.print-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 22px; padding: 24px 0; }
.print-fields div { min-width: 0; }
.print-fields dt { color: var(--muted); font-size: 11px; font-weight: 700; text-transform: uppercase; }
.print-fields dd { margin: 3px 0 0; overflow-wrap: anywhere; }
@media (max-width: 1120px) {
  .topbar { flex-wrap: wrap; padding: 13px 4vw; gap: 10px; }
  .main-nav { order: 3; width: 100%; justify-content: flex-start; overflow-x: auto; }
}
@media (max-width: 760px) {
  .report-grid { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .report-card { min-height: 0; }
  .report-note { align-items: flex-start; flex-direction: column; }
  .content-grid { grid-template-columns: 1fr; }
  .chart-grid { grid-template-columns: 1fr; }
  .admin-editor-modal .modal-dialog { width: auto; max-width: none !important; height: auto; max-height: calc(100vh - 24px); margin: 12px; }
  .admin-editor-modal .modal-content { max-height: calc(100vh - 24px); }
  .admin-editor-modal .modal-body { max-height: calc(100vh - 10rem); }
  .account-role { display: none; }
  .app-container { padding-top: 22px; }
  .metric-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .print-document { padding: 20px; }
  .print-fields { grid-template-columns: 1fr; }
}
@media print {
  .topbar, .print-actions { display: none !important; }
  .app-container { max-width: none; padding: 0; }
  .print-document { max-width: none; padding: 0; border: 0; box-shadow: none; }
}

:root {
  color-scheme: light;
  --bg-body: #f7f8fa;
  --text-main: #1b1d21;
  --text-muted: #858b96;
  --border-color: #e7e9ed;
  --primary: #1a1a1a;
  --surface: #fff;
  --success: #16875a;
  --warning: #a76b08;
  --radius: 12px;
  --shadow-card: 0 2px 8px rgba(20, 28, 40, .035);
  font-family: Inter, "Segoe UI", sans-serif;
}

html, body { min-height: 100%; background: var(--bg-body); color: var(--text-main); }
body { font-family: Inter, "Segoe UI", sans-serif; font-size: 13px; }
svg { width: 20px; height: 20px; flex: 0 0 auto; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
a { color: inherit; }
a:hover { color: inherit; }
.app-container { display: flex; max-width: none; min-height: 100vh; margin: 0; padding: 0; }
.sidebar {
  position: fixed; z-index: 30; inset: 0 auto 0 0; display: flex; width: 260px; flex-direction: column;
  padding: 25px 16px 15px; border-right: 1px solid var(--border-color); background: var(--surface);
}
.sidebar-brand { display: flex; align-items: center; gap: 11px; padding: 0 7px 25px; color: var(--text-main); font-size: 17px; font-weight: 750; letter-spacing: -.035em; }
.sidebar-brand:hover { color: var(--text-main); }
.sidebar-logo { display: block; width: 35px; height: 35px; flex: 0 0 auto; border-radius: 9px; object-fit: contain; }
.sidebar-nav { flex: 1; overflow: auto; padding-bottom: 15px; }
.sidebar-section-title { margin: 20px 8px 8px; color: #9a9faa; font-size: 10px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.sidebar-section-title:first-child { margin-top: 0; }
.sidebar-link { display: flex; min-height: 40px; align-items: center; gap: 12px; margin: 3px 0; padding: 0 10px; border-radius: 8px; color: #636a75; font-size: 12px; font-weight: 550; transition: color .16s, background .16s; }
.sidebar-link svg { width: 18px; height: 18px; color: #8a909a; }
.sidebar-link:hover { background: #f6f7f8; color: var(--text-main); }
.sidebar-link.active { background: #f0f1f3; color: var(--text-main); font-weight: 650; }
.sidebar-link.active svg { color: var(--text-main); }
.sidebar-account { display: flex; min-height: 58px; align-items: center; gap: 10px; padding: 12px 2px 0; border-top: 1px solid var(--border-color); }
.user-avatar { display: inline-grid; width: 34px; height: 34px; flex: 0 0 auto; place-items: center; border: 1px solid #e0d8ca; border-radius: 50%; color: #685a43; background: #eee7da; font-size: 10px; font-weight: 750; }
.sidebar-user-copy { display: flex; min-width: 0; flex: 1; flex-direction: column; gap: 3px; }
.sidebar-user-copy strong { overflow: hidden; font-size: 11px; font-weight: 650; text-overflow: ellipsis; white-space: nowrap; }
.sidebar-user-copy small { overflow: hidden; color: var(--text-muted); font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.sidebar-nav > form { margin: 2px 0 0; }
.sidebar-link.sidebar-logout-link { width: 100%; border: 0; text-align: left; background: transparent; cursor: pointer; }
.sidebar-link.sidebar-logout-link:hover { background: #f6f7f8; }
.main-content { display: flex; min-width: 0; min-height: 100vh; width: calc(100% - 260px); flex-direction: column; margin-left: 260px; }
.topbar { position: sticky; z-index: 20; top: 0; display: flex; min-height: 66px; align-items: center; justify-content: space-between; gap: 18px; padding: 0 36px; border-bottom: 1px solid var(--border-color); background: rgba(255,255,255,.94); }
.breadcrumb { display: flex; align-items: center; gap: 9px; color: #969ca6; font-size: 12px; white-space: nowrap; }
.breadcrumb svg { width: 15px; height: 15px; }
.breadcrumb strong { color: var(--text-main); font-weight: 600; }
.topbar-actions { display: flex; align-items: center; gap: 12px; }
.table-search { display: flex; height: 36px; align-items: center; gap: 8px; padding: 0 10px; border: 1px solid var(--border-color); border-radius: 8px; background: #fff; color: #9298a2; }
.table-search svg { width: 16px; height: 16px; }
.table-search input { width: 100%; min-width: 0; border: 0; outline: 0; color: var(--text-main); background: transparent; font: inherit; font-size: 11px; }
.table-search input::placeholder { color: #a0a5ad; }
.icon-button { display: inline-grid; width: 35px; height: 35px; flex: 0 0 auto; place-items: center; padding: 0; border: 1px solid transparent; border-radius: 8px; color: #666d77; background: transparent; cursor: pointer; }
.icon-button:hover { border-color: var(--border-color); color: var(--text-main); background: #f8f9fa; }
.icon-button svg { width: 18px; height: 18px; }
.notification-button { position: relative; }
.notification-count { position: absolute; top: -4px; right: -5px; display: grid; min-width: 18px; height: 18px; place-items: center; padding: 0 4px; border: 2px solid #fff; border-radius: 10px; color: #fff; background: #e5484d; font-size: 9px; font-weight: 750; line-height: 1; }
.top-avatar { width: 31px; height: 31px; margin-left: 2px; }
.mobile-menu-toggle, .sidebar-backdrop { display: none; }
.page-content { width: 100%; max-width: 1680px; flex: 1; margin: 0 auto; padding: 29px 36px 46px; }
.dashboard-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin-bottom: 23px; }
.dashboard-heading h1 { margin: 0; color: var(--text-main); font-size: clamp(24px, 2.2vw, 30px); font-weight: 650; letter-spacing: -.045em; }
.dashboard-heading .eyebrow { margin-bottom: 7px; color: #8a909a; font-size: 9px; letter-spacing: .12em; }
.dashboard-heading .muted { margin-top: 7px; color: #969ba4; font-size: 11px; }
.dashboard-actions { display: flex; align-items: center; gap: 8px; }
.period-select, .date-chip { position: relative; display: inline-flex; height: 36px; align-items: center; gap: 8px; padding: 0 11px; border: 1px solid var(--border-color); border-radius: 8px; color: #535a64; background: #fff; font-size: 11px; white-space: nowrap; }
.period-select select { appearance: none; padding-right: 19px; border: 0; outline: 0; color: inherit; background: transparent; font: inherit; cursor: pointer; }
.month-select-form { margin: 0; }
.period-select input[type="month"] { width: 125px; padding: 0; border: 0; outline: 0; color: inherit; background: transparent; font: inherit; cursor: pointer; }
.period-select svg { position: absolute; right: 7px; width: 13px; height: 13px; pointer-events: none; }
.date-chip svg { width: 15px; height: 15px; color: #7e8490; }
.button-primary, .button-secondary { display: inline-flex; min-height: 36px; align-items: center; justify-content: center; gap: 8px; padding: 0 12px; border: 1px solid var(--primary); border-radius: 8px; color: #fff; background: var(--primary); font-size: 11px; font-weight: 550; white-space: nowrap; transition: opacity .15s; }
.button-primary:hover { color: #fff; opacity: .83; }
.button-primary svg, .button-secondary svg { width: 15px; height: 15px; }
.button-secondary { border-color: var(--border-color); color: #41464f; background: #fff; }
.button-secondary:hover { border-color: #cdd0d5; color: var(--text-main); background: #fafafa; }
.dashboard-alert { margin: 0 0 16px; padding: 11px 14px; border: 1px solid #dbe7fc; border-radius: 9px; color: #28589b; background: #eff5ff; font-size: 12px; }
.dashboard-alert.error { border-color: #f1cdcd; color: #a53d3d; background: #fff2f2; }
.dashboard-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.dashboard-metric, .dashboard-panel { min-width: 0; border: 1px solid var(--border-color); border-radius: var(--radius); background: var(--surface); box-shadow: var(--shadow-card); }
.dashboard-metric { min-height: 142px; padding: 16px 17px 13px; }
.metric-topline, .metric-bottom { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.metric-label { color: #7f8590; font-size: 10px; font-weight: 550; }
.metric-icon { display: grid; width: 30px; height: 30px; flex: 0 0 auto; place-items: center; border-radius: 9px; }
.metric-icon svg { width: 16px; height: 16px; }
.metric-icon.blue { color: #346bd8; background: #edf3ff; }
.metric-icon.violet { color: #775bc6; background: #f2effc; }
.metric-icon.amber { color: #ae7718; background: #fff5e1; }
.metric-icon.green { color: #14845a; background: #eaf7f1; }
.metric-value { display: block; overflow: hidden; margin: 11px 0 9px; color: #1b1d21; font-size: clamp(22px, 2vw, 27px); font-weight: 650; letter-spacing: -.055em; text-overflow: ellipsis; white-space: nowrap; }
.metric-bottom { min-height: 27px; }
.metric-trend, .metric-caption { display: block; color: #9399a3; font-size: 9px; white-space: nowrap; }
.metric-trend { font-weight: 600; }
.trend-positive { color: #16875a; }
.trend-negative { color: #c2413b; }
.trend-neutral { color: #8b9099; }
.metric-sparkline { width: 76px; height: 27px; overflow: visible; }
.metric-sparkline polyline { fill: none; stroke: #3472e5; stroke-width: 2.3; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.metric-sparkline.violet-line polyline { stroke: #8b72d4; }
.metric-sparkline.amber-line polyline { stroke: #d99a2b; }
.metric-sparkline.green-line polyline { stroke: #249a6b; }
.document-counts { margin-top: 17px; padding: 17px 19px 19px; border: 1px solid var(--border-color); border-radius: var(--radius); background: rgba(255, 255, 255, .72); }
.document-counts-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 13px; }
.document-counts-heading h2 { margin: 0; color: #25272c; font-size: 13px; font-weight: 650; }
.document-counts-heading > span { color: #9399a3; font-size: 10px; }
.document-count-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.document-count-card { display: flex; min-width: 0; min-height: 75px; align-items: center; gap: 12px; padding: 12px 14px; border: 1px solid #edf0f3; border-radius: 10px; background: #fff; }
.document-count-icon { display: grid; width: 34px; height: 34px; flex: 0 0 auto; place-items: center; border-radius: 10px; }
.document-count-icon svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.document-count-icon.violet { color: #775bc6; background: #f2effc; }
.document-count-icon.blue { color: #346bd8; background: #edf3ff; }
.document-count-icon.amber { color: #ae7718; background: #fff5e1; }
.document-count-card > div { display: grid; min-width: 0; gap: 4px; }
.document-count-card > div span { overflow: hidden; color: #818894; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.document-count-card strong { color: #25272c; font-size: 20px; font-weight: 650; letter-spacing: -.04em; line-height: 1; }
.document-trend-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-top: 20px; }
.document-trend-heading h3 { margin: 0; color: #25272c; font-size: 12px; font-weight: 650; }
.document-trend-heading > span { color: #9399a3; font-size: 10px; }
.document-trend-chart { height: 190px; margin-top: 10px; }
.dashboard-charts { display: grid; grid-template-columns: minmax(0, 2fr) minmax(280px, 1fr); gap: 16px; margin-top: 17px; }
.dashboard-panel { padding: 19px 20px; }
.dashboard-panel-heading { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.dashboard-panel-heading h2 { margin: 0; color: #25272c; font-size: 14px; font-weight: 650; letter-spacing: -.02em; }
.panel-kicker { margin: 0 0 5px; color: #959ba5; font-size: 9px; font-weight: 700; letter-spacing: .1em; }
.chart-legend { display: flex; align-items: center; gap: 15px; color: #777e88; font-size: 10px; }
.chart-legend > span, .breakdown-legend span { display: inline-flex; align-items: center; gap: 7px; }
.legend-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; }
.revenue-dot { background: #2563eb; }
.collected-dot { background: #16a36a; }
.outstanding-dot { background: #f3b642; }
.chart-summary { display: flex; align-items: baseline; gap: 9px; margin: 15px 0 2px; }
.chart-summary strong { color: #25272c; font-size: 20px; font-weight: 650; letter-spacing: -.04em; }
.chart-summary span { color: #9a9fa8; font-size: 10px; }
.chart-canvas-wrap { position: relative; width: 100%; }
.large-chart { height: 215px; margin-top: 8px; }
.breakdown-panel { display: flex; flex-direction: column; }
.panel-icon { display: grid; width: 31px; height: 31px; place-items: center; border-radius: 9px; color: #6f7a8a; background: #f2f4f6; }
.panel-icon svg { width: 16px; height: 16px; }
.breakdown-total { display: flex; flex-direction: column; gap: 4px; margin-top: 20px; }
.breakdown-total span { color: #8e949e; font-size: 10px; }
.breakdown-total strong { color: #25272c; font-size: 20px; font-weight: 650; letter-spacing: -.04em; }
.doughnut-chart { width: 150px; height: 150px; align-self: center; margin: 2px auto 3px; }
.breakdown-legend { display: grid; gap: 10px; margin-top: auto; padding-top: 11px; border-top: 1px solid #f0f1f3; }
.breakdown-legend > div { display: flex; align-items: center; justify-content: space-between; gap: 12px; color: #69717c; font-size: 10px; }
.breakdown-legend strong { color: #33373d; font-size: 10px; font-weight: 600; }
.transactions-panel { margin-top: 17px; padding: 18px 0 0; }
.transactions-heading { align-items: flex-end; padding: 0 20px 15px; }
.table-subtitle { display: block; margin-top: 5px; color: #969ba4; font-size: 10px; }
.transaction-controls { display: flex; align-items: center; gap: 8px; }
.table-search { width: 185px; height: 34px; }
.transactions-scroll { overflow-x: auto; border-top: 1px solid #eef0f2; }
.transactions-table { width: 100%; border-collapse: collapse; color: #535a64; font-size: 10px; text-align: left; }
.transactions-table thead { color: #9298a2; background: #fcfcfd; }
.transactions-table th { height: 39px; padding: 0 11px; font-size: 9px; font-weight: 600; white-space: nowrap; }
.transactions-table td { height: 54px; padding: 7px 11px; border-top: 1px solid #f0f1f3; vertical-align: middle; }
.transactions-table tbody tr:hover { background: #fafbfc; }
.transactions-table input[type=checkbox] { width: 14px; height: 14px; accent-color: #26282d; vertical-align: middle; }
.folio-cell { color: #555c66; font-weight: 600; white-space: nowrap; }
.customer-name { display: block; overflow: hidden; max-width: 190px; color: #34383f; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.cell-subtitle { display: block; margin-top: 4px; color: #a0a5ad; font-size: 9px; }
.product-cell { overflow: hidden; max-width: 220px; color: #626873; text-overflow: ellipsis; white-space: nowrap; }
.numeric { text-align: right !important; white-space: nowrap; }
.revenue-cell { color: #33373d; font-weight: 600; }
.transaction-status { display: inline-flex; align-items: center; gap: 6px; padding: 5px 8px; border-radius: 20px; font-size: 9px; font-weight: 600; white-space: nowrap; }
.transaction-status i { width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.transaction-status.success { color: #16875a; background: #eaf7f1; }
.transaction-status.pending { color: #a76b08; background: #fff5e1; }
.transaction-status.refunded { color: #747b85; background: #f0f1f3; }
.document-type-badge { display: inline-flex; align-items: center; min-height: 22px; padding: 3px 8px; border-radius: 20px; color: #245d86; background: #edf5fb; font-size: 9px; font-weight: 650; white-space: nowrap; }
.document-type-badge.baking { color: #79551c; background: #fff4df; }
.document-type-badge.sales { color: #16714e; background: #eaf7f1; }
.document-type-badge.products { color: #245d86; background: #edf5fb; }
.row-action { display: inline-grid; width: 28px; height: 28px; place-items: center; border-radius: 7px; color: #747b85; }
.row-action:hover { color: #1f2227; background: #f0f1f3; }
.row-action svg { width: 15px; height: 15px; }
.dashboard-lists { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-top: 17px; }
.dashboard-lists .compact-panel { grid-column: 1 / -1; }
.compact-panel { padding: 17px 19px; }
.compact-panel .table-responsive { overflow-x: auto; margin-top: 13px; }
.compact-panel .table { --bs-table-bg: transparent; margin: 0; font-size: 10px; }
.compact-panel .table th { color: #9298a2; font-weight: 600; }
.compact-panel .table td { color: #606671; }
.compact-panel .empty-state { margin: 0; padding: 19px 0; font-size: 11px; }
.upcoming-deliveries-panel { margin-top: 18px; padding: 20px 22px; border-color: #c8dcf2; background: linear-gradient(115deg, #f4f9ff 0%, #fff 62%); box-shadow: 0 5px 18px rgba(23, 105, 170, .08); }
.upcoming-deliveries-heading { align-items: center; margin-bottom: 8px; }
.upcoming-deliveries-heading h2 { margin: 0; color: #174f78; font-size: 19px; font-weight: 700; }
.upcoming-deliveries-heading .table-subtitle { display: block; margin-top: 5px; }
.upcoming-deliveries-actions { display: flex; align-items: center; gap: 10px; }
.upcoming-deliveries-panel .panel-count { min-width: 0; height: 30px; color: #14558a; background: #e2f0fd; font-size: 11px; }
.upcoming-deliveries-panel .table-responsive { overflow-x: auto; margin-top: 12px; border-top: 1px solid #eef0f2; }
.upcoming-deliveries-panel .table { margin: 0; }
.upcoming-deliveries-panel .table td:last-child, .upcoming-deliveries-panel .table th:last-child { text-align: center; }
.upcoming-deliveries-panel .table-search { width: clamp(190px, 24vw, 270px); }
.upcoming-table { min-width: 900px; }
.upcoming-table th { height: 42px; }
.upcoming-table td { height: 58px; }
.upcoming-table tbody tr[hidden] { display: none; }
.upcoming-table tbody tr[data-sort-status="1"] { color: #858b94; background: #fbfbfc; }
.upcoming-table tbody tr[data-sort-status="1"] .customer-name,
.upcoming-table tbody tr[data-sort-status="1"] .revenue-cell { color: #777e88; }
.table-sort-button { display: inline-flex; align-items: center; gap: 5px; padding: 5px 0; border: 0; color: inherit; background: transparent; font: inherit; font-weight: 650; cursor: pointer; }
.table-sort-button:hover, .table-sort-button:focus-visible { color: #174f78; }
.table-sort-button span { color: #a0a6af; font-size: 11px; }
.upcoming-table th[aria-sort="ascending"] .table-sort-button span::after { content: "↑"; }
.upcoming-table th[aria-sort="descending"] .table-sort-button span::after { content: "↓"; }
.upcoming-table th[aria-sort] .table-sort-button span { font-size: 0; }
.upcoming-table .upcoming-actions-heading { text-align: center; }
.upcoming-row-actions { display: flex; align-items: center; justify-content: center; gap: 5px; white-space: nowrap; }
.upcoming-row-actions form { display: inline-flex; margin: 0; }
.delivery-action { display: inline-grid; width: 28px; height: 28px; place-items: center; border: 0; border-radius: 7px; color: #16875a; background: #eaf7f1; cursor: pointer; }
.delivery-action:hover { color: #fff; background: #16875a; }
.delivery-action svg { width: 15px; height: 15px; }
.delivered-action-label { color: #87909b; font-size: 9px; }
.deliveries-page { max-width: 1440px; margin: 0 auto; }
.deliveries-heading { margin-bottom: 21px; }
.deliveries-date-form { display: flex; align-items: flex-end; gap: 10px; margin-bottom: 16px; padding: 17px 19px; border: 1px solid var(--border-color); border-radius: var(--radius); background: #fff; box-shadow: var(--shadow-card); }
.deliveries-date-form > div { width: min(230px, 100%); }
.deliveries-date-form .form-control { min-height: 36px; border-color: var(--border-color); border-radius: 8px; font-size: 11px; }
.deliveries-date-form .button-primary { min-height: 36px; }
.deliveries-table-panel { padding: 19px 0 0; }
.deliveries-table-heading { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 0 20px 15px; }
.deliveries-table-heading h2 { margin: 0; color: #25272c; font-size: 17px; font-weight: 650; }
.deliveries-summary { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 8px; }
.deliveries-summary span { padding: 6px 10px; border: 1px solid #edf0f3; border-radius: 20px; color: #747b85; background: #fafbfc; font-size: 10px; white-space: nowrap; }
.deliveries-summary span:first-child { border-color: #f0dfbd; color: #95610b; background: #fff8e9; }
.deliveries-summary span:nth-child(2) { border-color: #d6ecdf; color: #16875a; background: #f0faf4; }
.deliveries-summary strong { color: #33373d; font-weight: 700; }
.deliveries-tools { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 0 20px 13px; }
.deliveries-search { width: min(420px, 100%); }
.deliveries-table-scroll { overflow-x: auto; border-top: 1px solid #eef0f2; }
.deliveries-table { min-width: 1050px; }
.deliveries-table tbody tr[data-sort-status="1"] { color: #858b94; background: #fbfbfc; }
.deliveries-table tbody tr[data-sort-status="1"] .customer-name,
.deliveries-table tbody tr[data-sort-status="1"] .revenue-cell { color: #777e88; }
.deliveries-table tbody tr[hidden] { display: none; }
.deliveries-table .table-sort-button { display: inline-flex; align-items: center; gap: 5px; padding: 5px 0; border: 0; color: inherit; background: transparent; font: inherit; font-weight: 650; cursor: pointer; }
.deliveries-table .table-sort-button:hover,
.deliveries-table .table-sort-button:focus-visible { color: #174f78; }
.deliveries-table .table-sort-button span { color: #a0a6af; font-size: 11px; }
.deliveries-table th[aria-sort="ascending"] .table-sort-button span::after { content: "↑"; }
.deliveries-table th[aria-sort="descending"] .table-sort-button span::after { content: "↓"; }
.deliveries-table th[aria-sort] .table-sort-button span { font-size: 0; }
.deliveries-table .deliveries-actions-heading { text-align: center; }
.deliveries-row-actions { display: flex; align-items: center; justify-content: center; gap: 5px; white-space: nowrap; }
.deliveries-row-actions form { display: inline-flex; margin: 0; }
.deliveries-page .empty-state { padding: 22px; color: #858b96; text-align: center; font-size: 11px; }
.panel-count { display: grid; min-width: 26px; height: 26px; place-items: center; padding: 0 7px; border-radius: 20px; color: #58606b; background: #f0f1f3; font-size: 10px; font-weight: 650; }
.public-main { display: flex; min-height: 100vh; flex-direction: column; }
.login-shell { flex: 1; min-height: 0; }
.login-brand-mark { display: block; object-fit: contain; }
.powered-footer { display: flex; min-height: 48px; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 36px; border-top: 1px solid var(--border-color); color: #969ba4; font-size: 10px; }
.powered-footer > span:last-child { color: #525965; font-size: 10px; font-weight: 800; letter-spacing: .1em; }
.powered-footer small { margin-right: 4px; color: #9a9faa; font-size: 8px; font-weight: 700; letter-spacing: .12em; }
.powered-footer-public { justify-content: center; }
.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; }

.size-editor { padding: 13px; border: 1px solid var(--line); border-radius: 10px; background: #f8fafc; }
.size-editor-help { margin: 0 0 12px; color: var(--muted); font-size: 12px; line-height: 1.5; }
.size-editor-fields { display: grid; grid-template-columns: minmax(0, 1fr) minmax(90px, .6fr); align-items: end; gap: 8px; }
.size-editor-fields > div { min-width: 0; }
.size-editor-fields label { display: block; margin-bottom: 5px; color: #536276; font-size: 11px; font-weight: 700; }
.size-editor-fields input { width: 100%; min-width: 0; padding: 8px; border: 1px solid #d5dee8; border-radius: 7px; background: white; }
.size-editor-fields .btn { grid-column: 1 / -1; min-height: 37px; padding: 6px 9px; font-size: 12px; white-space: nowrap; }
.size-editor-message { min-height: 18px; margin: 7px 0 0; color: #17623c; font-size: 11px; }
.size-editor-message.is-error { color: #b42318; }
.size-list-wrap { overflow: auto; margin-top: 8px; border: 1px solid var(--line); border-radius: 8px; background: white; }
.size-list { width: 100%; border-collapse: collapse; font-size: 12px; }
.size-list th, .size-list td { padding: 8px 10px; border-bottom: 1px solid #edf0f4; text-align: left; }
.size-list th { color: var(--muted); background: #f9fafb; font-size: 10px; text-transform: uppercase; }
.size-list th:nth-child(2), .size-list td:nth-child(2) { text-align: right; white-space: nowrap; }
.size-list th:last-child, .size-list td:last-child { width: 1%; text-align: right; white-space: nowrap; }
.size-list tr:last-child td { border-bottom: 0; }
.size-list-empty { margin: 0; padding: 12px; color: var(--muted); font-size: 11px; text-align: center; }
.size-remove { padding: 4px 7px; border: 0; border-radius: 6px; color: #a33131; background: #fff0f0; font-size: 10px; font-weight: 650; }

.print-document { position: relative; overflow: hidden; padding: 42px 48px; color: #202a35; }
.print-document::before { position: absolute; inset: 0 0 auto; height: 6px; background: linear-gradient(90deg, #104f82, #39a0d4); content: ""; }
.print-title { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 4px 0 24px; border-bottom: 1px solid #dce5ee; }
.print-brand { display: flex; align-items: center; gap: 13px; }
.print-brand .brand-mark { display: block; width: 48px; height: 48px; flex: 0 0 auto; border-radius: 8px; object-fit: contain; }
.print-brand-name { margin: 0; color: #174f78; font-size: 18px; font-weight: 800; letter-spacing: -.03em; }
.print-brand-caption { margin: 3px 0 0; color: #718096; font-size: 11px; }
.print-document-info { display: flex; align-items: flex-end; gap: 18px; text-align: right; }
.print-document-info h1 { margin: 0; color: #202a35; font-size: 20px; font-weight: 750; }
.print-doc-kicker { margin: 0 0 4px; color: #174f78; font-size: 10px; font-weight: 800; letter-spacing: .13em; }
.print-folio { display: grid; gap: 2px; min-width: 105px; padding: 9px 12px; border: 1px solid #dce5ee; border-radius: 9px; background: #f5f8fb; text-align: center; }
.print-folio span { color: #718096; font-size: 9px; font-weight: 750; letter-spacing: .12em; text-transform: uppercase; }
.print-folio strong { color: #174f78; font-size: 19px; letter-spacing: .04em; }
.print-details, .print-items-section { margin-top: 27px; }
.print-details h2, .print-items-section h2 { margin: 0 0 13px; color: #26394c; font-size: 12px; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; }
.print-operation { display: flex; justify-content: flex-end; margin-top: 12px; }
.print-operation span { padding: 5px 13px; border: 1px solid #174f78; border-radius: 4px; color: #174f78; font-size: 10px; font-weight: 800; letter-spacing: .12em; }
.print-fields { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; padding: 0; border: 1px solid #e1e8ef; border-radius: 10px; background: #fbfcfd; }
.print-fields div { padding: 12px 14px; border-bottom: 1px solid #e8edf2; }
.print-fields div:nth-last-child(-n+3) { border-bottom: 0; }
.print-fields dt { color: #718096; font-size: 9px; letter-spacing: .08em; }
.print-fields dd { margin-top: 5px; color: #26394c; font-size: 12px; font-weight: 600; }
.print-items { width: 100%; border-collapse: collapse; font-size: 11px; }
.print-items th { padding: 10px 9px; color: white; background: #174f78; font-size: 9px; font-weight: 700; letter-spacing: .04em; text-align: left; text-transform: uppercase; }
.print-items th:first-child { border-radius: 7px 0 0; }
.print-items th:last-child { border-radius: 0 7px 0 0; }
.print-items td { padding: 10px 9px; border-bottom: 1px solid #e8edf2; vertical-align: top; }
.print-items tbody tr:nth-child(even) { background: #f7f9fb; }
.print-number { text-align: right !important; white-space: nowrap; }
.print-unit { color: #174f78; font-weight: 750; text-transform: lowercase; }
.print-observations { margin-top: 23px; padding: 12px 14px; border: 1px solid #e1e8ef; border-radius: 8px; }
.print-observations h2 { margin: 0 0 6px; color: #718096; font-size: 9px; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; }
.print-observations p { min-height: 17px; margin: 0; color: #26394c; font-size: 11px; white-space: pre-wrap; }
.print-totals { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; width: min(100%, 570px); margin: 24px 0 0 auto; }
.print-total-single { grid-template-columns: minmax(180px, 1fr); }
.print-totals > div { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 12px; border: 1px solid #e1e8ef; border-radius: 8px; color: #596a7a; font-size: 10px; }
.print-totals strong { color: #26394c; font-size: 12px; white-space: nowrap; }
.print-totals > .print-total-primary { border-color: #174f78; color: white; background: #174f78; }
.print-totals > .print-total-primary strong { color: white; font-size: 14px; }
.print-footer { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin-top: 34px; padding-top: 12px; border-top: 1px solid #e1e8ef; color: #718096; font-size: 9px; }
.print-footer > div { display: grid; gap: 5px; }
.print-footer strong { color: #26394c; font-size: 11px; }

@media (max-width: 760px) {
  .size-editor-fields { grid-template-columns: minmax(0, 1fr) minmax(80px, .65fr); }
  .print-document { padding: 24px 18px; }
  .print-title { align-items: flex-start; flex-direction: column; gap: 16px; }
  .print-document-info { width: 100%; align-items: center; justify-content: space-between; text-align: left; }
  .print-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .print-fields div:nth-last-child(-n+3) { border-bottom: 1px solid #e8edf2; }
  .print-fields div:nth-last-child(-n+2) { border-bottom: 0; }
  .print-totals { grid-template-columns: 1fr; }
}

.delivery-credentials-dialog { width: min(420px, calc(100vw - 32px)); padding: 22px; border: 1px solid var(--border-color); border-radius: 14px; color: var(--ink); background: var(--surface); box-shadow: 0 20px 60px rgba(0, 0, 0, .28); }
.delivery-credentials-dialog::backdrop { background: rgba(15, 20, 28, .58); backdrop-filter: blur(2px); }
.delivery-credentials-dialog h2 { margin: 0 0 8px; color: var(--ink); font-size: 17px; }
.delivery-credentials-dialog p { margin: 0 0 16px; color: var(--muted); font-size: 12px; }
.delivery-credentials-dialog label { display: block; margin: 10px 0 5px; color: var(--ink); font-size: 11px; font-weight: 650; }
.delivery-credentials-dialog input { width: 100%; min-height: 38px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 7px; color: var(--ink); background: var(--surface); }
.delivery-credentials-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 18px; }
.activity-audit-filters { flex-wrap: wrap; }
.activity-audit-filters > div { flex: 1 1 155px; }
.activity-audit-panel { min-width: 0; }
.activity-audit-scroll { max-height: min(68vh, 760px); overflow: auto; }
.activity-audit-table { min-width: 1250px; }
.activity-audit-table td { vertical-align: top; }
.activity-route-cell { min-width: 190px; overflow-wrap: anywhere; }
.activity-user-agent { max-width: 240px; overflow-wrap: anywhere; }
.activity-trace { min-width: 140px; font-family: monospace; font-size: 10px; }
.activity-audit-pagination { display: flex; justify-content: flex-end; gap: 8px; margin-top: 14px; }

@media print {
  @page document-reference { size: 5.5in 8.5in; margin: 22.5mm 12.7mm 5mm; }
  html, body { min-height: 0; color: #202a35 !important; background: white !important; }
  .sidebar, .topbar, .sidebar-backdrop, .print-actions, .powered-footer { display: none !important; }
  .app-container { display: block; max-width: none; margin: 0; padding: 0; }
  .main-content { width: 100%; margin: 0 !important; }
  .page-content { padding: 0 !important; }
  .print-document { max-width: none; margin: 0; padding: 0; overflow: visible; border: 0; border-radius: 0; box-shadow: none; }
  .print-document::before { position: fixed; inset: 0 0 auto; height: 4px; print-color-adjust: exact; -webkit-print-color-adjust: exact; }
  .print-title, .print-fields, .print-items-section, .print-totals, .print-footer { break-inside: avoid; }
  .print-fields { border-color: #d9e1e8; }
  .print-items th, .print-totals > .print-total-primary { print-color-adjust: exact; -webkit-print-color-adjust: exact; }
  .print-items thead { display: table-header-group; }
  .print-items tr { break-inside: avoid; }
  .print-footer { margin-top: 24px; }
}

@media (max-width: 1200px) {
  .dashboard-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .document-count-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .dashboard-charts { grid-template-columns: minmax(0, 1fr); }
  .breakdown-panel { display: grid; grid-template-columns: minmax(0, 1fr) minmax(140px, .55fr); align-items: center; column-gap: 18px; }
  .breakdown-panel .dashboard-panel-heading, .breakdown-panel .breakdown-total { grid-column: 1; }
  .breakdown-panel .doughnut-chart { grid-area: 1 / 2 / 4 / 3; }
  .breakdown-panel .breakdown-legend { grid-column: 1; }
}

@media (max-width: 768px) {
  .sidebar { display: none; }
  body.sidebar-open .sidebar { position: fixed; display: flex; box-shadow: 10px 0 30px rgba(20, 25, 33, .14); }
  body.sidebar-open .sidebar-backdrop { position: fixed; z-index: 25; inset: 0; display: block; width: 100%; height: 100%; border: 0; background: rgba(20, 24, 31, .32); }
  .main-content { width: 100%; margin-left: 0; }
  .topbar { min-height: 59px; gap: 9px; padding: 0 15px; }
  .mobile-menu-toggle { display: inline-grid; }
  .topbar-actions { gap: 4px; }
  .breadcrumb { flex: 1; gap: 5px; font-size: 10px; }
  .top-avatar { width: 29px; height: 29px; }
  .page-content { padding: 23px 15px 34px; }
  .dashboard-heading { align-items: flex-start; flex-direction: column; gap: 14px; margin-bottom: 17px; }
  .dashboard-actions { width: 100%; flex-wrap: wrap; }
  .dashboard-actions .button-primary { margin-left: auto; }
  .dashboard-metrics { grid-template-columns: minmax(0, 1fr); gap: 11px; }
  .document-counts { margin-top: 12px; padding: 14px; }
  .document-counts-heading { align-items: flex-start; flex-direction: column; gap: 5px; }
  .document-count-grid { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .document-count-card { min-height: 65px; }
  .document-trend-heading { align-items: flex-start; flex-direction: column; gap: 4px; }
  .dashboard-metric { min-height: 126px; }
  .dashboard-charts, .dashboard-lists { grid-template-columns: minmax(0, 1fr); gap: 11px; margin-top: 11px; }
  .dashboard-panel { padding: 16px; }
  .upcoming-deliveries-panel { padding: 16px; }
  .upcoming-deliveries-heading { align-items: flex-start; flex-direction: column; }
  .upcoming-deliveries-actions { width: 100%; flex-wrap: wrap; justify-content: space-between; }
  .upcoming-deliveries-actions .table-search { width: 100%; flex-basis: 100%; }
  .powered-footer { padding: 10px 15px; }
  .transactions-panel { padding: 16px 0 0; }
  .transactions-heading { align-items: flex-start; flex-direction: column; padding: 0 16px 13px; }
  .transaction-controls { width: 100%; }
  .table-search { flex: 1; width: auto; }
  .transactions-table { min-width: 850px; }
  .breakdown-panel { display: flex; }
  .breakdown-panel .doughnut-chart { width: 150px; height: 150px; }
  .date-chip { flex: 1; }
}

.login-page { display: grid; width: min(100%, 1600px); min-height: calc(100vh - 48px); grid-template-columns: minmax(0, 1.15fr) minmax(380px, .85fr); align-items: stretch; place-items: stretch; gap: clamp(28px, 5vw, 80px); margin: 0 auto; padding: 28px clamp(22px, 4vw, 64px); }
.login-showcase { position: relative; min-width: 0; min-height: 620px; overflow: hidden; border-radius: 22px; background: #293b43; box-shadow: 0 18px 55px rgba(20, 35, 47, .16); }
.login-slideshow, .login-slide { position: absolute; inset: 0; }
.login-slide { overflow: hidden; margin: 0; opacity: 0; transition: opacity .8s ease; }
.login-slide.is-active { opacity: 1; }
.login-slide::after { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(7, 16, 22, .08) 22%, rgba(7, 16, 22, .75) 100%); content: ""; }
.login-slide img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.035); transition: transform 7s ease; }
.login-slide.is-active img { transform: scale(1); }
.login-location-card { position: absolute; z-index: 3; top: 22px; left: 22px; display: flex; width: min(340px, calc(100% - 44px)); min-height: 66px; align-items: center; gap: 12px; padding: 10px 13px; border: 1px solid rgba(255, 255, 255, .24); border-radius: 13px; color: #fff; background: rgba(28, 34, 34, .72); box-shadow: 0 8px 28px rgba(0, 0, 0, .16); text-decoration: none; backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); transition: background .18s ease, transform .18s ease; }
.login-location-card:hover { color: #fff; background: rgba(28, 34, 34, .88); transform: translateY(-1px); }
.login-location-card:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }
.login-location-icon { display: grid; width: 38px; height: 38px; flex: 0 0 auto; place-items: center; border-radius: 11px; color: #fff; background: #bb6247; }
.login-location-icon svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.login-location-copy { display: grid; min-width: 0; gap: 3px; }
.login-location-copy strong { font-size: 12px; font-weight: 700; }
.login-location-copy small { overflow: hidden; color: rgba(255, 255, 255, .8); font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.login-location-arrow { width: 16px; height: 16px; flex: 0 0 auto; margin-left: auto; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.login-slide figcaption { position: absolute; z-index: 1; right: 9%; bottom: 12%; left: 9%; display: grid; gap: 9px; color: #fff; }
.login-slide figcaption span { font-size: 11px; font-weight: 750; letter-spacing: .14em; text-transform: uppercase; }
.login-slide figcaption strong { max-width: 570px; font-size: clamp(27px, 3.4vw, 48px); font-weight: 650; letter-spacing: -.045em; line-height: 1.08; }
.login-slideshow-controls { position: absolute; z-index: 2; right: 9%; bottom: 6%; display: flex; gap: 8px; }
.login-slide-progress { position: absolute; right: 0; bottom: calc(100% + 12px); width: min(220px, 48vw); height: 2px; overflow: hidden; border-radius: 2px; background: rgba(255, 255, 255, .4); }
.login-slide-progress span { display: block; width: 100%; height: 100%; background: #fff; transform: scaleX(0); transform-origin: left; }
.login-slide-progress span.is-running { animation: login-slide-timer 6s linear both; }
.login-slideshow[data-paused="true"] .login-slide-progress span,
.login-slideshow[data-hidden="true"] .login-slide-progress span { animation-play-state: paused; }
.login-slide-dot { width: 24px; height: 5px; padding: 0; border: 0; border-radius: 6px; background: rgba(255, 255, 255, .48); cursor: pointer; transition: width .2s ease, background .2s ease; }
.login-slide-dot.is-active { width: 42px; background: #fff; }
.login-slide-dot:focus-visible { outline: 2px solid #fff; outline-offset: 4px; }
.login-slide-play { display: grid; width: 27px; height: 22px; place-items: center; margin: -8px 0; padding: 0; border: 0; border-radius: 6px; color: #fff; background: transparent; cursor: pointer; }
.login-slide-play:hover { background: rgba(255, 255, 255, .18); }
.login-slide-play:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
.login-slide-play svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.login-play-icon { display: none; fill: currentColor !important; }
.login-slideshow[data-paused="true"] .login-pause-icon { display: none; }
.login-slideshow[data-paused="true"] .login-play-icon { display: block; }
.login-form-panel { display: grid; min-width: 0; align-items: center; justify-items: center; padding: 34px 0; }
.login-page .login-card { width: min(100%, 440px); max-width: none; padding: 12px; border: 0; border-radius: 0; background: transparent; box-shadow: none; text-align: left; animation: login-appear .45s ease-out both; }
.login-brand { display: inline-flex; align-items: center; gap: 11px; margin-bottom: clamp(40px, 8vh, 82px); color: #222a32; font-size: 19px; font-weight: 750; letter-spacing: -.035em; }
.login-brand:hover { color: #222a32; }
.login-brand-mark { width: 38px; height: 38px; flex: 0 0 auto; border-radius: 9px; object-fit: contain; }
.login-page .login-card .eyebrow { margin-bottom: 9px; color: #728091; font-size: 10px; font-weight: 750; letter-spacing: .13em; }
.login-page .login-card h1 { margin: 0; color: #202a35; font-size: clamp(30px, 3vw, 38px); font-weight: 700; letter-spacing: -.045em; }
.login-page .login-card > .muted { margin: 10px 0 29px; color: #758194; font-size: 14px; }
.login-page .login-card > .login-instruction { margin-bottom: 14px; }
.license-owner-field { margin-bottom: 16px; }
.login-page .license-owner-field label { display: block; margin: 0 0 7px; color: #394655; font-size: 12px; font-weight: 650; }
.login-page .license-owner-field .form-control { min-height: 43px; padding: 10px 13px; border: 1px solid #dfe5eb; border-radius: 9px; color: #586575; background: #f4f6f8; font-size: 13px; }
.login-page .login-card .alert { padding: 11px 13px; border-radius: 9px; font-size: 12px; }
.login-page .login-form { text-align: left; }
.login-page .login-form .field label { display: block; margin: 15px 0 7px; color: #394655; font-size: 12px; font-weight: 650; }
.login-page .login-form .form-control { min-height: 47px; padding: 11px 13px; border: 1px solid #dfe5eb; border-radius: 9px; color: #25303b; background: #fff; font-size: 13px; transition: border-color .16s, box-shadow .16s; }
.login-page .login-form .form-control:focus { border-color: #477ca6; box-shadow: 0 0 0 3px rgba(71, 124, 166, .12); }
.login-page .login-form .text-danger { display: block; margin-top: 5px; font-size: 11px; }
.login-page .remember-row { gap: 9px; margin: 17px 0 0; color: #667383; font-size: 11px; }
.login-page .remember-row input { width: 15px; height: 15px; accent-color: #1769aa; }
.caps-lock-warning { display: inline-flex; align-items: center; gap: 6px; margin-top: 8px; color: #a5610a; font-size: 11px; font-weight: 650; }
.caps-lock-warning[hidden] { display: none; }
.caps-lock-warning svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.login-page .login-form .btn-primary { min-height: 47px; border: 1px solid #202a35; border-radius: 9px; color: #fff; background: #202a35; font-size: 13px; font-weight: 650; transition: transform .14s, background .14s; }
.login-page .login-form .btn-primary:hover { border-color: #344655; background: #344655; }
.login-page .login-form .btn-primary:active { transform: translateY(1px); }
.login-security-note { display: flex; align-items: center; gap: 7px; margin: 28px 0 0; color: #8993a0; font-size: 10px; }
.login-security-note svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
@keyframes login-appear { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
@keyframes login-slide-timer { to { transform: scaleX(1); } }

@media (max-width: 900px) {
  .login-page { grid-template-columns: minmax(0, 1fr) minmax(340px, .9fr); gap: 26px; padding-right: 24px; padding-left: 24px; }
  .login-showcase { min-height: 560px; }
  .login-brand { margin-bottom: 48px; }
}

@media (max-width: 680px) {
  .login-page { min-height: 0; grid-template-columns: minmax(0, 1fr); gap: 0; padding: 15px; }
  .login-showcase { min-height: 260px; border-radius: 16px; }
  .login-location-card { top: 12px; left: 12px; width: min(310px, calc(100% - 24px)); min-height: 54px; gap: 9px; padding: 7px 10px; }
  .login-location-icon { width: 34px; height: 34px; }
  .login-slide figcaption { right: 7%; bottom: 18%; left: 7%; gap: 6px; }
  .login-slide figcaption span { font-size: 9px; }
  .login-slide figcaption strong { max-width: 400px; font-size: clamp(22px, 7vw, 31px); }
  .login-slideshow-controls { right: 7%; bottom: 8%; }
  .login-form-panel { padding: 26px 4px 34px; }
  .login-page .login-card { padding: 4px; }
  .login-brand { margin-bottom: 28px; }
}

@media (prefers-reduced-motion: reduce) {
  .login-page *, .login-page *::before, .login-page *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: .01ms !important; }
  .login-page .login-slide-progress span.is-running { animation-duration: 6s !important; }
}

.login-page { position: relative; width: min(100% - 48px, 1320px); min-height: min(780px, calc(100vh - 112px)); grid-template-columns: minmax(0, 1.08fr) minmax(390px, .92fr); gap: 0; margin: 20px auto; padding: 12px; overflow: hidden; border: 1px solid var(--line); border-radius: 22px; background: var(--surface); box-shadow: var(--shadow-card, 0 18px 48px rgba(30, 42, 56, .1)); }
.login-showcase { min-height: 640px; border-radius: 15px; box-shadow: none; }
.login-slide::after { background: linear-gradient(180deg, rgba(12, 21, 31, .04) 20%, rgba(12, 21, 31, .25) 47%, rgba(12, 21, 31, .82) 100%); }
.login-slide figcaption { right: 8%; bottom: 13%; left: 8%; gap: 11px; }
.login-slide figcaption span { color: #c6e2f7; font-size: 10px; letter-spacing: .13em; }
.login-slide figcaption strong { max-width: 580px; font-size: clamp(29px, 3.2vw, 47px); line-height: 1.04; }
.login-slide figcaption small { max-width: 470px; color: rgba(255, 255, 255, .82); font-size: 13px; line-height: 1.55; }
.login-showcase-brand { position: absolute; z-index: 3; top: 22px; left: 22px; display: inline-flex; align-items: center; gap: 9px; color: white; font-size: 16px; font-weight: 750; letter-spacing: -.03em; text-shadow: 0 2px 12px rgba(0, 0, 0, .25); }
.login-showcase-brand:hover { color: white; }
.login-showcase-brand img { width: 34px; height: 34px; border: 1px solid rgba(255, 255, 255, .35); border-radius: 10px; object-fit: contain; }
.login-location-card { top: 18px; right: 18px; left: auto; width: min(310px, calc(100% - 90px)); min-height: 58px; }
.login-form-panel { padding: clamp(24px, 5vw, 68px); }
.login-page .login-card { width: min(100%, 420px); padding: 0; animation: login-appear .5s cubic-bezier(.2, .7, .2, 1) both; }
.login-card-heading { display: flex; align-items: center; gap: 12px; margin-bottom: 42px; }
.login-card-icon { display: grid; width: 44px; height: 44px; flex: 0 0 auto; place-items: center; border: 1px solid color-mix(in srgb, var(--blue) 22%, var(--line)); border-radius: 13px; color: var(--blue); background: color-mix(in srgb, var(--blue) 9%, var(--surface)); }
.login-card-icon svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.login-card-heading-copy { display: grid; gap: 4px; }
.login-card-heading-copy > span { color: var(--ink); font-size: 11px; font-weight: 800; letter-spacing: .1em; }
.login-card-heading-copy small { color: var(--muted); font-size: 11px; }
.login-page .login-card .eyebrow { color: var(--blue); }
.login-page .login-card h1 { color: var(--ink); font-size: clamp(32px, 3.4vw, 42px); letter-spacing: -.05em; }
.login-page .login-card > .muted { color: var(--muted); }
.login-page .license-owner-field label,
.login-page .login-form .field label { color: var(--ink); }
.login-page .license-owner-field .form-control { border-color: var(--line); color: var(--muted); background: color-mix(in srgb, var(--page) 72%, var(--surface)); }
.login-page .login-form .form-control { border-color: var(--line); color: var(--ink); background: var(--surface); }
.login-page .login-form .form-control:focus { border-color: var(--blue); box-shadow: 0 0 0 3px color-mix(in srgb, var(--blue) 16%, transparent); }
.login-page .remember-row { color: var(--muted); }
.login-page .login-form .btn-primary { border-color: var(--blue-dark); background: var(--blue-dark); box-shadow: 0 5px 14px color-mix(in srgb, var(--blue) 20%, transparent); }
.login-page .login-form .btn-primary:hover { border-color: var(--blue); background: var(--blue); }
.login-security-note { color: var(--muted); }
.login-security-note small { color: var(--blue); }

@media (max-width: 900px) {
  .login-page { width: min(100% - 32px, 720px); min-height: 0; grid-template-columns: minmax(0, 1fr); gap: 0; padding: 10px; }
  .login-showcase { min-height: 340px; }
  .login-form-panel { padding: 38px clamp(20px, 8vw, 64px); }
  .login-card-heading { margin-bottom: 28px; }
  .login-brand { margin-bottom: 32px; }
}

@media (max-width: 600px) {
  .operation-heading-actions { gap: 6px; }
  .operation-heading-actions > .btn { padding-right: 9px; padding-left: 9px; }
  .operation-card { padding: 15px 13px; }
  .operation-card-heading { flex-wrap: wrap; gap: 8px; }
  .operation-card-heading > div { flex: 1 1 calc(100% - 48px); }
  .operation-card-heading > .operation-item-count { margin-left: 42px; }
  .operation-card-heading > .operation-item-count + .btn { margin-left: auto; }
  .operation-submit-row { flex-direction: column-reverse; }
  .operation-submit-row .btn { width: 100%; }
}

@media (max-width: 680px) {
  .login-page { width: calc(100% - 24px); margin: 12px auto; padding: 8px; border-radius: 17px; }
  .login-showcase { min-height: 290px; border-radius: 12px; }
  .login-showcase-brand { top: 12px; left: 12px; font-size: 14px; }
  .login-showcase-brand img { width: 30px; height: 30px; }
  .login-location-card { top: 52px; right: 12px; left: 12px; width: auto; min-height: 48px; gap: 7px; padding: 6px 8px; }
  .login-location-icon { width: 30px; height: 30px; }
  .login-location-copy strong { font-size: 10px; }
  .login-location-copy small { font-size: 9px; }
  .login-slide figcaption { right: 7%; bottom: 21%; left: 7%; gap: 5px; }
  .login-slide figcaption span { font-size: 8px; }
  .login-slide figcaption strong { font-size: clamp(24px, 7.3vw, 32px); }
  .login-slide figcaption small { font-size: 10px; line-height: 1.4; }
  .login-slideshow-controls { right: 7%; bottom: 8%; gap: 6px; }
  .login-slide-dot { width: 16px; }
  .login-slide-dot.is-active { width: 30px; }
  .login-slide-progress { width: min(180px, 52vw); }
  .login-form-panel { padding: 28px 12px 24px; }
  .login-page .login-card { padding: 0 4px; }
  .login-card-heading { margin-bottom: 23px; }
  .login-page .login-card h1 { font-size: 32px; }
  .login-page .login-card > .login-instruction { margin-bottom: 12px; }
  .license-owner-field { margin-bottom: 12px; }
  .login-security-note { margin-top: 20px; }
}

.print-paper-select { display: flex; align-items: center; gap: 8px; color: var(--muted); font-size: 12px; font-weight: 650; }
.print-paper-select select { min-width: 150px; padding: 7px 30px 7px 10px; border: 1px solid var(--line); border-radius: 8px; color: var(--ink); background: var(--surface); font: inherit; }
.print-document { page: document-reference; }
.thermal-ticket { page: thermal80; width: 76mm; max-width: 100%; margin: 0 auto; padding: 3mm; border: 0; border-radius: 0; color: #111; background: white; box-shadow: none; font-family: "Arial", sans-serif; }
.thermal-ticket.thermal-58 { page: thermal58; width: 54mm; }
.thermal-ticket .print-title { align-items: flex-start; gap: 5px; padding: 0 0 7px; border-bottom: 1px dashed #555; }
.thermal-ticket .print-brand { gap: 5px; }
.thermal-ticket .print-brand .brand-mark { display: none; }
.thermal-ticket .print-brand-name { color: #111; font-size: 12px; line-height: 1.2; overflow-wrap: anywhere; }
.thermal-ticket .print-brand-caption { margin-top: 2px; color: #333; font-size: 8px; }
.thermal-ticket .print-document-info { align-items: flex-end; gap: 4px; text-align: right; }
.thermal-ticket .print-document-info h1 { max-width: 35mm; color: #111; font-size: 9px; overflow-wrap: anywhere; }
.thermal-ticket .print-doc-kicker { margin-bottom: 2px; color: #111; font-size: 7px; letter-spacing: .04em; }
.thermal-ticket .print-folio { min-width: 0; padding: 3px 4px; border: 1px solid #777; border-radius: 0; color: #111; background: white; }
.thermal-ticket .print-folio span { color: #222; font-size: 7px; }
.thermal-ticket .print-folio strong { color: #111; font-size: 11px; }
.thermal-ticket .print-operation { margin-top: 5px; }
.thermal-ticket .print-operation span { padding: 2px 5px; border: 1px solid #222; border-radius: 0; color: #111; font-size: 8px; letter-spacing: .08em; }
.thermal-ticket .print-details,
.thermal-ticket .print-items-section { margin-top: 9px; }
.thermal-ticket .print-details h2,
.thermal-ticket .print-items-section h2 { margin-bottom: 4px; color: #111; font-size: 8px; letter-spacing: .04em; }
.thermal-ticket .print-fields { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); border: 0; border-radius: 0; background: white; }
.thermal-ticket .print-fields div { padding: 3px 1px; border-bottom: 1px dotted #aaa !important; }
.thermal-ticket .print-fields dt { color: #333; font-size: 8px; }
.thermal-ticket .print-fields dd { margin-top: 1px; color: #111; font-size: 9px; font-weight: 500; }
.thermal-ticket .print-items { display: block; width: 100%; border-collapse: collapse; font-size: 8px; }
.thermal-ticket .print-items thead { display: none; }
.thermal-ticket .print-items tbody { display: block; }
.thermal-ticket .print-items tr { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2px; padding: 4px 0; border-bottom: 1px dashed #777; }
.thermal-ticket .print-items td { min-width: 0; padding: 0; border: 0; color: #111; font-size: 9px; overflow-wrap: anywhere; }
.thermal-ticket .print-items td:first-child { grid-column: 1 / -1; font-weight: 700; }
.thermal-ticket .print-items td:nth-child(2)::before { content: "Cant. "; }
.thermal-ticket .print-items td:nth-child(3)::before { content: "P.U. "; }
.thermal-ticket .print-items td:nth-child(4)::before { content: "Imp. "; }
.thermal-ticket .print-baking-items td:nth-child(2)::before { content: "P.U. "; }
.thermal-ticket .print-baking-items td:nth-child(3)::before { content: "Adobo: "; }
.thermal-ticket .print-baking-items td:nth-child(4)::before { content: "Kg "; }
.thermal-ticket .print-number { text-align: left !important; white-space: normal; }
.thermal-ticket .print-unit { color: #111; font-weight: 500; }
.thermal-ticket .print-observations { margin-top: 8px; padding: 5px 0; border: 0; border-top: 1px dashed #777; border-bottom: 1px dashed #777; border-radius: 0; }
.thermal-ticket .print-observations h2 { margin-bottom: 3px; color: #111; font-size: 8px; }
.thermal-ticket .print-observations p { color: #111; font-size: 9px; }
.thermal-ticket .print-totals { grid-template-columns: minmax(0, 1fr); gap: 2px; width: 100%; margin: 8px 0 0; }
.thermal-ticket .print-totals > div { padding: 3px 0; border: 0; border-bottom: 1px dotted #777; border-radius: 0; color: #111; font-size: 9px; }
.thermal-ticket .print-totals strong { color: #111; font-size: 9px; }
.thermal-ticket .print-totals > .print-total-primary { border: 0; color: #111; background: white; font-size: 12px; }
.thermal-ticket .print-totals > .print-total-primary strong { color: #111; font-size: 13px; }
.thermal-ticket .print-footer { grid-template-columns: minmax(0, 1fr); gap: 5px; margin-top: 10px; padding-top: 5px; border-top: 1px dashed #555; color: #333; font-size: 8px; }
.thermal-ticket .print-footer strong { color: #111; font-size: 9px; }
.thermal-ticket.thermal-58 .print-items tr { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 3px; }
.thermal-ticket.thermal-58 .print-items td:first-child,
.thermal-ticket.thermal-58 .print-items td:nth-child(2) { grid-column: 1 / -1; }
.thermal-ticket.thermal-58 .print-title { display: grid; grid-template-columns: minmax(0, 1fr); gap: 5px; }
.thermal-ticket.thermal-58 .print-document-info { width: 100%; align-items: flex-start; justify-content: space-between; text-align: left; }
.thermal-ticket.thermal-58 .print-document-info > div { min-width: 0; }
.thermal-ticket.thermal-58 .print-document-info h1 { max-width: 38mm; }
.thermal-ticket.thermal-58 .print-fields { grid-template-columns: minmax(0, 1fr); }
.order-sale-ticket { --receipt-ink: #26394c; --receipt-accent: #174f78; --receipt-line: #d7e0e8; }
.order-sale-ticket .print-title { align-items: center; }
.order-sale-ticket .print-document-info { align-items: center; }
.order-sale-ticket .print-document-info h1 { font-size: 19px; }
.order-sale-ticket .print-folio { min-width: 118px; border: 2px solid var(--receipt-accent); background: white; }
.order-sale-ticket .print-folio strong { font-size: 16px; }
.order-sale-customer { display: grid; grid-template-columns: 1.4fr 1fr; gap: 0 16px; margin-top: 20px; border: 1px solid var(--receipt-line); }
.order-sale-customer > div { display: grid; min-width: 0; gap: 4px; padding: 10px 12px; border-bottom: 1px solid var(--receipt-line); }
.order-sale-customer > div > span,
.order-sale-delivery > div > span,
.order-sale-footer > div > span { color: #647487; font-size: 9px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.order-sale-customer > div > strong { color: var(--receipt-ink); font-size: 12px; overflow-wrap: anywhere; }
.order-sale-customer .order-sale-customer-name { grid-row: span 2; align-content: center; border-right: 1px solid var(--receipt-line); border-bottom: 0; }
.order-sale-customer .order-sale-customer-name strong { font-size: 16px; }
.order-sale-customer > div:last-child { border-bottom: 0; }
.order-sale-delivery { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 10px; margin-top: 14px; padding: 11px 13px; border: 2px solid var(--receipt-accent); }
.order-sale-delivery > div { display: grid; gap: 4px; }
.order-sale-delivery > div > strong { color: var(--receipt-accent); font-size: 16px; }
.order-sale-delivery .order-sale-delivery-time { min-width: 105px; justify-items: center; padding-left: 12px; border-left: 1px dashed var(--receipt-line); }
.order-sale-delivery .order-sale-delivery-time strong { font-size: 19px; }
.order-sale-ticket .print-items-section { margin-top: 19px; }
.order-sale-ticket .print-items-section h2 { display: flex; justify-content: space-between; gap: 10px; }
.order-sale-ticket .print-items-section h2 span { color: #647487; font-size: 9px; font-weight: 650; letter-spacing: 0; text-transform: none; }
.order-sale-ticket .print-items th { background: var(--receipt-accent); }
.order-sale-ticket .print-unit { color: var(--receipt-accent); }
.order-sale-ticket .item-data-label { display: none; }
.order-sale-ticket .print-observations { margin-top: 15px; border-left: 4px solid var(--receipt-accent); background: #f7f9fb; }
.order-sale-totals { display: grid; gap: 6px; width: min(100%, 370px); margin: 15px 0 0 auto; }
.order-sale-totals > div { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 11px; border: 1px solid var(--receipt-line); color: #47586a; font-size: 10px; font-weight: 750; text-transform: uppercase; }
.order-sale-totals strong { color: var(--receipt-ink); font-size: 13px; }
.order-sale-totals > .is-total { border: 2px solid var(--receipt-accent); color: var(--receipt-accent); font-size: 12px; }
.order-sale-totals > .is-total strong { color: var(--receipt-accent); font-size: 17px; }
.order-sale-totals > .is-balance { border-color: #9aa8b5; border-style: dashed; }
.order-sale-totals.sale-total { width: min(100%, 250px); }
.order-sale-footer { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 18px; margin-top: 17px; padding-top: 10px; border-top: 1px solid var(--receipt-line); }
.order-sale-footer > div { display: grid; gap: 4px; }
.order-sale-footer > div > strong { color: var(--receipt-ink); font-size: 11px; overflow-wrap: anywhere; }
.order-sale-footer > small { grid-column: 1 / -1; padding-top: 7px; color: #647487; font-size: 9px; text-align: center; }
.thermal-ticket.order-sale-ticket .print-title { display: grid; grid-template-columns: 1fr; gap: 5px; }
.thermal-ticket.order-sale-ticket .print-document-info { width: 100%; justify-content: space-between; text-align: left; }
.thermal-ticket.order-sale-ticket .print-document-info h1 { font-size: 12px; }
.thermal-ticket.order-sale-ticket .print-folio { min-width: 0; }
.thermal-ticket.order-sale-ticket .print-brand .brand-mark { display: block; width: 9mm; height: 9mm; border-radius: 0; }
.thermal-ticket.order-sale-ticket .order-sale-customer { grid-template-columns: 1.15fr 1fr; gap: 0 6px; margin-top: 8px; }
.thermal-ticket.order-sale-ticket .order-sale-customer > div { gap: 2px; padding: 5px; }
.thermal-ticket.order-sale-ticket .order-sale-customer > div > span,
.thermal-ticket.order-sale-ticket .order-sale-delivery > div > span,
.thermal-ticket.order-sale-ticket .order-sale-footer > div > span { font-size: 7px; }
.thermal-ticket.order-sale-ticket .order-sale-customer > div > strong { font-size: 8px; }
.thermal-ticket.order-sale-ticket .order-sale-customer .order-sale-customer-name strong { font-size: 10px; }
.thermal-ticket.order-sale-ticket .order-sale-delivery { gap: 4px; margin-top: 7px; padding: 6px; border-width: 1px; }
.thermal-ticket.order-sale-ticket .order-sale-delivery > div > strong { font-size: 12px; }
.thermal-ticket.order-sale-ticket .order-sale-delivery .order-sale-delivery-time { min-width: 62px; padding-left: 5px; }
.thermal-ticket.order-sale-ticket .order-sale-delivery .order-sale-delivery-time strong { font-size: 14px; }
.thermal-ticket.order-sale-ticket .print-items-section { margin-top: 9px; }
.thermal-ticket.order-sale-ticket .print-items-section h2 { margin-bottom: 4px; font-size: 8px; }
.thermal-ticket.order-sale-ticket .print-items-section h2 span { font-size: 7px; }
.thermal-ticket.order-sale-ticket .print-items th { display: none; }
.thermal-ticket.order-sale-ticket .print-items tbody { display: block; }
.thermal-ticket.order-sale-ticket .print-items tr { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; margin-bottom: 5px; padding: 0 5px 5px; border: 1px solid #c8cdd2; border-left: 3px solid #555; background: #f7f7f7; }
.thermal-ticket.order-sale-ticket .print-items td { display: flex; min-width: 0; flex-direction: column; align-items: flex-start; gap: 2px; padding: 4px 3px 0; border: 0; color: #111; font-size: 9px; font-weight: 700; overflow-wrap: anywhere; }
.thermal-ticket.order-sale-ticket .print-items td:first-child { grid-column: 1 / -1; padding: 5px 3px 4px; border-bottom: 1px solid #c8cdd2; font-size: 10px; font-weight: 800; }
.thermal-ticket.order-sale-ticket .print-items td::before { content: none !important; }
.thermal-ticket.order-sale-ticket .print-items .item-data-label { display: block; color: #4b4b4b; font-size: 6.5px; font-weight: 700; letter-spacing: .03em; text-transform: uppercase; }
.thermal-ticket.order-sale-ticket .print-number { text-align: left !important; white-space: normal; }
.thermal-ticket.order-sale-ticket .print-unit { color: #111; font-size: 7px; font-weight: 500; }
.thermal-ticket.order-sale-ticket .print-observations { margin-top: 7px; padding: 5px 6px; border: 1px solid #aaa; border-left: 2px solid #333; background: white; }
.thermal-ticket.order-sale-ticket .print-observations h2 { margin-bottom: 3px; font-size: 7px; }
.thermal-ticket.order-sale-ticket .print-observations p { font-size: 8px; }
.thermal-ticket.order-sale-ticket .order-sale-totals { gap: 3px; width: 100%; margin-top: 7px; }
.thermal-ticket.order-sale-ticket .order-sale-totals > div { padding: 4px 5px; font-size: 8px; }
.thermal-ticket.order-sale-ticket .order-sale-totals strong { font-size: 9px; }
.thermal-ticket.order-sale-ticket .order-sale-totals > .is-total { font-size: 9px; }
.thermal-ticket.order-sale-ticket .order-sale-totals > .is-total strong { font-size: 12px; }
.thermal-ticket.order-sale-ticket .order-sale-footer { gap: 6px; margin-top: 8px; padding-top: 5px; }
.thermal-ticket.order-sale-ticket .order-sale-footer > div > strong { font-size: 8px; }
.thermal-ticket.order-sale-ticket .order-sale-footer > small { padding-top: 3px; font-size: 7px; }
.thermal-ticket.order-sale-ticket.thermal-58 .print-items tr { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.thermal-ticket.order-sale-ticket.thermal-58 .print-items td:nth-child(2) { grid-column: auto; }
.sale-ticket .order-sale-customer { grid-template-columns: 1.4fr 1fr; }
.sale-ticket .order-sale-customer .order-sale-customer-name { grid-row: span 2; }
.sale-ticket .order-sale-customer > div:last-child { border-bottom: 0; }
.sale-ticket .print-observations { margin-top: 15px; }
.sale-ticket .order-sale-footer { margin-top: 17px; }
.thermal-ticket.sale-ticket .order-sale-customer { grid-template-columns: 1.15fr 1fr; }
.baking-ticket { --baking-ink: #26394c; --baking-accent: #174f78; --baking-line: #d7e0e8; }
.baking-ticket .print-title { align-items: center; }
.baking-ticket .print-document-info { align-items: center; }
.baking-ticket .print-document-info h1 { font-size: 19px; }
.baking-ticket .print-folio { min-width: 118px; border: 2px solid var(--baking-accent); background: white; }
.baking-ticket .print-folio strong { font-size: 16px; }
.baking-ticket-customer { display: grid; grid-template-columns: 1.4fr 1fr; gap: 0 16px; margin-top: 20px; border: 1px solid var(--baking-line); }
.baking-ticket-field { display: grid; min-width: 0; gap: 4px; padding: 10px 12px; border-bottom: 1px solid var(--baking-line); }
.baking-ticket-field span, .baking-ticket-delivery-heading > span, .baking-ticket-time > span, .baking-ticket-metric > span, .baking-ticket-footer span { color: #647487; font-size: 9px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.baking-ticket-field strong { color: var(--baking-ink); font-size: 12px; overflow-wrap: anywhere; }
.baking-ticket-customer-name { grid-row: span 2; align-content: center; border-right: 1px solid var(--baking-line); border-bottom: 0; }
.baking-ticket-customer-name strong { font-size: 16px; }
.baking-ticket-field:last-child { border-bottom: 0; }
.baking-ticket-delivery { display: grid; grid-template-columns: 1fr auto; align-items: stretch; gap: 10px; margin-top: 14px; padding: 12px; border: 2px solid var(--baking-accent); }
.baking-ticket-delivery-heading { display: grid; align-content: center; gap: 4px; }
.baking-ticket-delivery-heading strong { color: var(--baking-accent); font-size: 17px; }
.baking-ticket-time { display: grid; min-width: 92px; align-content: center; justify-items: center; gap: 3px; padding: 5px 12px; border-left: 1px dashed var(--baking-line); }
.baking-ticket-time strong { color: var(--baking-ink); font-size: 20px; }
.baking-ticket-service { margin-top: 16px; }
.baking-ticket-section-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin-bottom: 7px; color: var(--baking-ink); font-size: 11px; font-weight: 850; letter-spacing: .06em; text-transform: uppercase; }
.baking-ticket-section-heading small { color: #647487; font-size: 8px; font-weight: 600; letter-spacing: 0; text-transform: none; }
.baking-ticket-service-choice { display: flex; align-items: center; gap: 12px; min-height: 55px; padding: 9px 12px; border: 1px solid var(--baking-accent); background: #f5f8fb; }
.baking-ticket-check { display: grid; width: 27px; height: 27px; flex: 0 0 auto; place-items: center; border: 2px solid var(--baking-accent); color: var(--baking-accent); font-size: 17px; font-weight: 900; }
.baking-ticket-service-choice div { display: grid; gap: 2px; }
.baking-ticket-service-choice small { color: #647487; font-size: 8px; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; }
.baking-ticket-service-choice strong { color: var(--baking-ink); font-size: 14px; }
.baking-ticket-measures { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 12px; margin-top: 13px; padding: 10px 0; border-top: 1px dashed #8290a0; border-bottom: 1px dashed #8290a0; }
.baking-ticket-metric { display: grid; gap: 4px; }
.baking-ticket-metric strong { color: var(--baking-ink); font-size: 18px; }
.baking-ticket-metric strong small { font-size: 11px; }
.baking-ticket-multiply { color: var(--baking-accent); font-size: 20px; font-weight: 800; }
.baking-ticket-marination { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 12px; padding: 9px 12px; border: 1px solid var(--baking-line); }
.baking-ticket-marination div { display: grid; gap: 2px; }
.baking-ticket-marination div span { color: var(--baking-ink); font-size: 11px; font-weight: 850; letter-spacing: .06em; text-transform: uppercase; }
.baking-ticket-marination div small { color: #647487; font-size: 8px; }
.baking-ticket-marination > strong { min-width: 65px; padding: 5px 10px; border: 1px solid #6b7785; color: #343d46; font-size: 13px; text-align: center; }
.baking-ticket-marination > strong.is-selected { border-color: var(--baking-accent); color: white; background: var(--baking-accent); }
.baking-ticket-observations { min-height: 64px; margin-top: 12px; padding: 9px 11px; border: 1px solid var(--baking-line); }
.baking-ticket-observations h2 { margin: 0 0 5px; color: #647487; font-size: 9px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.baking-ticket-observations p { margin: 0; color: var(--baking-ink); font-size: 11px; white-space: pre-wrap; overflow-wrap: anywhere; }
.baking-ticket-totals { display: grid; gap: 6px; width: min(100%, 340px); margin: 13px 0 0 auto; }
.baking-ticket-totals > div { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 7px 10px; border: 1px solid var(--baking-line); color: #47586a; font-size: 10px; font-weight: 750; text-transform: uppercase; }
.baking-ticket-totals strong { color: var(--baking-ink); font-size: 13px; }
.baking-ticket-totals > .is-total { border: 2px solid var(--baking-accent); color: var(--baking-accent); font-size: 12px; }
.baking-ticket-totals > .is-total strong { color: var(--baking-accent); font-size: 17px; }
.baking-ticket-totals > .is-balance { border-color: #9aa8b5; border-style: dashed; }
.baking-ticket-footer { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 16px; padding-top: 9px; border-top: 1px solid var(--baking-line); }
.baking-ticket-footer > div { display: grid; gap: 4px; }
.baking-ticket-footer strong { color: var(--baking-ink); font-size: 11px; overflow-wrap: anywhere; }
.thermal-ticket.baking-ticket .print-title { display: grid; grid-template-columns: 1fr; gap: 5px; }
.thermal-ticket.baking-ticket .print-document-info { width: 100%; justify-content: space-between; text-align: left; }
.thermal-ticket.baking-ticket .print-document-info h1 { font-size: 12px; }
.thermal-ticket.baking-ticket .print-folio { min-width: 0; }
.thermal-ticket.baking-ticket .print-brand .brand-mark { display: block; width: 9mm; height: 9mm; border-radius: 0; }
.thermal-ticket.baking-ticket .baking-ticket-customer { grid-template-columns: 1.15fr 1fr; gap: 0 6px; margin-top: 8px; }
.thermal-ticket.baking-ticket .baking-ticket-field { padding: 5px 5px; }
.thermal-ticket.baking-ticket .baking-ticket-field span,
.thermal-ticket.baking-ticket .baking-ticket-delivery-heading > span,
.thermal-ticket.baking-ticket .baking-ticket-time > span,
.thermal-ticket.baking-ticket .baking-ticket-metric > span,
.thermal-ticket.baking-ticket .baking-ticket-footer span { font-size: 7px; }
.thermal-ticket.baking-ticket .baking-ticket-field strong { font-size: 8px; }
.thermal-ticket.baking-ticket .baking-ticket-customer-name strong { font-size: 10px; }
.thermal-ticket.baking-ticket .baking-ticket-delivery { gap: 4px; margin-top: 7px; padding: 6px; border-width: 1px; }
.thermal-ticket.baking-ticket .baking-ticket-delivery-heading strong { font-size: 12px; }
.thermal-ticket.baking-ticket .baking-ticket-time { min-width: 55px; padding: 3px 5px; }
.thermal-ticket.baking-ticket .baking-ticket-time strong { font-size: 14px; }
.thermal-ticket.baking-ticket .baking-ticket-service { margin-top: 8px; }
.thermal-ticket.baking-ticket .baking-ticket-section-heading { margin-bottom: 4px; font-size: 8px; }
.thermal-ticket.baking-ticket .baking-ticket-section-heading small { font-size: 7px; }
.thermal-ticket.baking-ticket .baking-ticket-service-choice { min-height: 38px; gap: 7px; padding: 5px 7px; }
.thermal-ticket.baking-ticket .baking-ticket-check { width: 20px; height: 20px; font-size: 12px; }
.thermal-ticket.baking-ticket .baking-ticket-service-choice small { font-size: 7px; }
.thermal-ticket.baking-ticket .baking-ticket-service-choice strong { font-size: 10px; }
.thermal-ticket.baking-ticket .baking-ticket-measures { gap: 5px; margin-top: 7px; padding: 6px 0; }
.thermal-ticket.baking-ticket .baking-ticket-metric strong { font-size: 11px; }
.thermal-ticket.baking-ticket .baking-ticket-metric strong small { font-size: 8px; }
.thermal-ticket.baking-ticket .baking-ticket-multiply { font-size: 13px; }
.thermal-ticket.baking-ticket .baking-ticket-marination { margin-top: 7px; padding: 5px 6px; }
.thermal-ticket.baking-ticket .baking-ticket-marination div span { font-size: 8px; }
.thermal-ticket.baking-ticket .baking-ticket-marination div small { font-size: 6px; }
.thermal-ticket.baking-ticket .baking-ticket-marination > strong { min-width: 42px; padding: 3px 5px; font-size: 9px; }
.thermal-ticket.baking-ticket .baking-ticket-observations { min-height: 40px; margin-top: 7px; padding: 5px 6px; }
.thermal-ticket.baking-ticket .baking-ticket-observations h2 { font-size: 7px; }
.thermal-ticket.baking-ticket .baking-ticket-observations p { font-size: 8px; }
.thermal-ticket.baking-ticket .baking-ticket-totals { gap: 3px; width: 100%; margin-top: 7px; }
.thermal-ticket.baking-ticket .baking-ticket-totals > div { padding: 4px 5px; font-size: 8px; }
.thermal-ticket.baking-ticket .baking-ticket-totals strong { font-size: 9px; }
.thermal-ticket.baking-ticket .baking-ticket-totals > .is-total { font-size: 9px; }
.thermal-ticket.baking-ticket .baking-ticket-totals > .is-total strong { font-size: 12px; }
.thermal-ticket.baking-ticket .baking-ticket-footer { gap: 6px; margin-top: 7px; padding-top: 5px; }
.thermal-ticket.baking-ticket .baking-ticket-footer strong { font-size: 8px; }
@page thermal58 { margin: 0; }
@page thermal80 { margin: 0; }

.operation-heading-actions { display: flex; align-items: center; gap: 10px; }
.operation-folio { display: grid; min-width: 84px; gap: 2px; padding: 8px 11px; border: 1px solid var(--line); border-radius: 9px; background: var(--surface); text-align: center; }
.operation-folio small { color: var(--muted); font-size: 8px; font-weight: 750; letter-spacing: .1em; }
.operation-folio strong { color: #d13b36; font-size: 15px; letter-spacing: .05em; }
.operation-folio-system { border-left: 3px solid #d13b36; }
.operation-folio-system small,
.operation-folio-system strong { color: #c83232; }
.operation-card .manual-folio-input { border-left: 3px solid #2878c7; }
.operation-card label[for="ManualFolio"] { color: #246eb5; }
.operation-card .operation-folio-system {
  display: flex;
  width: 100%;
  min-width: 0;
  height: 39px;
  align-items: center;
  justify-content: center;
  padding: 0 11px;
  border: 1px solid var(--line);
  border-left: 3px solid #d13b36;
  border-radius: 8px;
  background: var(--surface);
}
.operation-card .operation-folio-system strong { font-size: 15px; }
.operation-card { margin-bottom: 14px; padding: 19px 20px; }
.operation-card-heading { display: flex; min-width: 0; align-items: center; gap: 11px; margin-bottom: 17px; }
.operation-card-heading > div { min-width: 0; }
.operation-section-icon { display: grid; width: 34px; height: 34px; flex: 0 0 auto; place-items: center; border-radius: 10px; color: var(--blue); background: color-mix(in srgb, var(--blue) 10%, var(--surface)); font-size: 10px; font-weight: 800; }
.operation-card-heading h2 { margin: 0; color: var(--ink); font-size: 14px; font-weight: 700; }
.operation-card-heading p { margin: 3px 0 0; color: var(--muted); font-size: 11px; }
.operation-card-heading .operation-folio { margin-left: auto; }
.operation-card .field-label { margin-bottom: 6px; color: var(--ink); font-size: 11px; }
.operation-card .form-control,
.operation-card .form-select { min-height: 39px; border-color: var(--line); color: var(--ink); background-color: var(--surface); font-size: 12px; }
.operation-card .form-control:focus,
.operation-card .form-select:focus { border-color: var(--blue); box-shadow: 0 0 0 3px color-mix(in srgb, var(--blue) 13%, transparent); }
.operation-card .input-group-text { min-width: 34px; justify-content: center; border-color: var(--line); color: var(--muted); background: var(--page); font-size: 12px; }
.operation-card .form-control[readonly] { background-color: color-mix(in srgb, var(--page) 75%, var(--surface)); font-weight: 650; }
.operation-card .balance-input .form-control { color: #ae3939; background: #fff3f2; }
.operation-card .balance-input .form-control.is-settled { color: #16714e; background: #eaf7f1; }
.operation-card .balance-input .form-control.is-invalid { border-color: #d94a4a; color: #b42318; background: #fff0f0; }
.operation-card .form-check { display: flex; min-height: 39px; align-items: center; gap: 7px; margin: 0; padding: 0 10px; border: 1px solid var(--line); border-radius: 8px; }
.operation-card .form-check-input { margin: 0; }
.operation-card .form-check-label { color: var(--ink); font-size: 12px; }
.operation-card .operation-notes { min-height: 78px; resize: vertical; }
.operation-field-help { display: block; margin-top: 5px; color: var(--muted); font-size: 10px; }
.operation-card .text-danger { display: block; margin-top: 4px; font-size: 10px; }
.operation-card .table-responsive { overflow-x: auto; }
.operation-card #order-lines { min-width: 680px; margin: 0; color: var(--ink); font-size: 11px; vertical-align: middle; }
.operation-card #order-lines thead { color: var(--muted); background: var(--page); }
.operation-card #order-lines th { padding: 9px 10px; border-bottom: 1px solid var(--line); font-size: 9px; font-weight: 700; white-space: nowrap; }
.operation-card #order-lines td { padding: 7px 8px; border-bottom: 1px solid var(--line); }
.operation-card #order-lines .product-search { min-width: 90px; }
.operation-card #order-lines .form-control,
.operation-card #order-lines .form-select { min-width: 90px; }
.operation-card #order-lines .size-select:disabled { border-color: #d8dce2; color: #777e88; background-color: #eceff3; cursor: not-allowed; opacity: 1; }
.operation-card #empty-lines { margin: 0; padding: 18px 0 3px; font-size: 11px; }
.operation-item-count { margin-left: auto; color: var(--muted); font-size: 11px; white-space: nowrap; }
.operation-card-heading .operation-item-count + .btn { flex: 0 0 auto; }
.operation-submit-row { display: flex; justify-content: flex-end; gap: 9px; margin: 17px 0 30px; }
html[data-theme="Dark"] .operation-folio,
html[data-theme="Dark"] .operation-card .form-check { background: var(--surface); }
html[data-theme="Dark"] .operation-card.operation-totals #total-preview {
  border-color: #3b526b;
  color: #c5dcf8;
  background: #25303b;
}
html[data-theme="Dark"] .operation-card.operation-totals .balance-input .form-control { border-color: #744444; color: #ffaaaa; background: #392828; }
html[data-theme="Dark"] .operation-card.operation-totals .balance-input .form-control.is-settled { border-color: #3b6a51; color: #9bdfb6; background: #26392d; }
html[data-theme="Dark"] .operation-card.operation-totals .balance-input .form-control.is-invalid { border-color: #a54b4b; color: #ffaaaa; background: #492b2b; }
html[data-theme="Dark"] .operation-card #order-lines thead { background: #333; }
html[data-theme="Dark"] .operation-card #order-lines .size-select:disabled { border-color: #484848; color: #a5a5a5; background-color: #383838; }

@media print {
  .thermal-print-hint { display: none !important; }
  .baking-ticket { print-color-adjust: exact; -webkit-print-color-adjust: exact; }
  .thermal-ticket { width: 76mm !important; max-width: none !important; margin: 0 !important; padding: 2mm !important; overflow: visible !important; }
  .thermal-ticket.thermal-58 { width: 54mm !important; }
  .thermal-ticket::before { display: none !important; }
  .thermal-ticket .print-items th,
  .thermal-ticket .print-totals > .print-total-primary { color: #111 !important; background: white !important; }
  .thermal-ticket .print-title,
  .thermal-ticket .print-fields,
  .thermal-ticket .print-items-section,
  .thermal-ticket .print-totals,
  .thermal-ticket .print-footer { break-inside: auto; }
}

.app-container { display: block; min-height: 100vh; padding: 0; }
.main-content { width: 100%; margin-left: 0; }
.topbar { position: sticky; z-index: 50; top: 12px; display: flex; width: calc(100% - clamp(24px, 4vw, 64px)); min-height: 72px; justify-content: flex-start; gap: clamp(20px, 3vw, 42px); margin: 12px auto 0; padding: 0 clamp(18px, 3vw, 42px); border: 1px solid rgba(225, 230, 236, .55); border-radius: 15px; background: rgba(255, 255, 255, .62); box-shadow: 0 8px 28px rgba(26, 35, 48, .06); backdrop-filter: blur(12px) saturate(145%); -webkit-backdrop-filter: blur(12px) saturate(145%); }
.sidebar-brand { flex: 0 0 auto; gap: 10px; padding: 0; }
.sidebar-logo { width: 36px; height: 36px; }
.sidebar-brand-copy { display: grid; min-width: 0; gap: 2px; line-height: 1.1; }
.sidebar-brand-copy strong { font-size: inherit; font-weight: 750; }
.sidebar-brand-copy small { max-width: 170px; overflow: hidden; color: #77808b; font-size: 9px; font-weight: 550; letter-spacing: 0; text-overflow: ellipsis; white-space: nowrap; }
.primary-nav { display: flex; min-width: 0; flex: 1; align-items: stretch; gap: 4px; }
.nav-direct, .nav-menu-trigger { position: relative; display: inline-flex; min-height: 72px; align-items: center; justify-content: center; gap: 7px; padding: 0 13px; border: 0; border-bottom: 2px solid transparent; color: #606975; background: transparent; font: inherit; font-size: 12px; font-weight: 550; white-space: nowrap; transition: color .16s, background .16s, border-color .16s; }
.nav-direct:hover, .nav-menu-trigger:hover, .nav-menu.is-open .nav-menu-trigger, .nav-menu.has-active .nav-menu-trigger, .nav-direct.active { color: #20242a; }
.nav-direct.active, .nav-menu.has-active .nav-menu-trigger { border-bottom-color: #202a35; }
.nav-menu-trigger { cursor: pointer; }
.nav-logout-form { display: flex; flex: 0 0 auto; margin: 0; }
.nav-logout { cursor: pointer; }
.nav-menu-trigger svg { width: 14px; height: 14px; color: #9299a3; transition: transform .18s; }
.nav-menu.is-open .nav-menu-trigger svg { transform: rotate(180deg); }
.nav-menu { position: relative; display: flex; align-items: stretch; }
.mega-menu { position: absolute; top: calc(100% - 2px); left: 50%; display: grid; width: min(720px, calc(100vw - 44px)); grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; padding: 25px 28px; border: 1px solid rgba(226, 231, 237, .96); border-radius: 14px; background: rgba(255, 255, 255, .98); box-shadow: 0 18px 40px rgba(20, 28, 40, .15); backdrop-filter: blur(8px) saturate(125%); -webkit-backdrop-filter: blur(8px) saturate(125%); transform: translateX(-50%); }
.mega-menu[hidden] { display: none; }
.mega-menu-column { min-width: 0; }
.mega-menu-column > p { margin: 0 0 12px; color: #9299a3; font-size: 9px; font-weight: 750; letter-spacing: .11em; text-transform: uppercase; }
.mega-menu-link { display: flex; min-width: 0; align-items: center; gap: 12px; margin: 2px 0; padding: 10px 9px; border-radius: 9px; color: #515b67; transition: color .15s, background .15s; }
.mega-menu-link:hover, .mega-menu-link.active { color: #202a35; background: #f4f6f8; }
.mega-menu-icon { display: grid; width: 35px; height: 35px; flex: 0 0 auto; place-items: center; border: 1px solid #e8ebef; border-radius: 9px; color: #697889; background: #fafbfc; }
.mega-menu-icon svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.mega-menu-link > span:last-child { display: grid; min-width: 0; gap: 4px; }
.mega-menu-link strong { overflow: hidden; color: inherit; font-size: 11px; font-weight: 650; text-overflow: ellipsis; white-space: nowrap; }
.mega-menu-link small { overflow: hidden; color: #9299a3; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.topbar-actions { flex: 0 0 auto; gap: 7px; }
.topbar-actions form { margin: 0; }
.top-avatar { margin-left: 0; }
.mobile-menu-toggle { display: none; }
.page-content { max-width: 1680px; }

@media (max-width: 1120px) {
  .topbar { gap: 15px; padding: 0 20px; }
  .primary-nav { gap: 0; }
  .nav-direct, .nav-menu-trigger { padding-right: 9px; padding-left: 9px; font-size: 11px; }
  .topbar-actions { gap: 3px; }
}

@media (max-width: 900px) {
  .topbar { width: calc(100% - 16px); min-height: 64px; justify-content: space-between; gap: 10px; margin-top: 8px; padding: 0 16px; }
  .mobile-menu-toggle { display: inline-grid; order: 3; }
  .primary-nav { position: absolute; z-index: 51; top: calc(100% + 1px); right: 12px; left: 12px; display: none; max-height: calc(100vh - 82px); flex: initial; flex-direction: column; align-items: stretch; overflow-y: auto; padding: 9px; border: 1px solid #e8ebef; border-radius: 12px; background: #fff; box-shadow: 0 18px 40px rgba(20, 28, 40, .16); }
  body.nav-open .primary-nav { display: flex; }
  .nav-direct, .nav-menu-trigger { width: 100%; min-height: 43px; justify-content: space-between; padding: 0 12px; border: 0; border-radius: 8px; text-align: left; }
  .nav-direct.active, .nav-menu.has-active .nav-menu-trigger { background: #f0f1f3; }
  .nav-menu { display: block; }
  .mega-menu { position: static; width: 100%; grid-template-columns: minmax(0, 1fr); gap: 10px; padding: 12px 8px 15px; border: 0; border-radius: 0; box-shadow: none; transform: none; }
  .mega-menu-column > p { margin-left: 9px; }
  .topbar-actions { margin-left: auto; }
  .main-content { width: 100%; margin: 0; }
}

@media (max-width: 520px) {
  .topbar { padding: 0 12px; }
  .sidebar-brand { font-size: 15px; }
  .sidebar-logo { width: 32px; height: 32px; }
  .topbar-actions { gap: 1px; }
  .top-avatar { width: 29px; height: 29px; font-size: 9px; }
  .mega-menu { padding-right: 4px; padding-left: 4px; }
}

.theme-toggle-form { display: flex; margin: 0; }
.theme-toggle { color: inherit; }
.theme-alert { margin: 14px auto 0; width: min(100% - 48px, 1608px); }
html[data-theme="Dark"] {
  color-scheme: dark;
  --bs-body-color: #f3f3f3;
  --bs-body-color-rgb: 243, 243, 243;
  --bs-body-bg: #202020;
  --bs-body-bg-rgb: 32, 32, 32;
  --bs-emphasis-color: #f3f3f3;
  --bs-emphasis-color-rgb: 243, 243, 243;
  --bs-secondary-color: #b8b8b8;
  --bs-secondary-color-rgb: 184, 184, 184;
  --bs-tertiary-color: #999;
  --bs-tertiary-color-rgb: 153, 153, 153;
  --bs-secondary-bg: #333;
  --bs-secondary-bg-rgb: 51, 51, 51;
  --bs-tertiary-bg: #2b2b2b;
  --bs-tertiary-bg-rgb: 43, 43, 43;
  --bs-border-color: #414141;
  --bs-border-color-translucent: rgba(255, 255, 255, .14);
  --bs-link-color: #8ab4f8;
  --bs-link-hover-color: #a9c7f7;
  --bs-form-control-bg: #242424;
  --bs-form-control-color: #ededed;
  --bs-form-control-border-color: #484848;
  --bs-form-control-disabled-bg: #333;
  --bs-form-select-bg: #242424;
  --bs-form-select-color: #ededed;
  --bs-form-select-border-color: #484848;
  --bs-code-color: #d6b5ff;
  --bs-highlight-bg: #514725;
  --bs-highlight-color: #f5e4ab;
  --bs-table-color: #d0d0d0;
  --bs-table-bg: transparent;
  --bs-table-border-color: #414141;
  --bs-table-striped-color: #dedede;
  --bs-table-striped-bg: rgba(255, 255, 255, .035);
  --bs-table-hover-color: #fff;
  --bs-table-hover-bg: rgba(255, 255, 255, .06);
  --bs-table-active-color: #fff;
  --bs-table-active-bg: rgba(255, 255, 255, .08);
  --bg-body: #202020;
  --text-main: #f3f3f3;
  --text-muted: #b8b8b8;
  --border-color: #414141;
  --primary: #3a78c2;
  --surface: #2b2b2b;
  --success: #b8b8b8;
  --warning: #b8b8b8;
  --shadow-card: 0 3px 14px rgba(0, 0, 0, .2);
  --ink: #f3f3f3;
  --muted: #b8b8b8;
  --line: #414141;
  --page: #202020;
  --blue: #8ab4f8;
  --blue-dark: #a9c7f7;
  background: var(--bg-body);
}
html[data-theme="Dark"] body { color: var(--text-main); background: var(--bg-body); }
html[data-theme="Dark"] a { color: #8ab4f8; }
html[data-theme="Dark"] .topbar {
  border-color: rgba(74, 74, 74, .85);
  background: rgba(43, 43, 43, .92);
  box-shadow: 0 8px 28px rgba(0, 0, 0, .22);
}
html[data-theme="Dark"] .sidebar-brand,
html[data-theme="Dark"] .sidebar-brand:hover,
html[data-theme="Dark"] .nav-direct,
html[data-theme="Dark"] .nav-menu-trigger,
html[data-theme="Dark"] .nav-direct:hover,
html[data-theme="Dark"] .nav-menu-trigger:hover,
html[data-theme="Dark"] .nav-menu.is-open .nav-menu-trigger,
html[data-theme="Dark"] .nav-menu.has-active .nav-menu-trigger,
html[data-theme="Dark"] .nav-direct.active { color: #e3eaf2; }
html[data-theme="Dark"] .sidebar-brand-copy small { color: #b8b8b8; }
html[data-theme="Dark"] .nav-direct.active,
html[data-theme="Dark"] .nav-menu.has-active .nav-menu-trigger { border-bottom-color: #8ab4f8; }
html[data-theme="Dark"] .nav-direct.active,
html[data-theme="Dark"] .nav-menu.has-active .nav-menu-trigger { background-color: rgba(255, 255, 255, .06); }
html[data-theme="Dark"] .mega-menu {
  border-color: #484848;
  background: rgba(43, 43, 43, .98);
  box-shadow: 0 18px 40px rgba(0, 0, 0, .36);
}
@media (max-width: 900px) {
  html[data-theme="Dark"] .primary-nav {
    border-color: #484848;
    background: #2b2b2b;
    box-shadow: 0 18px 40px rgba(0, 0, 0, .42);
  }
  html[data-theme="Dark"] .primary-nav .nav-direct,
  html[data-theme="Dark"] .primary-nav .nav-menu-trigger,
  html[data-theme="Dark"] .primary-nav .nav-direct:hover,
  html[data-theme="Dark"] .primary-nav .nav-menu-trigger:hover,
  html[data-theme="Dark"] .primary-nav .nav-menu.is-open .nav-menu-trigger,
  html[data-theme="Dark"] .primary-nav .nav-menu.has-active .nav-menu-trigger { color: #e3e3e3; }
  html[data-theme="Dark"] .primary-nav .nav-menu-trigger svg { color: #b8b8b8; }
  html[data-theme="Dark"] .primary-nav .nav-direct.active,
  html[data-theme="Dark"] .primary-nav .nav-menu.has-active .nav-menu-trigger {
    color: #a9c7f7;
    background: #383838;
  }
  html[data-theme="Dark"] .primary-nav .mega-menu {
    border: 1px solid #484848;
    border-radius: 10px;
    background: #242424;
    box-shadow: inset 0 1px rgba(255, 255, 255, .025);
  }
  html[data-theme="Dark"] .primary-nav .mega-menu-column > p { color: #a8a8a8; }
  html[data-theme="Dark"] .primary-nav .mega-menu-link { color: #dedede; }
  html[data-theme="Dark"] .primary-nav .mega-menu-link:hover,
  html[data-theme="Dark"] .primary-nav .mega-menu-link.active { color: #fff; background: #393939; }
  html[data-theme="Dark"] .primary-nav .mega-menu-link small { color: #aaa; }
  html[data-theme="Dark"] .primary-nav .mega-menu-icon { border-color: #4a4a4a; color: #c8c8c8; background: #363636; }
}
html[data-theme="Dark"] .mega-menu-column > p,
html[data-theme="Dark"] .mega-menu-link small,
html[data-theme="Dark"] .table-search { color: #b8b8b8; }
html[data-theme="Dark"] .mega-menu-link { color: #d0d0d0; }
html[data-theme="Dark"] .mega-menu-link:hover,
html[data-theme="Dark"] .mega-menu-link.active { color: #fff; background: #3b3b3b; }
html[data-theme="Dark"] .mega-menu-icon,
html[data-theme="Dark"] .icon-button:hover { border-color: #4a4a4a; color: #e0e0e0; background: #3a3a3a; }
html[data-theme="Dark"] .table-search { border-color: #454545; background: #242424; }
html[data-theme="Dark"] .table-search input { color: #f0f0f0; }
html[data-theme="Dark"] .icon-button,
html[data-theme="Dark"] .icon-button:hover,
html[data-theme="Dark"] .theme-toggle { color: #d0d0d0; }
html[data-theme="Dark"] .notification-count { border-color: #2b2b2b; }
html[data-theme="Dark"] .page-heading h1,
html[data-theme="Dark"] .dashboard-heading h1,
html[data-theme="Dark"] .dashboard-panel-heading h2,
html[data-theme="Dark"] .deliveries-table-heading h2,
html[data-theme="Dark"] .document-trend-heading h3,
html[data-theme="Dark"] .dashboard-metric .metric-value,
html[data-theme="Dark"] .document-count-card strong,
html[data-theme="Dark"] .chart-summary strong,
html[data-theme="Dark"] .breakdown-total strong { color: #f3f3f3; }
html[data-theme="Dark"] .muted,
html[data-theme="Dark"] .table-subtitle,
html[data-theme="Dark"] .metric-label,
html[data-theme="Dark"] .metric-caption,
html[data-theme="Dark"] .metric-trend.trend-neutral,
html[data-theme="Dark"] .document-counts-heading > span,
html[data-theme="Dark"] .document-trend-heading > span,
html[data-theme="Dark"] .document-count-card > div span,
html[data-theme="Dark"] .breakdown-total span,
html[data-theme="Dark"] .chart-summary span,
html[data-theme="Dark"] .cell-subtitle { color: #b8b8b8; }
html[data-theme="Dark"] .dashboard-metric,
html[data-theme="Dark"] .dashboard-panel,
html[data-theme="Dark"] .form-card,
html[data-theme="Dark"] .panel,
html[data-theme="Dark"] .card-panel,
html[data-theme="Dark"] .metric-card,
html[data-theme="Dark"] .deliveries-date-form,
html[data-theme="Dark"] .section-tabs a,
html[data-theme="Dark"] .document-counts {
  border-color: #414141;
  background: #2b2b2b;
  box-shadow: var(--shadow-card);
}
html[data-theme="Dark"] .document-counts-heading h2 { color: #f3f3f3; }
html[data-theme="Dark"] .document-count-card { border-color: #414141; background: #333; }
html[data-theme="Dark"] .upcoming-deliveries-panel { border-color: #3b5369; background: linear-gradient(115deg, #303030 0%, #2b2b2b 75%); }
html[data-theme="Dark"] .upcoming-deliveries-heading h2 { color: #a9c7f7; }
html[data-theme="Dark"] .upcoming-deliveries-panel .panel-count { color: #b5d0f7; background: #343c47; }
html[data-theme="Dark"] .deliveries-summary span { border-color: #484848; color: #d0d0d0; background: #353535; }
html[data-theme="Dark"] .deliveries-summary span:first-child { border-color: #5c4b2e; color: #f0c36d; background: #403522; }
html[data-theme="Dark"] .deliveries-summary span:nth-child(2) { border-color: #365643; color: #79d6a5; background: #263b30; }
html[data-theme="Dark"] .deliveries-summary span:last-child { border-color: #484848; color: #c5c5c5; background: #303030; }
html[data-theme="Dark"] .deliveries-summary strong { color: inherit; }
html[data-theme="Dark"] .dashboard-alert { border-color: #405a74; color: #c0d7f7; background: #303944; }
html[data-theme="Dark"] .dashboard-alert.error { border-color: #704246; color: #f1b2b4; background: #342124; }
html[data-theme="Dark"] .button-primary { border-color: #3a78c2; color: #fff; background: #3a78c2; }
html[data-theme="Dark"] .button-secondary {
  border-color: #484848;
  color: #dedede;
  background: #363636;
}
html[data-theme="Dark"] .button-secondary:hover { border-color: #666; color: #fff; background: #444; }
html[data-theme="Dark"] .form-control,
html[data-theme="Dark"] .form-select,
html[data-theme="Dark"] input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
html[data-theme="Dark"] select,
html[data-theme="Dark"] textarea {
  border-color: #484848;
  color: #ededed;
  background-color: #242424;
}
html[data-theme="Dark"] input::placeholder,
html[data-theme="Dark"] textarea::placeholder { color: #a5a5a5; }
html[data-theme="Dark"] .field-label,
html[data-theme="Dark"] .form-label,
html[data-theme="Dark"] .deliveries-date-form .field-label { color: #dedede; }
html[data-theme="Dark"] .table,
html[data-theme="Dark"] .table:not(.print-items):not(.size-list),
html[data-theme="Dark"] .table:not(.print-items):not(.size-list) td,
html[data-theme="Dark"] .panel .table,
html[data-theme="Dark"] .compact-panel .table td { color: #d0d0d0; }
html[data-theme="Dark"] .transactions-table { color: #d0d0d0; }
html[data-theme="Dark"] .transactions-table thead,
html[data-theme="Dark"] .table:not(.print-items):not(.size-list) thead { color: #c0c0c0; background: #333; }
html[data-theme="Dark"] .table {
  --bs-table-color: #d0d0d0;
  --bs-table-bg: transparent;
  --bs-table-border-color: #414141;
  --bs-table-striped-color: #dedede;
  --bs-table-striped-bg: rgba(255, 255, 255, .035);
  --bs-table-hover-color: #fff;
  --bs-table-hover-bg: rgba(255, 255, 255, .06);
  --bs-table-active-color: #fff;
  --bs-table-active-bg: rgba(255, 255, 255, .08);
}
html[data-theme="Dark"] .table > :not(caption) > * > * {
  color: var(--bs-table-color);
  background-color: transparent;
  border-bottom-color: var(--bs-table-border-color);
  box-shadow: inset 0 0 0 9999px var(--bs-table-bg-state, var(--bs-table-bg-type, var(--bs-table-accent-bg)));
}
html[data-theme="Dark"] .table > thead > tr > th,
html[data-theme="Dark"] .table-light,
html[data-theme="Dark"] .table-light > th,
html[data-theme="Dark"] .table-light > td,
html[data-theme="Dark"] .table-light > * > th,
html[data-theme="Dark"] .table-light > * > td {
  --bs-table-color: #d8d8d8;
  --bs-table-bg: #333;
  --bs-table-border-color: #484848;
}
html[data-theme="Dark"] .table > :not(caption) > * > .table-light,
html[data-theme="Dark"] .table > :not(caption) > .table-light > * {
  color: #d8d8d8;
  background-color: #333;
}
html[data-theme="Dark"] .transactions-table td,
html[data-theme="Dark"] .table:not(.print-items):not(.size-list) td,
html[data-theme="Dark"] .table:not(.print-items):not(.size-list) th { border-color: #414141; }
html[data-theme="Dark"] .transactions-table tbody tr:hover,
html[data-theme="Dark"] .table:not(.print-items):not(.size-list) tbody tr:hover { background: #393939; }
html[data-theme="Dark"] .upcoming-table tbody tr { color: #d0d0d0; background: #2b2b2b; }
html[data-theme="Dark"] .upcoming-table tbody tr > td { border-color: #414141; background-color: transparent; }
html[data-theme="Dark"] .upcoming-table tbody tr:hover { background: #393939; }
html[data-theme="Dark"] .upcoming-table tbody tr[data-sort-status="1"] { color: #b8b8b8; background: #262626; }
html[data-theme="Dark"] .upcoming-table tbody tr[data-sort-status="1"] .customer-name,
html[data-theme="Dark"] .upcoming-table tbody tr[data-sort-status="1"] .revenue-cell { color: #b8b8b8; }
html[data-theme="Dark"] .upcoming-table tbody tr[data-sort-status="1"]:hover { background: #393939; }
html[data-theme="Dark"] .deliveries-table tbody tr[data-sort-status="1"] { color: #b8b8b8; background: #262626; }
html[data-theme="Dark"] .deliveries-table tbody tr[data-sort-status="1"] .customer-name,
html[data-theme="Dark"] .deliveries-table tbody tr[data-sort-status="1"] .revenue-cell,
html[data-theme="Dark"] .customer-name,
html[data-theme="Dark"] .folio-cell,
html[data-theme="Dark"] .revenue-cell { color: #e0e0e0; }
html[data-theme="Dark"] .table-sort-button:hover,
html[data-theme="Dark"] .table-sort-button:focus-visible { color: #8ab4f8; }
html[data-theme="Dark"] .transactions-table tbody tr[hidden],
html[data-theme="Dark"] .deliveries-table tbody tr[hidden] { display: none; }
html[data-theme="Dark"] .transaction-status.success { color: #79d6a5; background: #263b30; }
html[data-theme="Dark"] .transaction-status.pending { color: #f0c36d; background: #403522; }
html[data-theme="Dark"] .transaction-status.refunded { color: #c1c1c1; background: #3a3a3a; }
html[data-theme="Dark"] .document-type-badge { color: #9fc7ff; background: #303b49; }
html[data-theme="Dark"] .document-type-badge.baking { color: #f0c36d; background: #403522; }
html[data-theme="Dark"] .document-type-badge.sales { color: #79d6a5; background: #263b30; }
html[data-theme="Dark"] .document-type-badge.products { color: #9fc7ff; background: #303b49; }
html[data-theme="Dark"] .delivery-action { color: #79d6a5; background: #263b30; }
html[data-theme="Dark"] .delivery-action:hover { color: #111; background: #79d6a5; }
html[data-theme="Dark"] .delivered-action-label,
html[data-theme="Dark"] .empty-state { color: #b8b8b8; }
html[data-theme="Dark"] .breakdown-legend { border-color: #414141; }
html[data-theme="Dark"] .breakdown-legend > div,
html[data-theme="Dark"] .breakdown-legend strong { color: #d0d0d0; }
html[data-theme="Dark"] .panel-icon { color: #c7c7c7; background: #3a3a3a; }
html[data-theme="Dark"] .user-avatar { border-color: #544a37; color: #f0d6a0; background: #403728; }
html[data-theme="Dark"] .powered-footer { border-color: #303a46; color: #9aa6b3; }
html[data-theme="Dark"] .powered-footer > span:last-child { color: #c6d0da; }
html[data-theme="Dark"] .login-page,
html[data-theme="Dark"] .public-main { color-scheme: light; }
html[data-theme="Dark"] .metric-icon.blue,
html[data-theme="Dark"] .document-count-icon.blue {
  border-color: #3b526b;
  color: #9fc7ff;
  background: #303b49;
}
html[data-theme="Dark"] .metric-icon.violet,
html[data-theme="Dark"] .document-count-icon.violet {
  border-color: #54496b;
  color: #c2a7ff;
  background: #3c334b;
}
html[data-theme="Dark"] .metric-icon.amber,
html[data-theme="Dark"] .document-count-icon.amber {
  border-color: #5c4b2e;
  color: #f0c36d;
  background: #403522;
}
html[data-theme="Dark"] .metric-icon.green {
  border-color: #365643;
  color: #79d6a5;
  background: #263b30;
}
html[data-theme="Dark"] .document-count-icon {
  border-color: #494949;
  color: #d7d7d7;
  background: #383838;
}
html[data-theme="Dark"] .metric-sparkline polyline { stroke: #8ab4f8; }
html[data-theme="Dark"] .metric-sparkline.violet-line polyline { stroke: #c2a7ff; }
html[data-theme="Dark"] .metric-sparkline.amber-line polyline { stroke: #f0c36d; }
html[data-theme="Dark"] .metric-sparkline.green-line polyline { stroke: #79d6a5; }
html[data-theme="Dark"] .revenue-dot { background: #8ab4f8; }
html[data-theme="Dark"] .collected-dot { background: #79d6a5; }
html[data-theme="Dark"] .outstanding-dot { background: #f0c36d; }
html[data-theme="Dark"] .trend-positive { color: #79d6a5; }
html[data-theme="Dark"] .trend-negative { color: #f28b82; }
html[data-theme="Dark"] .text-dark,
html[data-theme="Dark"] .text-black,
html[data-theme="Dark"] .text-body,
html[data-theme="Dark"] .text-body-emphasis { color: #ededed !important; }
html[data-theme="Dark"] .text-muted,
html[data-theme="Dark"] .text-body-secondary { color: #b8b8b8 !important; }
html[data-theme="Dark"] .bg-white,
html[data-theme="Dark"] .bg-light,
html[data-theme="Dark"] .bg-body,
html[data-theme="Dark"] .bg-body-tertiary,
html[data-theme="Dark"] .list-group-item,
html[data-theme="Dark"] .dropdown-menu,
html[data-theme="Dark"] .modal-content,
html[data-theme="Dark"] .offcanvas,
html[data-theme="Dark"] .accordion-item,
html[data-theme="Dark"] .popover,
html[data-theme="Dark"] .toast,
html[data-theme="Dark"] .page-link {
  border-color: #414141;
  color: #ededed;
  background-color: #2b2b2b;
}
html[data-theme="Dark"] .bg-body-secondary,
html[data-theme="Dark"] .list-group-item-action:hover,
html[data-theme="Dark"] .list-group-item-action:focus,
html[data-theme="Dark"] .dropdown-item:hover,
html[data-theme="Dark"] .dropdown-item:focus { color: #fff; background-color: #3a3a3a; }
html[data-theme="Dark"] .dropdown-divider,
html[data-theme="Dark"] hr { border-color: #484848; }
html[data-theme="Dark"] .btn-light,
html[data-theme="Dark"] .btn-outline-light { border-color: #484848; color: #ededed; background-color: #363636; }
html[data-theme="Dark"] .btn-light:hover,
html[data-theme="Dark"] .btn-outline-light:hover { border-color: #666; color: #fff; background-color: #444; }
html[data-theme="Dark"] .alert-primary,
html[data-theme="Dark"] .alert-info { border-color: #3b5369; color: #c7dcf7; background-color: #303944; }
html[data-theme="Dark"] .alert-success { border-color: #365643; color: #9cddb7; background-color: #263b30; }
html[data-theme="Dark"] .alert-warning { border-color: #5c4b2e; color: #f0c36d; background-color: #403522; }
html[data-theme="Dark"] .alert-danger { border-color: #704246; color: #f1b2b4; background-color: #342124; }
html[data-theme="Dark"] .form-check-input {
  border-color: #686868;
  background-color: #333;
}
html[data-theme="Dark"] .form-check-input:checked { border-color: #3a78c2; background-color: #3a78c2; }
html[data-theme="Dark"] .form-check-input:focus { border-color: #8ab4f8; box-shadow: 0 0 0 .25rem rgba(138, 180, 248, .2); }
html[data-theme="Dark"] .form-control:focus,
html[data-theme="Dark"] .form-select:focus,
html[data-theme="Dark"] input:focus,
html[data-theme="Dark"] select:focus,
html[data-theme="Dark"] textarea:focus { border-color: #8ab4f8; box-shadow: 0 0 0 .2rem rgba(138, 180, 248, .18); }
html[data-theme="Dark"] .period-select,
html[data-theme="Dark"] .date-chip {
  border-color: #484848;
  color: #dedede;
  background: #303030;
}
html[data-theme="Dark"] .period-select select,
html[data-theme="Dark"] .period-select select option {
  color: #ededed;
  background-color: #303030;
}
html[data-theme="Dark"] .period-select input[type="month"] {
  color-scheme: dark;
  color: #ededed;
}
html[data-theme="Dark"] .period-select select:focus,
html[data-theme="Dark"] .period-select input[type="month"]:focus { outline-color: #8ab4f8; }
html[data-theme="Dark"] .period-select svg,
html[data-theme="Dark"] .date-chip svg { color: #bdbdbd; }
html[data-theme="Dark"] .report-note {
  border-color: #414141;
  color: #ededed;
  background: #2b2b2b;
}
html[data-theme="Dark"] .report-note strong { color: #f3f3f3; }
html[data-theme="Dark"] .report-note span { color: #b8b8b8; }
html[data-theme="Dark"] .count-badge {
  border: 1px solid #3b526b;
  color: #9fc7ff;
  background: #303b49;
}
html[data-theme="Dark"] .form-stack input:not([type="checkbox"]),
html[data-theme="Dark"] .form-stack select,
html[data-theme="Dark"] .form-stack textarea {
  border-color: #484848;
  color: #ededed;
  background: #242424;
}
html[data-theme="Dark"] .form-stack input::placeholder,
html[data-theme="Dark"] .form-stack textarea::placeholder { color: #a5a5a5; }
html[data-theme="Dark"] .form-stack label { color: #dedede; }
html[data-theme="Dark"] .size-editor {
  border-color: #484848;
  background: #303030;
}
html[data-theme="Dark"] .size-editor-help { color: #b8b8b8; }
html[data-theme="Dark"] .size-editor-fields label { color: #dedede; }
html[data-theme="Dark"] .size-editor-fields input {
  border-color: #484848;
  color: #ededed;
  background: #242424;
}
html[data-theme="Dark"] .size-list-wrap {
  border-color: #484848;
  background: #2b2b2b;
}
html[data-theme="Dark"] .size-list { color: #d0d0d0; background: #2b2b2b; }
html[data-theme="Dark"] .size-list th,
html[data-theme="Dark"] .size-list td {
  border-color: #414141;
  color: #d0d0d0;
  background: #2b2b2b;
}
html[data-theme="Dark"] .size-list th { color: #c0c0c0; background: #333; }
html[data-theme="Dark"] .size-list-empty { color: #b8b8b8; }
html[data-theme="Dark"] .size-remove { border: 1px solid #704246; color: #f1b2b4; background: #342124; }
html[data-theme="Dark"] .report-card-icon { border: 1px solid #3b526b; color: #9fc7ff; background: #303b49; }
html[data-theme="Dark"] .report-card-icon.baking { border-color: #365643; color: #79d6a5; background: #263b30; }
html[data-theme="Dark"] .admin-form-panel .btn-outline-secondary,
html[data-theme="Dark"] .table-actions .btn-outline-secondary { border-color: #555; color: #dedede; }
html[data-theme="Dark"] .status-inactive { border: 1px solid #5c4b2e; color: #f0c36d; background: #403522; }
html[data-theme="Dark"] .status-active { border: 1px solid #365643; color: #79d6a5; background: #263b30; }
@media print {
  html[data-theme="Dark"], html[data-theme="Dark"] body { color: #202a35 !important; background: white !important; }
}

/* ---- Acceso con Google, Mi usuario y proveedores ---- */
.login-divider { display: flex; align-items: center; gap: 12px; margin: 16px 0 12px; color: var(--muted); font-size: 11px; font-weight: 650; letter-spacing: .08em; text-transform: uppercase; }
.login-divider::before, .login-divider::after { content: ""; flex: 1; height: 1px; background: var(--line); }
.google-login-button, .google-link-button { display: inline-flex; align-items: center; justify-content: center; gap: 10px; width: 100%; padding: 10px 14px; border: 1px solid var(--line); border-radius: 9px; background: var(--surface); color: var(--ink); font-size: 13px; font-weight: 650; }
.google-login-button:hover, .google-link-button:hover { border-color: var(--blue); background: var(--surface); color: var(--ink); }
.google-login-button svg, .google-link-button svg { width: 18px; height: 18px; flex: 0 0 auto; }
.user-avatar-link { color: inherit; text-decoration: none; }
.user-avatar-link:hover { color: inherit; }
.profile-page { width: min(100%, 900px); margin-inline: auto; }
.profile-grid { display: grid; gap: 16px; }
.profile-card-heading { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.profile-card-heading h2 { margin: 0; color: var(--ink); font-size: 16px; }
.profile-card-heading p { margin: 2px 0 0; font-size: 12px; }
.profile-provider-icon { display: grid; width: 40px; height: 40px; flex: 0 0 auto; place-items: center; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }
.profile-provider-icon svg { width: 20px; height: 20px; }
.profile-link-details { display: grid; gap: 10px; margin: 0 0 16px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 10px; background: var(--page); }
.profile-link-details dt { color: var(--muted); font-size: 10px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.profile-link-details dd { margin: 2px 0 0; color: var(--ink); font-size: 13px; word-break: break-all; }
.profile-link-hint { margin: 0 0 14px; color: var(--muted); font-size: 12px; line-height: 1.5; }
.provider-config-form { max-width: 560px; }
.provider-redirect-note { margin: 14px 0; }

/* ── Pantalla Mi usuario ──────────────────────────────────────────── */
.profile-identity { display: flex; gap: 18px; align-items: flex-start; }
.identity-avatar { display: grid; width: 72px; height: 72px; flex: 0 0 auto; place-items: center; border-radius: 50%; background: var(--blue-dark, #202a35); color: #fff; font-size: 24px; font-weight: 750; letter-spacing: .02em; }
.identity-body { min-width: 0; flex: 1; }
.identity-body h2 { margin: 0 0 7px; color: var(--ink); font-size: 19px; font-weight: 750; letter-spacing: -.02em; }
.identity-pills { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 13px; }
.status-pill.role-pill { color: #28589b; background: #eff5ff; border: 1px solid #dbe7fc; }
.identity-meta { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 10px 16px; margin: 0; }
.identity-meta dt { color: var(--muted); font-size: 10px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.identity-meta dd { margin: 2px 0 0; color: var(--ink); font-size: 13px; font-weight: 650; word-break: break-word; }
.identity-modified { font-size: 12px; }
.readonly-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 12px; padding: 12px 14px; border: 1px dashed var(--line); border-radius: 10px; background: var(--page); }
.readonly-grid .field label { display: block; margin-bottom: 5px; color: var(--muted); font-size: 10px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.readonly-grid input { color: var(--muted); background: var(--page); border-color: var(--line); cursor: not-allowed; opacity: 1; }
.profile-theme-row { display: flex; flex-wrap: wrap; gap: 8px; }
.profile-theme-row .btn { min-width: 110px; }
.profile-preference-label { margin: 20px 0 8px; color: var(--ink); font-size: 13px; font-weight: 700; }
.profile-preference-description { margin: 0 0 10px; color: var(--muted); font-size: 12px; }
.profile-grid form .btn { justify-self: start; }
@media (max-width: 640px) {
  .profile-identity { flex-direction: column; align-items: center; text-align: center; }
  .identity-pills { justify-content: center; }
  .identity-meta { text-align: left; }
}
html[data-theme="Dark"] .status-pill.role-pill { border: 1px solid #2d4a6b; color: #8fc0f5; background: #1e2c3d; }

.reference-ticket {
  box-sizing: border-box;
  width: 100%;
  max-width: 114.3mm;
  margin: 0 auto;
  color: #111;
  background: #fff;
  font-family: Arial, sans-serif;
  font-size: 5pt;
  line-height: 1.2;
}
.reference-ticket * { font-size: inherit; }
.reference-ticket-copy-label {
  margin-bottom: 1.5mm;
  padding: .8mm 1mm;
  border: .075mm dotted #555;
  color: #111;
  font-size: 6pt;
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
  text-transform: uppercase;
}
.reference-ticket-copies { display: block; }
.reference-ticket-copy { break-after: page; page-break-after: always; }
.reference-ticket-copy:last-child { break-after: auto; page-break-after: auto; }
.reference-ticket-header {
  display: grid;
  grid-template-columns: 15mm 32mm minmax(0, 1fr);
  align-items: center;
  gap: 3mm;
  margin-bottom: 3mm;
  padding-bottom: 2mm;
  border-bottom: 1px dotted #555;
  text-align: center;
}
.reference-ticket-logos { display: flex; align-items: center; gap: 2mm; }
.reference-ticket-logos img:first-child { width: 15mm; height: 15mm; object-fit: contain; }
.reference-ticket-logos img:last-child { width: 32mm; height: 9.5mm; object-fit: cover; object-position: center 48%; }
.reference-ticket-seasonal { display: grid; gap: 1mm; }
.reference-ticket-seasonal strong { color: #111; line-height: 1; }
.reference-ticket-seasonal span { color: #222; }
.reference-ticket-table {
  width: 100%;
  margin: 0;
  border-collapse: collapse;
  color: #111;
  font-family: Arial, sans-serif;
}
.reference-ticket-table th,
.reference-ticket-table td {
  padding: 1.5mm 2mm;
  border: .075mm dotted #555;
  text-align: center;
  vertical-align: middle;
  overflow-wrap: anywhere;
}
.reference-ticket-table th { font-weight: 700; }
.reference-ticket-identification th:first-child { width: 20%; }
.reference-ticket-identification td:nth-child(2) { width: 34%; }
.reference-ticket-identification th:nth-child(3) { width: 14%; }
.reference-ticket-identification td:nth-child(4) { width: 32%; }
.reference-ticket-identification tr:first-child th:nth-child(3),
.reference-ticket-identification tr:first-child td:nth-child(4) {
  color: #b54646;
  text-align: right;
}
.reference-ticket-identification tr th:first-child,
.reference-ticket-delivery th,
.reference-ticket-totals th { text-align: left; }
.reference-ticket-identification tr:first-child td:nth-child(2),
.reference-ticket-identification tr:last-child th,
.reference-ticket-identification tr:last-child td { text-align: left; }
.reference-ticket-identification tr:nth-child(2) td:first-of-type { text-align: left; }
.reference-ticket-identification .reference-ticket-group {
  border-top: .4mm solid #555;
  background: #eee;
  text-align: left;
  letter-spacing: .04em;
}
.reference-ticket-identification .reference-ticket-folios th { width: 30%; text-align: left; }
.reference-ticket-identification .reference-ticket-folios td { width: 20%; }
.reference-ticket-type { text-align: center !important; font-weight: 700; }
.reference-ticket-table small { color: #666; font-weight: 400; }
.reference-ticket-delivery { margin-top: 2.5mm; }
.reference-ticket-section-title {
  margin: 4mm 0 1.5mm;
  color: #111;
  font-family: Arial, sans-serif;
  font-weight: 700;
  text-align: center;
}
.reference-ticket-items { table-layout: fixed; }
.reference-ticket-items th,
.reference-ticket-items td { padding: .3mm .2mm; line-height: 1; }
.reference-ticket-items th,
.reference-ticket-items td { text-align: center; }
.reference-ticket-items .reference-ticket-unit-hint { color: #777; font-weight: 400; white-space: nowrap; }
.reference-ticket-items th:nth-child(n+2),
.reference-ticket-items td:nth-child(n+2) { white-space: nowrap; }
.reference-ticket-items tbody td:nth-child(2),
.reference-ticket-items.reference-ticket-baking-items tbody td:first-child {
  white-space: normal;
  overflow-wrap: anywhere;
  line-height: 1.2;
}
.reference-ticket-items tbody tr { break-inside: avoid; }
.reference-ticket-items:not(.reference-ticket-baking-items) th:nth-child(1) { width: 19%; }
.reference-ticket-items:not(.reference-ticket-baking-items) th:nth-child(2) { width: 26%; }
.reference-ticket-items:not(.reference-ticket-baking-items) th:nth-child(3) { width: 12%; }
.reference-ticket-items:not(.reference-ticket-baking-items) th:nth-child(4) { width: 21.5%; }
.reference-ticket-items:not(.reference-ticket-baking-items) th:nth-child(5) { width: 21.5%; }
.reference-ticket-baking-items th:nth-child(1) { width: 31%; }
.reference-ticket-baking-items th:nth-child(2) { width: 23%; }
.reference-ticket-baking-items th:nth-child(3) { width: 17%; }
.reference-ticket-baking-items th:nth-child(4) { width: 29%; }
.reference-ticket-totals { width: 58%; margin: 3mm 0 0 auto; }
.reference-ticket-totals th { width: 60%; }
.reference-ticket-totals td { text-align: center; white-space: nowrap; }
.reference-ticket-observations { margin-top: 3mm; }
.reference-ticket-observations th { text-align: center; }
.reference-ticket-observations td { min-height: 10mm; text-align: left; vertical-align: top; }
.reference-ticket-footer { margin-top: 3mm; }
.reference-ticket-footer th,
.reference-ticket-footer td { width: 50%; text-align: center; }
.thermal-ticket.reference-ticket { width: 76mm; max-width: none; padding: 3mm; font-size: 8pt; line-height: 1.3; }
.thermal-ticket.reference-ticket .reference-ticket-header {
  grid-template-columns: minmax(0, 1fr);
  justify-items: center;
  gap: 2mm;
  margin-bottom: 3mm;
}
.thermal-ticket.reference-ticket .reference-ticket-logos img:first-child { width: 13mm; height: 13mm; }
.thermal-ticket.reference-ticket .reference-ticket-logos img:last-child { width: 29mm; height: 8.5mm; }
.thermal-ticket.reference-ticket .reference-ticket-copy-label { font-size: 8pt; }
.thermal-ticket.reference-ticket .reference-ticket-table th,
.thermal-ticket.reference-ticket .reference-ticket-table td { padding: 1mm; }
.thermal-ticket.reference-ticket .reference-ticket-section-title { margin: 3mm 0 1.5mm; font-size: 9pt; }
.thermal-ticket.reference-ticket .reference-ticket-totals { width: 100%; margin-top: 2mm; }
.thermal-ticket.reference-ticket .reference-ticket-observations,
.thermal-ticket.reference-ticket .reference-ticket-footer { margin-top: 2mm; }
.reference-ticket-identification tr.reference-ticket-folio th,
.reference-ticket-identification tr.reference-ticket-folio td,
.reference-ticket-identification tr.reference-ticket-email td { text-align: center; }
.thermal-ticket.thermal-58.reference-ticket {
  width: 54mm;
  padding: 0;
}
.thermal-ticket.thermal-58.reference-ticket .reference-ticket-scaled-content {
  box-sizing: border-box;
  width: 76mm;
  padding: 3mm;
  transform: scale(.71);
  transform-origin: top left;
}
@media print {
  .thermal-ticket.thermal-58.reference-ticket {
    width: 54mm !important;
    padding: 0 !important;
  }
  .thermal-ticket.thermal-58.reference-ticket .reference-ticket-scaled-content {
    padding: 2mm !important;
  }
  .reference-ticket { max-width: none; margin: 0; }
  .reference-ticket-copy { break-inside: avoid; }
  .reference-ticket-header,
  .reference-ticket-table,
  .reference-ticket-section-title { break-inside: avoid; }
}

html[data-navigation="Side"] .main-content {
  width: calc(100% - 252px);
  margin-left: 252px;
  transition: width .2s ease, margin-left .2s ease;
}
html[data-navigation="Side"] .primary-nav {
  position: fixed;
  z-index: 60;
  top: 16px;
  bottom: 16px;
  left: 14px;
  display: flex;
  width: 240px;
  max-height: none;
  flex: none;
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-start;
  overflow-y: auto;
  gap: 2px;
  padding: 10px;
  border: 1px solid rgba(225, 230, 236, .72);
  border-radius: 16px;
  background: rgba(255, 255, 255, .86);
  box-shadow: 0 12px 34px rgba(26, 35, 48, .12);
  backdrop-filter: blur(14px) saturate(145%);
  -webkit-backdrop-filter: blur(14px) saturate(145%);
  transform: none;
}
html[data-navigation="Side"] .nav-direct,
html[data-navigation="Side"] .nav-menu-trigger {
  width: 100%;
  min-height: 34px;
  justify-content: space-between;
  padding: 0 11px;
  border: 0;
  border-radius: 8px;
  text-align: left;
}
html[data-navigation="Side"] .nav-logout-form { margin-top: auto; }
html[data-navigation="Side"] .nav-section-icon {
  display: block;
  width: 16px;
  height: 16px;
  flex: 0 0 auto;
  color: #788493;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}
html[data-navigation="Side"] .nav-chevron {
  width: 14px;
  height: 14px;
  flex: 0 0 auto;
  color: #9299a3;
  transition: transform .18s;
}
html[data-navigation="Side"] .nav-menu.is-open .nav-chevron {
  transform: rotate(180deg);
}
html[data-navigation="Side"] .nav-menu-trigger {
  gap: 9px;
}
html[data-navigation="Side"] .nav-menu-trigger span,
html[data-navigation="Side"] .nav-direct span {
  flex: 1;
  text-align: left;
}
html[data-navigation="Side"] .side-nav-collapse {
  display: flex;
  min-height: 32px;
  align-items: center;
  gap: 9px;
  margin-bottom: 5px;
  padding: 0 10px;
  border: 0;
  border-radius: 8px;
  color: #748092;
  background: transparent;
  font: inherit;
  font-size: 10px;
  font-weight: 600;
  text-align: left;
  cursor: pointer;
}
.side-nav-collapse,
.nav-section-icon { display: none; }
html[data-navigation="Side"] .side-nav-collapse:hover {
  color: #202a35;
  background: rgba(32, 42, 53, .06);
}
html[data-navigation="Side"] .side-nav-collapse svg {
  width: 16px;
  height: 16px;
  flex: 0 0 auto;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform .2s ease;
}
html[data-navigation="Side"] .nav-menu.is-open .nav-menu-trigger {
  color: #20242a;
}
html[data-navigation="Side"] .nav-direct.active,
html[data-navigation="Side"] .nav-menu.has-active .nav-menu-trigger {
  color: #20242a;
  background: #edf2f7;
}
html[data-navigation="Side"] .nav-menu {
  display: block;
}
html[data-navigation="Side"] .mega-menu {
  position: static;
  width: 100%;
  grid-template-columns: minmax(0, 1fr);
  gap: 4px;
  padding: 6px 3px 7px;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  transform: none;
}
html[data-navigation="Side"] .mega-menu[hidden] { display: none; }
html[data-navigation="Side"] .mega-menu-column > p {
  margin: 2px 0 3px 8px;
  font-size: 8px;
}
html[data-navigation="Side"] .mega-menu-link {
  min-height: 29px;
  gap: 7px;
  margin: 0;
  padding: 2px 6px;
}
html[data-navigation="Side"] .mega-menu-icon {
  width: 24px;
  height: 24px;
}
html[data-navigation="Side"] .mega-menu-icon svg { width: 15px; height: 15px; }
html[data-navigation="Side"] .mega-menu-link strong { font-size: 10px; }
html[data-navigation="Side"] .mega-menu-link small { display: none; }
html[data-navigation="Side"] .topbar {
  justify-content: space-between;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
html[data-theme="Dark"][data-navigation="Side"] .primary-nav {
  border-color: #484848;
  background: rgba(43, 43, 43, .94);
  box-shadow: 0 12px 34px rgba(0, 0, 0, .34);
}
html[data-theme="Dark"][data-navigation="Side"] .nav-direct.active,
html[data-theme="Dark"][data-navigation="Side"] .nav-menu.has-active .nav-menu-trigger {
  color: #e3eaf2;
  background: rgba(255, 255, 255, .09);
}
html[data-theme="Dark"][data-navigation="Side"] .mega-menu {
  background: transparent;
}
html[data-theme="Dark"][data-navigation="Side"] .nav-section-icon,
html[data-theme="Dark"][data-navigation="Side"] .side-nav-collapse {
  color: #aeb8c4;
}
html[data-theme="Dark"][data-navigation="Side"] .side-nav-collapse:hover {
  color: #f0f3f6;
  background: rgba(255, 255, 255, .08);
}
html[data-theme="Dark"][data-navigation="Side"] .nav-menu.is-open .nav-menu-trigger {
  color: #e3eaf2;
}

@media (min-width: 901px) {
  html[data-navigation="Side"] .side-nav-collapse { display: flex; }
  html[data-navigation="Side"].nav-collapsed .main-content {
    width: calc(100% - 86px);
    margin-left: 86px;
  }
  html[data-navigation="Side"].nav-collapsed .primary-nav {
    width: 60px;
    align-items: center;
    overflow: visible;
    padding: 10px 7px;
  }
  html[data-navigation="Side"].nav-collapsed .side-nav-collapse {
    width: 42px;
    justify-content: center;
    margin-bottom: 3px;
    padding: 0;
  }
  html[data-navigation="Side"].nav-collapsed .side-nav-collapse svg {
    transform: rotate(180deg);
  }
  html[data-navigation="Side"].nav-collapsed .side-nav-collapse span,
  html[data-navigation="Side"].nav-collapsed .nav-direct span,
  html[data-navigation="Side"].nav-collapsed .nav-menu-trigger span,
  html[data-navigation="Side"].nav-collapsed .nav-chevron {
    display: none;
  }
  html[data-navigation="Side"].nav-collapsed .nav-direct,
  html[data-navigation="Side"].nav-collapsed .nav-menu-trigger {
    width: 42px;
    min-height: 40px;
    justify-content: center;
    padding: 0;
  }
  html[data-navigation="Side"].nav-collapsed .nav-logout-form { width: 42px; }
  html[data-navigation="Side"].nav-collapsed .nav-menu-trigger {
    gap: 0;
  }
  html[data-navigation="Side"].nav-collapsed .nav-section-icon {
    width: 18px;
    height: 18px;
  }
  html[data-navigation="Side"].nav-collapsed .mega-menu {
    position: absolute;
    z-index: 62;
    top: -4px;
    left: calc(100% + 12px);
    width: 248px;
    gap: 12px;
    padding: 14px;
    border: 1px solid rgba(226, 231, 237, .96);
    border-radius: 12px;
    background: rgba(255, 255, 255, .98);
    box-shadow: 0 14px 34px rgba(20, 28, 40, .18);
  }
  html[data-navigation="Side"].nav-collapsed .nav-menu::after {
    position: absolute;
    top: -8px;
    right: -14px;
    bottom: -8px;
    width: 14px;
    content: "";
  }
  html[data-navigation="Side"].nav-collapsed .mega-menu-link {
    min-height: 36px;
    gap: 9px;
    padding: 4px 6px;
  }
  html[data-navigation="Side"].nav-collapsed .mega-menu-icon {
    width: 28px;
    height: 28px;
  }
  html[data-navigation="Side"].nav-collapsed .mega-menu-link small {
    display: block;
  }
  html[data-theme="Dark"][data-navigation="Side"].nav-collapsed .mega-menu {
    border-color: #484848;
    background: rgba(43, 43, 43, .98);
    box-shadow: 0 14px 34px rgba(0, 0, 0, .38);
  }
}
@media (max-width: 900px) {
  html[data-navigation="Side"] .side-nav-collapse {
    display: none;
  }
  html[data-navigation="Side"] .main-content {
    width: 100%;
    margin-left: 0;
  }
  html[data-navigation="Side"] .primary-nav {
    position: absolute;
    z-index: 51;
    top: calc(100% + 1px);
    bottom: auto;
    right: 12px;
    left: 12px;
    display: none;
    width: auto;
    max-height: calc(100vh - 82px);
    flex: initial;
    flex-direction: column;
    align-items: stretch;
    overflow-y: auto;
    padding: 9px;
    border: 1px solid #e8ebef;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 18px 40px rgba(20, 28, 40, .16);
    transform: none;
  }
  html[data-navigation="Side"] body.nav-open .primary-nav {
    display: flex;
  }
  html[data-navigation="Side"] .nav-direct,
  html[data-navigation="Side"] .nav-menu-trigger {
    min-height: 43px;
    padding: 0 12px;
  }
  html[data-navigation="Side"] .mega-menu {
    padding: 12px 8px 15px;
  }
  html[data-theme="Dark"][data-navigation="Side"] .primary-nav {
    border-color: #484848;
    background: #2b2b2b;
  }
}
