/* Atiyeh admin prototype — local-only styles. See design-system/atiyeh/ADMIN.md. */
:root {
  --a-page: #f1f7f7;
  --a-surface: #fff;
  --a-surface-soft: #f8fbfb;
  --a-ink: #17343a;
  --a-text: #405a60;
  --a-muted: #5b7074;
  --a-line: #e1ebeb;
  --a-line-strong: #c6d7d8;
  --a-primary: #25868d;
  --a-primary-deep: #1d6f78;
  --a-primary-soft: #e7f5f3;
  --a-success: #187a58;
  --a-success-soft: #e9f6ef;
  --a-warning: #a86616;
  --a-warning-soft: #fff4df;
  --a-danger: #b94c50;
  --a-danger-soft: #fcedec;
  --a-gradient: linear-gradient(125deg, #26858d 0%, #45a99f 56%, #68c2a5 100%);
  --a-page-glow: radial-gradient(ellipse at 85% 0%, rgba(111, 197, 180, .16), transparent 38%),
    radial-gradient(ellipse at 8% 88%, rgba(82, 167, 186, .11), transparent 32%);
  --a-shadow-sm: 0 6px 20px rgba(28, 77, 82, .06);
  --a-shadow-modal: 0 28px 80px rgba(14, 49, 54, .22);
  --a-font: "Segoe UI", Tahoma, sans-serif;
  --a-fast: 160ms ease;
  --a-radius-control: 12px;
  --a-radius-card: 22px;
  --a-radius-modal: 26px;
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }
html { min-width: 320px; background: var(--a-page); }
body { margin: 0; color: var(--a-ink); background: var(--a-page); font: 400 14px/1.75 var(--a-font); -webkit-font-smoothing: antialiased; }
button, input, select { font: inherit; }
button, a, input, select { touch-action: manipulation; }
button { color: inherit; }
a { color: inherit; text-decoration: none; }
h1, h2, h3, p { margin: 0; }
svg { display: block; }
.ic { width: 20px; height: 20px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
:focus-visible { outline: 3px solid rgba(37, 134, 141, .38); outline-offset: 3px; }
.skip { position: absolute; z-index: 80; inset-inline-start: 16px; top: -64px; padding: 8px 14px; border-radius: 10px; color: var(--a-ink); background: var(--a-surface); box-shadow: var(--a-shadow-sm); }
.skip:focus { top: 12px; }

.admin-screen { min-height: 100vh; background: var(--a-page-glow), var(--a-page); }
.admin-layout { display: grid; grid-template-columns: 264px minmax(0, 1fr); min-height: 100vh; }
.admin-sidebar { position: sticky; inset-block-start: 0; display: flex; flex-direction: column; min-height: 100vh; height: 100vh; padding: 28px 18px 20px; background: rgba(255,255,255,.92); border-inline-start: 1px solid var(--a-line); }
.brand { display: inline-flex; align-items: center; gap: 12px; padding: 6px 10px 30px; color: var(--a-ink); }
.brand-mark { position: relative; display: grid; place-items: center; width: 42px; height: 42px; border-radius: 15px; color: #fff; background: var(--a-gradient); box-shadow: 0 8px 18px rgba(37,134,141,.2); }
.brand-mark::before, .brand-mark::after { content: ""; position: absolute; width: 16px; height: 7px; border: 2px solid currentColor; border-radius: 8px; transform: rotate(-45deg); }
.brand-mark::after { transform: rotate(45deg); }
.brand-name { font-size: 20px; font-weight: 700; letter-spacing: -.04em; line-height: 1.25; }
.brand-caption { display: block; margin-top: 3px; color: var(--a-muted); font-size: 11px; font-weight: 500; letter-spacing: 0; }
.side-label { padding: 12px 14px 8px; color: var(--a-muted); font-size: 11px; font-weight: 700; letter-spacing: .06em; }
.side-nav { display: grid; gap: 6px; }
.side-link { position: relative; display: flex; align-items: center; gap: 12px; min-height: 48px; padding: 0 14px; border-radius: 14px; color: var(--a-text); font-weight: 600; transition: background var(--a-fast), color var(--a-fast), transform var(--a-fast); }
.side-link:hover { background: var(--a-surface-soft); color: var(--a-primary-deep); transform: translateX(-2px); }
.side-link[aria-current="page"] { color: #fff; background: var(--a-gradient); box-shadow: 0 8px 18px rgba(37,134,141,.18); }
.side-link[aria-current="page"] .ic { color: #fff; }
.side-link .ic { width: 19px; height: 19px; color: #789093; }
.side-spacer { flex: 1; }
.sidebar-note { margin: 22px 2px; padding: 16px; border: 1px solid #d9eeee; border-radius: 18px; background: linear-gradient(145deg, #effafa, #f6fbf7 80%); }
.sidebar-note b { display: block; margin-bottom: 3px; font-size: 13px; }
.sidebar-note p { color: var(--a-muted); font-size: 12px; line-height: 1.7; }
.staff-card { display: flex; align-items: center; gap: 10px; padding: 16px 8px 0; border-top: 1px solid var(--a-line); }
.staff-avatar { display: grid; place-items: center; width: 42px; height: 42px; flex: none; border: 1px solid #d9eeee; border-radius: 15px; color: var(--a-primary-deep); background: linear-gradient(145deg, #e1f5f1, #eef4ff); }
.staff-card b, .staff-card small { display: block; line-height: 1.55; }
.staff-card b { font-size: 13px; }
.staff-card small { color: var(--a-muted); font-size: 11px; }
.staff-more { display: grid; place-items: center; width: 38px; height: 38px; margin-inline-start: auto; border: 0; border-radius: 12px; color: var(--a-muted); background: transparent; cursor: pointer; }
.staff-more:hover { color: var(--a-primary); background: var(--a-primary-soft); }

.workspace { min-width: 0; }
.admin-header { display: flex; align-items: center; gap: 22px; min-height: 90px; padding: 16px clamp(22px, 3vw, 48px); border-bottom: 1px solid rgba(214,230,230,.8); background: rgba(255,255,255,.76); }
.header-title { min-width: 180px; margin-inline-end: auto; }
.header-title h1 { font-size: 22px; font-weight: 700; letter-spacing: -.03em; line-height: 1.4; }
.header-title p { color: var(--a-muted); font-size: 12px; }
.global-search { display: flex; align-items: center; gap: 10px; width: min(360px, 30vw); min-width: 190px; height: 46px; padding: 0 15px; border: 1px solid transparent; border-radius: 16px; color: var(--a-muted); background: #f2f7f7; transition: border-color var(--a-fast), background var(--a-fast), box-shadow var(--a-fast); }
.global-search:focus-within { border-color: #9bc9c8; background: #fff; box-shadow: 0 0 0 4px rgba(58,155,155,.09); }
.global-search .ic { width: 18px; height: 18px; }
.global-search input { width: 100%; min-width: 0; border: 0; outline: 0; color: var(--a-ink); background: transparent; font-size: 13px; }
.global-search input::placeholder { color: var(--a-muted); }
.header-profile { display: flex; align-items: center; gap: 10px; white-space: nowrap; }
.header-profile .staff-avatar { width: 42px; height: 42px; border: 0; border-radius: 50%; background: var(--a-gradient); color: #fff; }
.header-profile b, .header-profile small { display: block; line-height: 1.45; }
.header-profile b { font-size: 13px; }
.header-profile small { color: var(--a-muted); font-size: 11px; }
.header-actions { display: flex; gap: 8px; }
.icon-btn { position: relative; display: grid; place-items: center; width: 44px; height: 44px; border: 1px solid transparent; border-radius: 15px; color: var(--a-primary-deep); background: #e8f5f3; cursor: pointer; transition: transform var(--a-fast), background var(--a-fast), border-color var(--a-fast); }
.icon-btn:hover { transform: translateY(-1px); border-color: #cce6e3; background: #dff1ee; }
.icon-btn .ic { width: 19px; height: 19px; }
.notification-dot { position: absolute; inset-block-start: 8px; inset-inline-end: 9px; width: 7px; height: 7px; border: 2px solid #e8f5f3; border-radius: 50%; background: #e18a66; }
.page-content { width: min(100%, 1660px); margin-inline: auto; padding: 34px clamp(22px, 3vw, 48px) 64px; }
.page-intro { display: flex; align-items: flex-end; justify-content: space-between; gap: 22px; margin-bottom: 24px; }
.eyebrow { display: inline-flex; align-items: center; gap: 8px; margin-bottom: 5px; color: var(--a-primary-deep); font-size: 12px; font-weight: 700; }
.eyebrow::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: #5bb7a5; box-shadow: 0 0 0 4px rgba(91,183,165,.13); }
.page-intro h2 { font-size: 24px; font-weight: 700; letter-spacing: -.04em; line-height: 1.4; }
.page-intro p { margin-top: 5px; color: var(--a-muted); font-size: 13px; }
.action-row { display: flex; flex-wrap: wrap; gap: 10px; }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 9px; min-height: 44px; padding: 0 16px; border: 1px solid transparent; border-radius: var(--a-radius-control); font-size: 13px; font-weight: 700; line-height: 1; white-space: nowrap; cursor: pointer; transition: transform var(--a-fast), box-shadow var(--a-fast), color var(--a-fast), background var(--a-fast), border-color var(--a-fast); }
.btn .ic { width: 17px; height: 17px; }
.btn:hover:not(:disabled) { transform: translateY(-1px); }
.btn-primary { color: #fff; background: var(--a-gradient); box-shadow: 0 7px 16px rgba(37,134,141,.18); }
.btn-primary:hover:not(:disabled) { box-shadow: 0 10px 20px rgba(37,134,141,.24); }
.btn-secondary { color: var(--a-primary-deep); border-color: #cfe4e2; background: linear-gradient(135deg, #fff, #f3fbfa); }
.btn-secondary:hover:not(:disabled) { border-color: #9fc9c6; background: #eff9f7; }
.btn-quiet { color: var(--a-text); background: transparent; }
.btn-quiet:hover:not(:disabled) { background: var(--a-primary-soft); }
.btn:disabled { color: #91a3a4; background: #edf2f2; box-shadow: none; cursor: not-allowed; }
.btn-sm { min-height: 38px; padding-inline: 13px; font-size: 12px; }

.date-context { margin-top: 4px; color: var(--a-muted); font-size: 12px; font-weight: 600; }
.upload-status { min-height: 0; margin: -14px 0 12px; color: var(--a-primary-deep); font-size: 11px; }
.upload-status:empty { display: none; }
.upload-status.is-error { color: var(--a-danger); }
.day-control { display: flex; align-items: center; gap: 8px; }
.day-meta { min-width: 230px; padding-inline: 8px; text-align: center; }
.day-meta strong { display: block; font-size: 15px; font-weight: 700; }
.day-meta small { color: var(--a-muted); font-size: 11px; }
.day-arrow { display: grid; place-items: center; width: 38px; height: 38px; border: 1px solid var(--a-line); border-radius: 12px; color: var(--a-text); background: var(--a-surface); cursor: pointer; transition: border-color var(--a-fast), background var(--a-fast); }
.day-arrow:hover { border-color: #a8cecb; color: var(--a-primary-deep); background: #f3fbfa; }
.date-actions { display: flex; align-items: center; gap: 9px; }
.today-btn { min-height: 38px; padding-inline: 13px; border: 1px solid var(--a-line); border-radius: 11px; color: var(--a-primary-deep); background: #fff; font-size: 12px; font-weight: 700; cursor: pointer; }
.today-btn:hover { background: var(--a-primary-soft); }

.summary-row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-bottom: 14px; }
.summary-card { position: relative; overflow: hidden; display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 68px; padding: 11px 14px; border: 1px solid var(--a-line); border-radius: 16px; background: linear-gradient(120deg, rgba(255,255,255,.97), rgba(247,252,251,.95)); box-shadow: var(--a-shadow-sm); }
.summary-card::after { content: ""; position: absolute; inset-inline-end: -26px; inset-block-end: -42px; width: 100px; height: 100px; border-radius: 50%; background: radial-gradient(circle, rgba(99,193,172,.18), transparent 70%); }
.summary-card span { display: block; color: var(--a-muted); font-size: 11px; }
.summary-card strong { display: block; margin-top: 1px; font-size: 20px; line-height: 1.3; }
.summary-icon { z-index: 1; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 12px; color: var(--a-primary); background: var(--a-primary-soft); }
.summary-icon .ic { width: 20px; height: 20px; }

.table-panel { overflow: hidden; border: 1px solid var(--a-line); border-radius: var(--a-radius-card); background: rgba(255,255,255,.96); box-shadow: 0 12px 34px rgba(28,77,82,.055); }
.table-panel-head { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 20px 22px 14px; }
.table-title { display: flex; align-items: center; gap: 11px; min-width: 170px; }
.table-title-mark { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 13px; color: var(--a-primary-deep); background: linear-gradient(145deg, #e3f6f2, #edf6fa); }
.table-title-mark .ic { width: 18px; height: 18px; }
.table-title h3 { font-size: 15px; font-weight: 700; }
.table-title p { color: var(--a-muted); font-size: 11px; }
.filter-row { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.filter-select { min-width: 124px; height: 38px; padding: 0 12px; border: 1px solid #d8e9e7; border-radius: 12px; outline: 0; color: #477076; background: linear-gradient(135deg, #f0faf8, #edf7f8); font-size: 12px; font-weight: 600; cursor: pointer; }
.filter-select:focus { border-color: #76b5b4; box-shadow: 0 0 0 3px rgba(48,145,146,.1); }
.filter-state { display: flex; align-items: center; gap: 8px; min-height: 42px; padding: 0 22px; color: var(--a-muted); font-size: 12px; }
.filter-state button { padding: 0; border: 0; color: var(--a-primary-deep); background: transparent; font-size: 12px; font-weight: 700; cursor: pointer; }
.selection-bar { display: flex; align-items: center; gap: 10px; margin: 0 20px 12px; padding: 10px 12px; border: 1px solid #cde6e1; border-radius: 14px; background: linear-gradient(110deg, #effaf7, #f1f8fb); }
.selection-bar[hidden] { display: none; }
.selection-count { margin-inline-end: auto; color: var(--a-primary-deep); font-size: 12px; font-weight: 700; }
.table-scroll { overflow-x: auto; border-top: 1px solid var(--a-line); }
.appointment-table { width: 100%; min-width: 0; border-collapse: separate; border-spacing: 0; table-layout: fixed; }
.appointment-table th { height: 42px; padding: 0 8px; color: var(--a-muted); background: #f7fafa; font-size: 10px; font-weight: 700; text-align: start; white-space: nowrap; }
.appointment-table th:first-child, .appointment-table td:first-child { width: 34px; padding-inline-start: 12px; }
.appointment-table th:nth-child(2) { width: 108px; }
.appointment-table th:nth-child(3) { width: 12%; }
.appointment-table th:nth-child(4) { width: 12%; }
.appointment-table th:nth-child(5) { width: 80px; }
.appointment-table th:nth-child(6) { width: 90px; }
.appointment-table th:nth-child(7) { width: 110px; }
.appointment-table th:last-child, .appointment-table td:last-child { width: 112px; padding-inline-end: 12px; text-align: end; }
.appointment-table td { height: 56px; padding: 7px 8px; border-top: 1px solid #edf2f2; color: var(--a-text); font-size: 12px; vertical-align: middle; }
.appointment-table tbody tr { transition: background var(--a-fast); }
.appointment-table tbody tr:hover { background: #f8fcfb; }
.appointment-table tbody tr.is-selected { background: linear-gradient(90deg, rgba(233,248,245,.85), rgba(248,252,251,.75)); }
.check { width: 17px; height: 17px; accent-color: var(--a-primary); vertical-align: middle; cursor: pointer; }
.patient-cell { display: flex; align-items: center; min-width: 0; }
.patient-name { min-width: 0; }
.patient-name b, .patient-name small, .doctor-cell b, .doctor-cell small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.patient-name b, .doctor-cell b { color: var(--a-ink); font-size: 12px; font-weight: 700; }
.patient-name small, .doctor-cell small { color: var(--a-muted); font-size: 11px; }
.time-cell { color: var(--a-ink); font-size: 11px; font-weight: 700; white-space: nowrap; }
.time-cell span, .time-cell small { display: block; }
.time-cell small { margin-top: 1px; color: var(--a-muted); font-size: 10px; font-weight: 500; direction: ltr; text-align: right; }
.service-cell { color: var(--a-text); font-size: 12px; }
.status-badge, .link-badge { display: inline-flex; align-items: center; gap: 6px; width: fit-content; min-height: 27px; padding: 3px 10px; border-radius: 999px; font-size: 11px; font-weight: 700; white-space: nowrap; }
.status-badge::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.status-confirmed { color: var(--a-success); background: var(--a-success-soft); }
.status-pending { color: var(--a-warning); background: var(--a-warning-soft); }
.status-new { color: var(--a-primary-deep); background: var(--a-primary-soft); }
.status-cancelled { color: var(--a-danger); background: var(--a-danger-soft); }
.link-badge { padding-inline: 0; color: var(--a-muted); background: transparent; font-weight: 600; }
.link-badge .ic { width: 15px; height: 15px; }
.link-sent { color: var(--a-primary-deep); }
.link-open { color: var(--a-success); }
.row-action { min-height: 31px; padding: 0 8px; border: 1px solid #d1e5e3; border-radius: 9px; color: var(--a-primary-deep); background: #fff; font-size: 10px; font-weight: 700; cursor: pointer; }
.row-action:hover { background: var(--a-primary-soft); }
.table-footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 20px; border-top: 1px solid var(--a-line); color: var(--a-muted); font-size: 11px; }
.pager { display: flex; align-items: center; gap: 6px; }
.pager button { display: grid; place-items: center; width: 34px; height: 34px; border: 1px solid var(--a-line); border-radius: 10px; color: var(--a-text); background: #fff; cursor: pointer; }
.pager button[aria-current="page"] { border-color: transparent; color: #fff; background: var(--a-gradient); }
.pager button:disabled { opacity: .45; cursor: not-allowed; }

.empty-state { display: grid; justify-items: center; min-height: 360px; padding: 54px 24px; text-align: center; }
.empty-illustration { position: relative; display: grid; place-items: center; width: 92px; height: 92px; margin-bottom: 19px; border: 1px solid #d4eae6; border-radius: 29px; color: var(--a-primary); background: linear-gradient(145deg, #e6f8f4, #eff5fb); box-shadow: inset 0 0 0 8px rgba(255,255,255,.55); }
.empty-illustration::after { content: ""; position: absolute; inset: 14px; border: 1px dashed rgba(37,134,141,.24); border-radius: 20px; }
.empty-illustration .ic { width: 34px; height: 34px; }
.empty-state h3 { font-size: 18px; font-weight: 700; }
.empty-state p { max-width: 420px; margin-top: 7px; color: var(--a-muted); font-size: 13px; }
.empty-state .action-row { justify-content: center; margin-top: 20px; }
.empty-note { margin-top: 13px; color: var(--a-muted); font-size: 11px; }

.modal-backdrop { position: fixed; z-index: 50; inset: 0; display: grid; place-items: center; padding: 20px; background: rgba(15,43,48,.42); backdrop-filter: blur(6px); animation: veil-in 150ms ease-out; }
.modal-backdrop[hidden] { display: none; }
.modal { width: min(100%, 600px); max-height: min(88vh, 780px); overflow: auto; padding: 26px; border: 1px solid rgba(255,255,255,.78); border-radius: var(--a-radius-modal); background: var(--a-surface); box-shadow: var(--a-shadow-modal); animation: modal-in 190ms cubic-bezier(.2,.8,.2,1); }
.modal-calendar { width: min(100%, 520px); }
.modal-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 20px; }
.modal-head h2 { font-size: 19px; font-weight: 700; }
.modal-head p { margin-top: 4px; color: var(--a-muted); font-size: 12px; }
.modal-close { display: grid; place-items: center; width: 38px; height: 38px; border: 1px solid var(--a-line); border-radius: 12px; color: var(--a-muted); background: #fff; cursor: pointer; }
.modal-close:hover { color: var(--a-danger); background: var(--a-danger-soft); }
.calendar-heading { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; }
.calendar-heading strong { margin-inline-end: auto; font-size: 16px; }
.calendar-grid { display: grid; grid-template-columns: repeat(7, minmax(0,1fr)); gap: 5px; }
.calendar-grid [role="row"] { display: contents; }
.calendar-weekday { display: grid; place-items: center; min-height: 33px; color: var(--a-muted); font-size: 11px; font-weight: 700; }
.calendar-day { position: relative; display: grid; place-items: center; min-height: 52px; border: 1px solid transparent; border-radius: 14px; color: var(--a-text); background: transparent; font-size: 13px; cursor: pointer; transition: background var(--a-fast), border-color var(--a-fast), color var(--a-fast), transform var(--a-fast); }
.calendar-day:hover { transform: translateY(-1px); border-color: #d1e8e4; background: #f4fbf9; }
.calendar-day.is-today { color: var(--a-primary-deep); font-weight: 800; }
.calendar-day.is-selected { color: #fff; background: var(--a-gradient); box-shadow: 0 6px 14px rgba(37,134,141,.2); }
.calendar-day.is-outside { color: #b7c4c5; }
.calendar-day.has-appointments::after { content: ""; position: absolute; inset-block-end: 6px; width: 4px; height: 4px; border-radius: 50%; background: #5bb7a5; }
.calendar-day.is-selected.has-appointments::after { background: #fff; }
.calendar-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--a-line); color: var(--a-muted); font-size: 11px; }
.calendar-key { display: inline-flex; align-items: center; gap: 7px; }
.calendar-key i { width: 6px; height: 6px; border-radius: 50%; background: #5bb7a5; }

.drop-zone { display: grid; justify-items: center; min-height: 210px; padding: 26px; border: 1.5px dashed #a8cfcb; border-radius: 20px; text-align: center; background: linear-gradient(145deg, #f1fbf9, #f6fafc); transition: border-color var(--a-fast), background var(--a-fast); }
.drop-zone.is-over { border-color: var(--a-primary); background: #e8f7f3; }
.drop-icon { display: grid; place-items: center; width: 54px; height: 54px; margin-bottom: 12px; border-radius: 18px; color: var(--a-primary); background: #fff; box-shadow: var(--a-shadow-sm); }
.drop-icon .ic { width: 24px; height: 24px; }
.drop-zone b { font-size: 14px; }
.drop-zone p { margin-top: 4px; color: var(--a-muted); font-size: 12px; }
.drop-zone input { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); clip-path: inset(50%); white-space: nowrap; border: 0; }
.drop-zone:focus-within { border-color: var(--a-primary); box-shadow: 0 0 0 4px rgba(37,134,141,.12); }
.file-state { display: flex; align-items: center; gap: 10px; margin-top: 14px; padding: 11px 13px; border: 1px solid var(--a-line); border-radius: 13px; background: var(--a-surface-soft); font-size: 12px; }
.file-state .ic { color: var(--a-primary); }
.file-state span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.upload-help { margin-top: 14px; color: var(--a-muted); font-size: 11px; }
.modal-actions { display: flex; justify-content: flex-end; gap: 9px; margin-top: 20px; }
.confirm-copy { padding: 15px; border: 1px solid var(--a-line); border-radius: 16px; color: var(--a-text); background: var(--a-surface-soft); font-size: 13px; }
.confirm-copy strong { color: var(--a-ink); }
.toast { position: fixed; z-index: 100; inset-inline-start: 24px; inset-block-end: 24px; display: flex; align-items: center; gap: 10px; max-width: min(420px, calc(100vw - 32px)); padding: 13px 16px; border: 1px solid rgba(255,255,255,.8); border-radius: 15px; color: #fff; background: linear-gradient(120deg, #173f45, #24747a); box-shadow: var(--a-shadow-modal); animation: modal-in 180ms ease-out; }
.toast .ic { width: 18px; height: 18px; color: #a9ead6; }

.login-screen { display: grid; min-height: 100vh; place-items: center; padding: 34px; background: var(--a-page-glow), var(--a-page); }
.login-layout { display: grid; place-items: center; width: min(100%, 500px); min-height: 0; overflow: hidden; padding: clamp(26px, 5vw, 52px); border: 1px solid rgba(212,231,229,.9); border-radius: 30px; background: #fff; box-shadow: 0 26px 80px rgba(28,77,82,.12); }
.login-form-side { display: grid; align-content: center; width: 100%; }
.login-form-side .brand { padding: 0; margin-bottom: 36px; }
.login-form-side h1 { font-size: 25px; font-weight: 700; }
.login-form-side > p { margin-top: 6px; margin-bottom: 26px; color: var(--a-muted); font-size: 13px; }
.field { display: grid; gap: 7px; margin-bottom: 17px; }
.field label { font-size: 12px; font-weight: 700; }
.field-control { display: flex; align-items: center; gap: 10px; min-height: 48px; padding: 0 13px; border: 1px solid var(--a-line-strong); border-radius: 13px; color: var(--a-muted); background: #fff; transition: border-color var(--a-fast), box-shadow var(--a-fast); }
.field-control:focus-within { border-color: #78b7b4; box-shadow: 0 0 0 4px rgba(58,155,155,.1); }
.field-control .ic { width: 18px; height: 18px; }
.field-control input { width: 100%; border: 0; outline: 0; color: var(--a-ink); background: transparent; font-size: 13px; }
.field-control input::placeholder { color: var(--a-muted); }
.login-meta { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin: 4px 0 22px; color: var(--a-muted); font-size: 12px; }
.login-meta label { display: inline-flex; align-items: center; gap: 7px; cursor: pointer; }
.login-meta a { color: var(--a-primary-deep); font-weight: 700; }
.login-form-side .btn { width: 100%; min-height: 48px; }
.login-foot { margin-top: 20px; color: var(--a-muted); font-size: 11px; text-align: center; }
.field-error { min-height: 17px; color: var(--a-danger); font-size: 11px; }

@keyframes veil-in { from { opacity: 0; } }
@keyframes modal-in { from { opacity: 0; transform: translateY(8px) scale(.99); } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; } }

@media (max-width: 1180px) {
  .admin-layout { grid-template-columns: 228px minmax(0,1fr); }
  .admin-sidebar { padding-inline: 14px; }
  .table-panel-head { align-items: flex-start; flex-direction: column; }
  .filter-row { justify-content: flex-start; width: 100%; }
}
@media (max-width: 900px) {
  .admin-layout { display: flex; flex-direction: column; }
  .admin-sidebar { position: static; min-height: auto; height: auto; padding: 12px 20px; border-inline-start: 0; border-bottom: 1px solid var(--a-line); }
  .brand { padding: 2px 6px 12px; }
  .side-label, .sidebar-note, .staff-card { display: none; }
  .side-spacer { display: none; }
  .side-nav { display: flex; gap: 6px; overflow-x: auto; padding-bottom: 2px; }
  .side-link { min-height: 42px; padding-inline: 13px; white-space: nowrap; }
  .admin-header { flex-wrap: wrap; gap: 12px; min-height: 0; padding: 15px 22px; }
  .header-title { min-width: 130px; }
  .global-search { width: min(100%, 320px); flex: 1 1 200px; }
  .page-content { padding-top: 26px; }
  .summary-row { gap: 9px; }
}
@media (max-width: 780px) {
  .admin-sidebar { padding-inline: 14px; }
  .brand { padding-bottom: 8px; }
  .brand-mark { width: 36px; height: 36px; border-radius: 13px; }
  .brand-name { font-size: 18px; }
  .admin-header { padding: 14px 16px; }
  .header-title { flex: 1; }
  .header-title h1 { font-size: 19px; }
  .global-search { order: 3; flex-basis: 100%; max-width: none; }
  .header-profile span:last-child { display: none; }
  .header-profile .staff-avatar { width: 38px; height: 38px; }
  .icon-btn { width: 40px; height: 40px; }
  .page-content { padding: 22px 14px 42px; }
  .page-intro { align-items: flex-start; flex-direction: column; gap: 16px; }
  .page-intro h2 { font-size: 21px; }
  .action-row { width: 100%; }
  .action-row .btn { flex: 1; }
  .date-toolbar { align-items: stretch; flex-direction: column; padding: 12px; }
  .day-control, .date-actions { justify-content: space-between; }
  .day-meta { min-width: 0; flex: 1; }
  .date-actions .btn { flex: 1; }
  .summary-row { grid-template-columns: 1fr 1fr; }
  .summary-card { min-height: 76px; padding: 12px; }
  .summary-card:last-child { grid-column: 1 / -1; }
  .summary-card strong { font-size: 20px; }
  .table-panel { border-radius: 18px; }
  .table-panel-head { padding: 16px 14px 12px; }
  .filter-row { display: grid; grid-template-columns: 1fr 1fr; }
  .filter-select { width: 100%; min-width: 0; }
  .table-scroll { overflow: visible; }
  .appointment-table, .appointment-table tbody { display: block; min-width: 0; width: 100%; }
  .appointment-table thead { display: none; }
  .appointment-table tr { position: relative; display: grid; grid-template-columns: 24px minmax(0,1fr) auto; gap: 4px 10px; padding: 13px 14px; border-top: 1px solid var(--a-line); }
  .appointment-table td, .appointment-table td:first-child, .appointment-table td:last-child { display: block; width: auto; height: auto; padding: 0; border: 0; text-align: start; }
  .appointment-table td:first-child { grid-column: 1; grid-row: 1 / span 4; padding-top: 8px; }
  .appointment-table td:nth-child(2) { grid-column: 3; grid-row: 1 / span 2; align-self: center; }
  .appointment-table td:nth-child(3) { grid-column: 2; grid-row: 1 / span 2; }
  .appointment-table td:nth-child(4) { grid-column: 2; grid-row: 3; }
  .appointment-table td:nth-child(5) { grid-column: 3; grid-row: 3; justify-self: end; }
  .appointment-table td:nth-child(6) { grid-column: 2; grid-row: 4; }
  .appointment-table td:nth-child(7) { grid-column: 3; grid-row: 4; justify-self: end; }
  .appointment-table td:nth-child(8) { grid-column: 2 / -1; grid-row: 5; padding-top: 6px; }
  .table-footer { align-items: flex-start; flex-direction: column; padding-inline: 14px; }
  .selection-bar { flex-wrap: wrap; margin-inline: 10px; }
  .selection-count { flex-basis: 100%; }
  .login-screen { padding: 14px; }
  .login-layout { display: grid; min-height: auto; padding: 24px 20px; border-radius: 24px; }
  .login-form-side { padding: 0; }
  .login-form-side .brand { margin-bottom: 24px; }
  .login-form-side h1 { font-size: 22px; }
  .modal { padding: 20px 16px; border-radius: 22px; }
  .calendar-day { min-height: 44px; border-radius: 11px; }
}

/* Excel review: maximize the table, keep the column headings visible, and scroll its rows. */
.modal.modal-wide { display: flex; flex-direction: column; width: min(92vw, 1100px); height: min(94vh, 960px); max-height: 94vh; overflow: hidden; padding: 8px 12px 0; }
.import-modal-bar { display: flex; align-items: center; justify-content: space-between; flex: 0 0 48px; min-height: 48px; }
.import-doc-info { display: flex; align-items: center; gap: 9px; min-width: 0; }
.import-doc-info > span:last-child { display: grid; min-width: 0; line-height: 1.45; }
.import-doc-info strong { overflow: hidden; color: var(--a-ink); font-size: 12px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.import-doc-info small { color: var(--a-muted); font-size: 10px; }
.import-doc-icon { display: grid; place-items: center; width: 32px; height: 32px; flex: 0 0 32px; border: 1px solid #cce4e0; border-radius: 10px; color: var(--a-primary); background: var(--a-primary-soft); }
.import-doc-icon .ic { width: 17px; height: 17px; }
.import-modal-bar .modal-close { width: 30px; height: 30px; }
.import-table-wrap { flex: 1 1 auto; min-height: 260px; max-height: calc(94vh - 116px); overflow: auto; border: 1px solid var(--a-line); border-radius: 11px 11px 0 0; }
.import-table { min-width: 890px; }
.import-table th { position: sticky; top: 0; z-index: 2; height: 34px; padding: 0 7px; font-size: 10px; }
.import-table td { height: 38px; padding: 3px 7px; border-bottom: 1px solid #e8eeee; font-size: 10px; white-space: nowrap; }
.import-table tr:nth-child(even) td { background: #fbfdfd; }
.import-table tr:hover td { background: #f0f8f7; }
.import-table th:first-child, .import-table td:first-child { width: 34px; padding-inline: 3px; text-align: center; }
.import-table th:nth-child(2) { width: 138px; }
.import-table th:nth-child(3) { width: 135px; }
.import-table th:nth-child(4) { width: 120px; }
.import-table th:nth-child(5) { width: 150px; }
.import-table th:nth-child(6) { width: 72px; }
.import-table th:nth-child(7) { width: 200px; }
.import-table th:last-child, .import-table td:last-child { width: 38px; padding-inline: 2px; text-align: center; }
.import-patient-cell, .import-phone-cell, .import-doctor-cell { overflow: hidden; text-overflow: ellipsis; }
.import-phone-cell { direction: ltr; text-align: right; font-variant-numeric: tabular-nums; }
.import-date-cell { overflow: hidden; direction: rtl; text-overflow: ellipsis; }
.import-tags { flex-wrap: nowrap; gap: 3px; overflow: hidden; }
.import-tag { min-height: 18px; padding: 1px 5px; border-radius: 6px; font-size: 9px; }
.import-actions { position: sticky; bottom: 0; flex: 0 0 auto; margin: 0 -12px; padding: 8px 12px; border-top: 1px solid var(--a-line); background: #fff; }
@media (max-width: 780px) {
  .modal.modal-wide { width: 96vw; max-height: 96vh; padding-inline: 8px; }
  .import-table-wrap { max-height: calc(96vh - 118px); }
  .import-actions { margin-inline: -8px; padding-inline: 8px; }
}

/* Daily operations overview */
.overview-page { display: grid; gap: 16px; }
.overview-intro { align-items: center; margin-bottom: 0; }
.overview-intro h2 { font-size: 25px; }
.overview-intro-side { display: flex; align-items: center; gap: 10px; }
.range-pill { display: inline-flex; align-items: center; gap: 7px; padding: 8px 12px; border: 1px solid var(--a-line); border-radius: 999px; color: var(--a-text); background: #fff; font-size: 11px; white-space: nowrap; }
.range-pill .ic { width: 15px; height: 15px; color: var(--a-primary); }
.overview-filters { padding: 13px 15px 9px; border: 1px solid var(--a-line); border-radius: 16px; background: #fff; box-shadow: 0 4px 18px rgba(23,52,58,.025); }
.overview-filter-fields { display: flex; align-items: end; gap: 9px; }
.overview-filter-fields label { display: grid; gap: 4px; min-width: 140px; color: var(--a-muted); font-size: 10px; font-weight: 700; }
.overview-filter-fields label:nth-of-type(3), .overview-filter-fields label:nth-of-type(4) { min-width: 160px; }
.overview-filter-fields .text-input, .overview-filter-fields .filter-select { height: 37px; min-height: 37px; padding: 5px 10px; font-size: 11px; }
.overview-filter-fields .text-input { direction: ltr; text-align: right; }
.filter-connector { padding: 0 1px 10px; color: #9aabad; font-size: 10px; }
.overview-filter-fields .btn { min-height: 37px; padding-inline: 17px; }
.overview-filter-bottom { display: flex; align-items: center; gap: 13px; min-height: 34px; margin-top: 7px; border-top: 1px solid #f0f4f4; }
.overview-presets { display: inline-flex; gap: 3px; padding: 3px; border-radius: 9px; background: #f4f7f7; }
.overview-presets button, .overview-reset { padding: 4px 9px; border: 0; border-radius: 7px; color: var(--a-muted); background: transparent; cursor: pointer; font: inherit; font-size: 10px; }
.overview-presets button.is-active { color: var(--a-primary-deep); background: #fff; box-shadow: 0 1px 4px rgba(22,57,61,.1); font-weight: 700; }
.overview-reset { color: var(--a-primary-deep); }
.overview-filter-bottom .field-error { margin: 0; }
.overview-kpis { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 11px; }
.overview-kpi { position: relative; min-height: 119px; padding: 15px 16px 13px; overflow: hidden; border: 1px solid var(--a-line); border-radius: 16px; background: #fff; }
.overview-kpi::after { position: absolute; inset-inline-end: 0; inset-block: 16px; width: 3px; border-radius: 4px 0 0 4px; background: var(--kpi-color,var(--a-primary)); content: ""; }
.kpi-top { display: flex; align-items: center; gap: 7px; color: var(--a-muted); }
.kpi-top .ic { width: 16px; height: 16px; color: var(--kpi-color,var(--a-primary)); }
.kpi-top small { font-size: 11px; font-weight: 700; }
.overview-kpi > strong { display: block; margin-top: 8px; color: var(--a-ink); font-size: 27px; font-weight: 750; line-height: 1.15; }
.kpi-note { display: block; margin-top: 4px; color: #849497; font-size: 9px; }
.kpi-total { --kpi-color:#318d91; }.kpi-confirmed { --kpi-color:#25835f; }.kpi-pending { --kpi-color:#bf8125; }.kpi-cancelled { --kpi-color:#b75a5d; }.kpi-patients { --kpi-color:#527cb1; }
.overview-main-grid { display: grid; grid-template-columns: minmax(0,1.55fr) minmax(290px,.75fr); gap: 12px; }
.overview-secondary-grid { display: grid; grid-template-columns: minmax(0,1.15fr) minmax(280px,.85fr); gap: 12px; }
.overview-card { min-width: 0; padding: 17px; border: 1px solid var(--a-line); border-radius: 17px; background: #fff; box-shadow: 0 5px 22px rgba(23,52,58,.025); }
.overview-card-head { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.overview-card-head h3 { margin: 3px 0 0; color: var(--a-ink); font-size: 14px; font-weight: 750; }
.overview-card-head p { margin: 3px 0 0; color: var(--a-muted); font-size: 10px; }
.overview-card-kicker { color: var(--a-primary); font-size: 9px; font-weight: 800; }
.overview-head-icon { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 11px; color: var(--a-primary); background: var(--a-primary-soft); }
.overview-head-icon .ic { width: 17px; height: 17px; }
.overview-total-chip { display: grid; justify-items: center; min-width: 50px; padding: 5px 9px; border-radius: 11px; color: var(--a-primary-deep); background: var(--a-primary-soft); line-height: 1.35; }
.overview-total-chip b { font-size: 15px; }.overview-total-chip small { font-size: 9px; }
.overview-trend { display: flex; align-items: end; justify-content: space-around; gap: 14px; min-height: 188px; margin-top: 16px; padding: 8px 12px 0; border-bottom: 1px solid var(--a-line); background: repeating-linear-gradient(to bottom,transparent 0,transparent 45px,#eff4f4 46px,#eff4f4 47px); }
.trend-day { display: grid; justify-items: center; align-content: end; gap: 5px; min-width: 35px; height: 180px; flex: 1; color: var(--a-muted); }
.trend-day > b { color: var(--a-ink); font-size: 10px; }
.trend-bar { display: flex; flex-direction: column-reverse; width: min(34px,70%); overflow: hidden; border-radius: 8px 8px 3px 3px; background: #f5f7f7; }
.trend-segment { display: block; min-height: 0; width: 100%; }
.trend-segment.status-confirmed,.status-dot.status-confirmed,.overview-status-track .status-confirmed { background: #329773; }
.trend-segment.status-pending,.status-dot.status-pending,.overview-status-track .status-pending { background: #e5aa4d; }
.trend-segment.status-new,.status-dot.status-new,.overview-status-track .status-new { background: #5b9db1; }
.trend-segment.status-cancelled,.status-dot.status-cancelled,.overview-status-track .status-cancelled { background: #ce7778; }
.trend-day > small { color: #78898c; font-size: 9px; white-space: nowrap; }
.overview-chart-legend { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 13px; color: var(--a-muted); font-size: 9px; }
.overview-chart-legend span,.overview-status-label > span { display: inline-flex; align-items: center; gap: 5px; }
.overview-chart-legend i,.status-dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; }
.legend-confirmed { background:#329773; }.legend-pending { background:#e5aa4d; }.legend-new { background:#5b9db1; }.legend-cancelled { background:#ce7778; }
.overview-status-list { display: grid; gap: 14px; margin-top: 20px; }
.overview-status-row { display: grid; gap: 6px; }
.overview-status-label { display: flex; align-items: center; justify-content: space-between; color: var(--a-text); font-size: 10px; }
.overview-status-label b { color: var(--a-ink); font-size: 11px; }.overview-status-label b small { margin-inline-start: 3px; color: var(--a-muted); font-size: 9px; font-weight: 500; }
.overview-status-track { display: block; height: 6px; overflow: hidden; border-radius: 99px; background: #f0f4f4; }
.overview-status-track i { display: block; height: 100%; border-radius: inherit; }
.overview-status-total { display: flex; justify-content: space-between; margin-top: 17px; padding-top: 11px; border-top: 1px solid var(--a-line); color: var(--a-muted); font-size: 10px; }.overview-status-total b { color: var(--a-ink); font-size: 12px; }
.overview-doctor-list { display: grid; gap: 13px; margin-top: 16px; }
.overview-doctor-row { display: grid; grid-template-columns: 33px minmax(0,1fr) auto; align-items: center; column-gap: 9px; row-gap: 6px; }
.doctor-initial { display: grid; place-items: center; grid-row: span 2; width: 32px; height: 32px; border-radius: 11px; color: var(--a-primary-deep); background: var(--a-primary-soft); font-size: 13px; font-weight: 800; }
.doctor-info { display: grid; min-width: 0; }.doctor-info b { overflow: hidden; color: var(--a-ink); font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }.doctor-info small { color: var(--a-muted); font-size: 9px; }
.doctor-count { display: flex; align-items: baseline; gap: 4px; }.doctor-count b { color: var(--a-ink); font-size: 12px; }.doctor-count small { color: var(--a-muted); font-size: 9px; }
.doctor-share { grid-column: 2/4; display: block; height: 4px; overflow: hidden; border-radius: 99px; background: #eff4f4; }.doctor-share i { display: block; height: 100%; border-radius: inherit; background: var(--a-gradient); }
.overview-type-list { display: grid; gap: 10px; margin-top: 18px; }
.overview-type-row { display: flex; align-items: center; gap: 9px; padding: 10px; border: 1px solid #edf2f2; border-radius: 12px; background: #fcfdfd; }
.type-mark { display: grid; place-items: center; width: 31px; height: 31px; border-radius: 10px; color: var(--a-primary); background: var(--a-primary-soft); }.type-mark-1 { color:#5879a4; background:#eef3fa; }.type-mark .ic { width: 16px; height: 16px; }
.overview-type-row > span:nth-child(2) { display: grid; flex: 1; }.overview-type-row b { color: var(--a-ink); font-size: 10px; }.overview-type-row small { color: var(--a-muted); font-size: 9px; }.overview-type-row > strong { color: var(--a-ink); font-size: 15px; }
.overview-data-note { margin: 12px 0 0; color: #869597; font-size: 9px; }
.overview-followup-card .overview-card-head { margin-bottom: 11px; }.overview-followup-card .data-table th { height: 35px; }.overview-followup-card .data-table td { height: 45px; padding-block: 6px; font-size: 10px; }
.overview-no-data { display: grid; place-items: center; width: 100%; min-height: 100px; color: var(--a-muted); font-size: 11px; }
@media (max-width: 1180px) { .overview-kpis { grid-template-columns: repeat(3,minmax(0,1fr)); }.overview-filter-fields { flex-wrap: wrap; }.overview-filter-fields label { flex: 1 1 145px; } }
@media (max-width: 900px) { .overview-main-grid,.overview-secondary-grid { grid-template-columns: 1fr; }.overview-intro { align-items: flex-start; flex-direction: column; }.overview-intro-side { flex-wrap: wrap; } }
@media (max-width: 620px) { .overview-page { gap: 11px; }.overview-kpis { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }.overview-kpi { min-height: 105px; padding: 12px; }.overview-kpi > strong { font-size: 23px; }.overview-filter-fields { display: grid; grid-template-columns: 1fr 1fr; }.overview-filter-fields label { min-width: 0; }.overview-filter-fields label:nth-of-type(3),.overview-filter-fields label:nth-of-type(4) { min-width: 0; }.filter-connector { display: none; }.overview-filter-fields button { grid-column: 1/-1; }.overview-filter-bottom { flex-wrap: wrap; gap: 6px; }.overview-trend { gap: 4px; padding-inline: 3px; }.trend-day { min-width: 0; }.trend-bar { width: 22px; }.overview-card { padding: 13px; }.overview-followup-card .table-scroll { overflow-x: auto; } }

/* Operational additions: import review, manual booking, analytics, and people directories. */
.modal-wide { display: flex; flex-direction: column; width: min(100%, 1180px); max-height: 92vh; padding: 24px; }
.modal-wide .modal-head { flex: none; margin-bottom: 14px; }
.import-summary { display: flex; flex-wrap: wrap; gap: 8px; padding: 12px; border: 1px solid var(--a-line); border-radius: 16px; background: var(--a-surface-soft); }
.summary-chip { display: inline-flex; align-items: center; gap: 7px; min-height: 30px; padding: 4px 10px; border-radius: 999px; font-size: 11px; font-weight: 700; white-space: nowrap; }
.summary-chip .ic { width: 14px; height: 14px; }
.chip-success { color: var(--a-success); background: var(--a-success-soft); }
.chip-warning { color: var(--a-warning); background: var(--a-warning-soft); }
.chip-danger { color: var(--a-danger); background: var(--a-danger-soft); }
.chip-info { color: var(--a-primary-deep); background: var(--a-primary-soft); }
.import-toolbar { display: flex; align-items: flex-end; justify-content: space-between; gap: 14px; padding: 13px 2px; }
.field-inline { display: grid; gap: 4px; min-width: 180px; color: var(--a-muted); font-size: 11px; font-weight: 700; }
.field-inline .filter-select { width: 100%; }
.import-hint, .small-muted { color: var(--a-muted); font-size: 11px; }
.import-table-wrap { min-height: 160px; max-height: 49vh; overflow: auto; border: 1px solid var(--a-line); border-radius: 15px; }
.data-table { width: 100%; border-collapse: separate; border-spacing: 0; table-layout: fixed; }
.data-table th { position: sticky; z-index: 1; top: 0; height: 42px; padding: 0 12px; border-bottom: 1px solid var(--a-line); color: var(--a-muted); background: #f6f9f9; font-size: 11px; font-weight: 700; text-align: start; white-space: nowrap; }
.data-table td { height: 58px; padding: 8px 12px; border-bottom: 1px solid #edf2f2; color: var(--a-text); font-size: 12px; vertical-align: middle; overflow-wrap: anywhere; }
.data-table tbody tr:last-child td { border-bottom: 0; }
.data-table tbody tr:hover { background: #f8fcfb; }
.data-table td b { display: block; overflow: hidden; color: var(--a-ink); font-size: 12px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.data-table td .cell-sub { display: block; margin-top: 2px; overflow: hidden; color: var(--a-muted); font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.data-table th:first-child, .data-table td:first-child { width: 19%; }
.data-table .time-cell { width: 120px; }
.data-table .time-cell small { display: block; }
.import-table { min-width: 900px; }
.import-table th:first-child, .import-table td:first-child { width: 52px; text-align: center; }
.import-table th:nth-child(2) { width: 150px; }
.import-table th:nth-child(3) { width: 190px; }
.import-table th:nth-child(4) { width: 190px; }
.import-table th:nth-child(5) { width: 100px; }
.import-table th:nth-child(6) { width: auto; }
.import-table th:last-child, .import-table td:last-child { width: 58px; text-align: center; }
.import-table td { height: 66px; }
.import-table .is-excluded { background: #fbfcfa; }
.import-table .is-excluded td { color: #78898b; }
.import-table .check { width: 18px; height: 18px; }
.import-tags { display: flex; flex-wrap: wrap; gap: 4px; }
.import-tag { display: inline-flex; align-items: center; min-height: 22px; padding: 2px 7px; border-radius: 8px; font-size: 10px; font-weight: 700; white-space: nowrap; }
.tag-error { color: var(--a-danger); background: var(--a-danger-soft); }
.tag-warning { color: var(--a-warning); background: var(--a-warning-soft); }
.tag-info { color: var(--a-primary-deep); background: var(--a-primary-soft); }
.tag-ok { color: var(--a-success); background: var(--a-success-soft); }
.table-empty-cell { padding: 28px !important; color: var(--a-muted) !important; text-align: center; }
.icon-btn-sm { width: 30px; height: 30px; border-radius: 9px; }
.icon-btn-sm .ic { width: 15px; height: 15px; }
.danger-icon { color: var(--a-danger); background: var(--a-danger-soft); }
.import-actions { align-items: center; justify-content: flex-start; flex-wrap: wrap; margin-top: 12px; }
.import-actions .selection-count { margin-inline-end: auto; }
.table-panel-head .selection-bar { flex: 0 1 auto; min-height: 40px; margin: 0; padding: 4px 8px; border-radius: 12px; }
.table-panel-head .selection-bar .selection-count { white-space: nowrap; }
.modal-form { width: min(100%, 680px); }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 16px; }
.form-span { grid-column: 1 / -1; }
.field select, .text-input { width: 100%; min-height: 44px; padding: 9px 12px; border: 1px solid var(--a-line-strong); border-radius: 12px; outline: 0; color: var(--a-ink); background: #fff; font-size: 13px; }
.text-input::placeholder { color: #84979a; }
.field select:focus, .text-input:focus { border-color: #76b5b4; box-shadow: 0 0 0 3px rgba(48,145,146,.1); }
textarea.text-input { min-height: 82px; resize: vertical; }
.optional-label { color: var(--a-muted); font-size: 10px; font-weight: 500; }
.modal-form .modal-actions { margin-top: 8px; }
.people-metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-bottom: 14px; }
.people-metrics article { display: flex; align-items: center; justify-content: space-between; min-height: 62px; padding: 10px 16px; border: 1px solid var(--a-line); border-radius: 15px; background: rgba(255,255,255,.9); box-shadow: var(--a-shadow-sm); }
.people-metrics article span { color: var(--a-muted); font-size: 11px; }
.people-metrics article strong { color: var(--a-ink); font-size: 21px; }
.people-empty { display: grid; justify-items: center; gap: 8px; padding: 50px 20px; color: var(--a-muted); text-align: center; }
.people-empty .ic { width: 32px; height: 32px; color: var(--a-primary); }
.people-empty b { color: var(--a-ink); font-size: 14px; }
.day-choice-field { grid-column: 1 / -1; min-width: 0; margin: 0; padding: 0; border: 0; }
.day-choice-field legend { margin-bottom: 9px; color: var(--a-ink); font-size: 12px; font-weight: 650; }
.day-choice-list { display: flex; flex-wrap: wrap; gap: 7px; }
.day-choice { position: relative; cursor: pointer; }
.day-choice input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.day-choice span { display: inline-flex; align-items: center; min-height: 34px; padding: 5px 12px; border: 1px solid var(--a-line-strong); border-radius: 11px; color: var(--a-muted); background: #fff; font-size: 11px; transition: .15s ease; }
.day-choice input:checked + span { border-color: #a6d7d0; color: var(--a-primary-deep); background: var(--a-primary-soft); }
.day-choice input:focus-visible + span { outline: 3px solid rgba(48,145,146,.2); outline-offset: 2px; }
.people-pager { direction: ltr; }
.pager-ellipsis { display: grid; place-items: center; width: 24px; color: var(--a-muted); }
.specialty-chip, .count-pill { display: inline-flex; align-items: center; min-height: 26px; padding: 3px 9px; border-radius: 999px; color: var(--a-primary-deep); background: var(--a-primary-soft); font-size: 10px; font-weight: 700; white-space: nowrap; }
.count-pill { color: var(--a-text); background: #f1f5f5; }
.ltr-cell { direction: ltr; text-align: right; white-space: nowrap; }
.overview-page { display: grid; gap: 16px; }
.overview-page .page-intro { margin-bottom: 2px; }
.metric-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 12px; }
.metric-card { position: relative; display: grid; grid-template-columns: 42px 1fr; align-items: center; column-gap: 11px; min-height: 92px; padding: 14px 16px; border: 1px solid var(--a-line); border-radius: 18px; background: linear-gradient(140deg, #fff, #f8fcfb); box-shadow: var(--a-shadow-sm); }
.metric-icon { grid-row: 1 / span 3; display: grid; place-items: center; width: 42px; height: 42px; border-radius: 14px; color: var(--a-primary-deep); background: var(--a-primary-soft); }
.metric-icon .ic { width: 20px; height: 20px; }
.metric-green { color: var(--a-success); background: var(--a-success-soft); }
.metric-amber { color: var(--a-warning); background: var(--a-warning-soft); }
.metric-blue { color: #426f9a; background: #edf4fb; }
.metric-label { color: var(--a-muted); font-size: 11px; }
.metric-card strong { color: var(--a-ink); font-size: 23px; line-height: 1.25; }
.metric-note { color: var(--a-muted); font-size: 10px; }
.analytics-grid { display: grid; grid-template-columns: minmax(0,1.45fr) minmax(300px,.9fr); gap: 12px; }
.surface-card { min-width: 0; padding: 18px; border: 1px solid var(--a-line); border-radius: 20px; background: rgba(255,255,255,.94); box-shadow: var(--a-shadow-sm); }
.section-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.section-head h3 { color: var(--a-ink); font-size: 14px; font-weight: 700; }
.section-head p { margin-top: 3px; color: var(--a-muted); font-size: 11px; }
.section-icon { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 12px; color: var(--a-primary); background: var(--a-primary-soft); }
.period-select select { height: 34px; padding: 0 10px; border: 1px solid var(--a-line); border-radius: 10px; color: var(--a-text); background: #fff; font-size: 11px; }
.chart-area { display: grid; grid-template-columns: 24px 1fr; gap: 8px; height: 205px; margin-top: 15px; }
.chart-y { display: flex; flex-direction: column; justify-content: space-between; padding-bottom: 22px; color: var(--a-muted); font-size: 9px; }
.chart-bars { position: relative; display: flex; align-items: flex-end; justify-content: space-around; gap: 12px; padding: 12px 4px 0; border-bottom: 1px solid var(--a-line-strong); background: repeating-linear-gradient(to bottom, transparent 0, transparent 47px, #edf2f2 48px, transparent 49px); }
.chart-column { display: flex; flex-direction: column; align-items: center; justify-content: flex-end; gap: 5px; width: 48px; height: 100%; color: var(--a-muted); }
.chart-column .bar-value { font-size: 9px; }
.chart-column i { width: min(26px, 72%); height: var(--bar-height); min-height: 4px; border-radius: 8px 8px 2px 2px; background: var(--a-gradient); box-shadow: 0 4px 10px rgba(37,134,141,.14); transition: height 220ms ease; }
.chart-column small { position: absolute; transform: translateY(20px); font-size: 9px; white-space: nowrap; }
.chart-legend { display: flex; align-items: center; justify-content: space-between; margin-top: 12px; color: var(--a-muted); font-size: 10px; }
.chart-legend span { display: flex; align-items: center; gap: 7px; }
.chart-legend i { width: 8px; height: 8px; border-radius: 3px; background: var(--a-primary); }
.status-distribution { display: grid; gap: 15px; margin-top: 22px; }
.distribution-row > div { display: flex; align-items: center; justify-content: space-between; }
.distribution-row .status-badge { min-height: 24px; padding-inline: 8px; }
.distribution-row b { font-size: 12px; }
.distribution-track { display: block; height: 6px; margin-top: 7px; overflow: hidden; border-radius: 999px; background: #eff4f4; }
.distribution-track i { display: block; height: 100%; min-width: 0; border-radius: inherit; background: var(--a-primary); }
.distribution-track .status-confirmed { background: var(--a-success); }
.distribution-track .status-pending { background: #e2a642; }
.distribution-track .status-new { background: var(--a-primary); }
.distribution-track .status-cancelled { background: var(--a-danger); }
.insight-note { display: flex; align-items: flex-start; gap: 8px; margin-top: 20px; padding: 10px 12px; border: 1px solid #d9eeea; border-radius: 13px; color: var(--a-primary-deep); background: #f2faf8; font-size: 11px; }
.insight-note .ic { width: 16px; height: 16px; }
.recent-card .section-head { margin-bottom: 12px; }
.text-link { display: inline-flex; align-items: center; gap: 5px; color: var(--a-primary-deep); font-size: 11px; font-weight: 700; }
.text-link .ic { width: 14px; height: 14px; }
.overview-recent .data-table th:first-child, .overview-recent .data-table td:first-child { width: 90px; }
@media (max-width: 1100px) { .metric-grid { grid-template-columns: repeat(2, minmax(0,1fr)); } .analytics-grid { grid-template-columns: 1fr; } }
@media (max-width: 780px) {
  .modal-wide { padding: 18px 14px; }
  .import-toolbar { align-items: flex-start; flex-direction: column; }
  .import-hint { line-height: 1.7; }
  .import-actions { align-items: stretch; }
  .import-actions .selection-count { flex-basis: 100%; }
  .form-grid { grid-template-columns: 1fr; }
  .form-span { grid-column: auto; }
  .people-metrics { gap: 7px; }
  .people-metrics article { min-height: 56px; padding: 8px; }
  .people-metrics article span { font-size: 10px; }
  .people-metrics article strong { font-size: 18px; }
  #patient-table th:nth-child(5), #patient-table td:nth-child(5), #patient-table th:nth-child(7), #patient-table td:nth-child(7) { display: none; }
  #doctor-table th:nth-child(4), #doctor-table td:nth-child(4), #doctor-table th:nth-child(5), #doctor-table td:nth-child(5) { display: none; }
  .metric-grid { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 8px; }
  .metric-card { min-height: 82px; grid-template-columns: 34px 1fr; gap: 8px; padding: 10px; }
  .metric-icon { width: 34px; height: 34px; border-radius: 11px; }
  .metric-card strong { font-size: 20px; }
  .surface-card { padding: 14px; }
  .chart-bars { gap: 5px; }
  .chart-column { width: 32px; }
  .chart-column i { width: 20px; }
  .overview-page .page-intro { align-items: flex-start; }
  .overview-page .page-intro > .btn { width: 100%; }
}

/* Dense one-line spreadsheet review: the dialog itself scrolls, never page the imported rows. */
.modal-wide { display: block; overflow-y: auto; overscroll-behavior: contain; }
.modal-wide .modal-head { margin-bottom: 10px; }
.modal-wide .modal-head .eyebrow { margin-bottom: 1px; }
.import-summary { gap: 5px; padding: 7px 9px; border-radius: 12px; }
.summary-chip { min-height: 25px; padding: 2px 8px; font-size: 10px; }
.summary-chip .ic { width: 12px; height: 12px; }
.import-toolbar { align-items: center; gap: 10px; padding: 8px 0; }
.field-inline { display: flex; align-items: center; gap: 8px; min-width: 0; white-space: nowrap; }
.field-inline .filter-select { width: auto; min-width: 125px; height: 32px; }
.import-hint { font-size: 10px; }
.import-table-wrap { min-height: 0; max-height: none; overflow: visible; border-radius: 11px; }
.import-table { min-width: 720px; }
.import-table th { height: 34px; padding-inline: 8px; font-size: 10px; }
.import-table th:first-child, .import-table td:first-child { width: 38px; padding-inline: 5px; }
.import-table th:nth-child(2) { width: 155px; }
.import-table th:nth-child(3) { width: 180px; }
.import-table th:nth-child(4) { width: 150px; }
.import-table th:nth-child(5) { width: 82px; }
.import-table th:nth-child(6) { width: auto; }
.import-table th:last-child, .import-table td:last-child { width: 44px; padding-inline: 3px; }
.import-table td { height: 40px; padding: 4px 8px; font-size: 10px; white-space: nowrap; }
.import-table td b { display: inline; font-size: 11px; }
.import-date-cell { overflow: hidden; direction: rtl; text-overflow: ellipsis; }
.import-patient-cell { overflow: hidden; text-overflow: ellipsis; }
.import-patient-cell b { margin-inline-end: 6px; }
.import-patient-cell span { color: var(--a-muted); font-size: 10px; direction: ltr; unicode-bidi: isolate; }
.import-doctor-cell { overflow: hidden; text-overflow: ellipsis; }
.import-tags { flex-wrap: nowrap; gap: 3px; overflow: hidden; }
.import-tag { min-height: 19px; padding: 1px 6px; border-radius: 6px; font-size: 9px; }
.import-actions { position: sticky; z-index: 3; bottom: -24px; margin: 8px -24px -24px; padding: 10px 24px; border-top: 1px solid var(--a-line); background: rgba(255,255,255,.97); }
.person-detail-trigger { display: inline-grid; justify-items: start; padding: 0; border: 0; color: inherit; background: transparent; text-align: start; cursor: pointer; }
.person-detail-trigger:hover b { color: var(--a-primary-deep); text-decoration: underline; text-underline-offset: 3px; }
.person-detail-trigger:focus-visible { border-radius: 5px; }
.modal-detail { width: min(100%, 820px); }
.detail-metrics { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 9px; margin-bottom: 20px; }
.detail-metrics > span { display: grid; gap: 3px; min-height: 62px; padding: 10px 13px; border: 1px solid var(--a-line); border-radius: 13px; background: var(--a-surface-soft); }
.detail-metrics small { color: var(--a-muted); font-size: 10px; }
.detail-metrics b { color: var(--a-ink); font-size: 13px; }
.detail-history { border-top: 1px solid var(--a-line); padding-top: 15px; }
.detail-history .section-head { margin-bottom: 8px; }
.date-filter-bar { display: flex; align-items: flex-end; flex-wrap: wrap; gap: 9px; padding: 12px; border: 1px solid var(--a-line); border-radius: 16px; background: rgba(255,255,255,.82); }
.date-filter-bar label { display: grid; gap: 3px; min-width: 155px; color: var(--a-muted); font-size: 10px; font-weight: 700; }
.date-filter-bar .text-input { min-height: 36px; padding: 5px 10px; direction: ltr; text-align: right; font-size: 12px; }
.date-filter-bar .btn { min-height: 36px; }
.date-filter-bar .field-error { min-height: 0; margin: 0; }
.metric-grid { grid-template-columns: repeat(5,minmax(0,1fr)); }
.analytics-lower { grid-template-columns: minmax(0,1fr) minmax(0,1.2fr); }
.analytics-lower .data-table th:first-child, .analytics-lower .data-table td:first-child { width: 36%; }
.doctor-report-cell { display: flex; align-items: center; gap: 8px; min-width: 0; }
.doctor-report-cell > span:first-child { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.doctor-report-track { display: block; min-width: 50px; height: 5px; flex: 1; overflow: hidden; border-radius: 99px; background: #edf2f2; }
.doctor-report-track i { display: block; height: 100%; border-radius: inherit; background: var(--a-gradient); }
@media (max-width: 1100px) { .metric-grid { grid-template-columns: repeat(3,minmax(0,1fr)); } }
@media (max-width: 780px) {
  .import-actions { margin-inline: -14px; padding-inline: 14px; }
  .import-hint { white-space: normal; }
  .analytics-lower { grid-template-columns: 1fr; }
  .metric-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .date-filter-bar label { flex: 1 1 130px; }
  .date-filter-bar .field-error { flex-basis: 100%; }
}

/* Keep spreadsheet actions visible while only the imported rows scroll. */
.modal.modal-wide { display: flex; flex-direction: column; width: min(92vw, 1100px); height: min(94vh, 960px); max-height: 94vh; overflow: hidden; padding: 8px 12px 0; }
.modal.modal-wide .import-table-wrap { min-height: 0; max-height: none; flex: 1 1 0; overflow: auto; overscroll-behavior: contain; }
.modal.modal-wide .import-actions { position: relative; inset: auto; z-index: 2; flex: 0 0 auto; flex-wrap: wrap; gap: 12px; margin: 0 -12px; padding: 9px 12px; border-top: 1px solid var(--a-line); background: #fff; }
.modal.modal-wide .import-actions .selection-count { margin-inline-end: auto; }
.modal.modal-wide .import-actions .btn { min-height: 40px; flex: 0 0 auto; }
@media (max-width: 780px) {
  .modal.modal-wide { width: 96vw; height: 96vh; max-height: 96vh; padding-inline: 8px; }
  .modal.modal-wide .import-actions { margin-inline: -8px; padding-inline: 8px; }
  .modal.modal-wide .import-actions .selection-count { flex: 1 0 100%; }
}

/* Quiet, single-accent overview; date range is the only filter. */
.overview-page { gap: 12px; }
.overview-filters { padding: 9px 12px; border-radius: 13px; box-shadow: none; }
.overview-filter-fields { align-items: center; gap: 7px; }
.overview-filter-fields label { display: flex; align-items: center; gap: 7px; min-width: 0; color: var(--a-muted); font-size: 10px; font-weight: 600; }
.overview-filter-fields label .text-input { width: 132px; height: 35px; min-height: 35px; border-radius: 9px; background: #fbfcfc; }
.overview-filter-fields .filter-connector { padding: 0 2px; color: #8c999b; }
.overview-filter-fields .btn { min-height: 35px; padding-inline: 12px; }
.overview-filter-fields .overview-data-note { margin: 0 auto 0 0; font-size: 9px; }
#overview-filter-error { min-height: 0; margin: 3px 0 0; font-size: 10px; }
.overview-kpis { grid-template-columns: repeat(4,minmax(0,1fr)); gap: 9px; }
.overview-kpi { min-height: 98px; padding: 12px 14px; border-radius: 13px; box-shadow: none; }
.overview-kpi::after { display: none; }
.kpi-top .ic { width: 14px; height: 14px; color: var(--a-primary); }
.kpi-total,.kpi-confirmed,.kpi-pending,.kpi-cancelled,.kpi-patients { --kpi-color:var(--a-primary); }
.overview-kpi > strong { margin-top: 5px; font-size: 24px; }
.kpi-note { font-size: 9px; }
.overview-card { padding: 14px; border-radius: 14px; box-shadow: none; }
.overview-card-head h3 { margin: 0; font-size: 13px; }
.overview-card-head p { font-size: 9px; }
.overview-card-kicker,.overview-head-icon,.overview-total-chip { display: none; }
.overview-trend { min-height: 158px; margin-top: 8px; padding: 6px 8px 0; background: repeating-linear-gradient(to bottom,transparent 0,transparent 38px,#f1f4f4 39px,#f1f4f4 40px); }
.trend-day { height: 150px; gap: 4px; }
.trend-day > b { font-size: 9px; }
.trend-day > small { font-size: 8px; }
.trend-bar { width: min(28px,65%); border-radius: 6px 6px 2px 2px; background: #489b98; }
.overview-status-summary { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 10px; padding-top: 10px; border-top: 1px solid #eef2f2; }
.overview-status-summary span { display: flex; align-items: center; gap: 6px; min-width: 90px; padding: 4px 8px; border: 1px solid #eef2f2; border-radius: 8px; color: var(--a-muted); background: #fbfcfc; font-size: 9px; }
.overview-status-summary b { color: var(--a-ink); font-size: 10px; }
.overview-status-summary small { font-size: 9px; }
.overview-secondary-grid { grid-template-columns: minmax(260px,.75fr) minmax(0,1.25fr); gap: 10px; }
.overview-doctor-list { gap: 9px; margin-top: 12px; }
.overview-doctor-row { grid-template-columns: 29px minmax(0,1fr) auto; column-gap: 7px; row-gap: 4px; }
.doctor-initial { width: 28px; height: 28px; border-radius: 9px; font-size: 11px; }
.doctor-info b { font-size: 9px; }.doctor-info small,.doctor-count small { font-size: 8px; }
.doctor-count b { font-size: 10px; }
.doctor-share { height: 3px; }.doctor-share i { background: #489b98; }
.overview-followup-card .overview-card-head { margin-bottom: 7px; }
.overview-followup-card .data-table th { height: 32px; padding-inline: 7px; font-size: 9px; }
.overview-followup-card .data-table td { height: 38px; padding: 4px 7px; font-size: 9px; }
.overview-followup-card .status-badge,.overview-followup-card .link-badge { padding: 3px 6px; font-size: 8px; }
.overview-followup-card .status-badge,.overview-followup-card .link-badge { color: #596b6e; border: 0; background: #f1f4f4; }
.overview-no-data { min-height: 72px; font-size: 10px; }
@media (max-width: 900px) { .overview-kpis { grid-template-columns: repeat(2,minmax(0,1fr)); }.overview-secondary-grid { grid-template-columns: 1fr; } }
@media (max-width: 620px) {
  .overview-filter-fields { display: flex; flex-wrap: wrap; }
  .overview-filter-fields label { flex: 1 1 130px; justify-content: space-between; }
  .overview-filter-fields label .text-input { width: min(62%,150px); }
  .overview-filter-fields .overview-data-note { flex: 1 0 100%; margin: 0; }
  .overview-kpis { gap: 7px; }
  .overview-kpi { min-height: 90px; padding: 10px; }
  .overview-kpi > strong { font-size: 21px; }
  .overview-trend { gap: 3px; padding-inline: 2px; }
  .trend-day { min-width: 0; }
  .trend-bar { width: 20px; }
  .overview-status-summary { gap: 5px; }
  .overview-status-summary span { min-width: calc(50% - 4px); flex: 1; justify-content: space-between; }
  .overview-followup-card .table-scroll { overflow-x: auto; }
}