/* ==========================================================================
   CareMetrix — Roster Templates page
   Ported from roster-template-redesign-v5.html. Every rule is scoped under
   `.rt` so this page's `.card`, `.btn`, `.tabs`, `.field`, `table` etc. cannot
   collide with the shared components in components.css. Its design tokens live
   on `.rt` rather than `:root` for the same reason.
   ========================================================================== */

.rt { font-family: 'Inter', 'Plus Jakarta Sans', sans-serif; color: var(--ink-900); }
.rt h1, .rt h2, .rt h3, .rt h4, .rt .disp { font-family: 'Plus Jakarta Sans', sans-serif; }
.rt button { font-family: inherit; cursor: pointer; }
.rt input, .rt select, .rt textarea { font-family: inherit; }

.rt { --purple-900:#3B1878; --purple-700:#6D28D9; --purple-600:#7C3AED; --purple-500:#8B5CF6; --pink-500:#EC4899; --orange-400:#FB923C; --bg:#F6F4FB; --surface:#FFFFFF; --ink-900:#211334; --ink-700:#453A57; --ink-500:#6E6480; --ink-400:#8D84A0; --line:#E7E1F4; --line-soft:#F0ECF9; --green-700:#127A43; --green-100:#E4F8ED; --amber-700:#B15C00; --amber-100:#FFF3DE; --red-700:#C22B3B; --red-100:#FDEAEC; --radius-lg:18px; --radius-md:12px; --radius-sm:8px; --shadow-card:0 1px 2px rgba(59,24,120,.06), 0 8px 24px -12px rgba(59,24,120,.18); --shadow-pop:0 20px 60px -20px rgba(59,24,120,.45); }
/* ---------- layout ---------- */
.rt .crumbs { font-size:13px;color:var(--ink-400);display:flex;align-items:center;gap:6px;margin-bottom:14px; }
.rt .crumbs b { color:var(--purple-700);font-weight:600; }
.rt .crumbs .sep { opacity:.5; }
.rt .crumbs a { color:var(--ink-500);text-decoration:none;cursor:pointer; }
.rt .crumbs a:hover { color:var(--purple-700); }
/* ---------- buttons ---------- */
.rt .btn { border:none;border-radius:999px;padding:10px 18px;font-size:13.5px;font-weight:600; display:inline-flex;align-items:center;gap:7px;transition:transform .12s ease, box-shadow .12s ease; }
.rt .btn:active { transform:translateY(1px); }
.rt .btn-grad { background:linear-gradient(115deg,var(--purple-600),var(--pink-500) 65%, var(--orange-400));color:#fff;box-shadow:0 8px 18px -8px rgba(140,40,180,.55); }
.rt .btn-grad:hover { box-shadow:0 10px 22px -6px rgba(140,40,180,.6); }
.rt .btn-outline { background:#fff;border:1px solid var(--line);color:var(--ink-700); }
.rt .btn-outline:hover { border-color:var(--purple-500);color:var(--purple-700); }
.rt .btn-ghost { background:transparent;color:var(--ink-500); }
.rt .btn-ghost:hover { color:var(--purple-700); }
.rt .btn-sm { padding:6px 12px;font-size:12.5px;border-radius:8px; }
.rt .btn-danger-outline { background:#fff;border:1px solid var(--red-100);color:var(--red-700); }
.rt .btn:disabled { opacity:.45;cursor:not-allowed; }
/* ---------- page header ---------- */
.rt .page-head { display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:20px;gap:20px;flex-wrap:wrap; }
.rt .page-head h1 { font-size:23px;margin:0 0 4px;font-weight:700; }
.rt .page-head p { margin:0;color:var(--ink-500);font-size:13.5px; }
/* ---------- summary pills ---------- */
.rt .stat-row { display:flex;gap:12px;flex-wrap:wrap;margin-bottom:18px; }
.rt .stat-pill { background:#fff;border:1px solid var(--line);border-radius:14px;padding:12px 16px; display:flex;align-items:center;gap:10px;min-width:150px;box-shadow:var(--shadow-card); }
.rt .stat-pill .ic { width:34px;height:34px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:15px;flex:none; }
.rt .stat-pill.purple .ic { background:#F1E9FF;color:var(--purple-700); }
.rt .stat-pill.blue .ic { background:#E7F1FF;color:#1D5FBF; }
.rt .stat-pill.green .ic { background:var(--green-100);color:var(--green-700); }
.rt .stat-pill.amber .ic { background:var(--amber-100);color:var(--amber-700); }
.rt .stat-pill .num { font-size:17px;font-weight:800;line-height:1.1; }
.rt .stat-pill .lbl { font-size:11.5px;color:var(--ink-500); }
/* ---------- table card ---------- */
.rt .card { background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);box-shadow:var(--shadow-card); }
.rt .card-pad { padding:22px 24px; }
.rt .table-toolbar { display:flex;justify-content:space-between;align-items:center;gap:16px;padding:20px 24px 6px;flex-wrap:wrap; }
.rt .field-search { flex:1;max-width:340px;display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:10px;padding:9px 12px;color:var(--ink-400);font-size:13px; }
.rt .field-search input { border:none;outline:none;background:transparent;width:100%;font-size:13px;color:var(--ink-900); }
.rt table { width:100%;border-collapse:collapse; }
.rt thead th { text-align:left;font-size:11.5px;color:var(--ink-500);font-weight:600; padding:14px 16px;border-bottom:1px solid var(--line);white-space:nowrap; }
.rt tbody td { padding:16px;border-bottom:1px solid var(--line-soft);font-size:13.5px;vertical-align:middle; }
.rt tbody tr { cursor:pointer;transition:background .12s ease; }
.rt tbody tr:hover { background:#FBF9FF; }
.rt tbody tr:last-child td { border-bottom:none; }
.rt .t-name { font-weight:700;color:var(--ink-900); }
.rt .t-code { font-size:11.5px;color:var(--ink-400); }
.rt .loc { display:flex;align-items:flex-start;gap:6px;color:var(--ink-700); }
.rt .loc .sub { color:var(--ink-400);font-size:12px; }
.rt .pill { display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:5px 11px;font-size:12px;font-weight:600; }
.rt .pill-recur { background:#FCE7F6;color:#B6157F; }
.rt .pill-active { background:var(--green-100);color:var(--green-700); }
.rt .pill-active::before { content:'';width:6px;height:6px;border-radius:50%;background:var(--green-700); }
.rt .count-chip { display:inline-flex;align-items:center;gap:6px;font-weight:600;color:var(--ink-700); }
.rt .count-chip .ic { font-size:12px; }
.rt .fund-ok { display:inline-flex;align-items:center;gap:6px;background:var(--green-100);color:var(--green-700);border-radius:999px;padding:5px 11px;font-size:12px;font-weight:700; }
.rt .fund-warn { display:inline-flex;align-items:center;gap:6px;background:var(--red-100);color:var(--red-700);border-radius:999px;padding:5px 11px;font-size:12px;font-weight:700; }
.rt .row-action { color:var(--ink-400);font-size:16px;padding:6px;border-radius:6px; }
.rt .row-action:hover { background:var(--line-soft);color:var(--purple-700); }
/* ---------- banners ---------- */
.rt .banner { border-radius:var(--radius-md);padding:14px 18px;display:flex;gap:12px;align-items:flex-start;margin-bottom:20px; }
.rt .banner-warn { background:var(--amber-100);border:1px solid #F6D8A6; }
.rt .banner-warn .ic { color:var(--amber-700);font-size:17px; }
.rt .banner-ok { background:var(--green-100);border:1px solid #B9EBCB; }
.rt .banner-ok .ic { color:var(--green-700);font-size:17px; }
.rt .banner h4 { margin:0 0 3px;font-size:13.5px;font-weight:700; }
.rt .banner-warn h4 { color:var(--amber-700); }
.rt .banner-ok h4 { color:var(--green-700); }
.rt .banner p { margin:0;font-size:12.8px;color:var(--ink-700);line-height:1.5; }
.rt .banner .names { font-weight:700;color:var(--ink-900); }
.rt .banner .actions { margin-top:8px;display:flex;gap:8px; }
/* ---------- template details header ---------- */
.rt .detail-card { padding:22px 24px;margin-bottom:20px; }
.rt .detail-top { display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap; }
.rt .detail-title { display:flex;align-items:center;gap:12px; }
.rt .detail-title .ic { width:44px;height:44px;border-radius:12px;background:linear-gradient(135deg,#F1E9FF,#FCE7F6);display:flex;align-items:center;justify-content:center;font-size:19px; }
.rt .detail-title h2 { margin:0;font-size:18px; }
.rt .detail-title .sub { font-size:12px;color:var(--ink-400); }
.rt .detail-grid { display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:20px; }
.rt .dg-item {  }
.rt .dg-item .k { font-size:11px;color:var(--ink-400);font-weight:600;display:flex;align-items:center;gap:6px;margin-bottom:5px; }
.rt .dg-item .v { font-size:14px;font-weight:600;color:var(--ink-900); }
.rt .dg-item .v2 { font-size:12px;color:var(--ink-500); }
/* ---------- shift timeline ---------- */
.rt .sched-head { display:flex;justify-content:space-between;align-items:center;margin:26px 0 14px; }
.rt .sched-head h3 { margin:0;font-size:16px; }
.rt .timeline { display:grid;grid-template-columns:repeat(7,1fr);gap:12px; }
.rt .day-col { background:#fff;border:1px solid var(--line);border-radius:var(--radius-md);min-height:180px;overflow:hidden; }
.rt .day-col .dh { padding:11px 12px;border-bottom:1px solid var(--line-soft);font-size:12px;font-weight:700;color:var(--ink-500);display:flex;justify-content:space-between; }
.rt .day-col .dh span { color:var(--ink-300,#B7ADC9);font-weight:600; }
.rt .day-body { padding:10px;display:flex;flex-direction:column;gap:8px; }
.rt .shift-chip { background:linear-gradient(135deg,#F4EEFF,#FCEFFA);border:1px solid #E7D6FF;border-left:4px solid var(--purple-500); border-radius:10px;padding:9px 10px;cursor:pointer;transition:transform .1s ease; }
.rt .shift-chip:hover { transform:translateY(-1px);box-shadow:0 6px 16px -8px rgba(120,40,180,.4); }
.rt .shift-chip.has-warn { border-left-color:var(--red-700); }
.rt .shift-chip .time { font-size:12px;font-weight:700;color:var(--ink-900); }
.rt .shift-chip .meta { display:flex;gap:8px;margin-top:6px;flex-wrap:wrap; }
.rt .shift-chip .meta span { font-size:10.5px;color:var(--ink-500);display:flex;align-items:center;gap:3px; }
.rt .shift-chip .warn-dot { display:inline-flex;align-items:center;gap:4px;color:var(--red-700);font-size:10.5px;font-weight:700;margin-top:6px; }
.rt .day-empty { color:var(--ink-400);font-size:11.5px;padding:16px 10px;text-align:center; }
/* ---------- overlay / modal / drawer ---------- */
.rt .section-label { font-size:11.5px;font-weight:700;color:var(--purple-700);letter-spacing:.3px;margin:0 0 12px;text-transform:uppercase; }
.rt .field-grid { display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:18px; }
.rt .field label { display:block;font-size:12.5px;font-weight:600;color:var(--ink-700);margin-bottom:6px; }
.rt .field input[type=time], .rt .field input[type=date], .rt .field input[type=text], .rt .field input[type=number], .rt .field select, .rt .field textarea { width:100%;border:1px solid var(--line);border-radius:9px;padding:9px 11px;font-size:13px;color:var(--ink-900);background:#fff;outline:none; }
.rt .field input:focus, .rt .field select:focus, .rt .field textarea:focus { border-color:var(--purple-500);box-shadow:0 0 0 3px #EFE4FF; }
.rt .field-hint { font-size:11.5px;color:var(--ink-400);margin-top:4px; }
.rt .day-toggle-row { display:flex;gap:8px;flex-wrap:wrap;margin-bottom:6px; }
.rt .day-toggle { border:1px solid var(--line);background:#fff;border-radius:9px;padding:8px 0;width:52px;text-align:center;font-size:12.5px;font-weight:600;color:var(--ink-700); }
.rt .day-toggle.on { background:var(--purple-700);border-color:var(--purple-700);color:#fff; }
.rt .info-strip { display:flex;align-items:center;gap:10px;background:#F6F1FF;border:1px solid #E6D9FF;border-radius:10px;padding:10px 14px;margin:14px 0 20px;font-size:12.5px;color:var(--purple-700);flex-wrap:wrap; }
.rt .info-strip b { font-weight:700; }
.rt .info-strip .dur { margin-left:auto;background:#fff;border:1px solid #E6D9FF;border-radius:999px;padding:4px 12px;font-weight:700;color:var(--ink-900); }
.rt .combo { position:relative; }
.rt .combo-input { border:1px solid var(--line);border-radius:10px;padding:8px 10px;display:flex;flex-wrap:wrap;gap:6px;min-height:44px;align-items:center; }
.rt .combo-input input { border:none;outline:none;flex:1;min-width:120px;font-size:13px;padding:4px; }
.rt .combo-chip { background:#F1E9FF;color:var(--purple-700);border-radius:999px;padding:5px 8px 5px 11px;font-size:12.5px;font-weight:600;display:flex;align-items:center;gap:6px; }
.rt .combo-chip button { border:none;background:transparent;color:var(--purple-700);font-size:13px;line-height:1;cursor:pointer;opacity:.7; }
.rt .combo-chip button:hover { opacity:1; }
.rt .combo-list { position:absolute;top:calc(100% + 6px);left:0;right:0;background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:var(--shadow-pop);z-index:5;max-height:230px;overflow-y:auto; }
.rt .combo-opt { padding:10px 14px;display:flex;justify-content:space-between;align-items:center;font-size:13px;cursor:pointer; }
.rt .combo-opt:hover { background:#FBF9FF; }
.rt .combo-opt .n { font-weight:600; }
.rt .combo-opt .d { font-size:11.5px;color:var(--ink-400); }
.rt .combo-empty { padding:14px;font-size:12.5px;color:var(--ink-400);text-align:center; }
/* participant card in modal */
.rt .pcard { border:1px solid var(--line);border-radius:14px;margin-bottom:16px;overflow:hidden; }
.rt .pcard.unfunded { border-color:#F3C4CC; }
.rt .pcard-head { display:flex;align-items:center;gap:12px;padding:14px 16px;background:#FBF9FF;border-bottom:1px solid var(--line-soft); }
.rt .pcard.unfunded .pcard-head { background:var(--red-100); }
.rt .pcard-head .av { width:36px;height:36px;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:13px; }
.rt .pcard-head .who { flex:1;min-width:0; }
.rt .pcard-head .who .n { font-weight:700;font-size:13.5px; }
.rt .pcard-head .who .d { font-size:11.5px;color:var(--ink-500); }
.rt .pcard-head .remove { border:none;background:transparent;color:var(--ink-400);font-size:15px;padding:4px; }
.rt .pcard-head .remove:hover { color:var(--red-700); }
.rt .pcard-body { padding:14px 16px; }
.rt .unfunded-note { display:flex;gap:10px;align-items:flex-start;background:#fff;border:1px dashed #F3C4CC;border-radius:10px;padding:12px 14px;font-size:12.5px;color:var(--red-700); }
.rt .unfunded-note b { display:block;margin-bottom:2px; }
.rt .srow { border:1px solid var(--line-soft);background:#FCFBFF;border-radius:12px;padding:12px 14px;margin-bottom:10px;position:relative; }
.rt .srow-grid { display:grid;grid-template-columns:1.3fr 1.3fr 1fr 1.4fr .7fr 1.2fr auto;gap:10px;align-items:end; }
.rt .srow label { display:block;font-size:10.5px;font-weight:700;color:var(--ink-400);text-transform:uppercase;letter-spacing:.3px;margin-bottom:5px; }
.rt .srow select, .rt .srow input { width:100%;border:1px solid var(--line);border-radius:8px;padding:7px 8px;font-size:12.5px;background:#fff; }
.rt .srow input[readonly] { background:#F3EFFB;color:var(--ink-500);font-weight:600; }
.rt .srow-remove { border:none;background:#fff;border:1px solid var(--line);color:var(--ink-400);border-radius:8px;width:32px;height:32px;display:flex;align-items:center;justify-content:center; }
.rt .srow-remove:hover { color:var(--red-700);border-color:#F3C4CC; }
.rt .srow-badge { position:absolute;top:-9px;left:12px;background:var(--purple-700);color:#fff;font-size:10px;font-weight:700;padding:2px 9px;border-radius:999px; }
.rt .addsvc-btn { border:1.5px dashed #CBB6F2;background:#FBF9FF;color:var(--purple-700);border-radius:10px;padding:9px 14px;font-size:12.5px;font-weight:700;width:100%;display:flex;align-items:center;justify-content:center;gap:7px; }
.rt .addsvc-btn:hover { background:#F3EBFF; }
.rt .alloc-meter { margin-top:12px;display:flex;align-items:center;gap:10px; }
.rt .alloc-bar { flex:1;height:7px;border-radius:999px;background:#EFE9FA;overflow:hidden; }
.rt .alloc-bar > div { height:100%;border-radius:999px; }
.rt .alloc-label { font-size:11.5px;font-weight:700;white-space:nowrap; }
.rt .empty-services { font-size:12.5px;color:var(--amber-700);background:var(--amber-100);border-radius:9px;padding:10px 12px;display:flex;gap:8px;align-items:center;margin-bottom:10px; }
/* apply modal */
.rt .apply-result { background:var(--green-100);border:1px solid #B9EBCB;border-radius:12px;padding:16px;margin-top:14px; }
.rt .apply-result h4 { margin:0 0 6px;color:var(--green-700);font-size:13.5px; }
.rt .apply-result ul { margin:8px 0 0;padding-left:18px;font-size:12.5px;color:var(--ink-700);line-height:1.7; }
/* details drawer table */
.rt .svc-table { width:100%;border-collapse:collapse;margin-top:8px; }
.rt .svc-table th { text-align:left;font-size:10.5px;color:var(--ink-400);text-transform:uppercase;letter-spacing:.3px;padding:7px 8px;border-bottom:1px solid var(--line); }
.rt .svc-table td { padding:9px 8px;font-size:12.5px;border-bottom:1px solid var(--line-soft); }
.rt .ratio-tag { background:#F1E9FF;color:var(--purple-700);border-radius:6px;padding:2px 8px;font-weight:700;font-size:11.5px; }
.rt .rt-view { display:none; }
.rt .rt-view.active { display:block; }
@media (max-width:1100px) {
  .rt .timeline { grid-template-columns:repeat(3,1fr); }
  .rt .detail-grid { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:800px) {
  .rt .srow-grid { grid-template-columns:1fr 1fr; }
}
/* ================= v2 — validity, stats, schedule ================= */

/* --- validity cell (listing) --- */
.rt .val-range { font-weight:600;color:var(--ink-900);white-space:nowrap;font-size:13px; }
.rt .val-range .arrow { color:var(--ink-400);margin:0 5px;font-weight:500; }
.rt .val-note { font-size:11.5px;margin-top:4px;display:inline-flex;align-items:center;gap:5px;font-weight:600; }
.rt .val-note::before { content:'';width:5px;height:5px;border-radius:50%;background:currentColor; }
.rt .val-note.active { color:var(--green-700); }
.rt .val-note.soon { color:var(--amber-700); }
.rt .val-note.expired { color:var(--red-700); }
.rt .val-note.upcoming { color:#1D5FBF; }
.rt .pill-soon { background:var(--amber-100);color:var(--amber-700); }
.rt .pill-soon::before { content:'';width:6px;height:6px;border-radius:50%;background:var(--amber-700); }
.rt .pill-expired { background:var(--red-100);color:var(--red-700); }
.rt .pill-expired::before { content:'';width:6px;height:6px;border-radius:50%;background:var(--red-700); }
.rt .pill-upcoming { background:#E7F1FF;color:#1D5FBF; }
.rt .pill-upcoming::before { content:'';width:6px;height:6px;border-radius:50%;background:#1D5FBF; }
/* --- stat cards --- */
.rt .stat-row { display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-bottom:18px; }
@media(max-width:1180px) {
  .rt .stat-row { grid-template-columns:repeat(3,1fr); }
}
.rt .stat-pill { background:#fff;border:1px solid var(--line);border-radius:14px;padding:14px 16px; display:block;min-width:0;box-shadow:var(--shadow-card);position:relative;overflow:hidden; }
.rt .stat-pill::after { content:'';position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--purple-500);opacity:.8; }
.rt .stat-pill.green::after { background:var(--green-700); }
.rt .stat-pill.amber::after { background:var(--amber-700); }
.rt .stat-pill.blue::after { background:#1D5FBF; }
.rt .stat-pill .top { display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:9px; }
.rt .stat-pill .num { font-family:'Plus Jakarta Sans',sans-serif;font-size:26px;font-weight:800;line-height:1;letter-spacing:-.5px; }
.rt .stat-pill .lbl { font-size:11.5px;color:var(--ink-500);line-height:1.35; }
.rt .stat-pill .ic { width:30px;height:30px;border-radius:9px;display:flex;align-items:center;justify-content:center;font-size:14px;flex:none; }
.rt .stat-pill.actionable { cursor:pointer; }
.rt .stat-pill.actionable:hover { border-color:var(--purple-500); }
.rt .stat-pill.amber .num { color:var(--amber-700); }
/* --- schedule shell --- */
.rt .sched-card { margin-top:22px;overflow:hidden; }
.rt .sched-head { display:flex;justify-content:space-between;align-items:flex-start;gap:24px;padding:20px 22px 0;margin:0;flex-wrap:wrap; }
.rt .sched-head h3 { margin:0 0 4px;font-size:17px; }
.rt .sched-sub { margin:0;font-size:12.5px;color:var(--ink-500);line-height:1.5;max-width:64ch; }
.rt .sched-legend { display:flex;gap:16px;flex-wrap:wrap;font-size:11.5px;color:var(--ink-500);padding-top:4px; }
.rt .sched-legend i { width:10px;height:10px;border-radius:3px;display:inline-block;margin-right:6px;vertical-align:-1px; }
.rt .tabs { display:flex;gap:2px;padding:16px 22px 0;border-bottom:1px solid var(--line); }
.rt .tab { background:none;border:none;padding:9px 15px 11px;font-size:13.5px;font-weight:600;color:var(--ink-400); border-bottom:2px solid transparent;margin-bottom:-1px;display:flex;align-items:center;gap:7px;border-radius:8px 8px 0 0; }
.rt .tab:hover { color:var(--purple-700);background:var(--line-soft); }
.rt .tab.active { color:var(--purple-700);border-bottom-color:var(--purple-600); }
.rt .tab .cnt { background:var(--line-soft);color:var(--ink-500);border-radius:999px;padding:1px 7px;font-size:11px; }
.rt .tab.active .cnt { background:#F1E9FF;color:var(--purple-700); }
.rt .tab-panel { display:none; }
.rt .tab-panel.active { display:block; }
.rt .sched-toolbar { display:flex;align-items:center;gap:12px;padding:14px 22px;flex-wrap:wrap;border-bottom:1px solid var(--line-soft); }
.rt .sched-empty { padding:56px 22px;text-align:center;color:var(--ink-400);font-size:13px; }
.rt .sched-empty b { display:block;color:var(--ink-700);font-size:14px;margin-bottom:6px; }
/* --- timeline view --- */
.rt .tl-wrap { overflow:auto;max-height:640px; }
.rt .tl-grid { min-width:960px;--slot:34px; }
.rt .tl-row { display:grid;grid-template-columns:84px repeat(7,1fr); }
.rt .tl-head { position:sticky;top:0;z-index:6;background:#fff;box-shadow:0 1px 0 var(--line); }
.rt .tl-head .th { padding:12px 8px;font-size:12px;font-weight:700;color:var(--ink-700);text-align:center;border-left:1px solid var(--line-soft); }
.rt .tl-head .th small { display:block;font-weight:600;font-size:10.5px;color:var(--ink-400);margin-top:2px; }
.rt .tl-head .th.corner { border-left:none;text-align:left;color:var(--ink-400);font-size:11px;font-weight:600;padding-left:16px; }
.rt .tl-head .th.weekend { background:#FEF4F9;color:#B6157F; }
.rt .tl-gutter { position:relative;background:linear-gradient(90deg,transparent,transparent); }
.rt .tl-time { height:var(--slot);font-size:11px;color:var(--ink-400);padding-right:12px;text-align:right; line-height:1;position:relative;top:-6px;font-variant-numeric:tabular-nums; }
.rt .tl-time.half { color:#C3BBD2;font-size:10px; }
.rt .tl-col { position:relative;border-left:1px solid var(--line-soft); }
.rt .tl-col.weekend { background:#FDF8FB; }
.rt .tl-slot { height:var(--slot);border-bottom:1px dashed #EFEAF8; }
.rt .tl-slot.hour { border-bottom:1px solid var(--line); }
.rt .tl-block { position:absolute;border-radius:11px;padding:8px 10px;overflow:hidden;cursor:pointer; border:1px solid #DCC9FA;border-left:4px solid var(--purple-500); background:linear-gradient(140deg,#F5EFFF,#FBF0FB); transition:box-shadow .12s ease,transform .12s ease; }
.rt .tl-block:hover { box-shadow:0 10px 24px -12px rgba(59,24,120,.5);transform:translateY(-1px);z-index:4; }
.rt .tl-block.weekend { border-color:#F9CFE6;border-left-color:var(--pink-500);background:linear-gradient(140deg,#FEF1F8,#FDF3FA); }
.rt .tl-block.warn { border-color:#F6D8A6;border-left-color:var(--amber-700);background:linear-gradient(140deg,#FFF6E8,#FFFBF2); }
.rt .tl-block .t { font-size:12px;font-weight:800;color:var(--ink-900);line-height:1.25; }
.rt .tl-block .h { font-size:11.5px;font-weight:700;color:var(--purple-700);margin-top:1px; }
.rt .tl-block.weekend .h { color:#B6157F; }
.rt .tl-block.warn .h { color:var(--amber-700); }
.rt .tl-block .m { display:flex;flex-wrap:wrap;gap:5px;margin-top:7px; }
.rt .tl-block .m span { background:rgba(255,255,255,.75);border:1px solid rgba(124,58,237,.12);border-radius:6px; padding:2px 6px;font-size:10.5px;font-weight:600;color:var(--ink-700);white-space:nowrap; }
.rt .tl-block .flag { margin-top:6px;font-size:10.5px;font-weight:700;color:var(--amber-700); }
.rt .tl-block.compact { padding:5px 8px; }
.rt .tl-block.compact .m, .rt .tl-block.compact .flag { display:none; }
.rt .tl-block.compact .t { font-size:11px; }
/* --- participant view --- */
.rt .pv-wrap { overflow:auto;max-height:660px; }
.rt .pv-table { width:100%;border-collapse:separate;border-spacing:0;min-width:1080px; }
.rt .pv-table th { position:sticky;top:0;z-index:5;background:#fff;text-align:left;font-size:11.5px;font-weight:700; color:var(--ink-700);padding:12px 12px;border-bottom:1px solid var(--line);white-space:nowrap; }
.rt .pv-table th.weekend { background:#FEF4F9;color:#B6157F; }
.rt .pv-table th.who { left:0;z-index:7;min-width:224px;box-shadow:1px 0 0 var(--line); }
.rt .pv-table th.tot { text-align:right; }
.rt .pv-table td { padding:10px;border-bottom:1px solid var(--line-soft);border-left:1px solid var(--line-soft);vertical-align:top; }
.rt .pv-table td.who { position:sticky;left:0;background:#fff;z-index:3;border-left:none;box-shadow:1px 0 0 var(--line-soft); }
.rt .pv-table tr:hover td { background:#FDFBFF; }
.rt .pv-table tr:hover td.who { background:#FDFBFF; }
.rt .pv-table td.weekend { background:#FDF8FB; }
.rt .pv-who-cell { display:flex;gap:10px;align-items:flex-start; }
.rt .pv-who-cell .av { width:36px;height:36px;border-radius:11px;color:#fff;font-size:12px;font-weight:700; display:flex;align-items:center;justify-content:center;flex:none; }
.rt .pv-who-cell .n { font-weight:700;font-size:13px;line-height:1.3; }
.rt .pv-who-cell .d { font-size:11px;color:var(--ink-400);margin-top:1px; }
.rt .pv-who-cell .tag { margin-top:6px; }
.rt .sv-card { border-radius:10px;padding:8px 9px;border:1px solid #E1D3FA;background:#F7F2FE; border-left:3px solid var(--purple-500);margin-bottom:7px;cursor:pointer;transition:border-color .12s ease; }
.rt .sv-card:last-child { margin-bottom:0; }
.rt .sv-card:hover { border-color:var(--purple-500); }
.rt .sv-card.weekend { border-color:#F7CFE4;border-left-color:var(--pink-500);background:#FEF4F9; }
.rt .sv-card .t { font-size:11.5px;font-weight:800;color:var(--ink-900);line-height:1.3; }
.rt .sv-card .n { font-size:11px;font-weight:700;color:var(--purple-700);margin-top:3px; }
.rt .sv-card.weekend .n { color:#B6157F; }
.rt .sv-card .li { font-size:10.5px;color:var(--ink-400);margin-top:2px;font-variant-numeric:tabular-nums; }
.rt .sv-card .foot { display:flex;align-items:center;gap:6px;margin-top:7px;flex-wrap:wrap; }
.rt .sv-card .hrs { font-size:11px;font-weight:800;color:var(--ink-900); }
.rt .staff-chip { display:inline-flex;align-items:center;gap:5px;font-size:10.5px;font-weight:600;color:var(--ink-700); background:#fff;border:1px solid var(--line);border-radius:999px;padding:2px 8px 2px 3px; }
.rt .staff-chip .dot { width:16px;height:16px;border-radius:50%;color:#fff;font-size:8px;font-weight:700; display:flex;align-items:center;justify-content:center; }
.rt .staff-chip.none { color:var(--red-700);border-color:#F3C9CE;background:var(--red-100);padding:2px 8px; }
.rt .ratio-tag-sm { background:#EDE4FF;color:var(--purple-700);border-radius:5px;padding:1px 6px;font-size:10px;font-weight:700; }
.rt .sv-missing { border-radius:10px;padding:8px 9px;border:1px dashed #F0C99A;background:#FFF8EE; font-size:11px;color:var(--amber-700);font-weight:600;line-height:1.4; }
.rt .pv-total { text-align:right;font-weight:800;font-size:13px;white-space:nowrap; }
.rt .pv-total small { display:block;font-weight:600;font-size:10.5px;color:var(--ink-400);margin-top:2px; }
.rt .pv-none { color:#CFC7DC;font-size:11px;text-align:center;padding-top:12px; }
/* ================= v3 — compact detail header ================= */
.rt .page-head { margin-bottom:14px; }
.rt .title-meta { display:flex;align-items:center;gap:8px;margin-top:7px;flex-wrap:wrap; }
.rt .code-chip { font-size:11.5px;font-weight:700;color:var(--ink-500);background:var(--line-soft); border-radius:6px;padding:3px 9px;letter-spacing:.3px; }
.rt .title-meta .pill { font-size:11.5px;padding:3px 10px; }
/* one-row meta strip replaces the tall details card */
.rt .meta-bar { display:flex;flex-wrap:wrap;padding:0;margin-bottom:14px;overflow:hidden; }
.rt .meta-bar .mb-item { flex:1 1 190px;padding:11px 18px;border-left:1px solid var(--line-soft);min-width:0; }
.rt .meta-bar .mb-item:first-child { border-left:none; }
.rt .mb-item .k { font-size:10.5px;color:var(--ink-400);font-weight:600;margin-bottom:3px; }
.rt .mb-item .v { font-size:13px;font-weight:700;color:var(--ink-900);line-height:1.3; white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.rt .mb-item .v2 { font-size:11px;color:var(--ink-500);margin-top:1px; white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
/* stats — single compact row */
.rt .stat-row { gap:10px;margin-bottom:14px; }
.rt .stat-pill { padding:10px 14px;display:flex;align-items:center;gap:11px; }
.rt .stat-pill::after { width:3px; }
.rt .stat-pill .ic { width:32px;height:32px;border-radius:9px;font-size:14px; }
.rt .stat-pill .num { font-size:21px;line-height:1; }
.rt .stat-pill .lbl { font-size:11px;line-height:1.3;margin-top:3px; }
.rt .stat-pill .txt { min-width:0; }
/* banner — one line */
.rt .banner { padding:9px 14px;margin-bottom:14px;align-items:center;gap:10px; }
.rt .banner .ic { font-size:15px;line-height:1; }
.rt .banner h4 { display:inline;font-size:13px;margin:0; }
.rt .banner p { display:inline;font-size:12.5px;margin:0; }
.rt .banner .dot-sep { color:var(--ink-400);margin:0 6px; }
.rt .banner .actions { display:inline-flex;margin:0 0 0 10px;vertical-align:-3px; }
/* schedule — tighter head */
.rt .sched-card { margin-top:0; }
.rt .sched-head { padding:15px 20px 0;align-items:center; }
.rt .sched-sub { font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.rt .tabs { padding:12px 20px 0; }
.rt .tl-wrap, .rt .pv-wrap { max-height:calc(100vh - 300px);min-height:380px; }
/* ================= v4 — one summary card ================= */
.rt .summary-card { padding:0;overflow:hidden;margin-bottom:14px; }
/* status strip sits flush at the top of the card */
.rt .summary-card .banner { margin:0;border-radius:0;border-left:0;border-right:0;border-top:0;padding:10px 18px; }
/* meta row */
.rt .summary-card .meta-bar { border:0;border-radius:0;box-shadow:none;margin:0;border-bottom:1px solid var(--line-soft); }
.rt .summary-card .mb-item { padding:12px 18px; }
/* metrics row — dividers instead of five separate cards */
.rt .summary-card .stat-row { display:flex;flex-wrap:wrap;gap:0;margin:0;background:#FCFBFE; }
.rt .summary-card .stat-pill { flex:1 1 170px;min-width:0;border:0;border-left:1px solid var(--line-soft);border-radius:0; box-shadow:none;background:transparent;padding:12px 18px; }
.rt .summary-card .stat-pill:first-child { border-left:0; }
.rt .summary-card .stat-pill::after { display:none; }
.rt .summary-card .stat-pill .num { font-size:20px; }
.rt .summary-card .stat-pill.amber { background:#FFFAF0; }
.rt .summary-card .stat-pill.amber .lbl { color:var(--amber-700);font-weight:600; }
.rt .summary-card .stat-pill.actionable:hover { background:#FFF4E2; }
@media(max-width:1100px) {
  .rt .summary-card .stat-pill { flex:1 1 33%;border-top:1px solid var(--line-soft); }
  .rt .summary-card .stat-pill:nth-child(-n+3) { border-top:0; }
}

/* --------------------------------------------------------------------------
   Pulled onto the global theme: brand-gradient buttons at the shared radius,
   so this page matches every other one. The drawer, overlay and toast come
   from components.css.
   -------------------------------------------------------------------------- */

.rt .btn { padding: 8px 14px; border-radius: var(--r-btn); transition: all .2s ease; }
.rt .btn-sm { padding: 6px 12px; border-radius: var(--r-btn); }
.rt .btn-grad { background: var(--grad-brand); box-shadow: var(--shadow-grad); }
.rt .btn-grad:hover { box-shadow: 0 12px 26px -6px rgba(158, 92, 190, .56); }
.rt .day-toggle { border-radius: var(--r-btn); }
.rt .day-toggle.on { background: var(--brand-purple); border-color: var(--brand-purple); }

/* the org filter is a <select> styled as a button — keep it content-sized
   against the global form base's width:100% */
.rt select.btn { width: auto; }

/* the combo's typing field sits inside a bordered chip box — it must stay
   transparent rather than take the global form background */
.rt .combo-input input { background: transparent; border-radius: 0; }

/* --------------------------------------------------------------------------
   Listing table — matched to the product design: thin column rules, lavender
   header with sort affordances, gradient row marker, 3-dot action menu.
   -------------------------------------------------------------------------- */

.rt-tablebar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  padding: 6px 24px 16px;
}
.rt-tablebar__count { font-size: 13.5px; color: var(--ink-400); }
.rt-tablebar__pager { display: flex; align-items: center; gap: 8px; }
.rt-tablebar__label { font-size: 13.5px; font-weight: 600; color: var(--ink-500); }

.rt .rt-perpage {
  width: auto;
  min-width: 72px;
  padding: 7px 10px;
  font-size: 13.5px;
  font-weight: 600;
  color: var(--ink-900);
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
}
.rt .rt-page {
  min-width: 34px;
  padding: 6px 12px;
  border: none;
  border-radius: 9px;
  background: transparent;
  font-size: 13.5px;
  font-weight: 600;
  color: var(--ink-400);
  cursor: pointer;
  transition: all .2s ease;
}
.rt .rt-page:hover:not(:disabled) { background: var(--line-soft); color: var(--ink-900); }
.rt .rt-page:disabled { opacity: .55; cursor: not-allowed; }
.rt .rt-page.is-active { background: #FBE8F5; color: #B6157F; }

.rt .rt-table-wrap {
  margin: 0 24px 24px;
  border: 1px solid var(--commontable2-cell-border);
  border-radius: 12px;
  overflow-x: auto;
}

.rt .rt-table {
  width: 100%;
  min-width: 940px;
  border-collapse: separate;
  border-spacing: 0;
  table-layout: auto;
  font-size: 13px;
  background: #fff;
}

.rt .rt-table thead th {
  padding: 15px 18px;
  background: var(--commontable2-header-bg);
  color: #393746;
  font-size: 13px;
  font-weight: 800;
  text-align: left;
  vertical-align: middle;
  letter-spacing: .01em;
  white-space: nowrap;
  border-bottom: 1px solid var(--commontable2-cell-border);
  border-right: 1px solid var(--commontable2-cell-border);
  user-select: none;
  cursor: pointer;
}
.rt .rt-table thead th:last-child { border-right: 0; cursor: default; }
.rt .rt-table thead tr th:first-child { border-top-left-radius: 11px; }
.rt .rt-table thead tr th:last-child { border-top-right-radius: 11px; }

.rt-sort { margin-left: 5px; font-size: 12px; font-weight: 600; color: #A99FBE; }
.rt-sort.is-active { color: #7C3AED; }

.rt .rt-table tbody td {
  padding: 15px 18px;
  vertical-align: middle;
  font-size: 13.5px;
  color: var(--ink-700);
  border-bottom: 1px solid #EFEAF7;
  border-right: 1px solid #EFEAF7;
}
.rt .rt-table tbody td:last-child { border-right: 0; }
.rt .rt-table tbody tr:last-child td { border-bottom: 0; }
.rt .rt-table tbody tr:hover td { background: #FBF9FF; }

/* gradient marker down the left edge of every row */
.rt .rt-table tbody td:first-child { position: relative; padding-left: 26px; }
.rt .rt-table tbody td:first-child::before {
  content: '';
  position: absolute;
  left: 0;
  top: 8px;
  bottom: 8px;
  width: 4px;
  border-radius: 0 4px 4px 0;
  background: linear-gradient(180deg, #E24FA8, #9B5CF6);
}

.rt .rt-table .t-name { font-size: 14.5px; font-weight: 800; color: var(--ink-900); line-height: 1.3; }
.rt .rt-table .t-code { font-size: 12.5px; color: #8D84A0; margin-top: 3px; }

.rt .rt-table .loc { display: flex; align-items: flex-start; gap: 8px; }
.rt .rt-table .loc__ico {
  width: 15px;
  height: 15px;
  flex: none;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
  margin-top: 1px;
}
.rt .rt-table .loc__place { color: var(--ink-900); font-weight: 500; }
.rt .rt-table .loc .sub {
  display: flex;
  align-items: center;
  gap: 7px;
  margin-top: 5px;
  font-size: 13px;
  color: #7E6BB5;
}

.rt .rt-table .pill { font-size: 12.5px; font-weight: 700; padding: 6px 12px; }
.rt .rt-table .pill__ico {
  width: 13px;
  height: 13px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.rt .rt-table .pill-recur { background: #FCE7F3; color: #DB2777; }
.rt .rt-table .val-range { font-size: 13.5px; font-weight: 600; white-space: normal; }

/* ---- 3-dot action toggle ---- */

.rt-table__action { width: 84px; text-align: center; }
.rt .rt-table td.rt-table__action { text-align: center; }

.rt .rowmenu__btn {
  width: 32px;
  height: 32px;
  border: none;
  border-radius: 9px;
  background: transparent;
  color: #8D84A0;
  display: inline-grid;
  place-items: center;
  cursor: pointer;
  transition: all .2s ease;
}
.rt .rowmenu__btn svg { width: 18px; height: 18px; fill: currentColor; }
.rt .rowmenu__btn:hover { background: #F3EBFF; color: var(--purple-700); }

.rt .rowmenu__list {
  position: fixed;
  z-index: 120;
  min-width: 182px;
  padding: 8px;
  background: #fff;
  border: 1px solid #EDE7F5;
  border-radius: 14px;
  box-shadow: 0 20px 48px -14px rgba(59, 24, 120, .34);
  display: none;
}
.rt .rowmenu__list.is-open { display: block; }

.rt .rowmenu__item {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 10px 12px;
  border: none;
  border-radius: 10px;
  background: transparent;
  font-size: 14px;
  font-weight: 600;
  color: #453A57;
  text-align: left;
  cursor: pointer;
  transition: all .2s ease;
}
.rt .rowmenu__item svg {
  width: 17px;
  height: 17px;
  flex: none;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.rt .rowmenu__item:hover { background: #F7F3FE; color: var(--purple-700); }
.rt .rowmenu__item--danger { color: #DC2626; }
.rt .rowmenu__item--danger:hover { background: #FEE2E2; color: #DC2626; }

/* --------------------------------------------------------------------------
   Density: 13px throughout, 600 where emphasis is wanted, and tighter cells
   so all ten columns fit the content area without a horizontal scrollbar.
   -------------------------------------------------------------------------- */

.rt .rt-table { min-width: 860px; font-size: 13px; }

.rt .rt-table thead th {
  padding: 11px 12px;
  font-size: 13px;
  font-weight: 600;
}
.rt .rt-table tbody td { padding: 11px 12px; font-size: 13px; }
.rt .rt-table tbody td:first-child { padding-left: 20px; }

.rt .rt-table .t-name { font-size: 13px; font-weight: 600; }
.rt .rt-table .t-code { font-size: 12px; margin-top: 2px; }

.rt .rt-table .loc { gap: 6px; }
.rt .rt-table .loc__place { font-size: 13px; font-weight: 600; }
.rt .rt-table .loc .sub { font-size: 12.5px; gap: 6px; margin-top: 4px; }

.rt .rt-table .val-range { font-size: 13px; font-weight: 600; }
.rt .rt-table .val-range .d { white-space: nowrap; }
.rt .rt-table .val-range .arrow { margin: 0 4px; }
.rt .rt-table .val-note { font-size: 11.5px; margin-top: 3px; }

.rt .rt-table .pill { font-size: 12px; font-weight: 600; padding: 5px 10px; }
.rt .rt-table .fund-ok,
.rt .rt-table .fund-warn { font-size: 12px; font-weight: 600; padding: 5px 10px; white-space: nowrap; }
.rt .rt-table .count-chip { font-size: 13px; font-weight: 600; }

/* Column budget. The narrow columns are pinned so auto-layout spends the
   slack on the three that actually wrap, instead of padding out headers
   like "Participants" that only ever hold a single digit. */
.rt .rt-table .rt-table__sno { width: 54px; }
.rt .rt-table .rt-table__action { width: 54px; }
.rt .rt-table thead th:nth-child(2) { width: 16%; }   /* Template name */
.rt .rt-table thead th:nth-child(3) { width: 17%; }   /* Location & Property */
.rt .rt-table thead th:nth-child(4) { width: 13%; }   /* Validity */
.rt .rt-table thead th:nth-child(6),                  /* Participants */
.rt .rt-table thead th:nth-child(7) { width: 78px; }  /* Staff */
.rt .rt-table .count-chip { white-space: nowrap; }

@media (max-width: 1280px) {
  .rt .rt-table-wrap { margin: 0 16px 16px; }
  .rt .rt-table thead th,
  .rt .rt-table tbody td { padding: 10px; }
}