/* PrakharOne - layout and theme on top of Bootstrap 5.3 (leaf green + turmeric). */
/* Light look: these are also set on [data-bs-theme="light"] so a printout inside a dark page stays light. */
:root, [data-bs-theme="light"] {
  --pc-green: #2e6b46;
  --pc-green-dark: #224f34;
  --pc-green-soft: #3a7d55;
  --pc-gold: #c8902e;
  --pc-gold-soft: #fbf3e4;
  --pc-mint: #e6f2ea;
  --pc-bg: #f4f6f3;
  --pc-surface: #fff;
  --pc-line: #e2e8e3;
  --pc-ink: #2e6b46; /* green text: headings, card headers */
  --pc-strong: #111827;
  --pc-muted: #6c757d;
  --pc-th-bg: #f6f8f5;
  --pc-th-ink: #5f6b63;
  --pc-label: #000;
  --pc-field-border: #b9c3bd;
  --pc-placeholder: #8a948e;
  --pc-done-bg: #f3f4f3;
  --pc-shadow: rgba(20, 50, 30, .09);
  --pc-sidebar-width: 240px;
  --bs-primary: #2e6b46;
  --bs-primary-rgb: 46, 107, 70;
  --bs-link-color: #2e6b46;
  --bs-link-color-rgb: 46, 107, 70;
  --bs-link-hover-color: #224f34;
  --bs-body-font-size: 0.925rem;
}

