/* ========================================================
   PharmaCare Pro — Main Stylesheet
   ======================================================== */
:root {
  --sidebar-width: 260px;
  --sidebar-bg: #1a1f2e;
  --sidebar-text: #ced4da;
  --sidebar-active-bg: #0d6efd;
  --sidebar-hover-bg: rgba(255,255,255,.06);
  --navbar-height: 58px;
  --body-bg: #f0f2f5;
  --card-radius: 12px;
  --primary: #0d6efd;
  --success: #198754;
  --danger: #dc3545;
  --warning: #ffc107;
  --info: #0dcaf0;
  --text-muted: #6c757d;
}

*, *::before, *::after { box-sizing: border-box; }
body { margin: 0; font-family: 'Segoe UI', system-ui, -apple-system, sans-serif; background: var(--body-bg); color: #212529; }

/* ── Sidebar ────────────────────────────────────────── */
.sidebar {
  position: fixed; top: 0; left: 0; width: var(--sidebar-width);
  height: 100vh; background: var(--sidebar-bg); overflow-y: auto;
  z-index: 1040; transition: transform .25s ease, width .25s ease;
  display: flex; flex-direction: column;
  scrollbar-width: thin; scrollbar-color: rgba(255,255,255,.1) transparent;
}
.sidebar::-webkit-scrollbar { width: 4px; }
.sidebar::-webkit-scrollbar-track { background: transparent; }
.sidebar::-webkit-scrollbar-thumb { background: rgba(255,255,255,.15); border-radius: 4px; }

.sidebar-brand {
  display: flex; align-items: center; gap: 12px; padding: 18px 20px 16px;
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.sidebar-logo { width: 36px; height: 36px; object-fit: contain; border-radius: 8px; }
.sidebar-icon { font-size: 1.8rem; }
.sidebar-brand-text strong { display: block; color: #fff; font-size: .95rem; }
.sidebar-brand-text small { color: var(--sidebar-text); font-size: .72rem; }

.sidebar-menu { padding: 12px 0; flex: 1; }
.nav-item, .nav-group-toggle {
  display: flex; align-items: center; gap: 10px; padding: 9px 20px;
  color: var(--sidebar-text); text-decoration: none; font-size: .875rem;
  cursor: pointer; border: none; background: none; width: 100%;
  transition: background .15s, color .15s;
}
.nav-item:hover, .nav-group-toggle:hover { background: var(--sidebar-hover-bg); color: #fff; }
.nav-item.active { background: var(--sidebar-active-bg); color: #fff; border-radius: 8px; margin: 0 10px; padding: 9px 10px; }
.nav-item i, .nav-group-toggle i { font-size: 1rem; width: 20px; flex-shrink: 0; }
.nav-group-toggle .toggle-icon { font-size: .75rem; margin-left: auto; transition: transform .2s; }
.nav-group.open .toggle-icon { transform: rotate(180deg); }
.nav-group-items { padding: 0; }
.nav-sub-item {
  display: flex; align-items: center; gap: 10px; padding: 7px 20px 7px 42px;
  color: var(--sidebar-text); text-decoration: none; font-size: .825rem;
  transition: background .15s, color .15s;
}
.nav-sub-item:hover { background: var(--sidebar-hover-bg); color: #fff; }
.nav-sub-item.active { color: #fff; font-weight: 600; }
.nav-sub-item i { font-size: .85rem; width: 16px; }
.sidebar-divider { border-top: 1px solid rgba(255,255,255,.08); margin: 8px 0; }

/* ── Main Wrapper ───────────────────────────────────── */
.main-wrapper {
  margin-left: var(--sidebar-width);
  min-height: 100vh; transition: margin-left .25s ease;
  display: flex; flex-direction: column;
}
body.sidebar-collapsed .sidebar { transform: translateX(calc(-1 * var(--sidebar-width))); }
body.sidebar-collapsed .main-wrapper { margin-left: 0; }

/* ── Top Navbar ─────────────────────────────────────── */
.top-navbar {
  height: var(--navbar-height); background: #fff;
  border-bottom: 1px solid #e9ecef; position: sticky; top: 0; z-index: 1030;
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 20px; gap: 12px;
}
.navbar-left, .navbar-right { display: flex; align-items: center; gap: 10px; }
.sidebar-toggle { background: none; border: none; font-size: 1.4rem; cursor: pointer; color: #495057; padding: 4px 8px; border-radius: 6px; }
.sidebar-toggle:hover { background: #f8f9fa; }
.global-search { width: 280px; border-radius: 20px; border-color: #dee2e6; padding-left: 14px; }
.global-search:focus { width: 340px; border-color: var(--primary); box-shadow: 0 0 0 .15rem rgba(13,110,253,.15); }
.search-dropdown {
  position: absolute; top: 100%; left: 0; width: 100%; min-width: 360px;
  background: #fff; border: 1px solid #dee2e6; border-radius: 10px;
  box-shadow: 0 8px 25px rgba(0,0,0,.12); z-index: 2000; max-height: 400px; overflow-y: auto;
}
.search-result-item { padding: 10px 16px; border-bottom: 1px solid #f0f0f0; cursor: pointer; display: flex; align-items: center; gap: 10px; }
.search-result-item:hover { background: #f8f9fa; }
.search-result-item:last-child { border-bottom: none; }

.btn-icon { background: none; border: none; padding: 6px 10px; border-radius: 8px; color: #495057; }
.btn-icon:hover { background: #f8f9fa; }
.notification-badge {
  position: absolute; top: 0; right: 0; background: var(--danger);
  color: #fff; border-radius: 50%; width: 18px; height: 18px;
  font-size: .65rem; font-weight: 700; display: flex; align-items: center; justify-content: center;
}
.notification-dropdown { width: 340px; padding: 0; border-radius: 12px; box-shadow: 0 8px 25px rgba(0,0,0,.12); }
.dropdown-header { padding: 12px 16px; border-bottom: 1px solid #e9ecef; }
.branch-badge { font-size: .8rem; background: #e8f0fe; color: #1558d6; padding: 4px 10px; border-radius: 20px; }
.avatar-sm { width: 32px; height: 32px; object-fit: cover; }
.avatar-initials-sm {
  width: 32px; height: 32px; border-radius: 50%; background: var(--primary);
  color: #fff; display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: .875rem;
}
.user-menu-btn { background: #f8f9fa; border: 1px solid #dee2e6; border-radius: 20px; padding: 4px 12px; }
.user-menu-btn:hover { background: #e9ecef; }

/* ── Page Content ───────────────────────────────────── */
.page-content { padding: 24px; flex: 1; }
.page-footer { border-top: 1px solid #e9ecef; background: #fff; }
.page-header { margin-bottom: 20px; }
.page-header h4 { margin: 0; font-weight: 700; }
.breadcrumb { margin: 0; }

/* Settings workspace */
.settings-page-header { padding: 4px 2px 2px; }
.settings-status { display:inline-flex; align-items:center; gap:7px; padding:8px 12px; border:1px solid #bbf7d0; border-radius:999px; background:#f0fdf4; color:#15803d; font-size:.78rem; font-weight:700; }
.settings-nav-card { top:78px; background:#fff; border:1px solid #e7ebf0; border-radius:16px; padding:12px; box-shadow:0 8px 24px rgba(15,23,42,.05); }
.settings-nav-title { padding:7px 10px 11px; color:#94a3b8; font-size:.68rem; font-weight:800; letter-spacing:.09em; text-transform:uppercase; }
.settings-nav { display:flex; flex-direction:column; gap:5px; }
.settings-nav .nav-link { width:100%; display:flex; align-items:center; gap:12px; padding:12px; border:0; border-radius:11px; color:#475569; text-align:left; transition:.18s ease; }
.settings-nav .nav-link>i { width:34px; height:34px; display:grid; place-items:center; flex:0 0 34px; border-radius:9px; background:#f1f5f9; color:#64748b; font-size:1rem; }
.settings-nav .nav-link span { display:flex; flex-direction:column; min-width:0; }
.settings-nav .nav-link strong { color:inherit; font-size:.86rem; line-height:1.2; }
.settings-nav .nav-link small { margin-top:3px; color:#94a3b8; font-size:.7rem; }
.settings-nav .nav-link:hover { background:#f8fafc; color:#0f172a; }
.settings-nav .nav-link.active { background:#eff6ff; color:#1d4ed8; }
.settings-nav .nav-link.active>i { background:#2563eb; color:#fff; box-shadow:0 5px 12px rgba(37,99,235,.22); }
.settings-help { display:flex; gap:9px; margin-top:13px; padding:12px 10px 2px; border-top:1px solid #eef2f6; color:#64748b; font-size:.72rem; line-height:1.45; }
.settings-card { overflow:hidden; background:#fff; border:1px solid #e7ebf0; border-radius:16px; box-shadow:0 8px 24px rgba(15,23,42,.045); }
.settings-card-header { display:flex; align-items:center; gap:13px; padding:20px 22px; border-bottom:1px solid #edf0f4; background:linear-gradient(180deg,#fff,#fbfcfe); }
.settings-card-header h5 { margin:0 0 3px; color:#172033; font-size:1rem; font-weight:750; }
.settings-card-header p { margin:0; color:#7b8798; font-size:.8rem; }
.settings-card-icon { width:42px; height:42px; display:grid; place-items:center; flex:0 0 42px; border-radius:11px; font-size:1.1rem; }
.settings-card-icon.blue { background:#eaf2ff; color:#2563eb; }.settings-card-icon.purple { background:#f3e8ff; color:#7e22ce; }.settings-card-icon.teal { background:#e6fffb; color:#0f766e; }.settings-card-icon.orange { background:#fff7e6; color:#c2410c; }.settings-card-icon.green { background:#eafaf0; color:#15803d; }.settings-card-icon.red { background:#fff0f0; color:#dc2626; }
.settings-card-body { padding:24px; }
.settings-card .form-label { margin-bottom:7px; color:#334155; font-size:.79rem; font-weight:700; }
.settings-card .form-control,.settings-card .form-select,.settings-card .input-group-text { min-height:44px; border-color:#dbe1e8; }
.settings-card textarea.form-control { min-height:auto; }
.settings-card .form-control:focus,.settings-card .form-select:focus { border-color:#7ca9f8; box-shadow:0 0 0 .2rem rgba(37,99,235,.1); }
.settings-card .input-group-text { background:#f8fafc; color:#64748b; }
.settings-card .form-text { color:#8a96a7; font-size:.72rem; }
.settings-logo-upload { display:flex; align-items:center; gap:14px; padding:13px; border:1px dashed #cbd5e1; border-radius:12px; background:#fafcff; }
.settings-logo-upload>img,.settings-logo-upload>span { width:58px; height:58px; border-radius:11px; object-fit:contain; background:#edf2f7; display:grid; place-items:center; color:#94a3b8; font-size:1.3rem; flex:0 0 58px; }
.settings-note { display:flex; align-items:flex-start; gap:10px; padding:13px 15px; border:1px solid #bfdbfe; border-radius:10px; background:#eff6ff; color:#315b91; font-size:.78rem; }
.settings-savebar { display:flex; justify-content:space-between; align-items:center; gap:20px; margin-top:20px; padding:16px 18px; border:1px solid #dde3ea; border-radius:14px; background:rgba(255,255,255,.96); box-shadow:0 8px 22px rgba(15,23,42,.07); }
.settings-savebar>div { display:flex; flex-direction:column; }.settings-savebar strong { color:#27364a; font-size:.86rem; }.settings-savebar small { color:#8a96a7; margin-top:2px; }
.settings-savebar .btn { min-width:165px; border-radius:10px; font-size:.9rem; }
.unit-price-calculator { padding:14px; border:1px solid #bfdbfe; border-radius:12px; background:#f8fbff; }
.unit-price-result { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:9px 11px; border-radius:9px; background:#eaf7ef; color:#166534; font-size:.76rem; }
.unit-price-result>strong { font-size:.92rem; }

@media (max-width:991.98px) {
  .settings-nav-card { position:static!important; }
  .settings-nav { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }
  .settings-help { display:none; }
}
@media (max-width:575.98px) {
  .settings-nav { grid-template-columns:1fr; }
  .settings-card-header,.settings-card-body { padding:17px; }
  .settings-savebar { align-items:stretch; flex-direction:column; }
  .settings-savebar .btn { width:100%; }
}

/* ── Cards ──────────────────────────────────────────── */
.card { border: none; border-radius: var(--card-radius); box-shadow: 0 2px 8px rgba(0,0,0,.06); }
.stat-card { border-radius: var(--card-radius); padding: 20px; color: #fff; position: relative; overflow: hidden; }
.stat-card .stat-icon { font-size: 2.5rem; opacity: .25; position: absolute; right: 16px; top: 50%; transform: translateY(-50%); }
.stat-card .stat-value { font-size: 1.5rem; font-weight: 800; }
.stat-card .stat-label { font-size: .8rem; opacity: .85; }
.stat-card.blue   { background: linear-gradient(135deg,#0d6efd,#4dabf7); }
.stat-card.green  { background: linear-gradient(135deg,#198754,#51cf66); }
.stat-card.orange { background: linear-gradient(135deg,#fd7e14,#ffa94d); }
.stat-card.red    { background: linear-gradient(135deg,#dc3545,#ff6b6b); }
.stat-card.purple { background: linear-gradient(135deg,#6f42c1,#b197fc); }
.stat-card.teal   { background: linear-gradient(135deg,#20c997,#63e6be); }
.stat-card.pink   { background: linear-gradient(135deg,#d63384,#f783ac); }
.stat-card.dark   { background: linear-gradient(135deg,#343a40,#6c757d); }
.stat-card.indigo { background: linear-gradient(135deg,#3d5a80,#6c93c3); }
.stat-card.cyan   { background: linear-gradient(135deg,#0dcaf0,#74c0fc); }

/* ── Tables ─────────────────────────────────────────── */
.table th { background: #f8f9fa; font-weight: 600; font-size: .825rem; white-space: nowrap; border-bottom: 2px solid #dee2e6; }
.table td { font-size: .875rem; vertical-align: middle; }
.table-hover tbody tr:hover { background: #f0f7ff; }
.table-actions { white-space: nowrap; }
.table-actions .btn { padding: 3px 8px; font-size: .775rem; }

/* ── Badges ─────────────────────────────────────────── */
.status-badge { font-size: .72rem; padding: 3px 8px; border-radius: 20px; font-weight: 600; }

/* ── Forms ──────────────────────────────────────────── */
.form-label { font-weight: 600; font-size: .85rem; margin-bottom: 4px; }
.form-control, .form-select { border-radius: 8px; font-size: .875rem; }
.form-control:focus, .form-select:focus { box-shadow: 0 0 0 .15rem rgba(13,110,253,.2); border-color: var(--primary); }
.input-group-text { background: #f8f9fa; }

/* ── Quick Action Buttons ───────────────────────────── */
.quick-action-btn {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 6px; padding: 16px 10px; border-radius: 12px; text-decoration: none;
  font-size: .8rem; font-weight: 600; border: 2px solid transparent; transition: all .2s;
  min-height: 80px;
}
.quick-action-btn:hover { transform: translateY(-3px); box-shadow: 0 6px 20px rgba(0,0,0,.1); }
.quick-action-btn i { font-size: 1.6rem; }

/* ── POS ────────────────────────────────────────────── */
.pos-wrapper { display: grid; grid-template-columns: 1fr 420px; gap: 16px; height: calc(100vh - var(--navbar-height) - 48px - 2px); }
.pos-left { display: flex; flex-direction: column; overflow: hidden; }
.pos-right { display: flex; flex-direction: column; background: #fff; border-radius: var(--card-radius); box-shadow: 0 2px 8px rgba(0,0,0,.08); overflow: hidden; }
.pos-search-bar { position: sticky; top: 0; background: #fff; padding: 12px; border-bottom: 1px solid #e9ecef; z-index: 10; }
.pos-results { overflow-y: auto; flex: 1; padding: 8px; }
.medicine-card {
  border: 1px solid #e9ecef; border-radius: 10px; padding: 10px 14px;
  cursor: pointer; transition: all .15s; margin-bottom: 6px;
  display: flex; justify-content: space-between; align-items: center;
}
.medicine-card:hover, .medicine-card:focus { border-color: var(--primary); background: #f0f7ff; outline: none; }
.med-name { font-weight: 600; font-size: .875rem; }
.med-info { font-size: .75rem; color: var(--text-muted); }
.med-price { font-weight: 700; color: var(--primary); }
.med-stock-badge { font-size: .72rem; padding: 2px 6px; border-radius: 10px; }
.pos-cart-header { padding: 12px 16px; border-bottom: 1px solid #e9ecef; background: #f8f9fa; font-weight: 700; }
.pos-cart-items { flex: 1; overflow-y: auto; }
.cart-item { padding: 8px 12px; border-bottom: 1px solid #f0f0f0; }
.cart-item-name { font-weight: 600; font-size: .825rem; }
.cart-item-detail { font-size: .75rem; color: var(--text-muted); }
.cart-unit-prices { margin-top:2px; color:#16805a; font-size:.66rem; font-weight:600; }
.cart-qty-input { width: 60px; text-align: center; padding: 2px 4px; font-size: .825rem; }
.pos-totals { padding: 12px 16px; border-top: 1px solid #e9ecef; background: #f8f9fa; }
.pos-total-row { display: flex; justify-content: space-between; align-items: center; margin-bottom: 4px; font-size: .875rem; }
.pos-grand-total { font-size: 1.25rem; font-weight: 800; color: var(--primary); }
.pos-footer { padding: 10px 12px; border-top: 1px solid #e9ecef; display: flex; gap: 8px; }

/* ── Login ──────────────────────────────────────────── */
.login-page { margin: 0; padding: 0; background: var(--body-bg); min-height: 100vh; }
.login-wrapper { display: flex; min-height: 100vh; }
.login-left {
  flex: 1; background: linear-gradient(135deg,#0d6efd 0%,#0dcaf0 100%);
  flex-direction: column; align-items: center; justify-content: center; padding: 40px;
}
.login-brand-block { color: #fff; text-align: center; max-width: 400px; }
.login-icon { font-size: 5rem; }
.login-brand-name { font-size: 2.5rem; font-weight: 800; margin: 16px 0 8px; }
.login-tagline { opacity: .85; font-size: 1.1rem; }
.login-features { list-style: none; padding: 0; margin-top: 24px; text-align: left; }
.login-features li { padding: 6px 0; font-size: .95rem; }
.login-right { width: 460px; display: flex; align-items: center; justify-content: center; padding: 40px; background: #fff; }
.login-box { width: 100%; max-width: 380px; }

/* Advanced pharmacy login */
.login-page { --login-navy:#082f49; --login-blue:#0284c7; --login-cyan:#06b6d4; background:#f5f8fb; color:#172033; }
.login-wrapper { min-height:100vh; overflow:hidden; }
.login-left { position:relative; width:58%; flex:1 1 58%; overflow:hidden; align-items:stretch; justify-content:stretch; padding:0; background:linear-gradient(145deg,#06324d 0%,#075985 48%,#0284c7 100%); }
.login-grid { position:absolute; inset:0; opacity:.09; background-image:linear-gradient(rgba(255,255,255,.6) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.6) 1px,transparent 1px); background-size:42px 42px; mask-image:linear-gradient(to bottom,black,transparent 85%); }
.login-orb { position:absolute; border-radius:50%; filter:blur(2px); pointer-events:none; }
.login-orb-one { width:430px; height:430px; top:-180px; right:-130px; background:rgba(34,211,238,.18); border:1px solid rgba(255,255,255,.12); }
.login-orb-two { width:300px; height:300px; bottom:-140px; left:-90px; background:rgba(14,165,233,.24); border:1px solid rgba(255,255,255,.1); }
.login-hero { position:relative; z-index:1; width:100%; max-width:850px; min-height:100vh; margin:0 auto; padding:48px clamp(45px,7vw,100px) 38px; display:flex; flex-direction:column; color:#fff; }
.login-hero-brand,.login-mobile-brand { display:flex; align-items:center; gap:13px; }
.login-medical-logo { width:48px; height:48px; display:grid; place-items:center; border-radius:14px; background:linear-gradient(145deg,#22d3ee,#fff); color:#075985; box-shadow:0 10px 30px rgba(3,19,30,.22); font-size:1.4rem; }
.login-hero-brand strong,.login-mobile-brand strong { display:block; font-size:1.02rem; letter-spacing:.01em; }
.login-hero-brand small,.login-mobile-brand small { display:block; margin-top:2px; color:rgba(255,255,255,.7); font-size:.7rem; letter-spacing:.045em; }
.login-hero-copy { max-width:650px; margin:auto 0 28px; padding-top:65px; }
.login-eyebrow { display:inline-flex; align-items:center; gap:7px; padding:7px 12px; border:1px solid rgba(255,255,255,.17); border-radius:999px; background:rgba(255,255,255,.09); color:#cffafe; backdrop-filter:blur(10px); font-size:.74rem; font-weight:700; letter-spacing:.035em; text-transform:uppercase; }
.login-hero-copy h1 { max-width:610px; margin:21px 0 17px; font-size:clamp(2.15rem,3.6vw,3.65rem); font-weight:800; line-height:1.09; letter-spacing:-.035em; }
.login-hero-copy p { max-width:600px; margin:0; color:rgba(240,249,255,.78); font-size:1rem; line-height:1.75; }
.login-feature-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:11px; max-width:650px; }
.login-feature-grid article { display:flex; align-items:center; gap:12px; min-height:72px; padding:13px 15px; border:1px solid rgba(255,255,255,.12); border-radius:14px; background:rgba(255,255,255,.075); backdrop-filter:blur(8px); }
.login-feature-grid article>span { width:39px; height:39px; display:grid; place-items:center; flex:0 0 39px; border-radius:10px; background:rgba(165,243,252,.15); color:#a5f3fc; font-size:1rem; }
.login-feature-grid strong { display:block; font-size:.82rem; }.login-feature-grid small { display:block; margin-top:3px; color:rgba(255,255,255,.62); font-size:.69rem; }
.login-hero-footer { display:flex; align-items:center; flex-wrap:wrap; gap:22px; margin-top:auto; padding-top:30px; color:rgba(255,255,255,.6); font-size:.69rem; }
.login-hero-footer span { display:flex; align-items:center; gap:6px; }
.login-right { position:relative; width:42%; min-width:470px; flex:0 0 42%; min-height:100vh; padding:54px clamp(38px,5vw,76px) 32px; flex-direction:column; background:#fff; }
.login-box { width:100%; max-width:455px; margin:auto; }
.login-welcome { margin-bottom:30px; }
.login-secure-badge { display:inline-flex; align-items:center; gap:6px; margin-bottom:14px; padding:6px 10px; border-radius:999px; background:#ecfdf5; color:#047857; font-size:.7rem; font-weight:750; text-transform:uppercase; letter-spacing:.04em; }
.login-welcome h2 { margin:0 0 8px; color:#102a43; font-size:2rem; font-weight:800; letter-spacing:-.025em; }
.login-welcome p { margin:0; color:#7b8798; font-size:.88rem; }
.login-form .form-label { color:#34465a; font-size:.78rem; font-weight:750; }
.login-input-wrap { position:relative; }
.login-input-wrap .form-control { height:52px; padding:0 47px; border:1px solid #dce3ea; border-radius:11px; background:#fbfcfe; color:#172033; font-size:.86rem; transition:.18s ease; }
.login-input-wrap .form-control::placeholder { color:#a7b1be; }
.login-input-wrap .form-control:focus { border-color:#38bdf8; background:#fff; box-shadow:0 0 0 4px rgba(14,165,233,.1); }
.login-input-icon { position:absolute; z-index:2; top:50%; left:16px; transform:translateY(-50%); color:#8391a2; font-size:1rem; }
.login-password-toggle { position:absolute; z-index:3; top:50%; right:8px; width:36px; height:36px; transform:translateY(-50%); border:0; border-radius:8px; background:transparent; color:#718096; }
.login-password-toggle:hover { background:#eef6fb; color:#0284c7; }
.login-forgot-link { color:#0284c7; font-size:.75rem; font-weight:700; text-decoration:none; }.login-forgot-link:hover { color:#0369a1; text-decoration:underline; }
.login-options { display:flex; align-items:center; justify-content:space-between; gap:10px; margin:19px 0 23px; color:#677789; font-size:.74rem; }
.login-options .form-check { margin:0; }.login-options .form-check-input { border-color:#b9c4d0; }.login-options .form-check-input:checked { background-color:#0284c7; border-color:#0284c7; }
.login-options>span { color:#94a3b8; font-size:.68rem; }.login-options>span i { color:#10b981; }
.login-submit-btn { width:100%; height:52px; display:flex; align-items:center; justify-content:center; gap:12px; border:0; border-radius:11px; background:linear-gradient(100deg,#0369a1,#0891b2); color:#fff; box-shadow:0 10px 24px rgba(3,105,161,.23); font-size:.88rem; font-weight:750; transition:.2s ease; }
.login-submit-btn:hover,.login-submit-btn:focus { color:#fff; transform:translateY(-1px); box-shadow:0 13px 28px rgba(3,105,161,.3); }.login-submit-btn i { transition:transform .2s; }.login-submit-btn:hover i { transform:translateX(3px); }
.login-alert { display:flex; align-items:flex-start; gap:11px; border:0; border-radius:11px; padding:12px 14px; font-size:.75rem; }.login-alert>i { font-size:1rem; }.login-alert strong,.login-alert span { display:block; }.login-alert span { margin-top:2px; opacity:.78; }
.login-support { display:flex; align-items:center; gap:12px; margin-top:28px; padding:13px 14px; border:1px solid #e7edf2; border-radius:12px; background:#f8fafc; }
.login-support-icon { width:36px; height:36px; display:grid; place-items:center; flex:0 0 36px; border-radius:9px; background:#e0f2fe; color:#0369a1; }
.login-support small,.login-support strong { display:block; }.login-support small { color:#8b98a8; font-size:.67rem; }.login-support strong { margin-top:2px; color:#526276; font-size:.73rem; }
.login-footer { width:100%; max-width:455px; display:flex; justify-content:space-between; gap:16px; margin:34px auto 0; color:#9aa6b4; font-size:.66rem; }.login-footer strong { color:#677789; }
.login-mobile-brand { width:100%; max-width:455px; margin:0 auto 32px; }.login-mobile-brand .login-medical-logo { width:43px; height:43px; flex:0 0 43px; }.login-mobile-brand strong { color:#12314a; }.login-mobile-brand small { color:#8a98a8; }

@media (max-width:1199.98px) {
  .login-left { width:54%; flex-basis:54%; }.login-right { width:46%; flex-basis:46%; min-width:440px; padding-left:42px; padding-right:42px; }
  .login-hero { padding-left:50px; padding-right:50px; }.login-hero-copy h1 { font-size:2.55rem; }
}
@media (max-width:991.98px) {
  .login-wrapper { display:block; min-height:100vh; }.login-right { width:100%; min-width:0; min-height:100vh; padding:35px 24px 24px; }
  .login-box { margin:auto; }.login-footer { margin-top:auto; padding-top:34px; }
}
@media (max-width:575.98px) {
  .login-right { padding:25px 19px 20px; justify-content:flex-start; }.login-mobile-brand { margin-bottom:42px; }
  .login-welcome { margin-bottom:25px; }.login-welcome h2 { font-size:1.72rem; }.login-input-wrap .form-control { height:50px; }
  .login-options>span { display:none; }.login-footer { flex-direction:column; align-items:center; text-align:center; gap:4px; margin-top:30px; }
}

/* ── Charts ─────────────────────────────────────────── */
.chart-container { position: relative; height: 260px; }

/* ── Misc ───────────────────────────────────────────── */
.badge { font-weight: 600; }
.btn { border-radius: 8px; font-weight: 500; }
.btn-sm { font-size: .8rem; }
.modal-header { border-bottom-color: #e9ecef; }
.modal-footer { border-top-color: #e9ecef; }
.alert { border-radius: 10px; border: none; }
.alert-success { background: #d1e7dd; color: #0a3622; }
.alert-danger  { background: #f8d7da; color: #58151c; }
.alert-warning { background: #fff3cd; color: #664d03; }
.alert-info    { background: #cff4fc; color: #055160; }
.table-card { border-radius: var(--card-radius); overflow: hidden; box-shadow: 0 2px 8px rgba(0,0,0,.06); }
.table-card .table { margin-bottom: 0; }
.section-title { font-size: 1rem; font-weight: 700; margin-bottom: 0; }
.expiry-critical { background: #fff5f5; }
.expiry-warning  { background: #fffbf0; }

/* ── Responsive ─────────────────────────────────────── */
@media (max-width: 991.98px) {
  .sidebar { transform: translateX(calc(-1 * var(--sidebar-width))); }
  .main-wrapper { margin-left: 0; }
  body.sidebar-open .sidebar { transform: translateX(0); }
  body.sidebar-open .sidebar-overlay { display: block; }
  .sidebar-overlay { display: none; position: fixed; inset: 0; background: rgba(0,0,0,.5); z-index: 1039; }
  .pos-wrapper { grid-template-columns: 1fr; grid-template-rows: 1fr auto; height: auto; }
  .global-search { width: 160px; }
  .global-search:focus { width: 200px; }
  .login-right { width: 100%; }
}
@media (max-width: 575.98px) {
  .page-content { padding: 12px; }
  .stat-card .stat-value { font-size: 1.1rem; }
}

/* Standalone POS workspace */
.pos-page { margin: 0; overflow: hidden; background: #eef2f7; }
.pos-shell { display: flex; height: 100dvh; min-height: 0; overflow: hidden; }
.pos-sidebar { width: 60px; background: #172033; display: flex; flex-direction: column; align-items: center; padding: 12px 0; gap: 8px; flex: 0 0 60px; }
.pos-sidebar a { display: grid; place-items: center; width: 40px; height: 40px; transition: background .15s, color .15s; }
.pos-sidebar a:hover, .pos-sidebar a:focus-visible { color: #fff !important; background: rgba(255,255,255,.12); outline: none; }
.pos-main { flex: 1; min-width: 0; min-height: 0; display: flex; flex-direction: column; overflow: hidden; }
.pos-topbar { min-height: 52px; background: #fff; border-bottom: 1px solid #dde3ea; display: flex; align-items: center; padding: 0 16px; gap: 12px; flex-shrink: 0; box-shadow: 0 1px 4px rgba(15,23,42,.04); }
.pos-workspace { flex: 1; min-height: 0; overflow: hidden; display: grid; grid-template-columns: minmax(360px,1fr) minmax(380px,430px); }
.pos-workspace .pos-left { display: flex; flex-direction: column; min-width: 0; min-height: 0; overflow: hidden; border-right: 1px solid #dde3ea; }
.pos-workspace .pos-right { display: flex; flex-direction: column; min-width: 0; min-height: 0; background: #fff; border-radius: 0; box-shadow: none; overflow: hidden; }
.pos-workspace .pos-search-bar { position: static; background: #f8fafc; padding: 14px; border-bottom: 1px solid #dde3ea; flex-shrink: 0; }
.pos-customer-bar { padding: 10px 12px; border-bottom: 1px solid #e9ecef; background: #f8fafc; flex-shrink: 0; }
.pos-workspace .pos-cart-header { padding: 9px 12px; background: #172033; color: #fff; border-bottom: 1px solid #253149; font-size: .75rem; flex-shrink: 0; }
.pos-workspace .pos-cart-items { padding: 4px 0; min-height: 0; }
.pos-workspace .pos-totals { padding: 10px 12px; flex-shrink: 0; }
.pos-payment-panel { padding: 10px 12px; border-top: 1px solid #e9ecef; flex-shrink: 0; background: #fff; }
.pos-payment-panel .pay-btn { flex: 1 1 28%; min-height: 34px; }
.pos-payment-panel #checkoutBtn { min-height: 42px; }

@media (max-width: 991.98px) {
  .pos-workspace { grid-template-columns: minmax(300px,1fr) minmax(340px,44%); }
}

@media (max-width: 575.98px) {
  .pos-page { overflow: auto; }
  .pos-shell { min-height: 100dvh; height: auto; padding-bottom: 56px; }
  .pos-sidebar { position: fixed; z-index: 1040; left: 0; right: 0; bottom: 0; width: 100%; height: 56px; padding: 6px 10px; flex-direction: row; justify-content: space-around; box-shadow: 0 -2px 12px rgba(15,23,42,.15); }
  .pos-sidebar div { display: none; }
  .pos-main { overflow: visible; }
  .pos-topbar { min-height: 50px; padding: 0 10px; }
  .pos-topbar > .text-muted:not(#posTime), .pos-topbar #posTime { display: none; }
  .pos-workspace { display: flex; flex-direction: column; overflow: visible; }
  .pos-workspace .pos-left, .pos-workspace .pos-right { overflow: visible; border-right: 0; }
  .pos-workspace .pos-left { min-height: 42vh; border-bottom: 6px solid #eef2f7; }
  .pos-workspace .pos-results { max-height: 38vh; }
  .pos-workspace .pos-cart-items { min-height: 120px; max-height: 38vh; }
  .pos-workspace .pos-cart-header { display: none !important; }
}