/* Rivaz V150 — UI only. Loaded last on Login, Clinic Admin, Reception, Doctor and Dispensary.
   1) Rivaz Ops logo at the bottom of the left side panel (Clinic Admin, Reception).
   2) Doctor: Rivaz Ops logo in the top bar (replaces the date chip); status-coloured counts.
   3) Login pages: logo 25% smaller; "Welcome to" black + project name blue, both with a white outline. */

/* ---------- 1) Side panel logo (Clinic Admin + Reception) ---------- */
.rz-side-logo { display: flex; justify-content: center; align-items: center; padding: 14px 10px 4px; margin-top: 10px; border-top: 1px solid var(--rz-panel-line, rgba(255,255,255,.10)); }
.rz-side-logo img { display: block; width: 100%; max-width: 150px; height: auto; background: transparent; }
body[data-module="clinic-admin"] .rz-side-logo { margin-top: 0; }
/* Phones / small tablets: the panel becomes the top bar, so the logo is not repeated there. */
@media screen and (max-width: 900px) { body[data-module="clinic-admin"] .rz-side-logo { display: none !important; } }
@media screen and (max-width: 880px) { body[data-module="reception"] .rz-side-logo { display: none !important; } }
/* Short desktop windows: shrink so the menu still fits. */
@media screen and (min-width: 901px) and (max-height: 720px) { .rz-side-logo img { max-width: 110px; } .rz-side-logo { padding-top: 10px; } }

