* { box-sizing: border-box; }
body {
    margin: 0;
    font-family: Arial, Helvetica, sans-serif;
    background: #f5f7fb;
    color: #1f2937;
}
a { color: inherit; text-decoration: none; }
.app-shell { min-height: 100vh; display: flex; }
.sidebar {
    width: 240px;
    background: #172033;
    color: #fff;
    padding: 20px 14px;
    position: fixed;
    top: 0; bottom: 0; left: 0;
}
.sidebar-brand { display: flex; align-items: center; gap: 10px; padding: 6px 8px 22px; }
.sidebar-brand small { display: block; color: #aeb8ca; margin-top: 4px; }
.brand-mark {
    width: 52px; height: 52px; border-radius: 14px;
    display: flex; align-items: center; justify-content: center;
    background: #fff; color: #172033; font-weight: bold; font-size: 20px;
    margin: 0 auto 14px;
}
.brand-mark.small { width: 38px; height: 38px; margin: 0; border-radius: 10px; font-size: 16px; }
.sidebar nav a, .logout-link {
    display: block; padding: 11px 12px; border-radius: 8px;
    color: #d8deea; margin-bottom: 3px; font-size: 16px;
}
.sidebar nav a:hover, .sidebar nav a.active { background: #2a3650; color: #fff; }
.logout-link { position: absolute; bottom: 18px; left: 14px; right: 14px; border-top: 1px solid #2a3650; padding-top: 15px; }
.main-content { margin-left: 240px; width: calc(100% - 240px); min-height: 100vh; }
.topbar {
    height: 64px; background: #fff; border-bottom: 1px solid #e5e7eb;
    display: flex; align-items: center; justify-content: space-between;
    padding: 0 28px;
}
.user-menu { font-size: 16px; color: #667085; }
.content { padding: 28px; max-width: 1400px; margin: 0 auto; }
.page-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 24px; }
.page-header h2 { margin: 0 0 6px; }
.page-header p { margin: 0; color: #667085; }
.stats-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; margin-bottom: 22px; }
.stat-card, .content-card {
    background: #fff; border: 1px solid #e6eaf0; border-radius: 12px;
    padding: 20px; box-shadow: 0 2px 8px rgba(15, 23, 42, .04);
}
.stat-label { display: block; color: #667085; font-size: 15px; margin-bottom: 10px; }
.stat-card strong { font-size: 25px; }
.content-card h3 { margin-top: 0; }
.setup-list { margin-top: 18px; }
.setup-item { padding: 13px 0; border-bottom: 1px solid #edf0f4; color: #667085; }
.setup-item.done { color: #1f7a4d; }
.btn {
    border: 0; border-radius: 8px; padding: 11px 17px;
    cursor: pointer; display: inline-block; font-weight: bold;
}
.btn-primary { background: #172033; color: #fff; }
.btn-primary:hover { background: #273650; }
.btn-block { width: 100%; }
.footer { color: #98a2b3; text-align: center; padding: 25px; font-size: 14px; }
.auth-page { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 20px; background: #f5f7fb; }
.auth-card { width: 100%; max-width: 420px; background: #fff; padding: 34px; border-radius: 14px; border: 1px solid #e6eaf0; box-shadow: 0 10px 35px rgba(15, 23, 42, .08); }
.auth-card h1 { text-align: center; margin: 0 0 5px; font-size: 24px; }
.muted { text-align: center; color: #667085; margin: 0 0 25px; }
.auth-card label { display: block; margin: 15px 0 7px; font-size: 16px; font-weight: bold; }
.auth-card input {
    width: 100%; padding: 12px; border: 1px solid #d0d5dd;
    border-radius: 8px; font-size: 15px; outline: none;
}
.auth-card input:focus { border-color: #172033; }
.alert { padding: 12px 14px; border-radius: 8px; margin-bottom: 15px; font-size: 16px; }
.alert-danger { background: #fff0f0; color: #a33a3a; border: 1px solid #f1c2c2; }
.demo-note { margin-top: 18px; padding: 12px; background: #f5f7fb; border-radius: 8px; font-size: 14px; color: #667085; text-align: center; }
@media (max-width: 900px) {
    .sidebar { width: 200px; }
    .main-content { margin-left: 200px; width: calc(100% - 200px); }
    .stats-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 650px) {
    .sidebar { position: static; width: 100%; min-height: auto; }
    .app-shell { display: block; }
    .main-content { margin-left: 0; width: 100%; }
    .sidebar nav { display: grid; grid-template-columns: repeat(2, 1fr); gap: 3px; }
    .logout-link { position: static; margin-top: 10px; }
    .stats-grid { grid-template-columns: 1fr; }
    .page-header { display: block; }
    .page-header .btn { margin-top: 15px; }
}
.btn-secondary { background: #eef1f5; color: #273142; margin-left: 5px; }
.btn-secondary:hover { background: #e1e6ed; }
.alert-success { background: #ecfdf3; color: #176b45; border: 1px solid #b7ebcf; }
.search-form { display: flex; gap: 8px; align-items: center; }
.search-form input { flex: 1; padding: 11px 12px; border: 1px solid #d0d5dd; border-radius: 8px; font-size: 16px; }
.table-card { margin-top: 18px; padding: 0; overflow: hidden; }
.table-wrap { width: 100%; overflow-x: auto; }
.data-table { width: 100%; border-collapse: collapse; min-width: 900px; }
.data-table th, .data-table td { padding: 13px 15px; border-bottom: 1px solid #edf0f4; text-align: left; font-size: 15px; vertical-align: middle; }
.data-table th { background: #f8fafc; color: #667085; font-size: 14px; text-transform: uppercase; letter-spacing: .03em; }
.actions { white-space: nowrap; }
.action-link { color: #344054; margin-right: 10px; font-weight: bold; }
.action-link.danger { color: #b42318; }
.stock-low { color: #b42318; font-weight: bold; }
.status-badge { display: inline-block; padding: 4px 8px; border-radius: 20px; font-size: 13px; font-weight: bold; }
.status-active { background: #ecfdf3; color: #067647; }
.empty-state { text-align: center !important; color: #98a2b3; padding: 35px !important; }
.form-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; }
.form-group label { display: block; margin-bottom: 7px; font-size: 15px; font-weight: bold; color: #344054; }
.form-group input, .form-group select, .form-group textarea {
    width: 100%; padding: 11px 12px; border: 1px solid #d0d5dd; border-radius: 8px;
    font-family: inherit; font-size: 16px; background: #fff;
}
.form-group input:focus, .form-group select:focus, .form-group textarea:focus { outline: none; border-color: #667085; }
.form-span-2 { grid-column: span 2; }
.form-actions { margin-top: 24px; padding-top: 18px; border-top: 1px solid #edf0f4; }
.two-column { display: grid; grid-template-columns: 340px 1fr; gap: 18px; align-items: start; }
@media (max-width: 800px) {
    .form-grid { grid-template-columns: 1fr; }
    .form-span-2 { grid-column: span 1; }
    .two-column { grid-template-columns: 1fr; }
    .search-form { display: block; }
    .search-form input { margin-bottom: 8px; }
}


.alert-success { background:#edf9f1; color:#1f7a4d; border:1px solid #bfe4ca; }
.inventory-actions { display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-bottom:22px; }
.content-card + .content-card { margin-top:22px; }
.content-card label { display:block; margin:13px 0 6px; font-size:13px; font-weight:bold; }
.content-card input, .content-card select {
    width:100%; padding:10px 11px; border:1px solid #d0d5dd; border-radius:7px;
    background:#fff; font-size:14px;
}
.form-grid { display:grid; grid-template-columns:repeat(2, 1fr); gap:10px 14px; }
.muted-left { color:#667085; font-size:13px; margin-top:0; }
.table-header { display:flex; justify-content:space-between; align-items:end; gap:15px; }
.table-header form { display:flex; gap:8px; min-width:300px; }
.table-wrap { overflow-x:auto; margin-top:15px; }
table { width:100%; border-collapse:collapse; font-size:13px; }
th, td { padding:11px 10px; border-bottom:1px solid #edf0f4; text-align:left; white-space:nowrap; }
th { background:#f8fafc; color:#475467; font-size:12px; }
.badge { display:inline-block; padding:4px 8px; border-radius:20px; font-size:11px; font-weight:bold; }
.badge-success { background:#edf9f1; color:#1f7a4d; }
.badge-danger { background:#fff0f0; color:#a33a3a; }
.badge-warning { background:#fff7e6; color:#9a6700; }
@media (max-width: 800px) {
    .inventory-actions { grid-template-columns:1fr; }
    .table-header { display:block; }
    .table-header form { min-width:0; margin-top:12px; }
}


.pos-layout { display:grid; grid-template-columns:1fr 1.5fr; gap:20px; }
.pos-search-row { display:flex; gap:8px; }
.pos-search-row input { flex:1; }
.pos-results { margin-top:12px; }
.pos-result { display:flex; justify-content:space-between; align-items:center; padding:11px 0; border-bottom:1px solid #edf0f4; gap:10px; }
.pos-result small { display:block; color:#667085; margin-top:4px; }
.pos-result-empty { color:#667085; padding:10px 0; font-size:13px; }
.qty-input { width:75px !important; padding:7px !important; }
.btn-danger-small { background:#fff0f0; color:#a33a3a; border:1px solid #f1c2c2; padding:5px 9px; }
.pos-summary { margin:18px 0; border-top:1px solid #edf0f4; }
.pos-summary > div { display:flex; justify-content:space-between; padding:10px 0; border-bottom:1px solid #edf0f4; }
.pos-summary .pos-total { font-size:19px; }
@media (max-width: 900px) { .pos-layout { grid-template-columns:1fr; } }
.purchase-add-row { display:grid; grid-template-columns: 2fr .7fr .9fr .9fr 1fr 1.1fr auto; gap:8px; align-items:center; margin:15px 0; }
.purchase-add-row select, .purchase-add-row input { width:100%; padding:10px 11px; border:1px solid #d0d5dd; border-radius:7px; background:#fff; font-size:13px; }
.purchase-add-row .btn { white-space:nowrap; }
.purchase-total { text-align:right; padding-top:16px; margin-top:8px; border-top:1px solid #edf0f4; font-size:17px; }
.table-subtext { display:block; color:#98a2b3; margin-top:3px; font-size:11px; }
.link-button { border:0; background:none; padding:0; cursor:pointer; color:#344054; font-weight:bold; font-family:inherit; font-size:13px; }
.purchase-meta { display:flex; justify-content:space-between; gap:30px; padding-bottom:20px; margin-bottom:15px; border-bottom:1px solid #edf0f4; }
.purchase-meta > div { display:flex; flex-direction:column; gap:5px; }
.purchase-meta strong { font-size:12px; color:#667085; text-transform:uppercase; letter-spacing:.03em; }
.purchase-summary { margin-left:auto; width:360px; max-width:100%; margin-top:20px; }
.purchase-summary div { display:flex; justify-content:space-between; padding:10px 0; border-bottom:1px solid #edf0f4; }
@media (max-width: 1100px) { .purchase-add-row { grid-template-columns: 2fr 1fr 1fr; } .purchase-add-row .btn { width:100%; } }
@media (max-width: 650px) { .purchase-meta { display:block; } .purchase-meta > div + div { margin-top:18px; } .purchase-add-row { grid-template-columns:1fr; } }
@media print { .sidebar, .topbar, .page-header, .footer { display:none !important; } .main-content { margin:0; width:100%; } .content { padding:0; } .content-card { box-shadow:none; border:0; } }

.balance-due { color:#b42318; font-weight:bold; }

/* Step 7 - Expenses & Financial Reports */
.date-filter-form { display:flex; gap:10px; align-items:end; flex-wrap:wrap; }
.date-filter-form > div { min-width:150px; }
.date-filter-form label { display:block; margin-bottom:6px; font-size:12px; font-weight:bold; color:#475467; }
.date-filter-form input { padding:10px 11px; border:1px solid #d0d5dd; border-radius:7px; background:#fff; font-size:14px; }
.expense-stats { grid-template-columns:repeat(2, 1fr); }
.report-stats { grid-template-columns:repeat(4, 1fr); }
.report-stats .stat-card small { display:block; margin-top:7px; color:#98a2b3; font-size:12px; }
.report-filter-card { margin-bottom:22px; }
.report-grid { display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-bottom:22px; }
.report-note { margin-top:22px; color:#667085; font-size:13px; }
@media (max-width: 1000px) { .report-stats { grid-template-columns:repeat(2, 1fr); } }
@media (max-width: 800px) { .report-grid { grid-template-columns:1fr; } }
@media (max-width: 650px) { .expense-stats, .report-stats { grid-template-columns:1fr; } .date-filter-form { display:block; } .date-filter-form > div { margin-bottom:10px; } .date-filter-form input { width:100%; } }

/* Step 8 - Advanced Dashboard & Business Analytics */
.dashboard-header .dashboard-actions { display:flex; gap:8px; align-items:center; }
.dashboard-stats { grid-template-columns:repeat(6, 1fr); }
.dashboard-stats .stat-card { min-height:126px; }
.dashboard-stats .stat-card small { display:block; color:#98a2b3; font-size:12px; margin-top:8px; }
.stat-primary { border-top:3px solid #344054; }
.dashboard-grid { display:grid; gap:18px; margin-top:18px; }
.dashboard-grid-main { grid-template-columns:1.7fr 1fr; }
.dashboard-grid-three { grid-template-columns:1fr 1fr 1fr; }
.dashboard-grid-bottom { grid-template-columns:1.7fr 1fr; }
.dashboard-chart-card, .dashboard-profit-card { min-height:330px; }
.section-heading { display:flex; justify-content:space-between; align-items:flex-start; gap:12px; margin-bottom:16px; }
.section-heading h3 { margin:0 0 4px; }
.section-heading p { margin:0; color:#98a2b3; font-size:12px; }
.sales-chart { height:235px; display:flex; align-items:flex-end; justify-content:space-around; gap:10px; padding:20px 5px 0; border-bottom:1px solid #edf0f4; }
.sales-bar-item { flex:1; max-width:90px; height:100%; display:flex; flex-direction:column; align-items:center; justify-content:flex-end; }
.sales-bar-value { font-size:10px; color:#667085; min-height:18px; white-space:nowrap; }
.sales-bar-track { height:180px; width:70%; display:flex; align-items:flex-end; }
.sales-bar-fill { width:100%; min-height:2px; background:#344054; border-radius:6px 6px 0 0; transition:height .2s ease; }
.sales-bar-label { font-weight:bold; font-size:11px; color:#475467; margin-top:8px; text-align:center; }
.sales-bar-label small { display:block; color:#98a2b3; font-weight:normal; margin-top:2px; }
.performance-list > div, .performance-meta { display:flex; justify-content:space-between; gap:12px; padding:14px 0; border-bottom:1px solid #edf0f4; }
.performance-list span, .performance-meta span { color:#667085; font-size:13px; }
.performance-list strong, .performance-meta strong { font-size:14px; }
.performance-total { padding-top:18px !important; margin-top:4px; }
.performance-total strong { font-size:20px; }
.performance-meta { border-bottom:0; margin-top:5px; padding-bottom:0; }
.rank-item, .payment-item, .expiry-item, .mini-alert { display:flex; align-items:center; gap:10px; padding:12px 0; border-bottom:1px solid #edf0f4; }
.rank-item:last-child, .payment-item:last-child, .expiry-item:last-child, .mini-alert:last-child { border-bottom:0; }
.rank-number { width:27px; height:27px; display:flex; align-items:center; justify-content:center; border-radius:50%; background:#f2f4f7; color:#344054; font-weight:bold; font-size:12px; flex:0 0 auto; }
.rank-main, .payment-item > div, .expiry-item > div { flex:1; min-width:0; }
.rank-main strong, .payment-item strong, .expiry-item strong { display:block; font-size:13px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.rank-main small, .payment-item small, .expiry-item small { display:block; color:#98a2b3; font-size:11px; margin-top:3px; }
.payment-item > strong { white-space:nowrap; }
.alert-summary { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-bottom:8px; }
.alert-summary-item { padding:12px; border-radius:9px; text-align:center; }
.alert-summary-item span { display:block; font-size:22px; font-weight:bold; }
.alert-summary-item small { color:#667085; font-size:11px; }
.alert-summary-item.danger { background:#fff5f5; }
.alert-summary-item.warning { background:#fff9eb; }
.mini-alert { justify-content:space-between; font-size:12px; }
.mini-alert strong { color:#b42318; }
.expiry-days { background:#fff7e6; color:#9a6700; padding:5px 8px; border-radius:20px; font-size:11px; font-weight:bold; white-space:nowrap; }
.expiry-days.urgent { background:#fff0f0; color:#b42318; }
.quick-link-grid { display:grid; grid-template-columns:repeat(6, 1fr); gap:10px; }
.quick-link-grid a { display:block; padding:15px; border:1px solid #edf0f4; border-radius:9px; color:#273142; text-decoration:none; background:#fff; }
.quick-link-grid a:hover { border-color:#cbd2da; transform:translateY(-1px); }
.quick-link-grid strong { display:block; font-size:13px; }
.quick-link-grid small { display:block; color:#98a2b3; margin-top:5px; font-size:11px; }
.dashboard-quick-links { margin-top:18px; }
@media (max-width:1200px) { .dashboard-stats { grid-template-columns:repeat(3, 1fr); } .dashboard-grid-three { grid-template-columns:1fr 1fr; } .quick-link-grid { grid-template-columns:repeat(3, 1fr); } }
@media (max-width:900px) { .dashboard-grid-main, .dashboard-grid-bottom { grid-template-columns:1fr; } }
@media (max-width:700px) { .dashboard-header .dashboard-actions { margin-top:12px; } .dashboard-stats, .dashboard-grid-three, .quick-link-grid { grid-template-columns:1fr; } .sales-bar-track { width:55%; } .sales-chart { gap:5px; } }


/* Step 9 - user management */
.badge { display:inline-block; padding:4px 9px; border-radius:999px; background:#eef2ff; font-size:12px; font-weight:600; }
.btn-sm { padding:7px 10px; font-size:13px; }
.form-grid.four-col { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 900px) { .form-grid.four-col { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { .form-grid.four-col { grid-template-columns: 1fr; } }

/* Step 10 - Business Settings */
.settings-form { max-width: 1000px; }
.settings-form h3 { margin-top:0; margin-bottom:6px; }
.settings-form .form-help { color:#667085; font-size:12px; margin-top:4px; }
.settings-form .full-width { grid-column:1 / -1; }
.settings-divider { border:0; border-top:1px solid #edf0f4; margin:26px 0; }
.settings-form .form-actions { margin-top:20px; }
.settings-form textarea { width:100%; box-sizing:border-box; resize:vertical; }
@media (max-width:650px) { .settings-form .full-width { grid-column:auto; } }

/* Step 11 - Backup & Export */
.quick-actions { display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:14px; margin-top:18px; }
.quick-action { display:block; padding:18px; border:1px solid #e5e7eb; border-radius:12px; text-decoration:none; color:inherit; background:#fff; }
.quick-action strong { display:block; margin-bottom:6px; }
.quick-action span { color:#6b7280; font-size:13px; }
@media (max-width: 900px) { .quick-actions { grid-template-columns:repeat(2, minmax(0,1fr)); } }
@media (max-width: 520px) { .quick-actions { grid-template-columns:1fr; } }

/* Step 12 - Advanced POS */
.pos-search-row { display:grid; grid-template-columns:1fr auto auto; gap:8px; }
.pos-search-row input { min-width:0; }
.pos-held-card { margin-bottom:18px; }
.pos-held-card .table-actions { white-space:nowrap; }
.pos-action-buttons { display:flex; justify-content:flex-end; gap:8px; flex-wrap:wrap; margin-top:12px; }
.pos-action-buttons .btn { min-height:42px; }
.btn-secondary { background:#475467; color:#fff; border:1px solid #475467; }
.btn-light { background:#fff; color:#344054; border:1px solid #d0d5dd; }
@media (max-width:650px) {
    .pos-search-row { grid-template-columns:1fr; }
    .pos-action-buttons { display:grid; grid-template-columns:1fr; }
    .pos-action-buttons .btn { width:100%; }
    .pos-held-card .table-actions { white-space:normal; }
}

/* Premium UI refresh */
:root{--pm-primary:#176b5b;--pm-primary-dark:#0f5145;--pm-accent:#e8f5f1;--pm-bg:#f4f7f8;--pm-card:#ffffff;--pm-border:#e3e9e7;--pm-text:#17221f;--pm-muted:#71807b;--pm-danger:#c23b3b;--pm-warning:#a56b08;--pm-shadow:0 8px 28px rgba(23,34,31,.06)}
html{background:var(--pm-bg)}
body{font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;background:var(--pm-bg);color:var(--pm-text);line-height:1.45}
.sidebar{width:258px;background:linear-gradient(180deg,#102d27 0%,#123a32 100%);padding:22px 15px;box-shadow:8px 0 30px rgba(16,45,39,.08);z-index:20}
.sidebar-brand{padding:4px 10px 26px;gap:11px}.sidebar-brand strong{font-size:19px;letter-spacing:.01em}.sidebar-brand small{color:#a9c0ba;font-size:11px}
.brand-mark.small{width:40px;height:40px;border-radius:12px;background:#e9f6f2;color:var(--pm-primary);font-size:13px;box-shadow:0 4px 12px rgba(0,0,0,.12)}
.sidebar nav a,.logout-link{padding:12px 13px;border-radius:10px;color:#c7d7d3;margin-bottom:4px;font-size:16px;transition:all .18s ease}
.sidebar nav a:before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:transparent;margin:0 10px 1px 1px;transition:.18s}
.sidebar nav a:hover{background:rgba(255,255,255,.07);color:#fff;transform:translateX(2px)}
.sidebar nav a.active{background:#e7f4f0;color:#123a32;box-shadow:0 5px 15px rgba(0,0,0,.08);font-weight:700}.sidebar nav a.active:before{background:var(--pm-primary)}
.logout-link{left:15px;right:15px;border-top:1px solid rgba(255,255,255,.1);padding-top:16px;color:#c7d7d3}.logout-link:hover{color:#fff;background:rgba(255,255,255,.06)}
.main-content{margin-left:258px;width:calc(100% - 258px)}
.topbar{height:72px;background:rgba(255,255,255,.96);border-bottom:1px solid var(--pm-border);padding:0 32px;position:sticky;top:0;z-index:10;backdrop-filter:blur(10px)}
.topbar>div:first-child strong{font-size:18px;color:#26342f}.user-menu{background:#f1f6f4;border:1px solid #e1ebe8;color:#46615a;border-radius:22px;padding:8px 14px;font-weight:600;font-size:14px}
.content{padding:30px 32px 42px;max-width:1500px}.page-header{margin-bottom:25px}.page-header h2{font-size:25px;letter-spacing:-.02em;color:#17221f}.page-header p{font-size:13px;color:var(--pm-muted)}
.content-card,.stat-card{border:1px solid var(--pm-border);border-radius:15px;box-shadow:var(--pm-shadow);background:var(--pm-card)}
.content-card{padding:21px}.content-card h3{font-size:15px;color:#23332e}.stat-card{padding:19px;position:relative;overflow:hidden}.stat-card:after{content:"";position:absolute;right:-20px;top:-22px;width:75px;height:75px;border-radius:50%;background:#f0f7f5}.stat-card strong{position:relative;z-index:1;font-size:24px;color:#15251f;letter-spacing:-.02em}.stat-label{position:relative;z-index:1;color:#72817c;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em}
.dashboard-stats{gap:15px}.dashboard-stats .stat-card{min-height:128px}.stat-primary{border-top:3px solid var(--pm-primary)}
.btn{border-radius:9px;padding:10px 15px;font-size:12px;box-shadow:none;transition:.18s ease}.btn-primary{background:var(--pm-primary);color:#fff}.btn-primary:hover{background:var(--pm-primary-dark);transform:translateY(-1px);box-shadow:0 6px 15px rgba(23,107,91,.18)}.btn-secondary{background:#eef3f1;color:#30443e;border:1px solid #dce7e3}.btn-secondary:hover{background:#e4ece9}
.action-link{color:var(--pm-primary);font-size:12px}.action-link:hover{text-decoration:underline}
.section-heading{margin-bottom:17px}.section-heading h3{font-size:14px}.section-heading p{font-size:11px;color:#8a9793}
.table-card{border-radius:15px}.data-table th,th{background:#f6f9f8;color:#73817d;font-size:10px;letter-spacing:.07em;padding:12px 14px}.data-table td,td{padding:13px 14px;font-size:12px;border-bottom:1px solid #edf2f0}.data-table tbody tr:hover{background:#fafcfb}
.status-badge,.badge{padding:5px 9px;border-radius:999px;font-size:10px}.status-active,.badge-success{background:#e8f6f0;color:#147257}.badge-danger{background:#fff0f0;color:#b42318}.badge-warning{background:#fff6df;color:#95620a}
.form-group input,.form-group select,.form-group textarea,.content-card input,.content-card select,.search-form input,.date-filter-form input{border:1px solid #d7e1de;border-radius:9px;padding:11px 12px;color:#263631;background:#fff;transition:.18s}.form-group input:focus,.form-group select:focus,.form-group textarea:focus,.content-card input:focus,.content-card select:focus,.search-form input:focus{border-color:#74aa9d;box-shadow:0 0 0 3px rgba(23,107,91,.08);outline:none}
.search-form{background:#f7faf9;border:1px solid #e1e9e6;padding:6px;border-radius:11px}.search-form input{border:0;background:transparent}.search-form input:focus{box-shadow:none}
.alert{border-radius:10px}.alert-success{background:#eaf7f1;color:#176b45;border-color:#c5e8d6}.alert-danger{background:#fff2f2;color:#a33a3a;border-color:#f0cccc}
.sales-chart{background:linear-gradient(180deg,#fbfdfc,#fff);border-bottom-color:#dfe8e5;border-radius:10px}.sales-bar-fill{background:linear-gradient(180deg,#2b8c78,#176b5b);border-radius:7px 7px 2px 2px}.sales-bar-value{font-size:9px;color:#60716b}.sales-bar-label{color:#52625d;font-size:10px}
.rank-number{background:#eaf4f1;color:#176b5b}.rank-item,.payment-item,.expiry-item,.mini-alert,.performance-list>div{border-bottom-color:#edf2f0}.performance-list strong,.performance-total strong{color:#176b5b}
.alert-summary-item.danger{background:#fff4f3}.alert-summary-item.warning{background:#fff8e8}.mini-alert strong,.balance-due{color:var(--pm-danger)}
.quick-link-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:11px}.quick-link-grid a{border:1px solid #e1e9e6;background:#fbfdfc;border-radius:11px;padding:14px;transition:.18s}.quick-link-grid a:hover{border-color:#a9cec3;background:#f3faf7;transform:translateY(-2px);box-shadow:0 7px 18px rgba(23,107,91,.07)}.quick-link-grid strong{display:block;font-size:12px;color:#29443b}.quick-link-grid small{display:block;margin-top:5px;color:#899690;font-size:10px}
.inventory-actions{gap:15px}.purchase-add-row{gap:7px}.footer{padding:30px;color:#8b9994}
@media (max-width:1200px){.dashboard-stats{grid-template-columns:repeat(3,1fr)}.quick-link-grid{grid-template-columns:repeat(3,1fr)}}
@media (max-width:900px){.sidebar{width:220px}.main-content{margin-left:220px;width:calc(100% - 220px)}.content{padding:24px}.dashboard-grid-main,.dashboard-grid-bottom{grid-template-columns:1fr}.dashboard-grid-three{grid-template-columns:1fr 1fr}.topbar{padding:0 24px}}
@media (max-width:650px){.sidebar{width:100%;position:relative;padding:15px}.main-content{margin-left:0;width:100%}.content{padding:18px}.topbar{height:62px;padding:0 18px}.dashboard-stats,.dashboard-grid-three{grid-template-columns:1fr}.quick-link-grid{grid-template-columns:1fr 1fr}.sidebar nav{gap:5px}.sidebar nav a{padding:9px}.page-header h2{font-size:21px}}
@media print{body{background:#fff}.content-card,.stat-card{box-shadow:none}}

/* Login page polish - remove browser/legacy decoration artifacts */
.auth-page{
    min-height:100vh;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:22px;
    background:#f4f7f8;
}
.auth-card{
    width:100%;
    max-width:420px;
    padding:48px 34px 34px;
    background:#fff;
    border:1px solid #e1e7e5;
    border-radius:16px;
    box-shadow:0 12px 35px rgba(23,34,31,.08);
}
.auth-card .brand-mark{
    width:auto;
    height:auto;
    margin:0 0 28px;
    padding:0;
    background:transparent;
    color:#17221f;
    border-radius:0;
    font-size:20px;
    line-height:1;
    box-shadow:none;
}
.auth-card h1{
    margin:0 0 7px;
    text-align:center;
    font-size:24px;
    line-height:1.25;
    color:#17221f;
    letter-spacing:-.02em;
}
.auth-card .muted{
    margin:0 0 25px;
    text-align:center;
    color:#71807b;
    font-size:14px;
}
.auth-card label{
    display:block;
    margin:16px 0 7px;
    color:#17221f;
    font-size:13px;
    font-weight:700;
}
.auth-card input{
    display:block;
    width:100%;
    height:43px;
    padding:10px 12px;
    border:1px solid #d2dbd8;
    border-radius:9px;
    background:#fff;
    color:#17221f;
    font-family:inherit;
    font-size:14px;
    outline:none;
    box-shadow:none;
}
.auth-card input:focus{
    border-color:#176b5b;
    box-shadow:0 0 0 3px rgba(23,107,91,.08);
}
.auth-card form .btn.btn-primary.btn-block,
.auth-card button[type="submit"]{
    display:block;
    width:100%;
    height:35px;
    min-height:35px;
    margin-top:0;
    padding:0 15px;
    border:0;
    border-radius:9px;
    background:#176b5b;
    color:#fff;
    font-family:inherit;
    font-size:12px;
    font-weight:700;
    line-height:35px;
    text-align:center;
    text-decoration:none !important;
    text-decoration-line:none !important;
    text-decoration-style:solid !important;
    text-decoration-color:transparent !important;
    -webkit-appearance:none;
    appearance:none;
    outline:none;
    box-shadow:none;
    background-image:none !important;
    cursor:pointer;
}
.auth-card form .btn.btn-primary.btn-block:hover,
.auth-card button[type="submit"]:hover{
    background:#0f5145;
    transform:none;
    box-shadow:0 5px 14px rgba(23,107,91,.15);
}
.auth-card form .btn.btn-primary.btn-block:focus,
.auth-card button[type="submit"]:focus{
    outline:none;
    box-shadow:0 0 0 3px rgba(23,107,91,.12);
}
.demo-note{
    margin-top:18px;
    padding:13px 10px;
    background:#f5f7fa;
    border-radius:8px;
    color:#71807b;
    font-size:12px;
    line-height:1.55;
    text-align:center;
}
.demo-note strong{color:#44534e}
@media(max-width:480px){
    .auth-page{padding:16px}
    .auth-card{padding:38px 24px 26px}
}

/* Final login spacing correction */
.auth-card form{
    display:block;
    margin:30px 0 0;
}
.auth-card form label{
    display:block;
    margin:0 0 8px;
    line-height:1.3;
}
.auth-card form input[type="email"],
.auth-card form input[type="password"]{
    display:block;
    width:100%;
    height:44px;
    margin:0 0 18px;
    box-sizing:border-box;
}
.auth-card form button[type="submit"]{
    display:block;
    width:100%;
    height:44px;
    min-height:44px;
    margin:2px 0 0 !important;
    padding:0 15px;
    box-sizing:border-box;
    line-height:44px;
}
.auth-card .demo-note{
    margin-top:18px;
}

/* Step 14 - Sidebar layout and spacing fix */
.app-shell { min-height:100vh; }
.sidebar {
    height:100vh;
    display:flex;
    flex-direction:column;
    overflow:hidden;
}
.sidebar-brand { flex:0 0 auto; }
.sidebar nav {
    flex:1 1 auto;
    min-height:0;
    overflow-y:auto;
    overflow-x:hidden;
    padding:2px 0 12px;
    scrollbar-width:thin;
}
.sidebar nav::-webkit-scrollbar { width:5px; }
.sidebar nav::-webkit-scrollbar-track { background:transparent; }
.sidebar nav::-webkit-scrollbar-thumb { background:rgba(255,255,255,.18); border-radius:10px; }
.sidebar nav a,
.sidebar .logout-link {
    flex:0 0 auto;
    line-height:20px;
}
.sidebar .logout-link {
    position:static;
    flex:0 0 auto;
    margin:8px 0 0;
    padding:14px 13px 6px;
    border-top:1px solid rgba(255,255,255,.1);
}
@media (max-width:650px) {
    .sidebar { height:auto; min-height:auto; overflow:visible; }
    .sidebar nav { overflow:visible; flex:none; }
    .sidebar .logout-link { margin-top:8px; }
}

/* User Management - professional staff administration layout */
.users-page { max-width: 1420px; margin: 0 auto; }
.users-page-header { display:flex; align-items:flex-end; justify-content:space-between; gap:24px; margin-bottom:24px; }
.users-eyebrow { color:#176b5b; font-size:10px; font-weight:800; letter-spacing:.12em; margin-bottom:7px; }
.users-page-header h1 { margin:0; color:#17221f; font-size:28px; line-height:1.2; letter-spacing:-.025em; }
.users-page-header p { margin:7px 0 0; color:#71807b; font-size:13px; }
.users-header-badge { display:flex; align-items:center; gap:7px; padding:8px 12px; border:1px solid #dce8e4; background:#f3f8f6; color:#49625b; border-radius:999px; font-size:11px; font-weight:700; white-space:nowrap; }
.users-header-dot { width:7px; height:7px; border-radius:50%; background:#2b8c78; }
.users-alert { margin-bottom:18px; }
.users-layout { display:grid; grid-template-columns:minmax(340px,.72fr) minmax(560px,1.5fr); gap:20px; align-items:start; }
.users-add-card,.users-list-card { padding:22px; border-radius:16px; }
.users-section-head { display:flex; align-items:center; gap:12px; padding-bottom:18px; margin-bottom:18px; border-bottom:1px solid #edf2f0; }
.users-section-icon { width:38px; height:38px; flex:0 0 38px; display:flex; align-items:center; justify-content:center; border-radius:11px; background:#eaf5f2; color:#176b5b; font-size:22px; font-weight:700; line-height:1; }
.users-section-icon-list { font-size:21px; }
.users-section-head h2 { margin:0; color:#23332e; font-size:17px; line-height:1.2; }
.users-section-head p { margin:4px 0 0; color:#87938f; font-size:11px; line-height:1.45; }
.users-form { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px 14px; }
.users-form-field label { display:block; margin:0 0 7px; color:#34443f; font-size:11px; font-weight:800; }
.users-form-field input,.users-form-field select { display:block; width:100%; height:44px; padding:0 12px; border:1px solid #d6e0dd; border-radius:9px; background:#fff; color:#263631; font-family:inherit; font-size:12px; outline:none; box-shadow:none; transition:.18s ease; }
.users-form-field input::placeholder { color:#a0aaa7; }
.users-form-field input:focus,.users-form-field select:focus { border-color:#72a99d; box-shadow:0 0 0 3px rgba(23,107,91,.08); }
.users-form-action { grid-column:1 / -1; padding-top:10px; margin-top:2px; }
.users-create-btn { height:44px; padding:0 18px; font-size:12px; }
.users-create-btn span { display:inline-flex; width:17px; height:17px; align-items:center; justify-content:center; margin-right:5px; border:1px solid rgba(255,255,255,.5); border-radius:50%; font-size:13px; line-height:1; }
.users-role-note { display:flex; gap:8px; align-items:flex-start; margin-top:19px; padding:12px 13px; border:1px solid #e4ece9; background:#f7faf9; border-radius:10px; color:#7b8985; font-size:10px; line-height:1.45; }
.users-role-note strong { color:#40554e; white-space:nowrap; }
.users-list-card { min-width:0; }
.users-list-head { margin-bottom:0; }
.users-table-wrap { margin:0 -22px -22px; width:calc(100% + 44px); border-radius:0 0 16px 16px; }
.users-table { min-width:780px; }
.users-table th { padding:11px 14px; background:#f7faf9; font-size:9px; }
.users-table td { padding:13px 14px; font-size:11px; }
.user-name-cell { display:flex; align-items:center; gap:9px; min-width:145px; }
.user-avatar { width:30px; height:30px; flex:0 0 30px; display:inline-flex; align-items:center; justify-content:center; border-radius:9px; background:#eaf5f2; color:#176b5b; font-size:11px; font-weight:800; }
.user-name-cell strong { color:#273732; font-size:11px; }
.user-email-cell { color:#66756f; }
.user-date-cell { color:#75827e; white-space:nowrap; }
.user-role-badge,.user-status-badge { display:inline-flex; align-items:center; gap:6px; padding:5px 8px; border-radius:999px; font-size:9px; font-weight:800; white-space:nowrap; }
.user-role-badge span,.user-status-badge span { width:6px; height:6px; border-radius:50%; background:currentColor; }
.role-admin { color:#6656a6; background:#f0edfb; }
.role-manager { color:#176b5b; background:#e8f6f0; }
.role-cashier { color:#60727b; background:#eef3f5; }
.status-on { color:#147257; background:#e8f6f0; }
.status-off { color:#a33a3a; background:#fff0f0; }
.users-action-column { text-align:right !important; }
.users-edit-btn { padding:8px 12px; font-size:10px; margin:0; border-radius:8px; }
.users-table tbody tr:hover { background:#fbfdfc; }
@media (max-width:900px) {
    .users-layout { grid-template-columns:1fr; }
    .users-add-card { max-width:none; }
}
@media (max-width:700px) {
    .users-page-header { display:block; }
    .users-header-badge { display:inline-flex; margin-top:14px; }
    .users-form { grid-template-columns:1fr; }
    .users-form-action { grid-column:auto; padding-top:4px; margin-top:4px; }
    .users-table-wrap { overflow-x:auto; }
}


/* Working administrator dropdown */
.topbar-title{display:flex;align-items:center}
.topbar-user-wrap{height:100%;display:flex;align-items:center;gap:10px;margin-left:auto}
.notification-button{position:relative;width:30px;height:36px;border:0;background:transparent;padding:0;display:flex;align-items:center;justify-content:center;color:#75808a;cursor:pointer}
.notification-button svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.notification-dot{position:absolute;right:3px;top:6px;width:5px;height:5px;border-radius:50%;background:#20a56c;border:1px solid #fff}
.topbar-divider{width:1px;height:31px;background:#e5e9ed;margin:0 4px}
.user-menu{position:relative;height:100%;display:flex;align-items:center}
.user-menu-trigger{height:100%;display:flex;align-items:center;gap:9px;border:0;background:transparent;padding:0 0 0 3px;cursor:pointer;color:#4b555f;font-family:inherit}
.avatar-circle{width:31px;height:31px;border-radius:50%;background:#dcebe4;color:#277a64;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:12px;flex:0 0 31px}
.user-name{font-weight:700;font-size:12px;white-space:nowrap}
.user-caret{font-size:14px;color:#75808a;line-height:1;transition:transform .18s ease;margin-top:-3px}
.user-menu-trigger[aria-expanded="true"] .user-caret{transform:rotate(180deg);margin-top:3px}
.user-dropdown{position:absolute;z-index:1000;top:calc(100% + 9px);right:0;width:220px;background:#fff;border:1px solid #e4e9ee;border-radius:9px;box-shadow:0 12px 30px rgba(20,35,50,.14);padding:7px;display:none}
.user-dropdown.open{display:block}
.dropdown-user-info{display:flex;align-items:center;gap:10px;padding:9px 8px}
.dropdown-user-info .avatar-circle{width:34px;height:34px;flex-basis:34px}
.dropdown-user-info strong{display:block;font-size:12px;color:#293540}
.dropdown-user-info small{display:block;color:#929ca6;font-size:10px;margin-top:3px}
.dropdown-divider{height:1px;background:#edf0f3;margin:5px 0}
.user-dropdown a{display:block;padding:9px 10px;border-radius:6px;color:#56616c;font-size:12px;font-weight:600}
.user-dropdown a:hover{background:#f2f8f5;color:#18875b}
.user-dropdown .dropdown-logout:hover{background:#fff3f3;color:#b42318}
@media(max-width:650px){.topbar{padding:0 16px}.user-name{display:inline}.user-dropdown{right:-5px}.topbar-divider{height:28px}}

/* Pharmacy Manager dashboard visual refresh - based on supplied reference design */
:root { --pm-green:#24a36a; --pm-blue:#1676d2; --pm-navy:#0c1b2e; --pm-bg:#f4f7fb; --pm-border:#e5eaf0; --pm-text:#172033; --pm-muted:#667085; }
body { background:var(--pm-bg); color:var(--pm-text); font-family:Arial, Helvetica, sans-serif; }
.app-shell { min-height:100vh; }
.sidebar { width:118px; background:linear-gradient(180deg,#0b1a2d 0%,#10233b 100%); padding:0; box-shadow:2px 0 12px rgba(13,30,52,.08); z-index:20; }
.sidebar-brand { height:58px; padding:8px 10px 7px; display:flex; align-items:center; justify-content:center; border-bottom:1px solid rgba(255,255,255,.04); }
.brand-wordmark { line-height:1.05; text-align:center; font-size:17px; letter-spacing:-.3px; }
.brand-wordmark strong { display:block; color:#fff; font-weight:700; }
.brand-wordmark span { display:block; color:#22a66b; font-weight:700; margin-top:2px; }
.sidebar-nav { padding-top:7px; }
.sidebar-nav a { display:flex; align-items:center; gap:8px; min-height:34px; padding:7px 10px; margin:1px 5px; border-radius:3px; color:#e4ebf4; font-size:10.5px; font-weight:400; white-space:nowrap; transition:.15s ease; }
.sidebar-nav a svg { width:14px; height:14px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; flex:none; }
.sidebar-nav a:hover { background:rgba(255,255,255,.07); color:#fff; }
.sidebar-nav a.active { background:#23a76b; color:#fff; }
.main-content { margin-left:118px; width:calc(100% - 118px); min-height:100vh; }
.topbar { height:58px; padding:0 20px; background:rgba(255,255,255,.95); border-bottom:1px solid var(--pm-border); box-shadow:0 1px 3px rgba(15,23,42,.02); }
.topbar-title strong { font-size:16px; color:#182131; }
.topbar-user-wrap { display:flex; align-items:center; gap:13px; }
.icon-button { border:0; background:transparent; width:28px; height:28px; padding:5px; position:relative; color:#111827; cursor:pointer; }
.icon-button svg { width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
.notification-dot { width:4px; height:4px; border-radius:50%; background:#23a76b; position:absolute; top:4px; right:4px; }
.user-menu-trigger { border:0; background:transparent; display:flex; align-items:center; gap:7px; cursor:pointer; color:#172033; padding:3px 0; }
.avatar-circle { width:23px; height:23px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; background:#d9e8f6; color:#24364d; font-size:10px; font-weight:700; }
.user-name { font-size:11px; color:#1d2634; }
.user-caret { font-size:12px; color:#344054; margin-top:-3px; }
.user-dropdown { top:40px; right:0; min-width:190px; padding:9px; border:1px solid var(--pm-border); border-radius:9px; box-shadow:0 10px 25px rgba(15,23,42,.12); }
.user-dropdown a { font-size:12px; padding:9px 10px; border-radius:6px; display:block; }
.content { padding:16px; max-width:1440px; }
.dashboard-page { width:100%; }
.dashboard-welcome { margin:0 0 14px; }
.dashboard-welcome h1 { margin:0; font-size:16px; line-height:1.2; font-weight:700; }
.dashboard-stat-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; margin-bottom:10px; }
.dashboard-stat-card { min-height:77px; padding:11px 12px; background:#fff; border:1px solid var(--pm-border); border-radius:7px; box-shadow:0 2px 8px rgba(25,43,66,.035); }
.dashboard-stat-card > span { display:block; color:#394354; font-size:10px; margin-bottom:4px; }
.dashboard-stat-card strong { display:block; font-size:16px; line-height:1.15; color:#111827; }
.dashboard-stat-card small { display:block; margin-top:7px; font-size:9px; color:#23a76b; }
.dashboard-stat-card small.down { color:#d14343; }
.dashboard-stat-card .stat-link { display:inline-block; margin-top:7px; font-size:9px; color:#b7791f; }
.dashboard-main-grid { display:grid; grid-template-columns:1.8fr 1fr; gap:8px; margin-bottom:10px; }
.dashboard-bottom-grid { display:grid; grid-template-columns:1.8fr 1fr; gap:8px; }
.dashboard-panel { background:#fff; border:1px solid var(--pm-border); border-radius:7px; box-shadow:0 2px 8px rgba(25,43,66,.035); overflow:hidden; }
.sales-overview-panel { min-height:164px; }
.top-products-panel { min-height:164px; }
.panel-title { padding:11px 12px 8px; }
.panel-title h2 { margin:0; font-size:10px; color:#172033; font-weight:700; }
.line-chart-wrap { height:135px; padding:0 7px 4px; }
.line-chart { width:100%; height:100%; overflow:visible; }
.chart-grid-line { stroke:#e8edf2; stroke-width:1; }
.chart-y-label,.chart-x-label { fill:#7b8492; font-size:7px; font-family:Arial,Helvetica,sans-serif; }
.sales-line { fill:none; stroke:#218b61; stroke-width:2.1; stroke-linecap:round; stroke-linejoin:round; }
.sales-point { fill:#fff; stroke:#218b61; stroke-width:2; }
.top-product-list { padding:0 12px 7px; }
.top-product-row { min-height:26px; display:flex; align-items:center; justify-content:space-between; gap:12px; border-bottom:1px solid #f0f2f5; font-size:9.5px; color:#273142; }
.top-product-row:last-child { border-bottom:0; }
.top-product-row strong { font-size:9px; color:#475467; }
.dashboard-table-wrap { overflow-x:auto; }
.dashboard-table { width:100%; border-collapse:collapse; font-size:9px; }
.dashboard-table th,.dashboard-table td { padding:6px 12px; border-bottom:1px solid #eef1f4; text-align:left; white-space:nowrap; }
.dashboard-table th { color:#475467; font-weight:600; font-size:8.5px; background:#fff; }
.dashboard-table td { color:#344054; }
.dashboard-table tr:last-child td { border-bottom:0; }
.payment-dashboard-content { display:flex; align-items:center; justify-content:center; gap:18px; min-height:126px; padding:2px 12px 10px; }
.payment-donut { width:91px; height:91px; border-radius:50%; position:relative; flex:none; }
.payment-donut:after { content:""; position:absolute; width:48px; height:48px; border-radius:50%; background:#fff; top:21.5px; left:21.5px; box-shadow:inset 0 0 0 1px #f2f4f7; }
.payment-legend { min-width:105px; }
.payment-legend > div { display:flex; justify-content:space-between; align-items:center; gap:12px; margin:9px 0; font-size:9px; color:#344054; }
.payment-legend span { display:flex; align-items:center; gap:6px; }
.payment-legend i { display:inline-block; width:7px; height:7px; border-radius:50%; }
.payment-legend strong { font-size:9px; color:#475467; }
.empty-state { padding:18px 12px !important; color:#98a2b3; font-size:10px; text-align:center; }
.footer { padding:16px; font-size:9px; }
/* Preserve the reference proportions while allowing normal app pages to remain usable. */
.page-header { margin-bottom:16px; }
.content-card,.stat-card { border-radius:7px; }
@media (max-width: 900px) {
    .sidebar { width:90px; }
    .main-content { margin-left:90px; width:calc(100% - 90px); }
    .sidebar-nav a span { display:none; }
    .sidebar-nav a { justify-content:center; }
    .dashboard-stat-grid { grid-template-columns:repeat(2,1fr); }
}
@media (max-width: 650px) {
    .sidebar { position:static; width:100%; min-height:auto; }
    .sidebar-brand { height:48px; }
    .sidebar-nav { display:grid; grid-template-columns:repeat(4,1fr); padding:5px; }
    .sidebar-nav a { min-height:34px; margin:1px; }
    .sidebar-nav a span { display:block; font-size:8px; }
    .main-content { margin-left:0; width:100%; }
    .dashboard-main-grid,.dashboard-bottom-grid { grid-template-columns:1fr; }
    .dashboard-stat-grid { grid-template-columns:1fr 1fr; }
    .content { padding:10px; }
}

/* Final sidebar layout - enlarged typography without clipping */
.sidebar.sidebar,
.sidebar.sidebar * { box-sizing:border-box; }

.sidebar.sidebar {
    width:220px;
    background:#0b1b2e;
    color:#fff;
    padding:0;
    position:fixed;
    top:0;
    bottom:0;
    left:0;
    overflow-y:auto;
}

.sidebar.sidebar .sidebar-brand {
    height:68px;
    padding:10px 16px;
    border-bottom:1px solid rgba(255,255,255,.05);
    display:flex;
    align-items:center;
}

.sidebar.sidebar .brand-wordmark {
    font-size:20px;
    line-height:1.05;
    white-space:nowrap;
}

.sidebar.sidebar .brand-wordmark strong,
.sidebar.sidebar .brand-wordmark span { display:block; }

.sidebar.sidebar .brand-wordmark span { color:#22b36f; }

.sidebar.sidebar .sidebar-nav {
    display:block;
    padding:10px 7px 16px;
    overflow:visible;
}

.sidebar.sidebar .sidebar-nav a,
.sidebar.sidebar nav a {
    display:flex;
    align-items:center;
    gap:10px;
    width:100%;
    min-height:43px;
    margin:2px 0;
    padding:9px 11px;
    border-radius:5px;
    color:#dce5ee;
    font-size:16px;
    font-weight:400;
    line-height:22px;
    white-space:nowrap;
    overflow:visible;
    transform:none;
    box-shadow:none;
}

.sidebar.sidebar .sidebar-nav a svg,
.sidebar.sidebar nav a svg {
    width:18px;
    height:18px;
    flex:0 0 18px;
    fill:none;
    stroke:currentColor;
    stroke-width:1.7;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.sidebar.sidebar .sidebar-nav a:before,
.sidebar.sidebar nav a:before { display:none; }

.sidebar.sidebar .sidebar-nav a:hover,
.sidebar.sidebar nav a:hover {
    background:rgba(255,255,255,.07);
    color:#fff;
}

.sidebar.sidebar .sidebar-nav a.active,
.sidebar.sidebar nav a.active,
.sidebar.sidebar .sidebar-nav a.active:hover {
    background:#23a76b !important;
    color:#fff !important;
    box-shadow:none !important;
    font-weight:600;
}

.sidebar.sidebar .sidebar-nav a span {
    display:block;
    overflow:visible;
    text-overflow:clip;
    white-space:nowrap;
}

.main-content {
    margin-left:220px;
    width:calc(100% - 220px);
}

.topbar { height:58px; padding:0 20px; }
.content { padding:16px; max-width:1440px; }

@media (max-width:1100px) {
    .sidebar.sidebar { width:200px; }
    .main-content { margin-left:200px; width:calc(100% - 200px); }
    .sidebar.sidebar .sidebar-nav a,
    .sidebar.sidebar nav a { font-size:15px; }
}

@media (max-width:650px) {
    .sidebar.sidebar {
        position:static;
        width:100%;
        min-height:auto;
        overflow:visible;
    }
    .main-content { margin-left:0; width:100%; }
    .sidebar.sidebar .sidebar-brand { height:62px; }
    .sidebar.sidebar .sidebar-nav {
        display:grid;
        grid-template-columns:repeat(2,1fr);
        padding:7px;
        gap:3px;
    }
    .sidebar.sidebar .sidebar-nav a,
    .sidebar.sidebar nav a {
        width:auto;
        min-height:40px;
        margin:0;
        font-size:14px;
        justify-content:flex-start;
    }
}

/* =========================================================
   FINAL CLEAN UI / TYPOGRAPHY SYSTEM
   Consolidated typography and reference dashboard styling.
   ========================================================= */
:root {
    --pm-navy:#071a2f;
    --pm-navy-2:#0b223b;
    --pm-green:#20d27a;
    --pm-green-dark:#15945a;
    --pm-text:#101828;
    --pm-muted:#667085;
    --pm-border:#dfe5ec;
    --pm-bg:#f4f7fb;
}

html { font-size:16px; }
body {
    font-family:Arial, Helvetica, sans-serif;
    font-size:16px;
    line-height:1.45;
    background:var(--pm-bg);
    color:var(--pm-text);
}

/* Shared application shell */
.sidebar.sidebar {
    width:240px;
    background:linear-gradient(180deg,var(--pm-navy) 0%,var(--pm-navy-2) 100%);
    padding:0;
}
.sidebar.sidebar .sidebar-brand {
    height:119px;
    padding:20px 26px 18px;
    display:flex;
    align-items:flex-start;
}
.sidebar.sidebar .brand-wordmark {
    font-size:30px;
    line-height:1.02;
    letter-spacing:-.8px;
}
.sidebar.sidebar .brand-wordmark strong { color:#fff; display:block; }
.sidebar.sidebar .brand-wordmark span { color:#22b66f; display:block; margin-top:4px; }
.sidebar.sidebar .sidebar-nav { padding:0 8px 18px; }
.sidebar.sidebar .sidebar-nav a,
.sidebar.sidebar nav a {
    display:flex;
    align-items:center;
    width:100%;
    min-height:64px;
    margin:0;
    padding:0 20px;
    gap:16px;
    border-radius:0 7px 7px 0;
    color:#f4f7fb;
    font-size:22px;
    line-height:1.15;
    font-weight:500;
    white-space:nowrap;
    overflow:visible;
}
.sidebar.sidebar .sidebar-nav a span {
    display:block;
    white-space:nowrap;
    overflow:visible;
}
.sidebar.sidebar .sidebar-nav a svg,
.sidebar.sidebar nav a svg {
    width:25px; height:25px; flex:0 0 25px;
    fill:none; stroke:currentColor; stroke-width:1.8;
    stroke-linecap:round; stroke-linejoin:round;
}
.sidebar.sidebar .sidebar-nav a:hover,
.sidebar.sidebar nav a:hover { background:rgba(255,255,255,.07); color:#fff; }
.sidebar.sidebar .sidebar-nav a.active,
.sidebar.sidebar nav a.active {
    background:#124d49 !important;
    color:var(--pm-green) !important;
    border-left:5px solid var(--pm-green);
    padding-left:15px;
    font-weight:700;
}

.main-content { margin-left:240px; width:calc(100% - 240px); }
.topbar {
    height:72px;
    padding:0 28px 0 50px;
    background:#fff;
    border-bottom:1px solid #e4e8ee;
}
.topbar-title strong { font-size:18px; font-weight:600; color:#111827; }
.user-menu { font-size:16px; }
.user-name { font-size:16px; color:#182131; }
.avatar-circle { font-size:15px; }

.content { padding:28px 22px 0; max-width:none; }
.page-header h2 { font-size:28px; }
.page-header p { font-size:16px; }
.btn { font-size:16px; }

/* Shared forms/tables */
.form-group label, .content-card label, .auth-card label { font-size:16px; }
.form-group input, .form-group select, .form-group textarea,
.content-card input, .content-card select, .search-form input, .auth-card input {
    font-size:16px;
}
.data-table th, .data-table td, table th, table td { font-size:15px; }
.data-table th, table th { font-size:14px; }
.status-badge, .badge { font-size:14px; }
.empty-state { font-size:16px; }
.footer { font-size:15px; }

/* Dashboard reference layout */
.dashboard-page { width:100%; }
.dashboard-welcome { margin:0 0 25px; }
.dashboard-welcome h1 {
    margin:0;
    font-size:38px;
    line-height:1.15;
    font-weight:700;
    color:#101828;
}
.dashboard-stat-grid {
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:13px;
    margin-bottom:17px;
}
.dashboard-stat-card {
    min-height:166px;
    padding:28px 22px 22px;
    background:#fff;
    border:1px solid var(--pm-border);
    border-radius:12px;
    box-shadow:0 2px 8px rgba(16,24,40,.035);
}
.dashboard-stat-card > span {
    display:block; margin-bottom:10px;
    font-size:17px; line-height:1.3; color:#344054;
}
.dashboard-stat-card strong {
    display:block; font-size:32px; line-height:1.1; color:#101828;
}
.dashboard-stat-card small,
.dashboard-stat-card .stat-link {
    display:inline-block; margin-top:14px;
    font-size:16px; line-height:1.35;
}
.dashboard-stat-card small { color:#07883c; }
.dashboard-stat-card small.down { color:#d14343; }
.dashboard-stat-card .stat-link { color:#d97706; }

.dashboard-main-grid, .dashboard-bottom-grid {
    display:grid;
    grid-template-columns:1.7fr 1fr;
    gap:13px;
}
.dashboard-main-grid { margin-bottom:14px; }
.dashboard-panel {
    background:#fff;
    border:1px solid var(--pm-border);
    border-radius:12px;
    box-shadow:0 2px 9px rgba(16,24,40,.035);
    overflow:hidden;
}
.sales-overview-panel, .top-products-panel { min-height:360px; }
.dashboard-bottom-grid .dashboard-panel { min-height:295px; }
.panel-title { padding:24px 28px 13px; }
.panel-title h2 {
    margin:0; font-size:25px; line-height:1.2;
    color:#101828; font-weight:700;
}
.line-chart-wrap { height:300px; padding:0 24px 8px; }
.chart-y-label, .chart-x-label { font-size:13px; fill:#667085; }
.sales-line { stroke:#15945a; stroke-width:3; }
.sales-point { stroke:#15945a; stroke-width:3; }
.top-product-list { padding:10px 28px 16px; }
.top-product-row {
    min-height:48px;
    font-size:17px; line-height:1.35; color:#344054;
}
.top-product-row strong { font-size:16px; color:#475467; }
.dashboard-table-wrap { overflow-x:auto; }
.dashboard-table { width:100%; border-collapse:collapse; font-size:17px; }
.dashboard-table th, .dashboard-table td {
    padding:12px 28px;
    border-bottom:1px solid #eef1f4;
    text-align:left; white-space:nowrap;
    font-size:17px; line-height:1.4;
}
.dashboard-table th { font-size:16px; color:#475467; font-weight:600; background:#fff; }
.dashboard-table td { color:#344054; }
.dashboard-table tr:last-child td { border-bottom:0; }
.empty-state { padding:40px 20px !important; color:#98a2b3; font-size:17px !important; line-height:1.5; }
.payment-dashboard-content {
    min-height:220px; display:flex; align-items:center; justify-content:center;
    gap:45px; padding:12px 35px 20px;
}
.payment-donut { width:200px; height:200px; }
.payment-donut:after { width:106px; height:106px; top:47px; left:47px; }
.payment-legend { min-width:190px; }
.payment-legend > div { margin:17px 0; font-size:17px; line-height:1.4; gap:25px; }
.payment-legend strong { font-size:17px; }
.payment-legend i { width:15px; height:15px; }
.dashboard-page .footer { font-size:15px; }

@media (max-width:1100px) {
    .sidebar.sidebar { width:210px; }
    .main-content { margin-left:210px; width:calc(100% - 210px); }
    .sidebar.sidebar .sidebar-nav a, .sidebar.sidebar nav a { font-size:18px; min-height:56px; }
    .sidebar.sidebar .sidebar-nav a svg, .sidebar.sidebar nav a svg { width:22px; height:22px; flex-basis:22px; }
    .content { padding:24px; }
    .dashboard-stat-grid { grid-template-columns:repeat(2,1fr); }
}

@media (max-width:900px) {
    .dashboard-main-grid, .dashboard-bottom-grid { grid-template-columns:1fr; }
    .topbar { padding:0 20px; }
}

@media (max-width:650px) {
    .sidebar.sidebar { position:static; width:100%; min-height:auto; overflow:visible; }
    .main-content { margin-left:0; width:100%; }
    .sidebar.sidebar .sidebar-brand { height:82px; padding:16px 20px; }
    .sidebar.sidebar .brand-wordmark { font-size:24px; }
    .sidebar.sidebar .sidebar-nav { display:grid; grid-template-columns:repeat(2,1fr); padding:7px; gap:3px; }
    .sidebar.sidebar .sidebar-nav a, .sidebar.sidebar nav a {
        min-height:46px; padding:0 12px; border-radius:7px; font-size:16px; gap:9px;
    }
    .sidebar.sidebar .sidebar-nav a.active, .sidebar.sidebar nav a.active { padding-left:8px; border-left-width:4px; }
    .sidebar.sidebar .sidebar-nav a svg, .sidebar.sidebar nav a svg { width:20px; height:20px; flex-basis:20px; }
    .content { padding:18px; }
    .dashboard-welcome h1 { font-size:30px; }
    .dashboard-stat-grid { grid-template-columns:1fr; }
    .dashboard-stat-card { min-height:140px; }
    .dashboard-table th, .dashboard-table td { padding:10px 16px; }
    .payment-dashboard-content { flex-direction:column; gap:20px; }
}


/* =========================================================
   FINAL REFERENCE DESIGN — LAST RULES TAKE PRECEDENCE
   ========================================================= */
html, body { font-size:16px !important; }
body { background:#f4f7fb !important; color:#101828 !important; }
.sidebar.sidebar {
    width:240px !important;
    background:linear-gradient(180deg,#071a2f 0%,#0b223b 100%) !important;
    padding:0 !important;
}
.sidebar.sidebar .sidebar-brand {
    height:119px !important;
    padding:20px 26px 18px !important;
}
.sidebar.sidebar .brand-wordmark {
    font-size:30px !important;
    line-height:1.02 !important;
    letter-spacing:-.8px !important;
}
.sidebar.sidebar .sidebar-nav { padding:0 8px 18px !important; }
.sidebar.sidebar .sidebar-nav a,
.sidebar.sidebar nav a {
    min-height:64px !important;
    padding:0 20px !important;
    gap:16px !important;
    margin:0 !important;
    border-radius:0 7px 7px 0 !important;
    color:#f4f7fb !important;
    font-size:22px !important;
    line-height:1.15 !important;
    font-weight:500 !important;
    white-space:nowrap !important;
    overflow:visible !important;
}
.sidebar.sidebar .sidebar-nav a span { font-size:22px !important; }
.sidebar.sidebar .sidebar-nav a svg,
.sidebar.sidebar nav a svg {
    width:25px !important; height:25px !important; flex:0 0 25px !important;
}
.sidebar.sidebar .sidebar-nav a.active,
.sidebar.sidebar nav a.active {
    background:#124d49 !important;
    color:#20d27a !important;
    border-left:5px solid #20d27a !important;
    padding-left:15px !important;
    font-weight:700 !important;
}
.main-content { margin-left:240px !important; width:calc(100% - 240px) !important; }
.topbar {
    height:72px !important;
    padding:0 28px 0 50px !important;
    background:#fff !important;
    border-bottom:1px solid #e4e8ee !important;
}
.topbar-title strong { font-size:18px !important; }
.user-name { font-size:16px !important; }
.content { padding:28px 22px 0 !important; max-width:none !important; }
.dashboard-welcome { margin:0 0 25px !important; }
.dashboard-welcome h1 { font-size:38px !important; line-height:1.15 !important; }
.dashboard-stat-grid { grid-template-columns:repeat(4,1fr) !important; gap:13px !important; margin-bottom:17px !important; }
.dashboard-stat-card { min-height:166px !important; padding:28px 22px 22px !important; border-radius:12px !important; }
.dashboard-stat-card > span { font-size:17px !important; margin-bottom:10px !important; }
.dashboard-stat-card strong { font-size:32px !important; }
.dashboard-stat-card small,
.dashboard-stat-card .stat-link { font-size:16px !important; margin-top:14px !important; }
.dashboard-main-grid, .dashboard-bottom-grid { grid-template-columns:1.7fr 1fr !important; gap:13px !important; }
.dashboard-main-grid { margin-bottom:14px !important; }
.dashboard-panel { border-radius:12px !important; }
.sales-overview-panel, .top-products-panel { min-height:360px !important; }
.dashboard-bottom-grid .dashboard-panel { min-height:295px !important; }
.panel-title { padding:24px 28px 13px !important; }
.panel-title h2 { font-size:25px !important; line-height:1.2 !important; }
.line-chart-wrap { height:300px !important; padding:0 24px 8px !important; }
.chart-y-label, .chart-x-label { font-size:13px !important; }
.top-product-list { padding:10px 28px 16px !important; }
.top-product-row { min-height:48px !important; font-size:17px !important; line-height:1.35 !important; }
.top-product-row strong { font-size:16px !important; }
.dashboard-table { font-size:17px !important; }
.dashboard-table th, .dashboard-table td { padding:12px 28px !important; font-size:17px !important; line-height:1.4 !important; }
.dashboard-table th { font-size:16px !important; }
.empty-state { padding:40px 20px !important; font-size:17px !important; line-height:1.5 !important; }
.payment-dashboard-content { min-height:220px !important; gap:45px !important; padding:12px 35px 20px !important; }
.payment-donut { width:200px !important; height:200px !important; }
.payment-donut:after { width:106px !important; height:106px !important; top:47px !important; left:47px !important; }
.payment-legend { min-width:190px !important; }
.payment-legend > div { margin:17px 0 !important; font-size:17px !important; line-height:1.4 !important; gap:25px !important; }
.payment-legend strong { font-size:17px !important; }
.payment-legend i { width:15px !important; height:15px !important; }
.footer { font-size:15px !important; }
@media (max-width:1100px) {
 .sidebar.sidebar { width:210px !important; }
 .main-content { margin-left:210px !important; width:calc(100% - 210px) !important; }
 .sidebar.sidebar .sidebar-nav a, .sidebar.sidebar nav a { font-size:18px !important; min-height:56px !important; }
 .sidebar.sidebar .sidebar-nav a span { font-size:18px !important; }
 .sidebar.sidebar .sidebar-nav a svg, .sidebar.sidebar nav a svg { width:22px !important; height:22px !important; flex-basis:22px !important; }
 .content { padding:24px !important; }
 .dashboard-stat-grid { grid-template-columns:repeat(2,1fr) !important; }
}
@media (max-width:900px) {
 .dashboard-main-grid, .dashboard-bottom-grid { grid-template-columns:1fr !important; }
 .topbar { padding:0 20px !important; }
}
@media (max-width:650px) {
 .sidebar.sidebar { position:static !important; width:100% !important; min-height:auto !important; }
 .main-content { margin-left:0 !important; width:100% !important; }
 .sidebar.sidebar .sidebar-brand { height:82px !important; padding:16px 20px !important; }
 .sidebar.sidebar .brand-wordmark { font-size:24px !important; }
 .sidebar.sidebar .sidebar-nav { display:grid !important; grid-template-columns:repeat(2,1fr) !important; padding:7px !important; gap:3px !important; }
 .sidebar.sidebar .sidebar-nav a, .sidebar.sidebar nav a { min-height:46px !important; padding:0 12px !important; border-radius:7px !important; font-size:16px !important; gap:9px !important; }
 .sidebar.sidebar .sidebar-nav a span { font-size:16px !important; }
 .sidebar.sidebar .sidebar-nav a.active, .sidebar.sidebar nav a.active { padding-left:8px !important; border-left-width:4px !important; }
 .sidebar.sidebar .sidebar-nav a svg, .sidebar.sidebar nav a svg { width:20px !important; height:20px !important; flex-basis:20px !important; }
 .content { padding:18px !important; }
 .dashboard-welcome h1 { font-size:30px !important; }
 .dashboard-stat-grid { grid-template-columns:1fr !important; }
 .dashboard-stat-card { min-height:140px !important; }
 .dashboard-table th, .dashboard-table td { padding:10px 16px !important; }
 .payment-dashboard-content { flex-direction:column !important; gap:20px !important; }
}


/* Final balanced typography and icon sizing */
html, body { font-size: 16px !important; }

.sidebar.sidebar .sidebar-nav a,
.sidebar.sidebar nav a {
    font-size: 18px !important;
    min-height: 52px !important;
    gap: 11px !important;
}
.sidebar.sidebar .sidebar-nav a span { font-size: 18px !important; }
.sidebar.sidebar .sidebar-nav a .nav-icon,
.sidebar.sidebar .sidebar-nav a svg {
    display:block !important;
    visibility:visible !important;
    opacity:1 !important;
    width:21px !important;
    height:21px !important;
    min-width:21px !important;
    flex:0 0 21px !important;
    color:currentColor !important;
    stroke:currentColor !important;
    fill:none !important;
    stroke-width:1.8 !important;
    stroke-linecap:round !important;
    stroke-linejoin:round !important;
}
.sidebar.sidebar .brand-wordmark { font-size: 27px !important; }

.topbar-title strong { font-size: 18px !important; }
.user-name { font-size: 15px !important; }
.dashboard-welcome h1 { font-size: 34px !important; line-height:1.15 !important; }

.dashboard-stat-card {
    display:flex; align-items:center; gap:16px;
    min-height:150px !important;
    padding:22px 20px 20px !important;
}
.dashboard-stat-card .stat-icon {
    width:64px !important; height:64px !important; flex:0 0 64px !important;
}
.dashboard-stat-card .stat-icon svg { width:36px !important; height:36px !important; }
.dashboard-stat-card .stat-copy > span { font-size:16px !important; margin-bottom:7px !important; }
.dashboard-stat-card .stat-copy strong { font-size:28px !important; line-height:1.1 !important; }
.dashboard-stat-card .stat-copy small,
.dashboard-stat-card .stat-copy .trend,
.dashboard-stat-card .stat-copy .stat-link { font-size:14px !important; margin-top:10px !important; }

.panel-title { padding:20px 26px 12px !important; }
.panel-title h2 { font-size:21px !important; line-height:1.2 !important; }
.sales-overview-panel, .top-products-panel { min-height:340px !important; }
.dashboard-bottom-grid .dashboard-panel { min-height:275px !important; }
.line-chart-wrap { height:285px !important; padding:0 22px 8px !important; }
.chart-y-label, .chart-x-label { font-size:11px !important; }
.top-product-list { padding:8px 26px 14px !important; }
.top-product-row { min-height:44px !important; font-size:15px !important; line-height:1.35 !important; }
.top-product-row strong { font-size:14px !important; }
.dashboard-table { font-size:15px !important; }
.dashboard-table th, .dashboard-table td {
    padding:11px 26px !important; font-size:15px !important; line-height:1.4 !important;
}
.dashboard-table th { font-size:14px !important; }
.empty-state { padding:34px 18px !important; font-size:15px !important; line-height:1.5 !important; }
.payment-dashboard-content { min-height:210px !important; gap:35px !important; padding:10px 30px 18px !important; }
.payment-donut { width:185px !important; height:185px !important; }
.payment-donut:after { width:98px !important; height:98px !important; top:43.5px !important; left:43.5px !important; }
.payment-legend { min-width:180px !important; }
.payment-legend > div { margin:14px 0 !important; font-size:15px !important; line-height:1.4 !important; gap:20px !important; }
.payment-legend strong { font-size:15px !important; }
.payment-legend i { width:13px !important; height:13px !important; }
.footer { font-size:14px !important; }

@media (max-width:1100px) {
 .sidebar.sidebar { width:210px !important; }
 .main-content { margin-left:210px !important; width:calc(100% - 210px) !important; }
 .sidebar.sidebar .sidebar-nav a, .sidebar.sidebar nav a { font-size:17px !important; min-height:52px !important; }
 .sidebar.sidebar .sidebar-nav a span { font-size:17px !important; }
 .sidebar.sidebar .sidebar-nav a svg { width:21px !important; height:21px !important; flex-basis:21px !important; }
 .content { padding:24px !important; }
 .dashboard-stat-grid { grid-template-columns:repeat(2,1fr) !important; }
}
@media (max-width:650px) {
 .sidebar.sidebar { position:static !important; width:100% !important; min-height:auto !important; }
 .main-content { margin-left:0 !important; width:100% !important; }
 .sidebar.sidebar .sidebar-brand { height:82px !important; padding:16px 20px !important; }
 .sidebar.sidebar .brand-wordmark { font-size:24px !important; }
 .sidebar.sidebar .sidebar-nav { display:grid !important; grid-template-columns:repeat(2,1fr) !important; padding:7px !important; gap:3px !important; }
 .sidebar.sidebar .sidebar-nav a, .sidebar.sidebar nav a { min-height:46px !important; padding:0 12px !important; border-radius:7px !important; font-size:16px !important; gap:9px !important; }
 .sidebar.sidebar .sidebar-nav a span { font-size:16px !important; }
 .sidebar.sidebar .sidebar-nav a svg { width:20px !important; height:20px !important; flex-basis:20px !important; }
 .content { padding:18px !important; }
 .dashboard-welcome h1 { font-size:30px !important; }
 .dashboard-stat-grid { grid-template-columns:1fr !important; }
 .dashboard-stat-card { min-height:130px !important; }
 .dashboard-table th, .dashboard-table td { padding:10px 16px !important; }
 .payment-dashboard-content { flex-direction:column !important; gap:20px !important; }
}


/* Restore original dashboard statistic icon appearance */
.dashboard-stat-card .stat-icon {
    width:64px !important;
    height:64px !important;
    flex:0 0 64px !important;
    border-radius:50% !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
}
.dashboard-stat-card .stat-icon svg {
    width:36px !important;
    height:36px !important;
    display:block !important;
    fill:none !important;
    stroke:currentColor !important;
    stroke-width:1.9 !important;
    stroke-linecap:round !important;
    stroke-linejoin:round !important;
}
.dashboard-stat-card .stat-icon-sales,
.dashboard-stat-card .stat-icon-profit,
.dashboard-stat-card .stat-icon-products {
    background:#e8f8f0 !important;
    color:#14965b !important;
}
.dashboard-stat-card .stat-icon-low {
    background:#fff3e3 !important;
    color:#f28a00 !important;
}


/* Edit User page - consistent with the Staff / Users design */
.users-edit-page { max-width: 1180px; }
.users-edit-page .users-page-header { align-items: center; }
.users-edit-page .users-back-btn { white-space: nowrap; padding: 10px 16px; font-size: 13px; }
.users-edit-card { max-width: 900px; padding: 24px; border-radius: 16px; }
.users-edit-card .users-section-head { padding-bottom: 18px; margin-bottom: 22px; }
.users-edit-card .users-section-head h2 { font-size: 18px; }
.users-edit-card .users-section-head p { font-size: 12px; }
.users-edit-form { gap: 20px 18px; }
.users-edit-form .users-form-field label { font-size: 13px; margin-bottom: 8px; }
.users-edit-form .users-form-field input,
.users-edit-form .users-form-field select { height: 46px; font-size: 14px; padding: 0 13px; }
.users-edit-form .users-form-field .muted { font-size: 11px; font-weight: 400; color: #87938f; }
.users-edit-form .users-form-action { padding-top: 8px; }
.users-edit-form .users-create-btn { height: 46px; padding: 0 20px; font-size: 13px; }
@media (max-width: 650px) {
    .users-edit-page .users-page-header { display: block; }
    .users-edit-page .users-back-btn { display: inline-flex; margin-top: 14px; }
    .users-edit-card { padding: 18px; }
}