:root[data-theme=light] {
    --primary: #d85e2b;
    --primary-light: #e97842;
    --primary-dark: #b94a1f;
    --primary-soft: #fff1e9;
    --primary-ring: rgba(216, 94, 43, .18);
}

body { margin: 0; }
.shell { grid-template-columns: 248px minmax(0, 1fr); }
.admin-brand { text-decoration: none; }
.admin-brand .brand-text { display: block; }
.admin-nav .nav-link > span:not(.nav-badge) { display: block; }
.admin-brand .brand-logo { background: var(--primary); }
.admin-shell { transition: grid-template-columns .22s ease; }
.admin-shell > .d-sidebar { min-width: 0; transition: opacity .18s ease, padding .22s ease, width .22s ease; }
.admin-shell .hamburger { display: inline-flex; flex: 0 0 36px; }
.admin-brand { align-items: flex-start; flex-direction: column; gap: 9px; padding: 4px 8px 18px; }
.admin-brand-logo { align-items: center; background: #fff; border: 1px solid var(--border-soft); border-radius: 9px; display: flex; height: 64px; justify-content: center; padding: 7px 10px; width: 100%; }
.admin-brand-logo img { max-height: 48px; max-width: 100%; object-fit: contain; width: auto; }
.admin-brand .brand-role { color: var(--t-muted); font-size: 9px; margin: 0; }
.has-admin-sidebar-collapsed .admin-shell { grid-template-columns: 0 minmax(0, 1fr); }
.has-admin-sidebar-collapsed .admin-shell > .d-sidebar { border-right: 0; opacity: 0; overflow: hidden; padding-left: 0; padding-right: 0; visibility: hidden; }
.account-brand-logo { background: #fff; border-radius: 6px; display: block; height: auto; margin-bottom: 10px; max-width: 190px; object-fit: contain; padding: 4px; width: 100%; }
.customer-shell { grid-template-columns: 248px minmax(0, 1fr); }
.customer-sidebar { box-sizing: border-box; gap: 18px; min-width: 0; width: 248px; }
.customer-brand { align-items: flex-start; flex-direction: column; gap: 9px; min-width: 0; padding: 4px 8px 18px; width: 100%; }
.customer-brand-logo { align-items: center; background: #fff; border: 1px solid var(--border-soft); border-radius: 9px; display: flex; height: 64px; justify-content: center; padding: 7px 10px; width: 100%; }
.customer-brand-logo img { max-height: 48px; max-width: 100%; object-fit: contain; width: auto; }
.customer-brand .brand-role { color: var(--t-muted); font-size: 9px; margin: 0; }
.customer-workspace { min-width: 0; }
.customer-workspace .workspace-mark { flex: 0 0 34px; height: 34px; overflow: hidden; width: 34px; }
.customer-workspace .workspace-mark img { height: 100%; object-fit: cover; width: 100%; }
.customer-workspace-copy { min-width: 0; }
.customer-workspace-copy strong { overflow-wrap: anywhere; }
.customer-sidebar .admin-nav { min-width: 0; }
.customer-sidebar .nav-link { min-width: 0; }
.customer-sidebar .nav-link > span:not(.nav-badge) { overflow-wrap: anywhere; }
.brand-role { color: var(--t-light); display: block; font-family: JetBrains Mono, monospace; font-size: 9px; letter-spacing: .12em; margin-top: 5px; }
.admin-workspace { align-items: center; background: var(--bg-hover); border: 1px solid var(--border-soft); border-radius: 10px; display: flex; gap: 10px; padding: 10px; }
.workspace-mark { align-items: center; background: var(--bg-card); border: 1px solid var(--border); border-radius: 7px; color: var(--primary); display: flex; font-size: 12px; font-weight: 700; height: 30px; justify-content: center; width: 30px; }
.admin-workspace strong, .admin-workspace small { display: block; }
.admin-workspace strong { color: var(--t-base); font-size: 12px; }
.admin-workspace small { color: var(--t-light); font-size: 10px; margin-top: 2px; }
.workspace-chevron { color: var(--t-light); margin-left: auto; }
.admin-nav { display: grid; gap: 4px; }
.admin-nav-label { color: var(--t-light); font-family: JetBrains Mono, monospace; font-size: 9px; letter-spacing: .15em; margin: 12px 10px 4px; text-transform: uppercase; }
.admin-sidebar-foot { align-items: center; border-top: 1px solid var(--border-soft); color: var(--t-muted); display: flex; font-size: 10px; gap: 8px; margin-top: auto; padding: 16px 8px 0; }
.admin-status-dot { background: var(--success); border-radius: 50%; height: 7px; width: 7px; }
.admin-version { color: var(--t-light); font-family: JetBrains Mono, monospace; margin-left: auto; }
.admin-topbar-start, .admin-topbar-end, .admin-breadcrumb { align-items: center; display: flex; }
.admin-topbar-start { gap: 12px; }
.admin-topbar-end { gap: 14px; }
.admin-breadcrumb { color: var(--t-light); font-size: 12px; gap: 10px; }
.admin-breadcrumb strong { color: var(--t-base); font-weight: 600; }
.breadcrumb-divider { color: var(--border); }
.admin-topbar-label { color: var(--t-muted); font-size: 11px; }
.admin-avatar { align-items: center; background: var(--primary-soft); border: 1px solid color-mix(in srgb, var(--primary) 20%, white); border-radius: 50%; color: var(--primary-dark); display: flex; font-size: 10px; font-weight: 700; height: 32px; justify-content: center; width: 32px; }
.admin-logout { background: transparent; border: 0; color: var(--t-muted); cursor: pointer; font: inherit; font-size: 11px; font-weight: 600; padding: 8px 0; }
.admin-logout:hover { color: var(--primary-dark); }
.admin-content { max-width: 1600px; margin: 0 auto; }
.admin-hero { align-items: center; }
.admin-hero .hero-sub { margin: 0; }
.admin-kpi-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.admin-kpi-grid .kpi-compare { min-height: 30px; }
.admin-table-card { margin-top: 20px; }
.admin-table-wrap { overflow-x: auto; width: 100%; }
.admin-table { min-width: 700px; }
.admin-product-cell { align-items: center; display: flex; gap: 10px; min-width: 230px; }
.admin-product-cell > span:last-child { min-width: 0; }
.admin-product-cell strong, .admin-product-cell small { display: block; }
.admin-product-cell strong { color: var(--t-base); font-size: 12px; font-weight: 600; }
.admin-product-cell small { color: var(--t-muted); font-size: 10px; margin-top: 4px; }
.admin-product-thumb { align-items: center; background: var(--primary-soft); border-radius: 8px; color: var(--primary); display: flex; flex: 0 0 34px; font-size: 12px; font-weight: 700; height: 34px; justify-content: center; }
.admin-pill { border-radius: 999px; display: inline-flex; font-size: 10px; font-weight: 600; padding: 4px 8px; }
.admin-pill.is-live { background: var(--success-soft); color: #087f5b; }
.admin-pill.is-hidden { background: var(--bg-muted); color: var(--t-muted); }
.admin-row-link, .admin-text-link { color: var(--primary); font-size: 11px; font-weight: 600; text-decoration: none; }
.admin-row-link:hover, .admin-text-link:hover { color: var(--primary-dark); }
.admin-empty { color: var(--t-muted) !important; padding: 30px 14px !important; text-align: center; }
.admin-footer { color: var(--t-light); font-size: 10px; padding: 24px 2px 0; }
.admin-footer span { padding: 0 4px; }
.admin-flash { border: 1px solid transparent; border-radius: 9px; font-size: 12px; margin: 16px 32px 0; padding: 12px 16px; }
.admin-flash.is-success { background: var(--success-soft); border-color: #b7ead9; color: #087f5b; }
.admin-flash.is-info { background: #eff6ff; border-color: #bfdbfe; color: #1e40af; }
.admin-flash.is-error { background: var(--danger-soft); border-color: #fecaca; color: #b42318; }
.admin-flash ul { margin: 6px 0 0; padding-left: 18px; }
.admin-form-card { margin-top: 12px; }
.admin-form-grid { display: grid; gap: 18px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.admin-field { display: grid; gap: 7px; min-width: 0; }
.admin-field.is-wide { grid-column: 1 / -1; }
.admin-field label { color: var(--t-muted); font-size: 11px; font-weight: 600; }
.admin-field input, .admin-field textarea, .admin-field select { background: var(--bg-card); border: 1px solid var(--border); border-radius: 7px; color: var(--t-base); font: inherit; font-size: 12px; min-height: 40px; padding: 9px 11px; width: 100%; }
.admin-field textarea { min-height: 110px; resize: vertical; }
.admin-field-help { color: var(--t-light); font-size: 10px; }
.admin-rich-text { background: var(--bg-card); border: 1px solid var(--border); border-radius: 7px; color: var(--t-base); font-size: 12px; min-height: 220px; padding: 12px; }
.admin-rich-text:focus { border-color: var(--primary-light); box-shadow: 0 0 0 3px var(--primary-ring); outline: 0; }
.admin-form-card .trix-toolbar .trix-button-group { border-color: var(--border); }
.admin-form-card .trix-toolbar .trix-button { color: var(--t-muted); }
.admin-form-card .trix-toolbar .trix-button:not(:disabled):hover { background: var(--bg-hover); }
.admin-form-card .trix-toolbar .trix-button.trix-active { background: var(--primary-soft); color: var(--primary-dark); }
.admin-form-card .trix-toolbar .trix-button-group--file-tools { display: none; }
.admin-rich-text h1 { font-family: Inter Tight, Inter, sans-serif; font-size: 1.5em; font-weight: 700; }
.admin-rich-text blockquote { border-left: 3px solid var(--border); color: var(--t-muted); margin-left: 0; padding-left: 12px; }
.admin-rich-text pre { background: var(--bg-muted); border-radius: 5px; padding: 10px; }
.admin-rich-text ul { list-style: disc; padding-left: 22px; }
.admin-rich-text ol { list-style: decimal; padding-left: 22px; }
.admin-rich-text a, .product-rich-text a { color: var(--primary-dark); text-decoration: underline; }
.product-rich-text h1 { font-size: 1.5em; font-weight: 700; margin: 1em 0 .5em; }
.product-rich-text blockquote { border-left: 3px solid var(--border); color: var(--t-muted); margin: 1em 0; padding-left: 12px; }
.product-rich-text ul { list-style: disc; padding-left: 22px; }
.product-rich-text ol { list-style: decimal; padding-left: 22px; }
.product-rich-text pre { background: var(--bg-muted); border-radius: 5px; overflow-x: auto; padding: 12px; }
.admin-field input:focus, .admin-field textarea:focus, .admin-field select:focus { border-color: var(--primary-light); box-shadow: 0 0 0 3px var(--primary-ring); outline: 0; }
.admin-checkboxes { display: flex; flex-wrap: wrap; gap: 12px 22px; }
.admin-checkbox { align-items: center; color: var(--t-muted); display: inline-flex; font-size: 11px; gap: 8px; }
.admin-checkbox input { accent-color: var(--primary); height: 15px; width: 15px; }
.admin-form-actions { border-top: 1px solid var(--border-soft); display: flex; gap: 10px; justify-content: flex-end; margin-top: 22px; padding-top: 18px; }
.admin-cancel { align-items: center; border: 1px solid var(--border); border-radius: 8px; color: var(--t-muted); display: inline-flex; font-size: 11px; font-weight: 600; padding: 0 15px; text-decoration: none; }
.admin-image-preview { border: 1px solid var(--border); border-radius: 8px; display: block; height: 90px; margin-top: 8px; object-fit: cover; width: 120px; }
.store-cart-link { align-items: center; color: #334155; display: inline-flex; font-size: 12px; font-weight: 600; gap: 6px; text-decoration: none; }
.store-cart-link svg { fill: none; height: 18px; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.7; width: 18px; }
.store-cart-link b { align-items: center; background: #d85e2b; border-radius: 999px; color: white; display: inline-flex; font-size: 9px; height: 18px; justify-content: center; min-width: 18px; padding: 0 4px; }
.store-quantity { display: grid; gap: 4px; }
.store-quantity label { color: #64748b; font-size: 10px; font-weight: 600; }
.store-quantity input { border: 1px solid #cbd5e1; border-radius: 6px; min-height: 42px; padding: 0 8px; width: 70px; }
.catalogue-card-actions { align-items: center; border-top: 1px solid #e2e8f0; display: flex; justify-content: space-between; min-height: 58px; padding: 12px 20px; }
.catalogue-card-actions input { border: 1px solid #cbd5e1; border-radius: 6px; font-size: 12px; min-height: 34px; padding: 0 7px; width: 58px; }
.quote-dialog { border: 1px solid var(--border); border-radius: 14px; box-shadow: var(--shadow-lg); color: var(--t-base); max-height: min(90dvh, 800px); max-width: min(680px, calc(100vw - 28px)); padding: 0; width: 100%; }
.quote-dialog::backdrop { background: rgba(15, 23, 42, .58); backdrop-filter: blur(3px); }
.quote-dialog-form { max-height: min(90dvh, 800px); overflow-y: auto; padding: 24px; }
.quote-dialog-head { align-items: flex-start; border-bottom: 1px solid var(--border-soft); display: flex; justify-content: space-between; margin-bottom: 20px; padding-bottom: 16px; }
.quote-dialog-eyebrow { color: var(--primary); font-family: JetBrains Mono, monospace; font-size: 9px; letter-spacing: .12em; }
.quote-dialog-head h2 { font-family: Inter Tight, Inter, sans-serif; font-size: 24px; font-weight: 700; margin: 6px 0 0; }
.quote-dialog-head p { color: var(--t-muted); font-size: 11px; margin: 4px 0 0; }
.quote-dialog-close { align-items: center; background: var(--bg-muted); border: 0; border-radius: 50%; color: var(--t-muted); cursor: pointer; display: inline-flex; font-size: 20px; height: 32px; justify-content: center; line-height: 1; width: 32px; }
.quote-dialog-grid { display: grid; gap: 15px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.quote-field { display: grid; gap: 7px; min-width: 0; }
.quote-field.is-wide { grid-column: 1 / -1; }
.quote-field label { color: var(--t-muted); font-size: 11px; font-weight: 600; }
.quote-field input, .quote-field textarea { background: white; border: 1px solid var(--border); border-radius: 7px; color: var(--t-base); font: inherit; font-size: 12px; min-height: 40px; padding: 9px 11px; width: 100%; }
.quote-field textarea { min-height: 96px; resize: vertical; }
.quote-field input:focus, .quote-field textarea:focus { border-color: var(--primary-light); box-shadow: 0 0 0 3px var(--primary-ring); outline: 0; }
.quote-field small { color: var(--t-light); font-size: 10px; }
.quote-dialog-actions { border-top: 1px solid var(--border-soft); display: flex; gap: 10px; justify-content: flex-end; margin-top: 20px; padding-top: 16px; }
.commerce-card { margin-top: 20px; }
.commerce-summary { background: var(--bg-hover); border-radius: 9px; display: grid; gap: 10px; padding: 16px; }
.commerce-summary-row { color: var(--t-muted); display: flex; font-size: 12px; justify-content: space-between; }
.commerce-summary-row.is-total { border-top: 1px solid var(--border); color: var(--t-base); font-size: 15px; font-weight: 700; margin-top: 4px; padding-top: 12px; }
.commerce-line-item { align-items: center; display: flex; gap: 12px; min-width: 0; }
.commerce-line-item img { aspect-ratio: 1; border-radius: 7px; object-fit: cover; width: 58px; }
.commerce-line-item strong, .commerce-line-item small { display: block; }
.commerce-line-item strong { font-size: 12px; }
.commerce-line-item small { color: var(--t-muted); font-size: 10px; margin-top: 4px; }
.commerce-status { background: var(--warning-soft); border-radius: 999px; color: #9a5b00; display: inline-flex; font-size: 10px; font-weight: 600; padding: 4px 8px; }
.commerce-status.is-complete { background: var(--success-soft); color: #087f5b; }
.commerce-detail-grid { display: grid; gap: 18px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.commerce-detail-block { min-width: 0; }
.commerce-detail-block h3 { color: var(--t-light); font-family: JetBrains Mono, monospace; font-size: 9px; letter-spacing: .12em; margin: 0 0 8px; text-transform: uppercase; }
.commerce-detail-block p { color: var(--t-base); font-size: 12px; line-height: 1.6; margin: 0; overflow-wrap: anywhere; white-space: pre-line; }
.admin-count { background: var(--bg-muted); border-radius: 999px; color: var(--t-muted); font-family: JetBrains Mono, monospace; font-size: 10px; margin-left: 5px; padding: 3px 7px; vertical-align: 2px; }
.admin-subcategory-name { color: var(--t-light); display: block; font-size: 10px; margin-top: 4px; }
.admin-category-create { margin-bottom: 20px; }
.admin-category-create-form { align-items: end; display: grid; gap: 14px; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; }
.admin-category-list { gap: 0; }
.admin-category-group + .admin-category-group { border-top: 1px solid var(--border-soft); }
.admin-category-row { align-items: center; display: grid; gap: 12px; grid-template-columns: 28px minmax(120px, 1fr) auto auto; min-height: 58px; }
.admin-category-row.is-child { margin-left: 30px; }
.admin-category-marker { align-items: center; background: var(--primary-soft); border-radius: 7px; color: var(--primary); display: inline-flex; font-size: 10px; font-weight: 700; height: 26px; justify-content: center; width: 26px; }
.admin-child-branch { color: var(--t-light); font-size: 15px; text-align: center; }
.admin-category-edit { align-items: center; display: flex; gap: 12px; min-width: 0; }
.admin-category-edit input { background: transparent; border: 1px solid transparent; border-radius: 5px; color: var(--t-base); font: inherit; font-size: 12px; font-weight: 600; min-width: 0; padding: 6px 7px; width: 100%; }
.admin-category-edit input:focus { border-color: var(--border); outline: 0; }
.admin-category-count { color: var(--t-light); font-size: 10px; white-space: nowrap; }
.admin-actions { align-items: center; display: flex; gap: 12px; }
.admin-actions form { margin: 0; }
.admin-delete { background: transparent; border: 0; color: var(--danger); cursor: pointer; font: inherit; font-size: 11px; font-weight: 600; padding: 0; }
.admin-pagination { padding-top: 16px; }
.admin-pagination nav { display: flex; justify-content: flex-end; }
.admin-pagination nav > div:first-child { display: none; }
.admin-pagination nav > div:last-child > span { display: inline-flex; gap: 4px; }
.admin-pagination a, .admin-pagination span[aria-current] span, .admin-pagination button { align-items: center; border: 1px solid var(--border); border-radius: 6px; color: var(--t-muted); display: inline-flex; font-size: 11px; justify-content: center; min-height: 32px; min-width: 32px; padding: 0 8px; text-decoration: none; }
.admin-pagination span[aria-current] span { background: var(--primary); border-color: var(--primary); color: #fff; }
.admin-pagination button:disabled { opacity: .45; }
.account-kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.account-enquiry-table { min-width: 640px; }
.admin-pill.is-new { background: var(--warning-soft); color: #9a5b00; }

.auth-body { background: var(--bg-body); color: var(--t-base); min-height: 100vh; }
.auth-page { display: grid; gap: 22px; margin: 0 auto; max-width: 460px; min-height: 100vh; padding: 32px 20px; place-content: center; }
.auth-brand { align-items: center; color: var(--t-base); display: flex; gap: 11px; justify-self: center; text-decoration: none; }
.auth-brand-logo { background: #fff; border: 1px solid var(--border-soft); border-radius: 10px; display: block; height: auto; max-height: 88px; max-width: min(280px, 76vw); object-fit: contain; padding: 9px; width: auto; }
.auth-brand-mark { align-items: center; background: var(--primary); border-radius: 9px; box-shadow: 0 4px 10px -2px var(--primary-ring); color: #fff; display: flex; font-family: Inter Tight, sans-serif; font-size: 19px; font-weight: 700; height: 40px; justify-content: center; width: 40px; }
.auth-brand strong, .auth-brand small { display: block; }
.auth-brand strong { font-size: 12px; letter-spacing: .06em; }
.auth-brand small { color: var(--t-light); font-family: JetBrains Mono, monospace; font-size: 9px; letter-spacing: .1em; margin-top: 4px; }
.auth-card { animation: rise-in .45s ease both; background: var(--bg-card); border: 1px solid var(--border); border-radius: 14px; box-shadow: var(--shadow-lg); padding: 32px; }
.auth-eyebrow { color: var(--primary); display: block; font-family: JetBrains Mono, monospace; font-size: 9px; letter-spacing: .15em; }
.auth-card h1 { color: var(--t-base); font-family: Inter Tight, Inter, sans-serif; font-size: 29px; font-weight: 700; margin: 10px 0 0; }
.auth-description { color: var(--t-muted); font-size: 12px; line-height: 1.6; margin: 8px 0 0; }
.auth-form { display: grid; gap: 16px; margin-top: 24px; }
.auth-field { display: grid; gap: 7px; }
.auth-field label { color: var(--t-muted); font-size: 11px; font-weight: 600; }
.auth-field input { background: var(--bg-card); border: 1px solid var(--border); border-radius: 7px; color: var(--t-base); font: inherit; font-size: 12px; height: 42px; padding: 0 12px; width: 100%; }
.auth-field input:focus { border-color: var(--primary-light); box-shadow: 0 0 0 3px var(--primary-ring); outline: 0; }
.auth-remember { align-items: center; color: var(--t-muted); display: inline-flex; font-size: 11px; gap: 8px; }
.auth-remember input { accent-color: var(--primary); height: 15px; width: 15px; }
.auth-submit { justify-content: center; min-height: 42px; width: 100%; }
.auth-submit span { margin-left: 4px; }
.auth-switch { color: var(--t-muted); font-size: 11px; margin: 20px 0 0; text-align: center; }
.auth-switch a, .auth-admin-link { color: var(--primary-dark); font-weight: 600; text-decoration: none; }
.auth-switch a:hover, .auth-admin-link:hover { text-decoration: underline; }
.auth-admin-link { display: block; font-size: 10px; margin: 18px auto 0; text-align: center; }
.auth-home-link { color: var(--t-muted); font-size: 10px; justify-self: center; text-decoration: none; }
.auth-home-link:hover { color: var(--primary-dark); }
.auth-errors { background: var(--danger-soft); border: 1px solid #fecaca; border-radius: 8px; color: #b42318; font-size: 11px; padding: 12px 14px; }
.auth-errors ul { margin: 6px 0 0; padding-left: 18px; }
.account-enquiry-table td { white-space: normal; }
.customer-total { background: var(--primary-soft); border-radius: 999px; color: var(--primary-dark); display: inline-block; font-size: 11px; margin-left: 7px; padding: 3px 8px; vertical-align: 2px; }
.customer-list-table td { vertical-align: middle; }
.customer-list-avatar { align-items: center; background: var(--primary-soft); border: 1px solid var(--border); border-radius: 50%; color: var(--primary-dark); display: flex; flex: 0 0 36px; font-size: 12px; font-weight: 800; height: 36px; justify-content: center; overflow: hidden; width: 36px; }
.customer-list-avatar img { height: 100%; object-fit: cover; width: 100%; }
.customer-directory-count { align-items: center; background: var(--bg-card); border: 1px solid var(--border); border-radius: 12px; display: flex; gap: 11px; padding: 10px 15px; }
.customer-directory-count strong { color: var(--primary-dark); font-size: 23px; }
.customer-directory-count span { color: var(--t-muted); font-size: 11px; }
.customer-directory-head { align-items: center; }
.customer-search-form { align-items: center; display: flex; flex-wrap: wrap; gap: 8px; }
.customer-search-form input { background: var(--bg-body); border: 1px solid var(--border); border-radius: 7px; color: var(--t-base); font: inherit; font-size: 12px; min-height: 38px; min-width: min(250px, 58vw); padding: 8px 11px; }
.customer-search-form input:focus { border-color: var(--primary-light); outline: 2px solid var(--primary-ring); }
.customer-clear-search { color: var(--t-muted); font-size: 11px; font-weight: 600; padding: 8px; }
.customer-profile-hero { background: radial-gradient(circle at 88% 10%, rgba(243,107,33,.19), transparent 30%), linear-gradient(120deg, #182636, #283c50); border-radius: 15px; color: #fff; margin-bottom: 20px; padding: 21px 24px 24px; }
.customer-back-link { color: #d8e2eb; display: inline-block; font-size: 11px; margin-bottom: 20px; text-decoration: none; }
.customer-back-link:hover { color: #fff; }
.customer-profile-heading { align-items: center; display: flex; flex-wrap: wrap; gap: 18px; }
.customer-profile-avatar { align-items: center; background: linear-gradient(145deg, #f28a4b, #d85e2b); border: 3px solid rgba(255,255,255,.78); border-radius: 50%; color: #fff; display: flex; flex: 0 0 78px; font-size: 30px; font-weight: 800; height: 78px; justify-content: center; overflow: hidden; width: 78px; }
.customer-profile-avatar img { height: 100%; object-fit: cover; width: 100%; }
.customer-profile-identity { flex: 1 1 220px; min-width: 0; }
.customer-profile-identity h1 { color: #fff; font-size: clamp(23px, 3vw, 31px); letter-spacing: -.035em; margin: 3px 0; overflow-wrap: anywhere; }
.customer-profile-identity p { color: #e2e8f0; font-size: 13px; margin: 0; overflow-wrap: anywhere; }
.customer-profile-identity small { color: #b9c5d1; display: block; font-size: 10px; margin-top: 5px; }
.customer-profile-stats { display: flex; flex-wrap: wrap; gap: 9px; }
.customer-profile-stats div { background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.13); border-radius: 9px; min-width: 92px; padding: 10px 12px; }
.customer-profile-stats strong, .customer-profile-stats span { display: block; }
.customer-profile-stats strong { color: #fff; font-size: 18px; }
.customer-profile-stats span { color: #c8d2dc; font-size: 9px; margin-top: 2px; }
.customer-profile-grid { display: grid; gap: 18px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.customer-detail-card { min-width: 0; }
.customer-detail-list { display: grid; gap: 0; margin: 0; }
.customer-detail-list div { border-top: 1px solid var(--border-soft); display: grid; gap: 6px; grid-template-columns: 120px minmax(0, 1fr); padding: 12px 0; }
.customer-detail-list dt { color: var(--t-light); font-size: 11px; }
.customer-detail-list dd { color: var(--t-base); font-size: 12px; margin: 0; overflow-wrap: anywhere; }
.customer-detail-list a { color: var(--primary-dark); }
.customer-saved-address { background: var(--bg-hover); border: 1px solid var(--border-soft); border-radius: 9px; color: var(--t-muted); font-size: 11px; padding: 14px; }
.customer-saved-address strong, .customer-saved-address span { color: var(--t-base); display: block; }
.customer-saved-address p { line-height: 1.65; margin: 8px 0 0; }
.customer-empty-note { color: var(--t-muted); font-size: 12px; margin: 8px 0; }
.customer-history-card { margin-top: 18px; }
.customer-history-count { background: var(--bg-muted); border-radius: 999px; color: var(--t-muted); font-size: 10px; font-weight: 700; padding: 5px 9px; }
.customer-address-grid { display: grid; gap: 12px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.customer-address-item { background: var(--bg-hover); border: 1px solid var(--border-soft); border-radius: 10px; color: var(--t-muted); font-size: 11px; padding: 14px; }
.customer-address-head { align-items: center; display: flex; justify-content: space-between; margin-bottom: 7px; }
.customer-address-head strong { color: var(--t-base); font-size: 13px; }
.customer-address-item p { line-height: 1.65; margin: 7px 0 0; }
.customer-enquiry-table td { white-space: normal; }
.sr-only { clip: rect(0,0,0,0); clip-path: inset(50%); height: 1px; overflow: hidden; position: absolute; white-space: nowrap; width: 1px; }

@media (max-width: 1024px) {
    .admin-kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
    .shell { grid-template-columns: 1fr; }
    .d-sidebar { height: 100dvh; left: 0; position: fixed; top: 0; transform: translateX(-102%); transition: transform .22s ease; width: 248px; z-index: 100; }
    body.has-drawer-open .shell > .d-sidebar { transform: translateX(0) !important; }
    .drawer-backdrop { border: 0; cursor: pointer; padding: 0; pointer-events: none; }
    body.has-drawer-open .drawer-backdrop { opacity: 1; pointer-events: auto; visibility: visible; }
    .admin-topbar-label { display: none; }
    .admin-content { padding: 22px 18px; }
    .admin-flash { margin: 12px 18px 0; }
    .admin-hero { align-items: flex-start; flex-direction: column; gap: 16px; }
    .hero-actions { flex-wrap: wrap; }
    .admin-table-card { padding: 16px; }
    .admin-category-create-form { grid-template-columns: 1fr; }
}

@media (min-width: 761px) and (max-width: 1100px) {
    .customer-shell { grid-template-columns: 248px minmax(0, 1fr); }
    .customer-sidebar { padding-left: 14px; padding-right: 14px; }
}

@media (max-width: 760px) {
    .customer-sidebar { width: min(288px, 86vw); }
}

@media (max-width: 520px) {
    .customer-profile-grid, .customer-address-grid { grid-template-columns: 1fr; }
    .customer-profile-hero { padding: 18px; }
    .customer-profile-heading { align-items: flex-start; }
    .customer-profile-stats { width: 100%; }
    .customer-profile-stats div { flex: 1; min-width: 85px; }
    .customer-directory-head { align-items: flex-start; }
    .customer-search-form { width: 100%; }
    .customer-search-form input { flex: 1 1 160px; min-width: 0; }
    .customer-detail-list div { grid-template-columns: 100px minmax(0, 1fr); }
    .admin-kpi-grid { gap: 12px; grid-template-columns: 1fr; }
    .admin-form-grid { grid-template-columns: 1fr; }
    .admin-field.is-wide { grid-column: auto; }
    .admin-breadcrumb { font-size: 11px; gap: 7px; }
    .admin-content { padding: 18px 14px; }
    .admin-flash { margin: 10px 14px 0; }
    .hero-actions .btn { flex: 1; justify-content: center; }
    .auth-page { padding: 24px 16px; }
    .auth-card { padding: 24px 20px; }
    .admin-category-row { gap: 7px; grid-template-columns: 26px minmax(80px, 1fr) auto; padding: 8px 0; }
    .admin-category-row form:last-child { grid-column: 2 / -1; }
    .admin-category-edit { gap: 5px; }
    .admin-category-edit button { padding: 4px; }
    .quote-dialog-form { padding: 18px; }
    .quote-dialog-grid { grid-template-columns: 1fr; }
    .quote-field.is-wide { grid-column: auto; }
    .commerce-detail-grid { grid-template-columns: 1fr; }
}
/* Admin order details */
.order-invoice { display: none; }
.admin-order-layout { display: grid; gap: 20px; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 12px; }
.admin-order-layout > .card { margin-top: 0; }
.courier-label { display: none; }
.admin-detail-block + .admin-detail-block { margin-top: 18px; }
.admin-detail-label { color: var(--t-muted); font-size: 11px; font-weight: 600; letter-spacing: .08em; margin: 0; text-transform: uppercase; }
.admin-detail-value { color: var(--t-base); font-size: 14px; margin: 6px 0 0; overflow-wrap: anywhere; }
.admin-address { color: var(--t-base); font-size: 14px; line-height: 1.6; margin: 6px 0 0; white-space: pre-line; }
.admin-order-form { display: grid; gap: 16px; }
.admin-order-totals { border-top: 1px solid var(--border-soft); display: grid; gap: 10px; margin-left: auto; max-width: 360px; padding: 18px 20px 4px; }
.admin-summary-row { color: var(--t-muted); display: flex; font-size: 14px; gap: 12px; justify-content: space-between; }
.admin-summary-row strong { color: var(--t-base); white-space: nowrap; }
.admin-summary-row.is-total { border-top: 1px solid var(--border-soft); font-size: 15px; font-weight: 700; padding-top: 12px; }
.admin-summary-row.is-total span, .admin-summary-row.is-total strong { color: var(--t-base); }
@media print {
    @page { margin: 0; size: landscape; }
    body:has(.courier-label) { background: #fff !important; color: #000 !important; }
    body:has(.courier-label) * { visibility: hidden !important; }
    body:has(.courier-label) .courier-label,
    body:has(.courier-label) .courier-label * { visibility: visible !important; }
    body:has(.courier-label) .courier-label { background: #fff; border: 2.4mm solid #102b55; border-radius: 8mm; color: #102b55; display: block; height: 190mm; left: 5mm; overflow: hidden; position: absolute; right: 5mm; top: 5mm; }
    .courier-label-watermark { height: 100%; inset: 0; object-fit: cover; opacity: .18; position: absolute; width: 100%; z-index: 0; }
    .courier-label-header, .courier-label-rule, .courier-label-recipient, .courier-label-notes { position: relative; z-index: 1; }
    .courier-label-header { align-items: center; display: grid; gap: 5mm; grid-template-columns: 29% minmax(0, 1fr) 32%; min-height: 43mm; padding: 5mm 8mm; }
    .courier-label-logo { align-self: center; display: block; height: auto; max-height: 27mm; max-width: 100%; object-fit: contain; object-position: left center; width: 100%; }
    .courier-label-sender { align-content: center; border-left: 1px solid #c68616; display: grid; font-size: 7.5pt; gap: .7mm; line-height: 1.2; min-height: 31mm; min-width: 0; padding-left: 5mm; }
    .courier-label-sender-heading { color: #68758a; font-size: 6pt; font-weight: 700; letter-spacing: .12em; }
    .courier-label-sender strong { font-size: 12pt; line-height: 1.2; }
    .courier-label-sender span { overflow-wrap: anywhere; }
    .courier-label-sender-address { line-height: 1.25; }
    .courier-label-meta { align-content: center; border-left: 1px solid #c68616; display: grid; gap: 1.5mm; min-height: 31mm; min-width: 0; padding-left: 5mm; text-align: left; }
    .courier-label-meta-heading { font-size: 9pt; font-weight: 700; letter-spacing: .13em; }
    .courier-label-meta-number { font-size: 11pt; line-height: 1.2; overflow-wrap: anywhere; }
    .courier-label-meta-date { color: #273b5c; font-size: 10pt; }
    .courier-label-rule { background: #c68616; height: .6mm; margin: 0 8mm; }
    .courier-label-recipient { display: grid; grid-template-columns: minmax(0, 1fr) 35mm; padding: 9mm 10mm 5mm; }
    .courier-label-recipient-details { min-width: 0; }
    .courier-label-qr-wrap { align-content: center; display: grid; justify-items: center; gap: 2mm; padding-top: 3mm; }
    .courier-label-qr { height: 27mm; object-fit: contain; width: 27mm; }
    .courier-label-qr-wrap span { font-size: 7pt; font-weight: 700; letter-spacing: .12em; }
    .courier-label-heading { background: #f8e8c8; border-radius: 2mm; color: #102b55; display: inline-block; font-size: 11pt; font-weight: 700; letter-spacing: .14em; margin: 0 0 5mm; padding: 2mm 5mm; }
    .courier-label-name { font-size: 30pt; font-weight: 700; line-height: 1.12; margin: 0 0 4mm; overflow-wrap: anywhere; }
    .courier-label-address { font-size: 21pt; line-height: 1.35; margin: 0; overflow-wrap: anywhere; }
    .courier-label-contact { align-items: center; border-top: .5mm solid #c68616; display: flex; font-size: 15pt; gap: 5mm; margin: 7mm 0 0; padding-top: 5mm; }
    .courier-label-phone-icon, .courier-label-notes-icon, .courier-label-footer-icon { align-items: center; background: #f8e8c8; border-radius: 50%; color: #a96900; display: inline-flex; flex: 0 0 13mm; font-size: 18pt; height: 13mm; justify-content: center; width: 13mm; }
    .courier-label-phone-icon svg { fill: currentColor; height: 7mm; width: 7mm; }
    .courier-label-contact-label { border-right: .4mm solid #b8c1cd; font-size: 11pt; font-weight: 700; letter-spacing: .12em; padding-right: 8mm; }
    .courier-label-contact strong { font-size: 20pt; }
    .courier-label-notes { align-items: center; border-top: .5mm dashed #aab6c8; display: flex; font-size: 12pt; gap: 5mm; margin: 0 10mm 6mm; padding: 5mm 0; }
    .courier-label-notes div { display: grid; gap: 1.5mm; }
    .courier-label-notes strong { font-size: 13pt; }
    .courier-label-notes span { overflow-wrap: anywhere; }
    .courier-label-footer { align-items: center; border-top: .6mm solid #c68616; bottom: 0; color: #102b55; display: flex; font-size: 11pt; justify-content: space-between; left: 0; min-height: 17mm; padding: 3mm 7mm; position: absolute; right: 0; z-index: 1; }
    .courier-label-thanks { align-items: center; display: flex; gap: 4mm; font-weight: 600; }
    .courier-label-footer-icon { border-right: .4mm solid #c68616; border-radius: 0; flex-basis: 16mm; padding-right: 4mm; width: 16mm; }
    .courier-label-footer-number { border-left: .4mm solid #c68616; font-size: 10pt; padding-left: 7mm; }
}
@media (max-width: 900px) {
    .admin-order-layout { grid-template-columns: 1fr; }
}
@page invoice { size: 210mm 297mm; margin: 12mm; }
@media print {
    body.printing-invoice { page: invoice; }
    body.printing-invoice,
    body.printing-invoice .main,
    body.printing-invoice .content { background: #fff !important; }
    body.printing-invoice .shell { display: block !important; }
    body.printing-invoice .d-sidebar,
    body.printing-invoice .d-topbar,
    body.printing-invoice .admin-footer,
    body.printing-invoice .drawer-backdrop { display: none !important; }
    body.printing-invoice .main,
    body.printing-invoice .admin-content { display: block !important; margin: 0 !important; padding: 0 !important; width: auto !important; }
    body.printing-invoice * { visibility: hidden !important; }
    body.printing-invoice .courier-label { display: none !important; }
    body.printing-invoice .order-invoice,
    body.printing-invoice .order-invoice * { visibility: visible !important; }
    body.printing-invoice .admin-content > * { display: none !important; }
    body.printing-invoice .admin-content > .order-invoice { background: #fff; color: #172033; display: block !important; font-family: Arial, sans-serif; margin: 0; padding: 0; width: 100%; }
    .invoice-header { align-items: center; border-bottom: 2px solid #102b55; display: flex; flex-direction: column; padding-bottom: 7mm; text-align: center; }
    .invoice-company { align-items: center; display: flex; flex-direction: column; gap: 3mm; max-width: 100%; }
    .invoice-company img { display: block; max-height: 28mm; max-width: 65mm; object-fit: contain; }
    .invoice-company > div { text-align: center; }
    .invoice-company h1 { color: #102b55; font-size: 17pt; margin: 0 0 2mm; }
    .invoice-company p { color: #4b5563; font-size: 9pt; line-height: 1.4; margin: 1mm 0; }
    .invoice-title { display: grid; gap: 2mm; margin-top: 5mm; text-align: center; }
    .invoice-title span { color: #aa6b06; font-size: 10pt; font-weight: 700; letter-spacing: .16em; }
    .invoice-title strong { color: #102b55; font-size: 13pt; overflow-wrap: anywhere; }
    .invoice-title small { color: #4b5563; font-size: 9pt; }
    .invoice-parties { display: grid; gap: 8mm; grid-template-columns: 1fr 1fr 1fr; padding: 8mm 0; }
    .invoice-parties section { display: grid; align-content: start; gap: 2mm; }
    .invoice-eyebrow { color: #64748b; font-size: 8pt; font-weight: 700; letter-spacing: .12em; }
    .invoice-parties strong { color: #102b55; font-size: 10pt; }
    .invoice-parties p { font-size: 9pt; line-height: 1.5; margin: 0; overflow-wrap: anywhere; }
    .invoice-items { border-collapse: collapse; font-size: 9pt; width: 100%; }
    .invoice-items th { background: #102b55; color: #fff; font-size: 8pt; letter-spacing: .04em; padding: 3mm 2mm; text-align: left; }
    .invoice-items td { border-bottom: 1px solid #dbe1e9; padding: 3mm 2mm; vertical-align: top; }
    .invoice-items th:nth-child(n+4), .invoice-items td:nth-child(n+4) { text-align: right; }
    .invoice-items tr { break-inside: avoid; }
    .invoice-bottom { align-items: flex-start; display: flex; justify-content: space-between; padding-top: 8mm; }
    .invoice-thanks { color: #64748b; font-size: 10pt; }
    .invoice-totals { display: grid; gap: 3mm; min-width: 65mm; }
    .invoice-totals div { display: flex; font-size: 9pt; justify-content: space-between; gap: 12mm; }
    .invoice-grand-total { border-top: 1.5px solid #102b55; color: #102b55; font-size: 12pt !important; font-weight: 700; padding-top: 3mm; }
}