.btn-primary {
  --bs-btn-bg: var(--pc-green);
  --bs-btn-border-color: var(--pc-green);
  --bs-btn-hover-bg: var(--pc-green-dark);
  --bs-btn-hover-border-color: var(--pc-green-dark);
  --bs-btn-active-bg: var(--pc-green-dark);
  --bs-btn-active-border-color: var(--pc-green-dark);
  --bs-btn-disabled-bg: var(--pc-green);
  --bs-btn-disabled-border-color: var(--pc-green);
}
.btn-outline-primary {
  --bs-btn-color: var(--pc-green);
  --bs-btn-border-color: var(--pc-green);
  --bs-btn-hover-bg: var(--pc-green);
  --bs-btn-hover-border-color: var(--pc-green);
  --bs-btn-active-bg: var(--pc-green-dark);
}
.btn-whatsapp { --bs-btn-color: #fff; --bs-btn-bg: #1e9e55; --bs-btn-border-color: #1e9e55; --bs-btn-hover-color: #fff; --bs-btn-hover-bg: #17834a; --bs-btn-hover-border-color: #17834a; }
.text-gold { color: var(--pc-gold) !important; }
.text-green { color: var(--pc-ink) !important; }
.text-dark { color: var(--pc-strong) !important; }
.bg-white { background-color: var(--pc-surface) !important; }
.bg-mint { background: var(--pc-mint) !important; }
.bg-gold-soft { background: var(--pc-gold-soft) !important; }

body.pc-body { background: var(--pc-bg); }

/* Forms easy to read for doctors (owner 2026-10-24): black labels and typed text, field edges that show when empty. */
.form-label, .form-check-label { color: var(--pc-label); font-weight: 500; }
.form-control, .form-select { color: var(--pc-label); border-color: var(--pc-field-border); }
.form-control::placeholder { color: var(--pc-placeholder); }

/* ---------- shell ---------- */
.pc-shell { display: flex; min-height: 100vh; }
.pc-main { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.pc-content { flex: 1; padding: 1.5rem; }

/* Bootstrap forces .offcanvas-lg transparent on large screens, so the colour sits on an inner box. */
.pc-sidebar { --bs-offcanvas-width: var(--pc-sidebar-width); flex-shrink: 0; }
.pc-sidebar-inner {
  background: var(--pc-green);
  color: #fff;
  height: 100%;
  min-height: 100vh;
  width: var(--pc-sidebar-width);
  display: flex;
  flex-direction: column;
}
@media (min-width: 992px) {
  .pc-sidebar { position: sticky; top: 0; height: 100vh; }
  .pc-sidebar-inner { overflow-y: auto; }
}

.pc-brand {
  display: flex; align-items: center; gap: .6rem;
  padding: 1.05rem 1.15rem;
  font-size: 1.15rem; font-weight: 600; letter-spacing: .2px;
  border-bottom: 1px solid rgba(255, 255, 255, .1);
}
.pc-brand > span { white-space: nowrap; }
.pc-brand .bi { color: var(--pc-gold); font-size: 1.45rem; }
.pc-brand b { color: #f3d9a4; font-weight: 700; }

.pc-nav { padding: .75rem 0 1.5rem; }
.pc-nav-label {
  padding: 1rem 1.25rem .35rem;
  font-size: .7rem; text-transform: uppercase; letter-spacing: .08em;
  color: rgba(255, 255, 255, .55);
}
.pc-link {
  display: flex; align-items: center; gap: .7rem;
  padding: .55rem 1.25rem;
  color: rgba(255, 255, 255, .85);
  text-decoration: none;
  border-left: 3px solid transparent;
}
.pc-link .bi { font-size: 1.05rem; width: 1.2rem; text-align: center; }
.pc-link:hover { color: #fff; background: rgba(255, 255, 255, .07); }
.pc-link.active { color: #fff; background: var(--pc-green-soft); border-left-color: var(--pc-gold); }

/* ---------- top bar ---------- */
.pc-topbar {
  background: var(--pc-surface);
  border-bottom: 1px solid var(--pc-line);
  min-height: 60px;
  padding: .5rem 1.5rem;
  display: flex; align-items: center; gap: 1rem;
  position: sticky; top: 0; z-index: 1020;
}
.pc-clinic { display: flex; align-items: center; gap: .65rem; min-width: 0; }
.pc-clinic img { height: 38px; width: auto; max-width: 64px; object-fit: contain; }
.pc-clinic-name { font-weight: 600; color: var(--pc-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pc-clinic-sub { font-size: .75rem; color: var(--pc-muted); }
.pc-role-label { font-size: .72rem; }
.min-w-0 { min-width: 0; }
.pc-avatar {
  width: 34px; height: 34px; border-radius: 50%;
  background: var(--pc-mint); color: var(--pc-ink);
  display: inline-flex; align-items: center; justify-content: center;
  font-weight: 700; font-size: .85rem;
}
.pc-search { max-width: 22rem; }

.pc-footer {
  padding: .85rem 1.5rem;
  font-size: .8rem; color: var(--pc-muted);
  border-top: 1px solid var(--pc-line); background: var(--pc-surface);
}

/* ---------- content ---------- */
.pc-page-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .75rem; margin-bottom: 1.25rem; }
.pc-page-head h1 { font-size: 1.35rem; font-weight: 600; color: var(--pc-ink); margin: 0; }
.pc-page-head .pc-sub { color: var(--pc-muted); font-size: .85rem; }

.card { border: 0; box-shadow: 0 1px 3px var(--pc-shadow); }
.card-header { background: var(--pc-surface); font-weight: 600; color: var(--pc-ink); }

.pc-stat { display: flex; align-items: center; gap: 1rem; padding: 1.1rem 1.25rem; }
.pc-stat-icon {
  width: 48px; height: 48px; border-radius: 12px;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.4rem; flex-shrink: 0;
}
.pc-stat-value { font-size: 1.5rem; font-weight: 700; line-height: 1.1; color: var(--pc-strong); }
.pc-stat-label { font-size: .8rem; color: var(--pc-muted); }

.table > thead th {
  font-size: .75rem; text-transform: uppercase; letter-spacing: .04em;
  color: var(--pc-th-ink); background: var(--pc-th-bg); font-weight: 600; white-space: nowrap;
}
.table td { color: var(--pc-strong); }

.pc-logo-preview { max-height: 90px; max-width: 220px; object-fit: contain; border: 1px solid #e5e7eb; border-radius: .5rem; padding: .35rem; background: #fff; }
.pc-avatar-lg { width: 56px; height: 56px; font-size: 1.4rem; }
.pc-scroll-list { max-height: 32rem; overflow-y: auto; }
.pc-code-input { font-family: SFMono-Regular, Menlo, Consolas, monospace; font-size: 1.6rem; letter-spacing: .5rem; text-align: center; }
.pc-token { min-width: 2.6rem; display: inline-block; text-align: center; font-weight: 700; }
.pc-pre { white-space: pre-line; }
.pc-section-title { font-size: .78rem; text-transform: uppercase; letter-spacing: .06em; color: var(--pc-ink); font-weight: 700; margin-bottom: .5rem; }

/* Prescription rows */
.pc-rx-table td { padding: .3rem; vertical-align: top; }
.pc-rx-table .form-control, .pc-rx-table .form-select { padding: .3rem .45rem; font-size: .875rem; }
.pc-rx-medicine { min-width: 14rem; width: 32%; }
.pc-rx-short { width: 10rem; min-width: 7rem; }
.pc-rx-days { width: 4.5rem; }

/* ---------- sign-in page ---------- */
.pc-auth { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 1.5rem; background: var(--pc-bg); }
.pc-auth-card { width: 100%; max-width: 880px; overflow: hidden; border-radius: 1rem; }
.pc-auth-brand {
  background: linear-gradient(160deg, var(--pc-green) 0%, var(--pc-green-dark) 75%);
  color: #fff; padding: 2.5rem 2rem;
  display: flex; flex-direction: column; justify-content: space-between; gap: 2rem;
}
.pc-auth-brand .pc-auth-logo { background: #fff; border-radius: .75rem; padding: .6rem .9rem; display: inline-block; }
.pc-auth-brand .pc-auth-logo img { height: 56px; width: auto; }
.pc-auth-brand h2 { font-weight: 700; font-size: 1.6rem; }
.pc-auth-brand h2 b { color: #f3d9a4; }
.pc-auth-brand p, .pc-auth-brand li { color: rgba(255, 255, 255, .82); }
.pc-auth-form { padding: 2.5rem 2rem; background: var(--pc-surface); }

/* Brand band on the one-column cards (no clinic, paused, My account), owner 2026-10-23. */
.pc-card-brand {
  background: linear-gradient(120deg, var(--pc-green) 0%, var(--pc-green-dark) 100%);
  color: #fff; padding: .85rem 2rem;
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .2rem 1rem;
}
.pc-card-brand-name { font-size: 1.2rem; font-weight: 600; letter-spacing: .2px; white-space: nowrap; }
.pc-card-brand-name .bi { color: var(--pc-gold); margin-right: .2rem; }
.pc-card-brand-name b { color: #f3d9a4; font-weight: 700; }
.pc-card-brand-tag { font-size: .8rem; color: rgba(255, 255, 255, .75); }

/* ---------- error pages ---------- */
.pc-error { min-height: 100vh; display: flex; align-items: center; justify-content: center; text-align: center; padding: 1.5rem; }
.pc-error-code { font-size: 4rem; font-weight: 800; color: var(--pc-ink); line-height: 1; }

/* ---------- printouts (prescription, bill) ---------- */
.pc-print { max-width: 820px; background: #fff; color: #000; position: relative; overflow: hidden; }
.pc-print-a5 { max-width: 600px; }
.pc-print-head { border-bottom: 2px solid var(--pc-green); padding-bottom: .6rem; margin-bottom: .8rem; }
.pc-print-logo { height: 64px; width: auto; max-width: 110px; object-fit: contain; }
.pc-print-clinic { font-size: 1.35rem; font-weight: 700; color: var(--pc-green); line-height: 1.2; }
.pc-print-doctor { font-weight: 600; }
.pc-print table td, .pc-print table th { padding: .3rem .45rem; }
.pc-print .pc-rx-mark { font-size: 1.5rem; font-weight: 700; font-family: Georgia, serif; color: var(--pc-green); }
.pc-print-sign { height: 3rem; border-bottom: 1px solid #333; width: 12rem; margin-bottom: .25rem; margin-left: auto; }
.pc-qr svg { display: block; width: 120px; height: 120px; }
.pc-cancelled-mark { position: absolute; top: 45%; left: 50%; transform: translate(-50%, -50%) rotate(-20deg);
  font-size: 4.5rem; font-weight: 800; color: rgba(220, 53, 69, .18); pointer-events: none; letter-spacing: .3rem; }

@media (max-width: 575.98px) {
  .pc-content { padding: 1rem; }
  .pc-topbar { padding: .5rem 1rem; }
}

@media print {
  .pc-sidebar, .pc-topbar, .pc-footer, .no-print, .alert { display: none !important; }
  /* A full-screen-height shell would add an empty page after a page-high printout. */
  .pc-shell, .pc-main { min-height: 0 !important; }
  .card { box-shadow: none; }
  .pc-content { padding: 0; }
  body.pc-body { background: #fff; }
  .pc-print { max-width: none; }
  .pc-print-head, .pc-cancelled-mark { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  /* Pre-printed letterhead: keep the space, hide our heading. */
  .pc-print-blank-head .pc-print-head { visibility: hidden; }
}
@page { margin: 12mm; }
@page a5 { size: A5; margin: 8mm; }
.pc-print-a5 { page: a5; }
.pc-print-head > .text-end { max-width: 45%; }

/* Section sub-menus (pharmacy) */
.pc-subnav .nav-link { padding: .35rem .8rem; font-size: .9rem; color: var(--pc-ink); }
.pc-subnav .nav-link.active { background: var(--pc-green); color: #fff; }

/* Terms of Service / Privacy Policy pages */
.pc-legal-page { background: var(--pc-bg); min-height: 100vh; padding: 1.5rem 1rem; }
.pc-legal { max-width: 860px; margin: 0 auto; background: var(--pc-surface); border-radius: 1rem; box-shadow: 0 1px 3px var(--pc-shadow); padding: 2rem 2.25rem; line-height: 1.65; }
.pc-legal h1 { font-size: 1.6rem; font-weight: 700; color: var(--pc-ink); margin-bottom: .5rem; }
.pc-legal h2 { font-size: 1.05rem; font-weight: 700; color: var(--pc-green-dark); margin: 1.75rem 0 .6rem; }
.pc-legal table { width: 100%; border-collapse: collapse; margin: .5rem 0 1rem; font-size: .9rem; }
.pc-legal th, .pc-legal td { border: 1px solid var(--pc-line); padding: .45rem .6rem; vertical-align: top; text-align: left; }
.pc-legal th { background: var(--pc-th-bg); }
.pc-legal-brand { font-weight: 700; color: var(--pc-ink); text-decoration: none; }
.pc-legal-brand b { color: var(--pc-gold); }
.pc-legal-brand .bi { color: var(--pc-gold); }
@media (max-width: 575.98px) { .pc-legal { padding: 1.25rem 1rem; } .pc-legal table { display: block; overflow-x: auto; } }

/* Modules the plan lacks: shown locked, a click opens the upgrade pop-up (owner 2026-10-22). */
button.pc-link { width: 100%; background: none; border: 0; border-left: 3px solid transparent; text-align: left; font: inherit; }
.pc-link.pc-locked { color: rgba(255, 255, 255, .55); }
.pc-link.pc-locked:hover { color: #fff; }
.pc-locked .pc-lock { margin-left: auto; font-size: .8rem; width: auto; color: var(--pc-gold); }
.btn.pc-locked { opacity: .75; }
.btn.pc-locked .pc-lock { color: var(--pc-gold); margin-left: .25rem; }

/* Appointment diary (owner 2026-10-23): rows = slots, columns = doctors. */
.pc-diary th { background: var(--pc-th-bg); font-weight: 600; font-size: .85rem; }
.pc-diary td { padding: .35rem .45rem; }
.pc-diary-many td { min-width: 14rem; } /* several doctors: the table scrolls sideways on a phone */
.pc-diary .pc-diary-time { width: 4.5rem; min-width: 4.5rem; }
.pc-appt { border-left: 3px solid var(--pc-green); background: var(--pc-mint); border-radius: .35rem; padding: .3rem .5rem; margin-bottom: .3rem; }
.pc-appt-done { border-left-color: #adb5bd; background: var(--pc-done-bg); }
.pc-diary-add { display: inline-block; color: var(--pc-placeholder); text-decoration: none; font-size: 1.1rem; line-height: 1; padding: 0 .3rem; border-radius: .3rem; }
.pc-diary-add:hover { color: var(--pc-green); background: var(--pc-mint); }

/* Online booking (owner 2026-10-24): QR on the settings page and the poster, the public booking page. */
.pc-qr-lg svg { width: 180px; height: 180px; }
.pc-qr-poster { width: 300px; }
.pc-qr-poster svg { width: 300px; height: 300px; }
.pc-book-logo { height: 56px; width: auto; max-width: 120px; object-fit: contain; background: #fff; border-radius: .5rem; padding: .25rem; }
.pc-book .btn-check + .btn { min-width: 4.6rem; }
.pc-book-days .btn { line-height: 1.15; }
.pc-book-days .btn small { display: block; font-size: .72rem; opacity: .8; }

/* Page-head action buttons on a phone (owner 2026-10-24: four buttons filled the screen): one row like an app
   toolbar - icon above a small label, all the same width. */
@media (max-width: 575.98px) {
  .pc-actions { width: 100%; flex-wrap: nowrap !important; gap: .35rem !important; }
  .pc-actions > a, .pc-actions > button, .pc-actions > form { flex: 1 1 0; min-width: 0; }
  .pc-actions > form > .btn { width: 100%; height: 100%; }
  .pc-actions .btn { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .1rem;
    padding: .35rem .15rem; font-size: .7rem; line-height: 1.15; white-space: normal; text-align: center; }
  .pc-actions .btn > .bi:first-child { font-size: 1.15rem; margin: 0 !important; }
  .pc-actions .btn .pc-lock { position: absolute; top: .15rem; right: .25rem; font-size: .6rem; margin: 0; }
}

/* ---------- Night look (moon / sun button, owner 2026-10-24: doctors who run the clinic at night) ----------
   public/js/theme.js sets data-bs-theme on <html> before the page draws (saved choice, else the device's setting).
   Printouts carry data-bs-theme="light" and stay paper-white. */
[data-bs-theme="dark"] {
  --pc-bg: #0f1411;
  --pc-surface: #1a211c;
  --pc-line: #2b3530;
  --pc-mint: #1f3a2a;
  --pc-gold-soft: #3b3020;
  --pc-ink: #8fd1a8;
  --pc-strong: #eef3ef;
  --pc-muted: #a3b0a7;
  --pc-th-bg: #222b25;
  --pc-th-ink: #a3b0a7;
  --pc-label: #f3f6f4;
  --pc-field-border: #46534b;
  --pc-placeholder: #7b887f;
  --pc-done-bg: #222924;
  --pc-shadow: rgba(0, 0, 0, .45);
  --bs-body-bg: #1a211c;
  --bs-body-color: #e3e9e5;
  --bs-secondary-color: #a3b0a7;
  --bs-border-color: #2f3a33;
  --bs-link-color: #8fd1a8;
  --bs-link-color-rgb: 143, 209, 168;
  --bs-link-hover-color: #b6e5c8;
  --bs-link-hover-color-rgb: 182, 229, 200;
}
[data-bs-theme="dark"] .btn-outline-primary { --bs-btn-color: #8fd1a8; --bs-btn-border-color: #4f9a6e; --bs-btn-hover-color: #fff; }
[data-bs-theme="dark"] .form-control, [data-bs-theme="dark"] .form-select, [data-bs-theme="dark"] .input-group-text { background-color: #121815; }
[data-bs-theme="dark"] .pc-sidebar-inner { background: #183a27; }
[data-bs-theme="dark"] .pc-link.active { background: #23513a; }

.pc-theme-toggle { color: var(--pc-ink); font-size: 1.15rem; line-height: 1; text-decoration: none; }
.pc-theme-toggle:hover { color: var(--pc-gold); }
.pc-theme-sun { display: none; color: var(--pc-gold); }
[data-bs-theme="dark"] .pc-theme-sun { display: inline-block; }
[data-bs-theme="dark"] .pc-theme-moon { display: none; }
.pc-theme-float { position: fixed; bottom: .75rem; right: .75rem; z-index: 1030; border-radius: 50%;
  --bs-btn-bg: var(--pc-surface); --bs-btn-hover-bg: var(--pc-surface); --bs-btn-active-bg: var(--pc-surface);
  box-shadow: 0 1px 3px var(--pc-shadow); width: 2.4rem; height: 2.4rem; display: inline-flex; align-items: center; justify-content: center; }

/* IPD board (owner 2026-10-24): one card per bed. */
.pc-bed { border: 1px solid var(--pc-line); box-shadow: none; color: var(--pc-strong); }
.pc-bed-busy { border-color: var(--pc-gold); background: var(--pc-gold-soft); }
a.pc-bed-busy:hover { border-color: var(--pc-green); }
