/* Mangusada MENYAMA Panel Admin — basis dokumen + 14 komponen .ad-* (§7).
   Tidak ada @import silang ke portal.css (AD-01). */

/* --- Basis --- */
*,*::before,*::after{box-sizing:border-box}
html{font-size:16px}
body{margin:0;background:var(--ad-bg);color:var(--ad-ink);font-family:var(--ad-font);font-size:var(--ad-fs-base);line-height:var(--ad-lh-base);font-weight:var(--ad-fw-base);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
h1,h2,h3,h4{margin:0;font-weight:700;color:var(--ad-ink)}
h1{font-size:var(--ad-fs-display);line-height:var(--ad-lh-display)}
h2{font-size:var(--ad-fs-h2);line-height:var(--ad-lh-h2)}
h3{font-size:var(--ad-fs-h3);line-height:var(--ad-lh-h3);font-weight:600}
p{margin:0 0 var(--ad-space-3)}
a{color:var(--ad-brand);text-decoration:none}
a:hover{color:var(--ad-brand-dark);text-decoration:underline}
small{font-size:var(--ad-fs-xs)}
button,input,select,textarea{font:inherit;color:inherit}
table{border-collapse:collapse;border-spacing:0}
:focus-visible{outline:2px solid var(--ad-brand);outline-offset:1px;box-shadow:var(--ad-focus-ring)}
.ad-tnum,.ad-table td,.ad-table th,.ad-stat__value{font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1}
.ad-muted{color:var(--ad-ink-muted)}
.ad-sm{font-size:var(--ad-fs-sm);line-height:var(--ad-lh-sm);font-weight:var(--ad-fw-sm)}
.ad-xs{font-size:var(--ad-fs-xs);line-height:var(--ad-lh-xs);font-weight:var(--ad-fw-xs)}
.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media (prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* --- Ikon --- */
.ad-ico{flex:0 0 auto;display:inline-block;vertical-align:middle;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.ad-ico[width="14"]{width:14px;height:14px}
.ad-ico[width="16"]{width:16px;height:16px}
.ad-ico[width="18"]{width:18px;height:18px}
.ad-ico[width="20"]{width:20px;height:20px}
.ad-ico[width="22"]{width:22px;height:22px}
.ad-ico[width="26"]{width:26px;height:26px}

/* --- Shell aplikasi (§5.1) --- */
.ad-app{display:flex;min-height:100vh;background:var(--ad-bg)}
.ad-main{flex:1;min-width:0;display:flex;flex-direction:column}
/* overflow-x:clip = jaring pengaman terakhir agar halaman tidak pernah bisa
   digeser horizontal. Sengaja "clip", bukan "hidden"/"auto": clip tidak membuat
   scroll container sehingga position:sticky pada thead tabel tetap berfungsi. */
.ad-content{width:100%;max-width:var(--ad-content-max);margin:0 auto;padding:var(--ad-gutter) var(--ad-gutter) 48px;display:flex;flex-direction:column;gap:var(--ad-space-4);min-width:0;overflow-x:clip}
.ad-row{display:flex;gap:var(--ad-space-3);align-items:flex-start}
.ad-row>*{min-width:0}
.ad-col-8{flex:2 1 0}
.ad-col-4{flex:1 1 0}
.ad-stack{display:flex;flex-direction:column;gap:var(--ad-space-3)}

/* --- Identitas Mangusada MENYAMA (AD-23) ------------------------------------------
   Satu lockup dipakai tiga layar: sidebar (mendatar), halaman masuk dan halaman
   galat penuh (tegak, rata tengah). Menggantikan .ad-sidebar__word/__org dan
   .ad-error__word/__org yang sebelumnya mendefinisikan wordmark dua kali.
   Kepingan lambang memakai gradien brand→deep: satu-satunya bidang gradien di
   panel ini, sengaja terbatas pada lambang supaya tidak jadi gaya umum. */
.ad-brand{display:flex;align-items:center;gap:var(--ad-space-2);min-width:0}
.ad-brand__mark{display:grid;place-items:center;flex:0 0 auto;width:38px;height:38px;border-radius:11px;
  background:linear-gradient(145deg,var(--ad-brand),var(--ad-brand-deep));color:var(--ad-text-on-brand);
  box-shadow:0 2px 6px rgba(10,63,59,.22)}
.ad-brand__text{display:flex;flex-direction:column;gap:1px;min-width:0}
/* letter-spacing lega: wordmark 7 huruf kapital, tanpa jarak ekstra terbaca padat */
.ad-brand__word{font-size:var(--ad-fs-h2);line-height:1.2;font-weight:700;letter-spacing:.06em;color:var(--ad-brand)}
.ad-brand__org{font-size:var(--ad-fs-xs);line-height:var(--ad-lh-xs);font-weight:600;color:var(--ad-ink-muted)}
.ad-brand__tag{font-size:var(--ad-fs-xs);line-height:var(--ad-lh-base);font-weight:500;color:var(--ad-ink-muted);text-wrap:pretty}
/* logo lockup Mangusada MENYAMA (rasio ~0.91) sudah memuat wordmark + tagline sendiri */
.ad-brand__logo{display:block;width:clamp(180px,55vw,240px);height:auto;margin:0 auto}

.ad-brand--stack{flex-direction:column;text-align:center;gap:var(--ad-space-2)}
.ad-brand--stack .ad-brand__mark{width:56px;height:56px;border-radius:16px}
.ad-brand--stack .ad-brand__text{align-items:center;gap:var(--ad-space-1)}
.ad-brand--stack .ad-brand__word{font-size:var(--ad-fs-display);line-height:var(--ad-lh-display);letter-spacing:.09em}
/* 34ch: kepanjangan nama pecah jadi dua baris seimbang, bukan satu baris panjang */
.ad-brand--stack .ad-brand__tag{max-width:34ch}
/* Baris instansi jadi lencana pil — tanpa ini ia sebobot kepanjangan nama tepat di
   atasnya dan hierarkinya kabur. Bentuknya sengaja mengekor lencana "Mangusada MENYAMA"
   pada splash portal (DS-15), supaya kedua sisi terbaca satu keluarga. */
.ad-brand--stack .ad-brand__org{margin-top:var(--ad-space-1);padding:5px 14px;border-radius:var(--ad-pill);
  background:var(--ad-brand-tint);color:var(--ad-brand-dark);letter-spacing:var(--ad-ls-caps)}

/* --- 7.1 Sidebar --- */
.ad-sidebar{width:var(--ad-sidebar-w);flex:0 0 var(--ad-sidebar-w);background:var(--ad-surface);border-right:1px solid var(--ad-border);display:flex;flex-direction:column;padding:var(--ad-space-3);gap:var(--ad-space-2)}
.ad-sidebar__brand{padding:var(--ad-space-2) var(--ad-space-3) var(--ad-space-3)}
/* rasio ~2.88 (2884x1000) — width dibatasi, height auto menjaga proporsi */
.ad-sidebar__brand-link{display:block;border-radius:var(--ad-radius-sm);outline-offset:2px}
.ad-sidebar__logo{display:block;width:100%;max-width:184px;height:auto}
.ad-sidebar__nav{display:flex;flex-direction:column;gap:2px;flex:1;overflow-y:auto}
.ad-nav-label{font-size:var(--ad-fs-xs);font-weight:600;text-transform:uppercase;letter-spacing:var(--ad-ls-caps-wide);color:var(--ad-ink-muted);margin-top:var(--ad-space-4);margin-bottom:var(--ad-space-1);padding:0 var(--ad-space-3)}
.ad-sidebar__nav>.ad-nav-label:first-child{margin-top:0}
.ad-nav-item{position:relative;display:flex;align-items:center;gap:var(--ad-space-2);height:44px;padding:8px var(--ad-space-3);border-radius:var(--ad-radius-sm);color:var(--ad-ink);font-size:var(--ad-fs-base);text-decoration:none;border:0;background:none;width:100%;text-align:left;cursor:pointer}
.ad-nav-item:hover{background:var(--ad-surface-alt);color:var(--ad-ink);text-decoration:none}
.ad-nav-item.is-active{background:var(--ad-brand-tint);color:var(--ad-brand);font-weight:600}
.ad-nav-item.is-active::before{content:"";position:absolute;left:0;top:8px;bottom:8px;width:3px;border-radius:0 3px 3px 0;background:var(--ad-brand)}
.ad-sidebar__foot{border-top:1px solid var(--ad-border);padding-top:var(--ad-space-2);margin-top:var(--ad-space-2)}
.ad-sidebar__foot .ad-nav-item{color:var(--ad-ink-muted)}

/* --- 7.2 Topbar --- */
.ad-topbar{position:sticky;top:0;z-index:20;height:var(--ad-topbar-h);flex:0 0 var(--ad-topbar-h);background:var(--ad-bg);border-bottom:1px solid var(--ad-border);display:flex;align-items:center;gap:var(--ad-space-3);padding:0 var(--ad-gutter)}
.ad-topbar__titles{flex:1;min-width:0}
/* judul/sub topbar dipotong elipsis — topbar tinggi tetap, tak boleh membungkus */
.ad-topbar__titles h1{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ad-topbar__sub{font-size:var(--ad-fs-sm);line-height:var(--ad-lh-sm);font-weight:var(--ad-fw-sm);color:var(--ad-ink-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ad-topbar__actions{display:flex;align-items:center;gap:var(--ad-space-3)}
.ad-topbar__sep{width:1px;height:32px;background:var(--ad-border)}
.ad-userchip{display:flex;align-items:center;gap:var(--ad-space-2);background:none;border:0;padding:4px;border-radius:var(--ad-radius-sm);cursor:pointer}
.ad-userchip:hover{background:var(--ad-surface-alt)}
.ad-avatar{width:36px;height:36px;flex:0 0 36px;border-radius:var(--ad-pill);background:var(--ad-brand-tint);color:var(--ad-brand);display:grid;place-items:center;font-size:var(--ad-fs-sm);font-weight:700}
.ad-userchip__name{display:block;font-size:var(--ad-fs-sm);font-weight:600;line-height:1.2;text-align:left}
.ad-userchip__role{display:block;font-size:var(--ad-fs-xs);color:var(--ad-ink-muted);line-height:1.2;text-align:left}
.ad-menu-btn{display:none}
@media (max-width:991px){.ad-menu-btn{display:inline-flex}}

/* --- 7.3 Kartu --- */
.ad-card{background:var(--ad-surface);border:1px solid var(--ad-border);border-radius:var(--ad-radius);box-shadow:var(--ad-shadow-sm);padding:var(--ad-card-pad)}
.ad-card--tight{padding:var(--ad-card-pad-tight)}
.ad-card--flush{padding:var(--ad-card-pad) 0}
.ad-card__head{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--ad-space-3);margin-bottom:var(--ad-space-3)}
.ad-card--flush>.ad-card__head{padding:0 var(--ad-card-pad)}
.ad-card__sub{font-size:var(--ad-fs-sm);line-height:var(--ad-lh-sm);font-weight:var(--ad-fw-sm);color:var(--ad-ink-muted)}
.ad-card__actions{display:flex;align-items:center;gap:var(--ad-space-2);flex:0 0 auto}

/* --- 7.4 Panel statistik --- */
.ad-hero{background:var(--ad-brand-deep);border-radius:var(--ad-radius);padding:var(--ad-card-pad);display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:var(--ad-space-3)}
.ad-stat{background:rgba(255,255,255,.07);border-radius:var(--ad-radius-sm);padding:var(--ad-space-3);display:flex;flex-direction:column;gap:var(--ad-space-1)}
.ad-stat__label{font-size:var(--ad-fs-sm);line-height:var(--ad-lh-sm);font-weight:500;color:var(--ad-on-deep-muted)}
.ad-stat__value{font-size:var(--ad-fs-metric);line-height:var(--ad-lh-metric);font-weight:700;color:var(--ad-on-deep)}
.ad-stat__meta{font-size:var(--ad-fs-xs);line-height:var(--ad-lh-xs);font-weight:600;color:var(--ad-on-deep-muted)}
.ad-stat__spark{margin-top:var(--ad-space-1);height:40px}
.ad-stat__spark svg{display:block;width:100%;height:40px}

/* --- 7.5 Kartu grafik --- */
.ad-chart svg{display:block;max-width:100%}
.ad-chart--area svg{width:100%;height:auto}
.ad-legend{display:flex;flex-direction:column;gap:var(--ad-space-2);margin:0;padding:0;list-style:none}
.ad-legend--row{flex-direction:row;flex-wrap:wrap;gap:var(--ad-space-3)}
.ad-legend li{display:flex;align-items:center;gap:var(--ad-space-2);font-size:var(--ad-fs-sm);line-height:1.3}
.ad-legend__swatch{width:10px;height:10px;flex:0 0 10px;border-radius:2px}
.ad-legend__label{flex:1;color:var(--ad-ink)}
.ad-legend__value{font-weight:700;font-variant-numeric:tabular-nums}
.ad-radial{display:flex;align-items:center;gap:var(--ad-space-3)}
.ad-radial__num{font-size:var(--ad-fs-h2);font-weight:700}
.ad-donut-wrap{display:flex;align-items:center;gap:var(--ad-space-4);flex-wrap:wrap}

/* --- 7.6 Tabel data --- */
/* scroll horizontal lokal; thead lepas sticky krn wrap ini jadi containernya (lihat AD-08c) */
.ad-table-wrap{overflow-x:auto}
.ad-table{width:100%;font-size:var(--ad-fs-base)}
/* white-space:normal (bukan nowrap) sengaja: pada tabel berkolom banyak (mis. Rawat
   Inap) header dua kata butuh boleh pecah ke baris kedua di lebar sempit, jaring
   pengaman terakhir sebelum overflow-x:auto pada .ad-table-wrap harus dipakai (AD-08d) */
.ad-table thead th{background:var(--ad-surface-alt);height:var(--ad-head-h);padding:0 var(--ad-cell-pad-x);text-align:left;font-size:var(--ad-fs-xs);font-weight:600;text-transform:uppercase;letter-spacing:var(--ad-ls-caps);color:var(--ad-ink-muted);white-space:normal;border-bottom:1px solid var(--ad-border-strong)}
.ad-table tbody td{height:var(--ad-row-h);padding:var(--ad-cell-pad-y) var(--ad-cell-pad-x);vertical-align:middle;border-bottom:1px solid var(--ad-border)}
.ad-table tbody tr:hover{background:var(--ad-surface-alt)}
.ad-table tbody tr:last-child td{border-bottom:0}
.ad-table .ad-num,.ad-table th.ad-num{text-align:right}
.ad-table .ad-actions{width:1%;white-space:nowrap;text-align:right}
.ad-actions{display:inline-flex;gap:var(--ad-space-1);justify-content:flex-end}
.ad-ident__name{font-size:var(--ad-fs-h3);line-height:1.3;font-weight:600}
.ad-ident__mrn{font-size:var(--ad-fs-xs);line-height:var(--ad-lh-xs);color:var(--ad-ink-muted)}
.ad-table tfoot td{height:var(--ad-head-h);padding:var(--ad-cell-pad-y) var(--ad-cell-pad-x);background:var(--ad-surface-alt);font-weight:700;border-top:1px solid var(--ad-border-strong)}
.ad-strike{text-decoration:line-through;color:var(--ad-neutral-fg)}
.ad-table td.ad-actions,.ad-table th.ad-actions{display:table-cell}
@media (max-width:1399px){.ad-col-xxl{display:none}}
@media (max-width:1199px){.ad-col-xl{display:none}}
@media (max-width:767px){.ad-table td.ad-actions{display:flex}}

/* --- 7.7 Lencana --- */
.ad-badge{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:var(--ad-pill);font-size:var(--ad-fs-xs);line-height:1.2;font-weight:600;white-space:nowrap;border:1px solid transparent}
.ad-badge--info{background:var(--ad-info-bg);color:var(--ad-info-fg);border-color:var(--ad-info-line)}
.ad-badge--success{background:var(--ad-success-bg);color:var(--ad-success-fg);border-color:var(--ad-success-line)}
.ad-badge--warning{background:var(--ad-warning-bg);color:var(--ad-warning-fg);border-color:var(--ad-warning-line)}
.ad-badge--danger{background:var(--ad-danger-bg);color:var(--ad-danger-fg);border-color:var(--ad-danger-line)}
.ad-badge--neutral{background:var(--ad-neutral-bg);color:var(--ad-neutral-fg);border-color:var(--ad-neutral-line)}

/* --- 7.8 Toolbar filter --- */
.ad-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:var(--ad-space-2);max-width:100%}
/* min-width:0 wajib: min-content sebuah <select> = lebar <option> terpanjang
   (mis. "Gedung A - Anggrek 3"), tanpa ini select menolak menyusut dan toolbar jebol */
.ad-toolbar .ad-select{min-width:0;max-width:100%}
/* Kontrol berikon (.ad-search & .ad-input-icon) memakai pola "cangkang flex":
   pembungkus yang memegang border/latar, ikon sebagai anak flex sungguhan, input
   polos di sebelahnya. Pola lama (ikon position:absolute + padding-left pada input)
   dibuang karena padding itu ikut menaikkan *min-content width* input — dan flex item
   default min-width:auto menolak menyusut di bawah nilai itu, sehingga toolbar jebol
   melewati lebar layar di ponsel. Dengan pola ini input selalu boleh menyusut. */
.ad-search{position:relative;display:flex;align-items:stretch;flex:1 1 240px;min-width:0;background:var(--ad-surface);border:1px solid var(--ad-border);border-radius:var(--ad-radius-sm)}
.ad-field>.ad-search{flex:0 0 auto}
.ad-search>.ad-search__icon{flex:0 0 auto;display:flex;align-items:center;padding-left:var(--ad-search-icon-pad);color:var(--ad-ink-muted);pointer-events:none}
.ad-search>.ad-input{flex:1 1 auto;min-width:0;width:100%;border:0;background:none;border-radius:inherit;padding-left:var(--ad-search-icon-gap);padding-right:var(--ad-search-icon-pad)}
.ad-search:focus-within{border-color:var(--ad-brand);box-shadow:var(--ad-focus-ring)}
.ad-search>.ad-input:focus{box-shadow:none}
.ad-search>.ad-search__icon>.ad-ico{width:var(--ad-icon-search);height:var(--ad-icon-search)}
/* pembungkus generik input date/time — ikon kiri jadi penanda jenis input */
.ad-input-icon{position:relative;display:flex;align-items:stretch;width:100%;min-width:0;background:var(--ad-surface);border:1px solid var(--ad-border);border-radius:var(--ad-radius-sm)}
.ad-input-icon>.ad-input-icon__icon{flex:0 0 auto;display:flex;align-items:center;padding-left:var(--ad-field-icon-pad);color:var(--ad-ink-muted);pointer-events:none}
.ad-input-icon>.ad-input{flex:1 1 auto;min-width:0;width:100%;border:0;background:none;border-radius:inherit;padding-left:var(--ad-field-icon-gap);padding-right:var(--ad-field-icon-pad)}
.ad-input-icon:focus-within{border-color:var(--ad-brand);box-shadow:var(--ad-focus-ring)}
.ad-input-icon>.ad-input:focus{box-shadow:none}
.ad-input-icon:has(>.ad-input:disabled){background:var(--ad-surface-alt)}
.ad-input-icon>.ad-input-icon__icon>.ad-ico{width:var(--ad-icon-field);height:var(--ad-icon-field)}
/* Cangkang yang sama dengan .ad-input-icon tetapi penandanya teks, bukan ikon — dipakai
   field kode kamar/fasilitas untuk memperlihatkan awalan (R-/FAC-) yang sebenarnya
   ditambahkan di server saat simpan. Hanya dipasang pada formulir TAMBAH; pada formulir
   ubah kode tampil utuh dalam input disabled biasa, jadi sengaja tidak ada padanan
   aturan :has(>.ad-input:disabled) seperti milik .ad-input-icon. */
.ad-input-affix{display:flex;align-items:stretch;width:100%;min-width:0;background:var(--ad-surface);border:1px solid var(--ad-border);border-radius:var(--ad-radius-sm)}
/* Awalan dibedakan sebagai segmen tersendiri memakai resep yang sama dengan .ad-table thead th
   (isian --ad-surface-alt + garis pemisah --ad-border-strong), supaya jelas terbaca "bukan bagian
   yang saya ketik" tanpa keluar dari palet. Radius dikurangi 1px = tebal border cangkang, agar
   sudut kirinya duduk rapat di dalam lengkungan cangkang alih-alih menonjol keluar.
   pointer-events:none supaya klik pada area awalan tetap jatuh ke input, bukan ke teks mati. */
.ad-input-affix>.ad-input-affix__prefix{flex:0 0 auto;display:flex;align-items:center;padding:0 12px;background:var(--ad-surface-alt);border-right:1px solid var(--ad-border-strong);border-radius:calc(var(--ad-radius-sm) - 1px) 0 0 calc(var(--ad-radius-sm) - 1px);color:var(--ad-ink-muted);font-size:var(--ad-fs-base);font-weight:600;pointer-events:none;user-select:none}
.ad-input-affix>.ad-input{flex:1 1 auto;min-width:0;width:100%;border:0;background:none;border-radius:inherit}
.ad-input-affix:focus-within{border-color:var(--ad-brand);box-shadow:var(--ad-focus-ring)}
.ad-input-affix>.ad-input:focus{box-shadow:none}
/* Tinggi ketiga cangkang disamakan dengan field polos. --ad-control (40px) sudah termasuk
   border-nya (box-sizing:border-box global), sedangkan input di dalam cangkang ber-border 0
   sehingga tetap 40px lalu cangkang menambah 1px atas+bawah = 42px — dua piksel lebih jangkung
   dari .ad-input tetangganya pada formulir yang sama. Sejak sini cangkang yang memegang tinggi,
   input mengisi penuh kotak isinya. Cangkang keempat wajib ikut kedua selektor di bawah. */
.ad-search,.ad-input-icon,.ad-input-affix{height:var(--ad-control)}
.ad-search>.ad-input,.ad-input-icon>.ad-input,.ad-input-affix>.ad-input{height:100%}
.ad-chip{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 6px 0 12px;border-radius:var(--ad-pill);background:var(--ad-brand-tint);color:var(--ad-brand);border:1px solid #CFE3E1;font-size:var(--ad-fs-xs);font-weight:600}
.ad-chip button{display:grid;place-items:center;width:20px;height:20px;border:0;border-radius:var(--ad-pill);background:none;color:inherit;cursor:pointer}
.ad-chip button:hover{background:rgba(15,111,104,.12)}
.ad-toolbar__clear{font-size:var(--ad-fs-sm);font-weight:600}
/* rentang tanggal (2 input date, atau date+time) — basis horizontal, dipakai di
   toolbar filter maupun di dalam .ad-field formulir; dipecah vertikal di ≤767 */
.ad-daterange{display:flex;align-items:center;gap:6px;flex-wrap:nowrap;min-width:0}
/* basis 150px = lebar yang diinginkan di desktop; shrink 1 + min-width:0 membuatnya
   tetap boleh menyusut di layar sempit alih-alih mendorong toolbar keluar layar */
.ad-daterange>.ad-input-icon{flex:1 1 150px;min-width:0}
.ad-daterange>.ad-help{flex:0 0 auto}

/* --- 7.9 Formulir --- */
.ad-form{max-width:720px;display:flex;flex-direction:column;gap:var(--ad-field-gap)}
.ad-form--wide{max-width:none;display:grid;grid-template-columns:1fr 1fr;gap:var(--ad-field-gap) var(--ad-space-4)}
/* min-width:0 wajib di tiap level grid/flex ini — tanpanya kolom ikut melebar
   mengikuti lebar konten asli widget datetime-local, jadi overflow di layar sempit */
.ad-form--wide>.ad-form-section{min-width:0}
.ad-field{display:flex;flex-direction:column;gap:6px;min-width:0}
.ad-label{font-size:var(--ad-fs-sm);line-height:var(--ad-lh-sm);font-weight:500;color:var(--ad-ink)}
.ad-req{color:var(--ad-danger-fg);margin-left:2px}
.ad-input,.ad-select,.ad-textarea{width:100%;min-width:0;height:var(--ad-control);padding:0 12px;background:var(--ad-surface);border:1px solid var(--ad-border);border-radius:var(--ad-radius-sm);font-size:var(--ad-fs-base);color:var(--ad-ink)}
.ad-input--lg,.ad-select--lg{height:var(--ad-control-lg)}
.ad-textarea{height:auto;min-height:88px;padding:10px 12px;line-height:var(--ad-lh-base);resize:vertical}
.ad-select{appearance:none;text-overflow:ellipsis;padding-right:34px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%235A6560' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center}
.ad-input::placeholder,.ad-textarea::placeholder{color:var(--ad-ink-muted);opacity:1}
.ad-input:focus,.ad-select:focus,.ad-textarea:focus{outline:none;border-color:var(--ad-brand);box-shadow:var(--ad-focus-ring)}
.ad-input:disabled,.ad-select:disabled{background:var(--ad-surface-alt);color:var(--ad-ink-muted);cursor:not-allowed}
.ad-help{font-size:var(--ad-fs-sm);line-height:var(--ad-lh-sm);font-weight:var(--ad-fw-sm);color:var(--ad-ink-muted)}
.ad-counter{font-size:var(--ad-fs-xs);color:var(--ad-ink-muted);font-variant-numeric:tabular-nums}
/* Pesan validasi per-field. Namanya .ad-field-error — BUKAN .ad-error — karena
   .ad-error* sudah dipakai halaman galat penuh 404 di blok terakhir berkas ini (AD-20);
   nama yang sama membuat pesan ini ikut menjadi grid setinggi layar. Lihat AD-21. */
/* align-items:flex-start (bukan center) supaya pesan yang membungkus dua baris di
   ponsel tetap rata dengan ikonnya, bukan menggeser ikon ke tengah blok teks */
.ad-field-error{display:flex;align-items:flex-start;gap:6px;font-size:var(--ad-fs-sm);line-height:var(--ad-lh-sm);font-weight:var(--ad-fw-sm);color:var(--ad-danger-fg)}
.ad-field-error>.ad-ico{margin-top:1px}
/* .ad-check ikut menerima is-invalid: baris fasilitas di formulir kamar adalah satu
   .ad-check berisi input jumlah/catatan, bukan .ad-field tersendiri */
.ad-field.is-invalid .ad-input,.ad-field.is-invalid .ad-select,.ad-field.is-invalid .ad-textarea,
.ad-field.is-invalid .ad-input-icon,.ad-field.is-invalid .ad-input-affix,.ad-field.is-invalid .ad-search,
.ad-check.is-invalid .ad-input,.ad-check.is-invalid .ad-select{border-color:var(--ad-danger-fg)}
/* fokus di dalam field bermasalah tetap merah: tanpa ini border merah berubah hijau
   begitu petugas mengklik input yang baru saja ditolak validasi */
.ad-field.is-invalid .ad-input:focus,.ad-field.is-invalid .ad-select:focus,.ad-field.is-invalid .ad-textarea:focus,
.ad-field.is-invalid .ad-input-icon:focus-within,.ad-field.is-invalid .ad-input-affix:focus-within,.ad-field.is-invalid .ad-search:focus-within,
.ad-check.is-invalid .ad-input:focus,.ad-check.is-invalid .ad-select:focus{border-color:var(--ad-danger-fg);box-shadow:var(--ad-focus-ring-danger)}
.ad-form-section{display:flex;flex-direction:column;gap:var(--ad-field-gap);padding-top:var(--ad-section-gap);border-top:1px solid var(--ad-border)}
.ad-form-section:first-child{padding-top:0;border-top:0}
.ad-form-section__title{font-size:var(--ad-fs-h3);font-weight:600}
.ad-form-actions{display:flex;align-items:center;gap:var(--ad-space-3);padding-top:var(--ad-space-2)}

/* --- Kotak centang dan radio --- */
.ad-check{display:flex;align-items:flex-start;gap:10px;padding:8px 0}
.ad-check__input{flex:0 0 18px;width:18px;height:18px;margin:2px 0 0;accent-color:var(--ad-brand);cursor:pointer}
.ad-check__body{display:flex;flex-direction:column;gap:2px;min-width:0}
.ad-check__label{font-size:var(--ad-fs-base);line-height:1.4;cursor:pointer}
.ad-check__extra{display:flex;gap:var(--ad-space-2);margin-top:6px;flex-wrap:wrap}
.ad-check.is-disabled .ad-check__label,.ad-check.is-disabled .ad-help{color:var(--ad-ink-muted)}
.ad-check.is-disabled .ad-check__input{cursor:not-allowed}
.ad-check-list{display:flex;flex-direction:column;border:1px solid var(--ad-border);border-radius:var(--ad-radius-sm);padding:var(--ad-space-2) 12px}
.ad-check-list .ad-check+.ad-check{border-top:1px solid var(--ad-border)}

/* --- 7.10 Blok field publik / internal --- */
.ad-field-public,.ad-field-internal{border-radius:var(--ad-radius-sm);padding:var(--ad-space-3);display:flex;flex-direction:column;gap:var(--ad-space-2)}
.ad-field-public{background:var(--ad-brand-tint);border:1px solid #CFE3E1}
.ad-field-internal{background:var(--ad-surface-alt);border:1px dashed var(--ad-border)}
.ad-field-public .ad-textarea,.ad-field-internal .ad-textarea{background:var(--ad-surface)}
.ad-field-foot{display:flex;justify-content:space-between;align-items:center;gap:var(--ad-space-2)}

/* --- 7.11 Editor butir kegiatan --- */
.ad-plan-item{display:flex;align-items:flex-start;gap:var(--ad-space-2);padding:12px;border:1px solid var(--ad-border);border-radius:var(--ad-radius-sm);background:var(--ad-surface)}
.ad-plan-item+.ad-plan-item{margin-top:var(--ad-space-2)}
.ad-plan-item__kind{width:190px;flex:0 0 190px}
.ad-plan-item__title{flex:1;min-width:0}
.ad-plan-item__status{width:150px;flex:0 0 150px}
/* Input jam di editor butir kegiatan sengaja TIDAK dibungkus .ad-input-icon: browser
   sudah menggambar ikon jam sendiri di dalam input[type=time], jadi ikon i-jam kita
   membuatnya dobel. Menyembunyikan ikon bawaan hanya mungkin di WebKit/Blink
   (::-webkit-calendar-picker-indicator) — Firefox tidak mengeksposnya, maka ikon
   design system yang dilepas agar hasilnya seragam lintas browser. */

/* --- 7.12 Keadaan kosong --- */
.ad-empty{display:flex;flex-direction:column;align-items:center;text-align:center;gap:var(--ad-space-2);padding:48px var(--ad-space-4);color:var(--ad-ink)}
.ad-empty__icon{color:var(--ad-ink-muted);display:flex}
.ad-empty--done .ad-empty__icon{color:var(--ad-success-fg)}
.ad-empty__title{font-size:var(--ad-fs-h3);font-weight:600}
.ad-empty__text{font-size:var(--ad-fs-sm);font-weight:var(--ad-fw-sm);color:var(--ad-ink-muted);max-width:44ch}

/* --- 7.13 Flash --- */
.ad-flash{display:flex;align-items:flex-start;gap:var(--ad-space-2);padding:12px var(--ad-space-3);border-radius:var(--ad-radius-sm);border:1px solid transparent;font-size:var(--ad-fs-base)}
.ad-flash__icon{display:flex;flex:0 0 auto;margin-top:2px}
.ad-flash__body{flex:1}
.ad-flash__close{border:0;background:none;color:inherit;cursor:pointer;display:grid;place-items:center;width:24px;height:24px;border-radius:var(--ad-radius-sm);opacity:.7}
.ad-flash__close:hover{opacity:1}
.ad-flash--info{background:var(--ad-info-bg);color:var(--ad-info-fg);border-color:var(--ad-info-line)}
.ad-flash--success{background:var(--ad-success-bg);color:var(--ad-success-fg);border-color:var(--ad-success-line)}
.ad-flash--warning{background:var(--ad-warning-bg);color:var(--ad-warning-fg);border-color:var(--ad-warning-line)}
.ad-flash--danger{background:var(--ad-danger-bg);color:var(--ad-danger-fg);border-color:var(--ad-danger-line)}

/* --- 7.14 Modal konfirmasi --- */
.ad-backdrop{position:fixed;inset:0;z-index:60;background:rgba(27,35,32,.45);display:grid;place-items:center;padding:var(--ad-space-4)}
.ad-backdrop[hidden]{display:none}
.ad-modal{width:480px;max-width:100%;background:var(--ad-surface);border-radius:var(--ad-radius);box-shadow:var(--ad-shadow-pop);padding:var(--ad-card-pad);display:flex;flex-direction:column;gap:var(--ad-space-3)}
.ad-modal--wide{width:560px}
.ad-modal__obj{font-size:var(--ad-fs-sm);font-weight:600;color:var(--ad-ink-muted)}
.ad-modal__actions{display:flex;align-items:center;gap:var(--ad-space-3);margin-top:var(--ad-space-1)}

/* --- Tombol (§8.2, override wajib .btn) --- */
.ad-btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--ad-space-2);height:var(--ad-control);padding:0 var(--ad-space-3);border-radius:var(--ad-radius-sm);border:1px solid transparent;font-size:var(--ad-fs-sm);font-weight:600;cursor:pointer;white-space:nowrap;text-decoration:none}
.ad-btn:hover{text-decoration:none}
.ad-btn--lg{height:var(--ad-control-lg);font-size:var(--ad-fs-base);padding:0 var(--ad-space-4)}
.ad-btn--block{width:100%}
.ad-btn--primary{background:var(--ad-brand);color:#fff}
.ad-btn--primary:hover,.ad-btn--primary:active{background:var(--ad-brand-dark);color:#fff}
.ad-btn--secondary{background:var(--ad-surface);color:var(--ad-ink);border-color:var(--ad-border-strong)}
.ad-btn--secondary:hover{background:var(--ad-surface-alt);color:var(--ad-ink)}
.ad-btn--ghost{background:none;color:var(--ad-brand)}
.ad-btn--ghost:hover{background:var(--ad-brand-tint);color:var(--ad-brand-dark)}
.ad-btn--danger{background:var(--ad-danger-fg);color:#fff}
.ad-btn--danger:hover{background:#8F1D17;color:#fff}
.ad-btn:disabled,.ad-btn[aria-disabled="true"]{opacity:.5;cursor:not-allowed}
.ad-icon-btn{display:inline-grid;place-items:center;width:var(--ad-icon-btn);height:var(--ad-icon-btn);padding:0;border:1px solid var(--ad-border);border-radius:var(--ad-radius-sm);background:var(--ad-surface);color:var(--ad-ink-muted);cursor:pointer;position:relative}
.ad-icon-btn::after{content:"";position:absolute;inset:-4px}
.ad-icon-btn:hover{background:var(--ad-surface-alt);color:var(--ad-ink);border-color:var(--ad-border-strong)}
.ad-icon-btn--danger:hover{color:var(--ad-danger-fg);border-color:var(--ad-danger-line);background:var(--ad-danger-bg)}
.ad-icon-btn--bare{border-color:transparent;background:none}

/* --- Paginasi --- */
.ad-pagination{display:flex;align-items:center;gap:var(--ad-space-1);justify-content:flex-end}
.ad-pagination__item{display:grid;place-items:center;min-width:var(--ad-icon-btn);height:var(--ad-icon-btn);padding:0 10px;border:1px solid var(--ad-border);border-radius:var(--ad-radius-sm);background:var(--ad-surface);color:var(--ad-ink);font-size:var(--ad-fs-sm);font-weight:600;cursor:pointer}
.ad-pagination__item:hover{background:var(--ad-surface-alt);text-decoration:none}
.ad-pagination__item.is-active{background:var(--ad-brand);border-color:var(--ad-brand);color:#fff}
.ad-pagination__item:disabled,.ad-pagination__item.is-disabled{opacity:.4;cursor:not-allowed;pointer-events:none}

/* --- Pemilih ikon fasilitas (AD-11b, §6.7) --- */
.ad-iconpick{display:grid;grid-template-columns:repeat(6,1fr);gap:var(--ad-space-2)}
.ad-iconpick__opt{display:flex;flex-direction:column;align-items:center;gap:4px;padding:10px 4px;border:1px solid var(--ad-border);border-radius:var(--ad-radius-sm);background:var(--ad-surface);cursor:pointer;font-size:11px;font-weight:600;color:var(--ad-ink-muted);text-align:center}
.ad-iconpick__opt:hover{background:var(--ad-surface-alt)}
.ad-iconpick__opt.is-selected{border:2px solid var(--ad-brand);background:var(--ad-brand-tint);color:var(--ad-brand);padding:9px 3px}

/* --- Chip fasilitas pada tabel kamar --- */
.ad-facilities{display:inline-flex;align-items:center;gap:var(--ad-space-1);color:var(--ad-ink-muted)}
.ad-facilities__more{font-size:var(--ad-fs-xs);font-weight:600}

/* --- Bar okupansi --- */
.ad-meter{height:8px;border-radius:var(--ad-pill);background:var(--ad-neutral-bg);overflow:hidden}
.ad-meter__fill{height:100%;background:var(--ad-brand);border-radius:var(--ad-pill)}

/* --- Tab --- */
.ad-tabs{display:flex;gap:var(--ad-space-1);border-bottom:1px solid var(--ad-border)}
.ad-tab{background:none;border:0;border-bottom:2px solid transparent;padding:10px var(--ad-space-3);font-size:var(--ad-fs-sm);font-weight:600;color:var(--ad-ink-muted);cursor:pointer}
.ad-tab:hover{color:var(--ad-ink)}
.ad-tab.is-active{color:var(--ad-brand);border-bottom-color:var(--ad-brand)}

/* --- Dropdown --- */
.ad-dropdown{position:relative}
.ad-dropdown__menu{position:absolute;right:0;top:calc(100% + 6px);z-index:40;min-width:200px;background:var(--ad-surface);border:1px solid var(--ad-border);border-radius:var(--ad-radius-sm);box-shadow:var(--ad-shadow-pop);padding:6px;display:flex;flex-direction:column}
.ad-dropdown__menu[hidden]{display:none}
.ad-dropdown__item{display:flex;align-items:center;gap:var(--ad-space-2);padding:8px 10px;border:0;background:none;border-radius:8px;font-size:var(--ad-fs-sm);color:var(--ad-ink);text-align:left;cursor:pointer}
.ad-dropdown__item:hover{background:var(--ad-surface-alt);text-decoration:none;color:var(--ad-ink)}
.ad-dropdown__item--danger{color:var(--ad-danger-fg)}

/* --- Tab bar ponsel (hanya ≤767px) --- */
.ad-tabbar{display:none;position:fixed;left:0;right:0;bottom:0;z-index:50;height:calc(var(--ad-tabbar-h) + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom);background:var(--ad-surface);border-top:1px solid var(--ad-border);box-shadow:0 -1px 12px rgba(27,35,32,.06)}
.ad-tabbar__item{position:relative;flex:1 1 0;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;height:var(--ad-tabbar-h);border:0;background:none;color:var(--ad-ink-muted);font-size:11px;font-weight:600;line-height:1.2;cursor:pointer;padding:0 2px}
.ad-tabbar__item span{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ad-tabbar__item.is-active{color:var(--ad-brand)}
.ad-tabbar__item.is-active::before{content:"";position:absolute;top:0;width:28px;height:3px;border-radius:0 0 3px 3px;background:var(--ad-brand)}
.ad-scrim{display:none;position:fixed;inset:0;z-index:65;border:0;padding:0;background:rgba(27,35,32,.45)}
@media (max-width:991px){.ad-scrim{display:block}}

/* --- Halaman masuk — satu-satunya layar tanpa shell --- */
.ad-login-page{background:var(--ad-bg)}
.ad-login{min-height:100vh;display:grid;place-items:center;padding:var(--ad-gutter)}
.ad-login__card{width:100%;max-width:420px;display:flex;flex-direction:column;gap:var(--ad-field-gap)}
/* garis rambut memisahkan identitas dari medan isian; tanpa itu lockup tegak
   terbaca menyatu dengan label field pertama */
.ad-login__brand{display:flex;justify-content:center;padding-bottom:var(--ad-space-3);border-bottom:1px solid var(--ad-border)}

/* --- Responsif (§5.2, AD-07) ---------------------------------------------
   Tiga tingkat, titik henti sejajar Bootstrap: desktop ≥1200px sidebar tetap;
   tablet 768–1199px sidebar offcanvas; ponsel ≤767px tab bar bawah, tabel jadi kartu. */
@media (max-width:1199px){
  .ad-row{flex-wrap:wrap}
  .ad-col-8,.ad-col-4{flex:1 1 100%}
  .ad-form--wide{grid-template-columns:1fr}
  .ad-iconpick{grid-template-columns:repeat(4,1fr)}
}
@media (max-width:991px){
  /* Tablet: ikon field tetap 16/18px, jarak sedikit dirapatkan */
  :root{--ad-gutter:20px;--ad-card-pad:20px;--ad-field-icon-gap:8px;--ad-search-icon-gap:8px}
  .ad-sidebar{position:fixed;inset:0 auto 0 0;z-index:70;transform:translateX(-100%);transition:transform .2s ease}
  .ad-sidebar.is-open{transform:none;box-shadow:var(--ad-shadow-pop)}
  .ad-hero{grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}
  .ad-plan-item{flex-wrap:wrap}
  .ad-plan-item__kind{flex:1 1 180px;width:auto}
  .ad-plan-item__title{flex:1 1 100%;order:5}
  .ad-plan-item__status{flex:1 1 150px;width:auto}
}
@media (max-width:767px){
  /* Ponsel: ikon field turun ke 15/16px, padding kiri-kanan dirapatkan supaya
     ruang teks di dalam input tetap lega (lihat token di tokens.css) */
  :root{--ad-gutter:16px;--ad-card-pad:16px;--ad-card-pad-tight:14px;--ad-topbar-h:64px;--ad-section-gap:24px;
    --ad-icon-field:15px;--ad-field-icon-pad:10px;--ad-field-icon-gap:8px;
    --ad-icon-search:16px;--ad-search-icon-pad:10px;--ad-search-icon-gap:8px}
  .ad-content{gap:var(--ad-space-3);padding-bottom:calc(var(--ad-tabbar-h) + env(safe-area-inset-bottom) + 24px)}
  .ad-menu-btn{display:none}
  .ad-tabbar{display:flex}
  .ad-topbar{gap:var(--ad-space-2)}
  .ad-topbar__sub,.ad-topbar__sep,.ad-userchip__name,.ad-userchip__role,.ad-userchip>svg{display:none}
  .ad-userchip{padding:0}
  .ad-topbar__actions .ad-btn{font-size:0;gap:0;padding:0;width:var(--ad-control);flex:0 0 var(--ad-control)}
  .ad-toolbar .ad-search{flex:1 1 100%}
  .ad-toolbar .ad-select{width:auto!important;flex:1 1 calc(50% - var(--ad-space-2))}
  .ad-toolbar__clear{margin-left:auto}
  /* rentang tanggal toolbar (filter rawat-inap/laporan) — dua input date tidak muat
     berdampingan di layar sempit, jadi disusun vertikal selebar toolbar */
  .ad-toolbar .ad-daterange{flex:1 1 100%}
  .ad-daterange{flex-direction:column;align-items:stretch;gap:6px;width:100%;min-width:0}
  .ad-daterange>.ad-help{text-align:center}
  .ad-daterange>.ad-input-icon{flex:0 0 auto;width:100%}
  .ad-table-wrap{overflow-x:visible}
  .ad-table,.ad-table tbody,.ad-table tfoot,.ad-table tr,.ad-table td{display:block;width:auto}
  .ad-table thead{display:none}
  .ad-table tbody tr{border:1px solid var(--ad-border);border-radius:var(--ad-radius-sm);background:var(--ad-surface);padding:14px;margin:0 var(--ad-card-pad) var(--ad-space-2)}
  .ad-table tbody tr:hover{background:var(--ad-surface)}
  .ad-table tbody td,.ad-table tfoot td{height:auto;padding:5px 0;border:0;display:flex;align-items:baseline;justify-content:space-between;gap:var(--ad-space-3);text-align:right}
  .ad-table td.ad-col-xl,.ad-table td.ad-col-xxl{display:flex}
  .ad-table tbody td::before{content:attr(data-label);flex:0 0 42%;text-align:left;font-size:var(--ad-fs-xs);line-height:var(--ad-lh-xs);font-weight:600;text-transform:uppercase;letter-spacing:var(--ad-ls-caps);color:var(--ad-ink-muted)}
  .ad-table tbody td:not([data-label])::before{display:none}
  .ad-table tbody td:has(.ad-ident__name){display:block;text-align:left;padding-top:0;padding-bottom:8px}
  .ad-table tbody td:has(.ad-ident__name)::before{display:none}
  .ad-table tbody td.ad-actions{width:auto;justify-content:flex-end;margin-top:8px;padding-top:10px;border-top:1px solid var(--ad-border)}
  /* sel tabel berisi form inline (mis. tanggal rencana + tombol Buka) — ganti jadi
     label di atas, form selebar penuh di bawah, bukan disempitkan jadi 58% lebar */
  .ad-table tbody td:has(.ad-table-inline-form){display:block;text-align:left}
  .ad-table tbody td:has(.ad-table-inline-form)::before{display:block;margin-bottom:6px}
  .ad-table-inline-form{width:100%}
  .ad-table-inline-form .ad-input-icon{flex:1 1 auto;min-width:0}
  .ad-table .ad-num{text-align:right}
  .ad-table tfoot td{padding:10px 14px;border-radius:var(--ad-radius-sm)}
  .ad-pagination{justify-content:center;flex-wrap:wrap}
  .ad-form{max-width:none}
  .ad-form-actions{flex-direction:column-reverse;align-items:stretch}
  .ad-form-actions .ad-btn{width:100%}
  .ad-modal__actions{flex-direction:column-reverse;align-items:stretch}
  .ad-modal__actions .ad-btn{width:100%}
  .ad-backdrop{padding:0;align-items:end}
  .ad-modal,.ad-modal--wide{width:100%;border-radius:var(--ad-radius) var(--ad-radius) 0 0;padding:var(--ad-space-4) var(--ad-card-pad) calc(var(--ad-space-4) + env(safe-area-inset-bottom));max-height:88vh;overflow-y:auto}
  .ad-hero{grid-template-columns:1fr 1fr;gap:var(--ad-space-2);padding:var(--ad-space-3)}
  .ad-stat__spark,.ad-stat__spark svg{height:28px}
  .ad-iconpick{grid-template-columns:repeat(3,1fr)}
  .ad-tabs{overflow-x:auto;scrollbar-width:none}
  .ad-tabs::-webkit-scrollbar{display:none}
  .ad-card__head{flex-direction:column;align-items:stretch}
  /* aksi kartu (badge + tombol publikasi dsb) tidak muat sebaris di layar sempit */
  .ad-card__actions{flex-wrap:wrap}
  .ad-plan-item{flex-wrap:wrap}
  .ad-plan-item__title{order:1;flex:1 1 100%}
  .ad-plan-item__kind{order:2;flex:1 1 100%;width:auto}
  .ad-plan-item__status{order:3;flex:1 1 100%;width:auto}
  .ad-plan-item>.ad-icon-btn{order:4;margin-left:auto}
}
/* Ponsel sangat sempit (≤359px, mis. iPhone SE / Android 5") — dua select
   berdampingan sudah tidak terbaca, jadi semuanya jadi satu kolom penuh. */
@media (max-width:359px){
  :root{--ad-gutter:12px;--ad-card-pad:14px;--ad-card-pad-tight:12px;
    --ad-icon-field:14px;--ad-field-icon-pad:8px;--ad-field-icon-gap:6px;
    --ad-icon-search:15px;--ad-search-icon-pad:9px;--ad-search-icon-gap:6px}
  .ad-toolbar .ad-select{flex:1 1 100%}
  .ad-toolbar .ad-btn{flex:1 1 100%}
  .ad-toolbar__clear{margin-left:0;text-align:center}
  .ad-hero{grid-template-columns:1fr}
  .ad-table tbody td,.ad-table tfoot td{gap:var(--ad-space-2)}
  .ad-table tbody td::before{flex:0 0 46%}
}
@media (pointer:coarse){
  .ad-icon-btn{width:44px;height:44px}
  .ad-btn{height:44px}
  .ad-btn--lg{height:48px}
  .ad-nav-item{height:48px}
  .ad-input,.ad-select{height:44px}
  /* cangkang ikut naik; input di dalamnya tetap height:100% (selektor anak menang atas .ad-input) */
  .ad-search,.ad-input-icon,.ad-input-affix{height:44px}
}

/* Halaman QR kamar (FR-06) — pratinjau di layar + lembar cetak */
.ad-qr-box{width:220px;height:220px;border:1px solid var(--ad-border);border-radius:var(--ad-radius-sm);padding:16px;background:#fff;box-sizing:border-box;flex-shrink:0}
.ad-qr-box svg{width:100%;height:100%;display:block}

/* Lembar cetak QR (FR-06) — disembunyikan di layar, hanya ditampilkan sendirian
   saat mode cetak lewat teknik isolasi cetak standar (visibility, bukan display,
   supaya ukuran fisik cm/mm tetap dihitung layout engine). QR dicetak minimal
   5x5 cm (dipakai 6,8x6,8 cm) agar terbaca dari jarak 30 cm sesuai FR-06.
   Nada visual sengaja mengikuti design system PORTAL PUBLIK (teal #0F6F68,
   netral hangat #FAF8F5, radius besar) — pembacanya keluarga pasien di koridor,
   bukan petugas, jadi lembar ini adalah "sampul" portal, bukan dokumen internal.
   Ketentuan lama "hitam putih tanpa warna brand" (§5.6 dokumen admin) dicabut,
   lihat koreksi AD-19 di dokumen tersebut.
   Aturan keras yang menjaga lembar tetap terbaca: TIDAK ADA teks terang di atas
   blok warna. Semua teks gelap di atas latar terang, sehingga bila printer
   monokrom atau dialog cetak membuang latar ("background graphics" mati),
   isinya tetap utuh — yang hilang hanya hiasan. */
.ad-print-sheet{display:none}
@media print{
  /* :has() membatasi isolasi cetak hanya ke halaman yang benar-benar punya
     .ad-print-sheet, supaya Ctrl+P di halaman admin lain tidak ikut jadi blank.
     Penting: selector "un-hide" di bawah harus diawali prefix body:has(...) yang
     SAMA dengan selector "hide" di atas — tanpa itu spesifisitasnya kalah
     (body:has(.x) * = 0,1,1 vs .x * saja = 0,1,0), sehingga visibility:hidden
     tetap menang dan seluruh lembar cetak (termasuk QR) ikut tak terlihat. */
  body:has(.ad-print-sheet) *{visibility:hidden}
  body:has(.ad-print-sheet) .ad-print-sheet,
  body:has(.ad-print-sheet) .ad-print-sheet *{visibility:visible}
  /* print-color-adjust:exact memaksa Chrome/Safari mencetak latar tint meski
     centang "Background graphics" di dialog cetak dimatikan */
  .ad-print-sheet{display:block;position:absolute;inset:0;margin:0;padding:8mm;page-break-inside:avoid;
    font-family:var(--ad-font);color:#1B2320;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  /* Bingkai luar: satu garis teal bersudut membulat — sumber kehangatan pada
     sistem portal datang dari radius, bukan dari blok warna besar (DS §5.2) */
  .ad-print-sheet__frame{height:100%;border:1.1mm solid #0F6F68;border-radius:9mm;overflow:hidden;
    display:flex;flex-direction:column;text-align:center}
  /* Isi dipusatkan pada ruang SISA di bawah pita kepala (bukan pada seluruh
     bingkai) — pita tetap menempel di tepi atas, sisa ruang terbagi rata */
  .ad-print-sheet__body{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;
    gap:6mm;padding:8mm 10mm 9mm}
  /* Pita kepala menempel ke tepi dalam bingkai; radius sudutnya dijamin rapi
     oleh overflow:hidden pada frame, tidak perlu dihitung ulang */
  .ad-print-sheet__brand{padding:5mm 10mm;background:#E6F1F0;
    border-bottom:.3mm solid #CFE3E1;display:flex;align-items:center;justify-content:center;gap:2.5mm;
    color:#0B534E;font-size:10.5pt;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
  /* Lambang Mangusada MENYAMA pada lembar cetak: favicon brand penuh warna di dalam kepingan
     PUTIH — seni logo yang gelap-dominan di atas latar terang tetap patuh AD-19 (tak ada
     bentuk terang di atas blok warna) dan tetap terbaca di printer monokrom sebagai abu. */
  .ad-print-sheet__mark{display:flex;align-items:center;justify-content:center;flex:0 0 auto;
    width:8mm;height:8mm;border-radius:2.4mm;background:#FFFFFF;border:.3mm solid #CFE3E1;overflow:hidden}
  .ad-print-sheet__mark img{width:6.6mm;height:6.6mm;object-fit:contain}
  .ad-print-sheet__head{display:flex;flex-direction:column;align-items:center;gap:3mm;margin-top:2mm}
  .ad-print-sheet__eyebrow{font-size:11.5pt;font-weight:600;color:#5A6560;letter-spacing:.04em}
  .ad-print-sheet h1{margin:0;font-size:30pt;font-weight:700;line-height:1.15}
  .ad-print-sheet__chips{display:flex;flex-wrap:wrap;justify-content:center;gap:3mm}
  /* Chip tint teal + teks teal gelap — tetap terbaca bila tint tidak tercetak */
  .ad-print-sheet__chip{display:inline-flex;align-items:center;gap:2mm;padding:2mm 4.5mm;
    background:#E6F1F0;border:.3mm solid #CFE3E1;border-radius:999px;
    font-size:11pt;font-weight:600;color:#0B534E}
  .ad-print-sheet__chip svg{width:4.5mm;height:4.5mm;flex:0 0 auto}
  /* Kartu QR: bidang putih berbingkai supaya modul QR punya quiet zone visual
     tambahan di atas kertas dan tidak "menempel" ke ornamen sekitarnya */
  .ad-print-sheet__qr{width:78mm;height:78mm;padding:5mm;background:#FFFFFF;
    border:.3mm solid #E7E2DA;border-radius:5mm}
  .ad-print-sheet__qr svg{width:100%;height:100%;display:block}
  .ad-print-sheet__instruction{margin:0;font-size:15pt;font-weight:700;line-height:1.3}
  /* Tiga langkah — daftar bernomor kiri-rata, dibatasi lebarnya agar barisnya
     pendek dan mudah dipindai mata sambil berdiri */
  .ad-print-sheet__steps{margin:0;padding:0;list-style:none;max-width:125mm;
    display:flex;flex-direction:column;gap:3.5mm;text-align:left}
  .ad-print-sheet__steps li{display:flex;align-items:flex-start;gap:4mm;
    font-size:12pt;line-height:1.4}
  .ad-print-sheet__steps b{display:flex;align-items:center;justify-content:center;flex:0 0 auto;
    width:7.5mm;height:7.5mm;border-radius:999px;background:#E6F1F0;border:.3mm solid #0F6F68;
    color:#0B534E;font-size:11pt;font-weight:700}
  /* Catatan privasi (P-2) — nada netral, bukan peringatan */
  .ad-print-sheet__note{display:flex;align-items:flex-start;gap:4mm;max-width:145mm;
    padding:5mm 6mm;background:#FAF8F5;border:.3mm solid #E7E2DA;border-radius:5mm;
    text-align:left;font-size:10.5pt;line-height:1.5;color:#5A6560}
  .ad-print-sheet__note svg{width:5.5mm;height:5.5mm;flex:0 0 auto;color:#0F6F68;margin-top:.5mm}
  .ad-print-sheet__note p{margin:0}
  .ad-print-sheet__foot{margin:0;font-size:9.5pt;color:#5A6560;letter-spacing:.02em}
  @page{size:A4;margin:0}
}

/* PENTING: seluruh .ad-error* di bawah ini milik HALAMAN galat penuh, bukan pesan
   validasi form — pesan validasi memakai .ad-field-error di §7.9. Jangan memakai
   .ad-error untuk pesan inline: kedua arti itu pernah bertabrakan (AD-21). */
/* Halaman galat penuh (404 sisi admin) — layar kedua tanpa shell setelah .ad-login.
   Design system §9.11 menulis "404 di dalam shell"; dicabut lewat koreksi AD-20
   (2026-08-29) karena halaman ini juga dilihat pengunjung tanpa sesi, sehingga
   sidebar/topbar admin tidak punya arti di sana. Lihat catatan di
   .claude/docs/status-implementasi.md § "Halaman 404 terpisah admin vs portal".
   Responsif tanpa breakpoint sendiri sebisa mungkin: angka 404 dan jarak dalam
   memakai clamp() sehingga skala mengikuti lebar layar, bukan meloncat. */
.ad-error-page{background:var(--ad-bg)}
/* min-height ganda: 100vh untuk browser lama, 100dvh supaya bilah alamat ponsel
   tidak membuat halaman ikut menggulir sedikit */
.ad-error{min-height:100vh;min-height:100dvh;display:grid;place-items:center;padding:var(--ad-gutter);padding-bottom:calc(var(--ad-gutter) + env(safe-area-inset-bottom))}
.ad-error__panel{width:100%;max-width:560px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:var(--ad-space-3);
  background:var(--ad-surface);border:1px solid var(--ad-border);border-radius:var(--ad-radius);box-shadow:var(--ad-shadow-sm);
  padding:clamp(28px,6vw,var(--ad-space-5)) clamp(20px,5vw,var(--ad-space-5))}
/* angka besar: lantai 56px agar tetap dominan di ponsel sempit, atap 104px di desktop */
.ad-error__code{font-size:clamp(56px,16vw,104px);line-height:1;font-weight:700;letter-spacing:-.02em;color:var(--ad-brand);
  font-variant-numeric:tabular-nums;margin-top:var(--ad-space-1)}
.ad-error__title{font-size:var(--ad-fs-display);line-height:var(--ad-lh-display)}
.ad-error__text{margin:0;max-width:46ch;font-size:var(--ad-fs-sm);line-height:var(--ad-lh-base);color:var(--ad-ink-muted)}
/* aksi: sebaris di layar lega, menumpuk penuh begitu ruangnya kurang dari ~360px */
.ad-error__actions{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--ad-space-2);width:100%;margin-top:var(--ad-space-2)}
.ad-error__actions>*{flex:0 1 auto}
@media (max-width:767px){
  /* ponsel: satu kolom penuh, aksi utama tetap di atas (bukan column-reverse
     seperti .ad-form-actions — di sini tidak ada pasangan Batal/Simpan) */
  .ad-error__actions{flex-direction:column;align-items:stretch}
  .ad-error__actions>*{width:100%}
  .ad-error__title{font-size:var(--ad-fs-h2);line-height:var(--ad-lh-h2)}
}
/* layar pendek (ponsel mendarat/landscape): jangan paksa pusat vertikal, cukup
   beri jarak atas-bawah supaya isinya tetap bisa digulir penuh */
@media (max-height:520px){
  .ad-error{align-items:start;padding-top:var(--ad-space-4)}
  .ad-error__code{font-size:clamp(40px,10vh,64px)}
}

/* Varian halaman galat bersama (AD-25, diperluas AD-27). Tiga halaman galat dipakai
   SATU berkas untuk kedua sisi — 500, 503, dan jaring pengaman 4xx — sebab ketiganya
   bisa terjadi di mana saja, pada /adm maupun /pub. Karena keluarga pasien ikut
   membacanya, teksnya menaati lantai 16px NFR-20 milik portal, bukan --ad-fs-sm 14px
   yang hanya sah untuk petugas. Ini satu-satunya penyimpangan skala di panel admin,
   dan sengaja dikunci ke dua modifier ini saja — jangan dipasang ke komponen lain.
   (--5xx dipakai 500 & 503; --4xx dipakai errors/4xx.blade.php.) */
.ad-error--5xx .ad-error__text,.ad-error--4xx .ad-error__text{font-size:16px;line-height:1.6}
.ad-error--5xx .ad-error__text strong,.ad-error--4xx .ad-error__text strong{font-weight:600;color:var(--ad-ink);font-variant-numeric:tabular-nums}