/* ---------- 2) Doctor ---------- */
/* Top bar: Rivaz Ops logo on the left, clinic logo + name in the centre, doctor / buttons on the right. */
body[data-module="doctor"] .appbar.rz-appbar3 { display: grid !important; grid-template-columns: minmax(0,1fr) auto minmax(0,1fr); align-items: center; gap: 12px; }
body[data-module="doctor"] .rz-appbar3 .rz-appbar-logo { justify-self: start; display: flex; align-items: center; min-width: 0; }
body[data-module="doctor"] .rz-appbar3 .rz-appbar-logo img { display: block; height: 36px; width: auto; max-width: 100%; background: transparent; }
body[data-module="doctor"] .rz-appbar3 .rz-al-icon { display: none !important; }
body[data-module="doctor"] .rz-appbar3 .brand-row { justify-self: center; min-width: 0; max-width: 100%; flex: none !important; text-align: left; }
body[data-module="doctor"] .rz-appbar3 .brand-row > div { min-width: 0; }
body[data-module="doctor"] .rz-appbar3 .brand-row b { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body[data-module="doctor"] .rz-appbar-right { justify-self: end; display: flex; align-items: center; gap: 12px; min-width: 0; }
@media screen and (max-width: 1180px) {
  body[data-module="doctor"] .rz-appbar3 .rz-al-full { display: none !important; }
  body[data-module="doctor"] .rz-appbar3 .rz-al-icon { display: block !important; height: 32px; }
  body[data-module="doctor"] .rz-appbar-right .me > div { display: none; }   /* avatar only */
}
/* Phones: row 1 = Rivaz logo | clinic (centre) | doctor avatar; row 2 = Change password + Sign out */
@media screen and (max-width: 760px) {
  body[data-module="doctor"] .appbar.rz-appbar3 { grid-template-columns: 44px minmax(0,1fr) 44px; grid-template-rows: auto auto; gap: 8px; row-gap: 8px; }
  body[data-module="doctor"] .rz-appbar-right { display: contents; }
  body[data-module="doctor"] .rz-appbar3 .rz-appbar-logo { grid-column: 1; grid-row: 1; }
  body[data-module="doctor"] .rz-appbar3 .rz-al-icon { height: 26px; }
  body[data-module="doctor"] .rz-appbar3 .brand-row { grid-column: 2; grid-row: 1; justify-self: center; gap: 8px; }
  body[data-module="doctor"] .rz-appbar3 .brand-row b { max-width: none !important; font-size: 15px; }
  body[data-module="doctor"] .rz-appbar3 .brand-row svg,
  body[data-module="doctor"] .rz-appbar3 .brand-row .clinic-logo-img { width: 30px !important; height: 30px !important; flex: 0 0 30px; }
  body[data-module="doctor"] .rz-appbar-right .me { grid-column: 3; grid-row: 1; justify-self: end; }
  body[data-module="doctor"] .rz-appbar-right .me svg { width: 32px; height: 32px; }
  body[data-module="doctor"] .rz-appbar-right .btn[data-act="change-password"] { grid-column: 1 / 3; grid-row: 2; justify-content: center; width: 100%; }
  body[data-module="doctor"] .rz-appbar-right .top-logout { grid-column: 3; grid-row: 2; justify-self: end; white-space: nowrap; }
}
@media screen and (max-width: 760px) {
  /* give Sign out more room than the 44px avatar column */
  body[data-module="doctor"] .appbar.rz-appbar3 { grid-template-columns: 44px minmax(0,1fr) auto; }
}
@media print { body[data-module="doctor"] .rz-appbar-logo { display: none !important; } }

/* status colours: Waiting = blue, Consulted = green, Next day = amber, Future = violet */
body[data-module="doctor"] { --rz-st-wait: #1D63D8; --rz-st-done: #1E9A55; --rz-st-next: #E08A00; --rz-st-future: #7652D6; }
body[data-module="doctor"] .tab .tn {
  display: inline-flex; align-items: center; justify-content: center; text-align: center;
  min-width: 40px; height: 36px; padding: 0 10px; border-radius: 999px; line-height: 1;
  color: #fff !important; background: var(--rz-st-wait); box-shadow: 0 0 0 2px rgba(255,255,255,.85);
}
body[data-module="doctor"] .tab .tn-today { background: var(--rz-st-wait); }
body[data-module="doctor"] .tab .tn-consulted { background: var(--rz-st-done); }
body[data-module="doctor"] .tab .tn-next { background: var(--rz-st-next); }
body[data-module="doctor"] .tab .tn-future { background: var(--rz-st-future); }
@media screen and (max-width: 480px) { body[data-module="doctor"] .tab .tn { min-width: 32px; height: 30px; padding: 0 8px; } }

html:root body[data-module="doctor"] .hello-stats div.hs-waiting { background: var(--rz-st-wait) !important; }
html:root body[data-module="doctor"] .hello-stats div.hs-consulted { background: var(--rz-st-done) !important; }
html:root body[data-module="doctor"] .hello-stats div.hs-next { background: var(--rz-st-next) !important; }
html:root body[data-module="doctor"] .hello-stats div[class^="hs-"] { color: #fff !important; border: 1px solid rgba(255,255,255,.35); }
html:root body[data-module="doctor"] .hello-stats div[class^="hs-"] span { opacity: 1; }

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) body[data-module="doctor"] { --rz-st-wait: #2F74E6; --rz-st-done: #23A35E; --rz-st-next: #D98300; --rz-st-future: #8466E0; }
  :root:not([data-theme="light"]) body[data-module="doctor"] .tab .tn { box-shadow: 0 0 0 2px rgba(255,255,255,.18); }
}
:root[data-theme="dark"] body[data-module="doctor"] { --rz-st-wait: #2F74E6; --rz-st-done: #23A35E; --rz-st-next: #D98300; --rz-st-future: #8466E0; }
:root[data-theme="dark"] body[data-module="doctor"] .tab .tn { box-shadow: 0 0 0 2px rgba(255,255,255,.18); }

/* ---------- 3) Login pages ---------- */
/* Logo 25% smaller */
body[data-module="login"] .rzl-logo img { width: min(390px, 64.5%) !important; }
body[data-module="login"] .rzl-logo-m { width: min(172px, 51vw) !important; }
body[data-module="dispensary"] .rz-dlogin-head .rivaz-login-img { width: min(172px, 48%) !important; }

/* "Welcome to" black, project name blue — both with a white outline (light and dark mode) */
body[data-module="login"] .rzl-title,
body[data-module="dispensary"] .rz-welcome-title {
  color: #0B6FD6 !important;
  text-shadow: -1.5px -1.5px 0 #fff, 1.5px -1.5px 0 #fff, -1.5px 1.5px 0 #fff, 1.5px 1.5px 0 #fff,
               0 -2px 0 #fff, 0 2px 0 #fff, -2px 0 0 #fff, 2px 0 0 #fff !important;
}
body[data-module="login"] .rzl-title .rzl-l1,
body[data-module="dispensary"] .rz-welcome-title .rzl-l1 { color: #000 !important; }
@supports (paint-order: stroke fill) and (-webkit-text-stroke: 1px #fff) {
  body[data-module="login"] .rzl-title,
  body[data-module="dispensary"] .rz-welcome-title {
    text-shadow: none !important; -webkit-text-stroke: 4px #fff; paint-order: stroke fill;
  }
}
