/* ============================================================
   CAREGIVER CONSOLE THEME — loads after styles.css
   A calmer clinical-control aesthetic: indigo, slate, mint and
   coral alert states. Scoped to body[data-role="caregiver"] so
   the senior voice theme remains untouched.
   ============================================================ */

body[data-role="caregiver"]:not(.contrast){
  --bg:#f4f7fc;
  --surface:#ffffff;
  --surface-2:#eef3ff;
  --surface-3:#e3ebfb;
  --text:#172033;
  --muted:#5f6d85;
  --line:#d7e0ef;
  --accent:#3557d5;
  --accent-strong:#243ea8;
  --accent-soft:#e8eeff;
  --danger:#c2414b;
  --danger-soft:#fde8ea;
  --warning:#a16207;
  --warning-soft:#fff3d6;
  --shadow:0 24px 60px rgba(31,45,84,.12);
  --shadow-sm:0 10px 28px rgba(31,45,84,.08);
  --radius:28px;
  --radius-sm:16px;
}

body[data-role="caregiver"]{
  background:
    radial-gradient(circle at 88% -12%, rgba(109,139,255,.24) 0, transparent 34%),
    radial-gradient(circle at -8% 18%, rgba(45,212,191,.16) 0, transparent 30%),
    linear-gradient(180deg,#f8faff 0%,#eef3fb 100%);
  color:var(--text);
}

body[data-role="caregiver"] ::selection{ background:#c7d5ff; color:#172033; }
body[data-role="caregiver"] button:focus-visible,
body[data-role="caregiver"] a:focus-visible,
body[data-role="caregiver"] input:focus-visible,
body[data-role="caregiver"] select:focus-visible,
body[data-role="caregiver"] textarea:focus-visible{ outline-color:#9db4ff; }

/* ---------- Brand / top bar ---------- */
body[data-role="caregiver"] .topbar{
  background:rgba(255,255,255,.88);
  border-bottom:1px solid rgba(215,224,239,.92);
  box-shadow:0 14px 34px rgba(23,32,51,.07);
}
body[data-role="caregiver"] .brand{ gap:12px; }
body[data-role="caregiver"] .brandmark{
  background:linear-gradient(135deg,var(--accent-strong),#6d8bff);
  box-shadow:0 12px 24px rgba(53,87,213,.24);
}
body[data-role="caregiver"] .brand small{ color:var(--muted); font-weight:750; }
body[data-role="caregiver"] .top-actions{ align-items:center; }
body[data-role="caregiver"] .top-actions button{ min-height:46px; border-radius:999px; }
body[data-role="caregiver"] .top-actions button[data-action="logout"]{
  background:#fff;color:var(--accent-strong);border-color:#cfdbfb;font-weight:850;
}

/* ---------- App shell and side console ---------- */
body[data-role="caregiver"] .shell{ max-width:1680px; }
body[data-role="caregiver"] aside{
  position:sticky;
  top:78px;
  height:calc(100vh - 78px);
  overflow:auto;
  padding:26px 16px 22px;
  background:linear-gradient(180deg,rgba(255,255,255,.92),rgba(246,249,255,.80));
  border-right:1px solid rgba(215,224,239,.92);
  backdrop-filter:blur(16px);
}
body[data-role="caregiver"] aside>.eyebrow{ margin:2px 10px 16px; color:#7284a8; }
body[data-role="caregiver"] .link-section{
  margin:0 0 18px;
  padding:16px;
  background:linear-gradient(145deg,#ffffff,#f4f7ff);
  border:1px solid #d9e4fb;
  border-radius:22px;
  box-shadow:var(--shadow-sm);
}
body[data-role="caregiver"] .link-section .eyebrow{ color:var(--accent-strong); }
body[data-role="caregiver"] .link-section .primary{ width:100%; justify-content:center; }
body[data-role="caregiver"] #link-status-message{ margin:10px 2px 0; color:var(--muted); font-weight:700; }

body[data-role="caregiver"] nav{ display:grid; gap:8px; }
body[data-role="caregiver"] nav button{
  width:100%;
  justify-content:flex-start;
  gap:12px;
  min-height:50px;
  padding:12px 14px;
  border:1px solid transparent;
  border-radius:16px;
  background:transparent;
  color:var(--muted);
  box-shadow:none;
}
body[data-role="caregiver"] nav button:hover{
  transform:none;
  background:#fff;
  border-color:var(--line);
  color:var(--text);
  box-shadow:0 10px 22px rgba(31,45,84,.08);
}
body[data-role="caregiver"] nav button.active{
  background:linear-gradient(135deg,var(--accent),#6d8bff);
  border-color:transparent;
  color:#fff;
  box-shadow:0 14px 28px rgba(53,87,213,.25);
}
body[data-role="caregiver"] .nav-icon{
  width:34px;height:34px;flex:none;
  display:grid;place-items:center;
  border-radius:12px;
  background:var(--surface-2);
  color:var(--accent-strong);
}
body[data-role="caregiver"] nav button.active .nav-icon{
  background:rgba(255,255,255,.22);
  color:#fff;
}

body[data-role="caregiver"] .side-bottom{
  margin-top:22px;
  padding:16px;
  border:1px solid var(--line);
  border-radius:22px;
  background:rgba(255,255,255,.78);
  display:grid;
  gap:12px;
}
body[data-role="caregiver"] .side-bottom p#connection{
  margin:0;
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 12px;
  border-radius:999px;
  background:var(--surface-2);
  color:var(--accent-strong);
  font-weight:850;
  font-size:.82rem;
}
body[data-role="caregiver"] .side-bottom a{
  display:inline-flex;
  justify-content:center;
  padding:11px 14px;
  border-radius:999px;
  background:var(--accent-soft);
  color:var(--accent-strong);
  font-weight:850;
  text-decoration:none;
}

/* ---------- Main dashboard ---------- */
body[data-role="caregiver"] main{ padding:46px 46px 86px; }
body[data-role="caregiver"] .page-heading{ align-items:center; margin-bottom:30px; }
body[data-role="caregiver"] .page-heading .eyebrow{ color:#7284a8; font-weight:850; letter-spacing:.12em; }
body[data-role="caregiver"] .page-heading h1{ letter-spacing:-.06em; }
body[data-role="caregiver"] #role-label.pill{
  background:linear-gradient(135deg,#eaf0ff,#ffffff);
  border-color:#cfdbfb;
  color:var(--accent-strong);
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
  box-shadow:var(--shadow-sm);
}

body[data-role="caregiver"] .card{
  background:linear-gradient(180deg,#ffffff 0%,#fcfdff 100%);
  border:1px solid rgba(215,224,239,.96);
  border-radius:var(--radius);
  box-shadow:var(--shadow-sm);
}
body[data-role="caregiver"] .insight{
  background:linear-gradient(135deg,#f8fbff,#eef4ff);
  border-color:#cfdbfb;
}
body[data-role="caregiver"] .insight.attention{
  background:linear-gradient(135deg,#fffaf0,#fff7ed);
  border-color:#ead39a;
}
body[data-role="caregiver"] .section-head{ align-items:center; margin-bottom:18px; }
body[data-role="caregiver"] .section-head h2{ margin-bottom:0; letter-spacing:-.03em; }
body[data-role="caregiver"] .eyebrow{ color:#7284a8; }
body[data-role="caregiver"] .muted{ color:var(--muted); }

body[data-role="caregiver"] .row{ border-bottom:1px solid #e6ecf7; padding:18px 2px; }
body[data-role="caregiver"] .row:hover{
  background:linear-gradient(90deg,rgba(53,87,213,.045),rgba(53,87,213,0) 68%);
}
body[data-role="caregiver"] .row h3{ letter-spacing:-.02em; }
body[data-role="caregiver"] .row small{ color:#7d8aa5; font-weight:750; }
body[data-role="caregiver"] .prewrap{ white-space:pre-wrap; color:var(--muted); }

body[data-role="caregiver"] .empty{
  background:#fbfcff;
  border:1px dashed #bfcdea;
  border-radius:18px;
  color:var(--muted);
}

/* ---------- Status badges ---------- */
body[data-role="caregiver"] .pill,
body[data-role="caregiver"] .badge{
  background:#fff;
  border:1px solid var(--line);
  color:var(--muted);
  box-shadow:0 6px 16px rgba(31,45,84,.05);
}
body[data-role="caregiver"] .badge.taken,
body[data-role="caregiver"] .badge.completed{ background:#e8f7ee; border-color:#bfe8cf; color:#237346; }
body[data-role="caregiver"] .badge.accepted{ background:#e8f7ff; border-color:#bfe8f5; color:#0f6f8f; }
body[data-role="caregiver"] .badge.requested{ background:#fff3d6; border-color:#ecd39a; color:#8a5a08; }
body[data-role="caregiver"] .badge.due{ background:#e8eeff; border-color:#c9d7ff; color:#243ea8; }
body[data-role="caregiver"] .badge.overdue,
body[data-role="caregiver"] .badge.skipped,
body[data-role="caregiver"] .badge.open{ background:var(--danger-soft); border-color:#f2c4c8; color:var(--danger); }

/* ---------- Buttons, forms, dialogs, feedback ---------- */
body[data-role="caregiver"] button{ border-radius:14px; }
body[data-role="caregiver"] button.primary,
body[data-role="caregiver"] .button.primary{
  background:linear-gradient(135deg,var(--accent),#6d8bff);
  border-color:transparent;
  box-shadow:0 14px 28px rgba(53,87,213,.24);
}
body[data-role="caregiver"] button.primary:hover,
body[data-role="caregiver"] .button.primary:hover{
  background:linear-gradient(135deg,var(--accent-strong),var(--accent));
  border-color:transparent;
  box-shadow:0 18px 34px rgba(53,87,213,.30);
}
body[data-role="caregiver"] button.danger,
body[data-role="caregiver"] .help-button{
  background:var(--danger-soft);
  color:var(--danger);
  border-color:#f2c4c8;
}
body[data-role="caregiver"] input,
body[data-role="caregiver"] textarea,
body[data-role="caregiver"] select{
  background:#fbfcff;
  border:1px solid #d5dfef;
  border-radius:14px;
}
body[data-role="caregiver"] input:focus,
body[data-role="caregiver"] textarea:focus,
body[data-role="caregiver"] select:focus{
  border-color:var(--accent);
  box-shadow:0 0 0 4px rgba(53,87,213,.12);
}
body[data-role="caregiver"] dialog{
  border:1px solid rgba(215,224,239,.95);
  box-shadow:0 34px 90px rgba(15,23,42,.30);
}
body[data-role="caregiver"] #toast{
  border-radius:999px;
  background:#172033;
  color:#fff;
  box-shadow:0 18px 44px rgba(15,23,42,.28);
}
body[data-role="caregiver"] .banner{
  background:linear-gradient(135deg,#fff5f5,#fff1f2);
  border:1px solid #f2c4c8;
  border-left:6px solid var(--danger);
  box-shadow:var(--shadow-sm);
}
body[data-role="caregiver"] .banner.info{
  background:linear-gradient(135deg,#f3f7ff,#eef4ff);
  border:1px solid #cfdbfb;
  border-left-color:var(--accent);
}

/* ---------- Caregiver sign-in screen ---------- */
body[data-role="caregiver"] .unlock::before{ background:#dbe7ff; }
body[data-role="caregiver"] .unlock::after{ background:#e7fbff; }
body[data-role="caregiver"] .auth-card{
  border:1px solid rgba(215,224,239,.95);
  box-shadow:0 34px 100px rgba(23,32,51,.18);
}
body[data-role="caregiver"] .auth-intro{
  background:
    radial-gradient(circle at 90% 10%, rgba(255,255,255,.24) 0, transparent 34%),
    linear-gradient(145deg,#1e2a55,#3557d5 62%,#6d8bff);
}
body[data-role="caregiver"] .auth-intro .eyebrow,
body[data-role="caregiver"] .auth-intro .muted{ color:#dbe6ff; }
body[data-role="caregiver"] .auth-mark{
  background:rgba(255,255,255,.16);
  color:#fff;
  border:1px solid rgba(255,255,255,.28);
  box-shadow:0 14px 30px rgba(15,23,42,.20);
}
body[data-role="caregiver"] .auth-point span{
  background:#fff;
  color:var(--accent-strong);
  box-shadow:0 10px 22px rgba(15,23,42,.18);
}
body[data-role="caregiver"] .auth-tabs{ background:var(--surface-2); }
body[data-role="caregiver"] .auth-tab-btn.active{
  background:#fff;
  color:var(--accent-strong);
  box-shadow:0 10px 22px rgba(31,45,84,.10);
}
body[data-role="caregiver"] .auth-panel input,
body[data-role="caregiver"] .auth-panel select{ background:#fbfcff; }
body[data-role="caregiver"] .dashboard-link-container a{
  display:inline-flex;
  padding:10px 14px;
  border-radius:999px;
  background:var(--accent-soft);
  color:var(--accent-strong);
  font-weight:850;
  text-decoration:none;
}

/* ---------- Density and small screens ---------- */
@media(min-width:761px){
  body[data-role="caregiver"] .row .actions{ width:auto; justify-content:flex-end; }
  body[data-role="caregiver"] .row .actions button{ flex:0 1 auto; }
}
@media(max-width:1050px){
  body[data-role="caregiver"] aside{ position:static; height:auto; overflow:visible; }
  body[data-role="caregiver"] nav{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:760px){
  body[data-role="caregiver"] .shell{ display:block; }
  body[data-role="caregiver"] aside{ border-right:0; border-bottom:1px solid rgba(215,224,239,.92); }
  body[data-role="caregiver"] nav{ grid-template-columns:1fr; }
  body[data-role="caregiver"] main{ padding:28px 18px 70px; }
  body[data-role="caregiver"] .page-heading{ align-items:flex-start; flex-direction:column; }
  body[data-role="caregiver"] .top-actions{ width:100%; }
  body[data-role="caregiver"] .top-actions button{ flex:1 1 auto; }
}