/* Temanten v19 — Admin: Modern Professional Studio Dashboard (lapisan gaya di atas main.css v18) */
:root{--a-bg:#f5f6f8;--a-card:#fff;--a-iv:#faf9f6;--a-br:#4a3b32;--a-br2:#2c2420;--a-ink:#1a1614;--a-mut:#5d534f;--a-ln:#e6e2e0;--a-ok:#2e7d32;--a-warn:#b26a00;--a-bad:#c62828;--a-info:#0277bd;--a-side:248px;--a-side-c:76px}
.tm-shell{background:var(--a-bg)!important;color:var(--a-ink);font-family:"Plus Jakarta Sans",system-ui,sans-serif;-webkit-font-smoothing:antialiased}
.tm-shell h1.font-serif,.tm-shell [data-testid=page-title]{font-family:"Plus Jakarta Sans",system-ui,sans-serif!important;font-weight:700!important;letter-spacing:-.025em!important;font-size:clamp(24px,3vw,30px)!important;line-height:1.15!important;color:var(--a-ink)}
.tm-shell h2.font-serif,.tm-shell h3.font-serif{font-family:"Plus Jakarta Sans",system-ui,sans-serif!important;font-weight:700!important;letter-spacing:-.015em}
.tm-shell p.font-serif{font-family:"Plus Jakarta Sans",system-ui,sans-serif!important;font-weight:700!important;letter-spacing:-.02em}
/* kartu & panel */
.tm-main .rounded-lg.border,.tm-main .rounded-xl.border,.tm-main .rounded-2xl.border{border-color:var(--a-ln)!important;border-radius:12px!important;box-shadow:0 1px 2px rgba(16,12,10,.04),0 4px 14px rgba(16,12,10,.04)}
.tm-main .rounded-lg.border.bg-white,.tm-main .rounded-xl.border.bg-white,.tm-main .rounded-2xl.border.bg-white{background:var(--a-card)!important}
.tm-main [data-testid=dash-hero]{background:var(--a-br2)!important;border-color:var(--a-br2)!important;color:#f4efe7}
.tm-main [data-testid=dash-hero] p{color:#f4efe7!important}
.tm-main [data-testid=dash-hero] p:first-child{color:rgba(244,239,231,.72)!important;letter-spacing:.06em;text-transform:uppercase;font-size:11px!important}
/* tombol */
.tm-shell .btn-gold{background:var(--a-br)!important;color:#fff!important;border-color:var(--a-br)!important;border-radius:8px!important;min-height:42px;font-weight:600;transition:background-color .2s,transform .15s}
.tm-shell .btn-gold:hover{background:var(--a-br2)!important}
.tm-shell .btn-gold:active,.tm-shell .btn-outline:active{transform:scale(.98)}
.tm-shell .btn-outline{border-radius:8px!important;border-color:#d9d4d1!important;background:#fff;color:var(--a-ink)!important;min-height:40px;font-weight:600;transition:background-color .2s,border-color .2s}
.tm-shell .btn-outline:hover{background:var(--a-iv)!important;border-color:var(--a-br)!important}
.tm-shell .btn-icon{min-width:40px;min-height:40px;border-radius:8px!important}
/* form */
.tm-shell .inp,.tm-shell .txa,.tm-shell select,.tm-shell input[type=text],.tm-shell input[type=number],.tm-shell input[type=date],.tm-shell input[type=email],.tm-shell input[type=search]{border-color:#d9d4d1;border-radius:8px!important;font-size:15px;min-height:42px;background:#fff;color:var(--a-ink)}
.tm-shell .inp:focus,.tm-shell .txa:focus,.tm-shell select:focus,.tm-shell input:focus{outline:none!important;border-color:var(--a-br)!important;box-shadow:0 0 0 3px rgba(74,59,50,.14)!important}
.tm-shell label{color:var(--a-mut)}
.tm-shell :focus-visible{outline:2px solid var(--a-br);outline-offset:2px}
/* tabel */
.tm-main table{width:100%;border-collapse:separate;border-spacing:0;font-size:14px}
.tm-main thead th{background:var(--a-iv);color:var(--a-mut);font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;text-align:left;padding:11px 14px;border-bottom:1px solid var(--a-ln)}
.tm-main tbody td{padding:12px 14px;border-bottom:1px solid #f0ecea;vertical-align:top}
.tm-main tbody tr:hover td{background:#fcfbf9}
.tm-main .tabular-nums,.tm-main .tm-money{font-variant-numeric:tabular-nums}
@media (max-width:767px){.tm-main table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%}.tm-main thead th,.tm-main tbody td{padding:10px 12px;white-space:nowrap}}
/* modal, dropdown, sheet: tidak terpotong */
.tm-shell ~ [role=dialog],[role=dialog]{max-height:calc(100dvh - 24px);overflow-y:auto;overscroll-behavior:contain}
[role=dialog] .inp,[role=dialog] .txa{font-size:16px}
[data-radix-popper-content-wrapper]{max-width:calc(100vw - 16px)}
[role=listbox],[role=menu]{max-height:min(60dvh,420px);overflow-y:auto}
/* sidebar desktop */
.tm-side{display:none}
@media (min-width:1024px){
.tm-side{display:flex;flex-direction:column;position:fixed;inset:0 auto 0 0;width:var(--a-side);background:#fff;border-right:1px solid var(--a-ln);z-index:45;transition:width .25s ease}
.tm-shell .tm-main{margin-left:var(--a-side);max-width:none;padding-left:clamp(24px,3vw,44px);padding-right:clamp(24px,3vw,44px);padding-bottom:48px;transition:margin-left .25s ease}
.tm-shell .tm-main>div{max-width:1180px;margin:0 auto}
.tm-bnav{display:none!important}
.tm-col .tm-side{width:var(--a-side-c)}
.tm-col .tm-main{margin-left:var(--a-side-c)}
}
.tm-side-top{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:18px 16px 14px 20px;border-bottom:1px solid #f0ecea}
.tm-side-logo{height:38px;width:auto;transition:opacity .2s}
.tm-side-tog{width:34px;height:34px;border-radius:8px;border:1px solid var(--a-ln);background:#fff;color:var(--a-mut);display:flex;align-items:center;justify-content:center;flex:none;cursor:pointer;transition:background-color .2s}
.tm-side-tog:hover{background:var(--a-iv);color:var(--a-ink)}
.tm-side-nav{flex:1;overflow-y:auto;padding:12px 10px;display:flex;flex-direction:column;gap:2px}
.tm-side-a{position:relative;display:flex;align-items:center;gap:12px;min-height:42px;padding:9px 12px;border-radius:9px;color:var(--a-mut);font-size:14px;font-weight:500;text-decoration:none;background:none;border:0;width:100%;text-align:left;cursor:pointer;white-space:nowrap;transition:background-color .15s,color .15s}
.tm-side-a:hover{background:var(--a-iv);color:var(--a-ink)}
.tm-side-a.on{background:#f3efe9;color:var(--a-br2);font-weight:700}
.tm-side-a.on::before{content:"";position:absolute;left:-10px;top:9px;bottom:9px;width:3px;border-radius:0 3px 3px 0;background:var(--a-br)}
.tm-side-ic{width:20px;height:20px;flex:none}
.tm-side-l{overflow:hidden;text-overflow:ellipsis}
.tm-side-badge{margin-left:auto;min-width:20px;height:20px;padding:0 6px;border-radius:99px;background:var(--a-bad);color:#fff;font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center}
.tm-side-foot{border-top:1px solid #f0ecea;padding:10px}
.tm-side-mail{display:block;padding:4px 12px 6px;font-size:12px;color:var(--a-mut);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tm-col .tm-side-top{flex-direction:column;padding:14px 8px;gap:10px}
.tm-col .tm-side-logo{height:26px}
.tm-col .tm-side-l,.tm-col .tm-side-mail{display:none}
.tm-col .tm-side-a{justify-content:center;padding:9px}
.tm-col .tm-side-badge{position:absolute;top:4px;right:6px;min-width:16px;height:16px;font-size:9px;padding:0 4px}
/* navigasi bawah (HP & tablet) */
.tm-bnav{box-shadow:0 -6px 20px rgba(16,12,10,.05)}
.tm-bnav a,.tm-bnav button{min-height:52px}
/* dashboard */
@media (min-width:1024px){.tm-dash{max-width:1080px!important}}
.tm-kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.tm-kpi{display:flex;flex-direction:column;gap:2px;background:#fff;border:1px solid var(--a-ln);border-radius:12px;padding:14px 16px;text-decoration:none;color:var(--a-ink);box-shadow:0 1px 2px rgba(16,12,10,.04);transition:border-color .2s,transform .2s,box-shadow .2s;position:relative;overflow:hidden}
.tm-kpi::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:#d9d4d1}
.tm-kpi:hover{border-color:var(--a-br);transform:translateY(-1px);box-shadow:0 8px 20px rgba(16,12,10,.06)}
.tm-kpi-l{font-size:12px;font-weight:600;color:var(--a-mut)}
.tm-kpi-v{font-size:28px;font-weight:800;letter-spacing:-.03em;line-height:1.15;font-variant-numeric:tabular-nums}
.tm-kpi-s{font-size:11.5px;color:#8a807b}
.tm-ok::before{background:var(--a-ok)}.tm-info::before{background:var(--a-info)}.tm-warn::before{background:#e0a100}.tm-bad::before{background:var(--a-bad)}
.tm-has.tm-bad .tm-kpi-v{color:var(--a-bad)}.tm-has.tm-warn .tm-kpi-v{color:var(--a-warn)}
@media (min-width:1024px){.tm-kpis{grid-template-columns:repeat(6,minmax(0,1fr))}}
@media (max-width:420px){.tm-kpis{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.tm-kpi{padding:12px}.tm-kpi-v{font-size:24px}}
/* status: warna konsisten */
.tm-main .bg-emerald-50{background:#e8f3ea!important}.tm-main .text-emerald-800,.tm-main .text-emerald-700{color:var(--a-ok)!important}
.tm-main .bg-amber-50{background:#fff5e0!important}.tm-main .text-amber-800,.tm-main .text-amber-700{color:var(--a-warn)!important}
.tm-main .bg-red-50{background:#fdecec!important}.tm-main .text-red-700,.tm-main .text-red-600{color:var(--a-bad)!important}
.tm-main .bg-sky-50{background:#e7f2fa!important}.tm-main .text-sky-800,.tm-main .text-sky-700{color:var(--a-info)!important}
/* responsif umum */
.tm-main{overflow-wrap:anywhere}
.tm-main img{max-width:100%}
@media (max-width:640px){.tm-shell .btn-gold,.tm-shell .btn-outline{min-height:44px}.tm-main{padding-left:14px!important;padding-right:14px!important}}
/* v19 r3: badge Populer tetap di dalam kartu paket */
[data-testid^="package-card-"]{position:relative}