/* Temanten Photo — STEP 01 Design System: WHITE + GREY NEUTRAL (loaded LAST, visual only).
   No business logic, API, DB, auth or routes are touched. Pastels = small accents only. */

/* ===== 1. TOKENS ===== */
:root{
  --ds-white:#ffffff;--ds-off:#fafaf9;--ds-bg:#f6f6f5;--ds-grey-50:#f3f3f2;--ds-grey-100:#ededec;
  --ds-line:#e6e6e4;--ds-line-soft:#efefed;--ds-grey-300:#d6d6d3;--ds-grey-400:#b4b4b0;
  --ds-mid:#8a8a86;--ds-text-2:#5c5c59;--ds-ink:#2a2a29;--ds-charcoal:#1f1f1f;
  --ds-blue:#e9eef6;--ds-blue-ink:#44597a;--ds-lav:#efecf6;--ds-lav-ink:#5d5480;
  --ds-peach:#fbefe8;--ds-peach-ink:#8a5b43;--ds-mint:#e8f3ee;--ds-mint-ink:#3f6b57;
  --ds-yellow:#faf4e0;--ds-yellow-ink:#7a6624;--ds-rose:#fbecec;--ds-rose-ink:#a14646;
  --ds-r-sm:8px;--ds-r:12px;--ds-r-lg:16px;--ds-pill:999px;
  --ds-sh-1:0 1px 2px rgba(20,20,20,.035);--ds-sh-2:0 6px 20px rgba(20,20,20,.05);
  --ds-sans:"Plus Jakarta Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --ds-serif:"Cormorant Garamond",Georgia,"Times New Roman",serif;
  --ds-tap:44px;--ds-side:248px;--ds-side-c:76px;--ds-ease:cubic-bezier(.2,.7,.2,1);
  /* map legacy admin vars (v19/v21) to neutral */
  --a-bg:var(--ds-bg);--a-card:#fff;--a-iv:var(--ds-off);--a-br:var(--ds-charcoal);--a-br2:var(--ds-charcoal);
  --a-ink:var(--ds-ink);--a-mut:var(--ds-text-2);--a-ln:var(--ds-line);--a-ok:var(--ds-mint-ink);
  --a-warn:var(--ds-yellow-ink);--a-bad:var(--ds-rose-ink);--a-info:var(--ds-blue-ink)
}
::selection{background:#e3e3e0;color:var(--ds-charcoal)}

/* ===== 2. APP SHELL & TYPOGRAPHY ===== */
.tm-shell{background:var(--ds-bg)!important;color:var(--ds-ink)!important;font-family:var(--ds-sans)!important;-webkit-font-smoothing:antialiased;overflow-x:clip!important}
.tm-shell h1.font-serif,.tm-shell [data-testid=page-title],.tm-shell .tmd-h1,.tm-shell .ds-h1{
  font-family:var(--ds-serif)!important;font-weight:600!important;letter-spacing:-.01em!important;
  font-size:clamp(30px,3.6vw,40px)!important;line-height:1.1!important;color:var(--ds-charcoal)!important}
.tm-shell h2.font-serif,.tm-shell .ds-h2{font-family:var(--ds-serif)!important;font-weight:600!important;letter-spacing:0!important;color:var(--ds-charcoal)!important}
.tm-shell h3.font-serif,.tm-shell p.font-serif{font-family:var(--ds-sans)!important;font-weight:700!important;letter-spacing:-.015em!important}
.tm-shell p,.tm-shell small{color:inherit}
.tm-shell .text-zinc-500,.tm-shell .text-zinc-400{color:var(--ds-mid)!important}
.tm-shell .text-zinc-600{color:var(--ds-text-2)!important}
.tm-shell .text-zinc-900,.tm-shell .text-zinc-800{color:var(--ds-ink)!important}
.tm-shell :focus-visible{outline:2px solid var(--ds-grey-400)!important;outline-offset:2px}

/* ===== 3. SIDEBAR (desktop, white + thin line) ===== */
@media (min-width:1024px){
  .tm-side{background:#fff!important;border-right:1px solid var(--ds-line)!important;box-shadow:none!important}
  .tm-shell .tm-main{padding-left:clamp(24px,3vw,48px)!important;padding-right:clamp(24px,3vw,48px)!important;padding-bottom:56px!important}
  .tm-shell .tm-main>div,.tm-shell .tm-main>.tm-top{max-width:1180px;margin-left:auto;margin-right:auto}
}
.tm-side,.tm-side *{color:var(--ds-text-2)}
.tm-side-top{border-bottom:1px solid var(--ds-line-soft)!important;padding:18px 14px 14px 20px!important;background:#fff!important}
.tm-side-logo{height:26px!important;width:auto;opacity:.92;filter:grayscale(1)}
.tm-side-tog{border:1px solid var(--ds-line)!important;background:#fff!important;border-radius:var(--ds-r-sm)!important;color:var(--ds-mid)!important;width:32px!important;height:32px!important}
.tm-side-tog:hover{background:var(--ds-grey-50)!important;color:var(--ds-ink)!important}
.tm-side-nav{padding:12px 10px!important;gap:2px!important}
.tm-side-a{min-height:40px!important;border-radius:10px!important;color:var(--ds-text-2)!important;font-weight:500!important;font-size:14px!important;background:transparent!important;transition:background-color .18s var(--ds-ease),color .18s var(--ds-ease)!important}
.tm-side-a:hover{background:var(--ds-grey-50)!important;color:var(--ds-charcoal)!important}
.tm-side-a.on{background:var(--ds-grey-100)!important;color:var(--ds-charcoal)!important;font-weight:650!important}
.tm-side-a.on *{color:var(--ds-charcoal)!important}
.tm-side-a.on::before{background:var(--ds-charcoal)!important;width:2px!important;left:-10px!important}
.tm-side-badge{background:var(--ds-rose)!important;color:var(--ds-rose-ink)!important;font-weight:700!important}
.tm-side-foot{border-top:1px solid var(--ds-line-soft)!important;background:#fff!important}
.tm-side-mail{color:var(--ds-mid)!important}

/* ===== 4. HEADER (plain: date + notification + profile) ===== */
.tm-top{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:48px;margin:0 0 18px;padding:0 0 12px;border-bottom:1px solid var(--ds-line-soft)}
.tm-top-date{margin:0;font-size:13px;font-weight:500;color:var(--ds-mid);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.tm-top-r{display:flex;align-items:center;gap:8px;flex:none}
.tm-main:has(.tmd-date) .tm-top-date{visibility:hidden}
.tm-top-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;width:var(--ds-tap);height:var(--ds-tap);border-radius:var(--ds-pill);border:1px solid var(--ds-line);background:#fff;color:var(--ds-ink);transition:background-color .18s var(--ds-ease),border-color .18s var(--ds-ease)}
.tm-top-btn:hover{background:var(--ds-grey-50);border-color:var(--ds-grey-300)}
.tm-top-ic{width:19px;height:19px}
.tm-top-badge{position:absolute;top:4px;right:3px;min-width:17px;height:17px;padding:0 5px;border-radius:var(--ds-pill);background:var(--ds-rose);color:var(--ds-rose-ink);font-size:10px;font-weight:700;display:flex;align-items:center;justify-content:center;border:1.5px solid #fff}
.tm-top-prof{display:inline-flex;align-items:center;gap:8px;min-height:var(--ds-tap);padding:0 6px;border-radius:var(--ds-pill);border:1px solid var(--ds-line);background:#fff;color:var(--ds-ink);cursor:pointer;max-width:240px;transition:background-color .18s var(--ds-ease)}
.tm-top-prof:hover{background:var(--ds-grey-50)}
.tm-top-av{width:32px;height:32px;flex:none;border-radius:50%;background:var(--ds-grey-100);color:var(--ds-charcoal);font-size:13px;font-weight:700;display:flex;align-items:center;justify-content:center}
.tm-top-mail{font-size:13px;font-weight:500;color:var(--ds-text-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding-right:8px}
@media (max-width:767px){.tm-top-mail{display:none}.tm-top-prof{padding:0;width:var(--ds-tap);justify-content:center}}

/* ===== 5. BUTTONS ===== */
.tm-shell .btn-gold,.tm-shell .tmd-btn,.tm-shell .ds-btn{background:var(--ds-charcoal)!important;border:1px solid var(--ds-charcoal)!important;color:#fff!important;border-radius:10px!important;box-shadow:none!important;font-weight:600!important;min-height:42px;transition:background-color .18s var(--ds-ease),transform .12s var(--ds-ease)!important}
.tm-shell .btn-gold *,.tm-shell .tmd-btn *{color:#fff!important}
.tm-shell .btn-gold:hover,.tm-shell .tmd-btn:hover,.tm-shell .ds-btn:hover{background:#3a3a39!important;border-color:#3a3a39!important}
.tm-shell .btn-gold:active,.tm-shell .btn-outline:active,.tm-shell .ds-btn:active{transform:scale(.98)}
.tm-shell .btn-outline,.tm-shell .tmd-btn-line,.tm-shell .ds-btn-line{background:#fff!important;border:1px solid var(--ds-line)!important;color:var(--ds-ink)!important;border-radius:10px!important;box-shadow:none!important;font-weight:550!important;min-height:42px}
.tm-shell .tmd-btn-line *{color:var(--ds-ink)!important}
.tm-shell .btn-outline:hover,.tm-shell .tmd-btn-line:hover,.tm-shell .ds-btn-line:hover{background:var(--ds-grey-50)!important;border-color:var(--ds-grey-300)!important}
.tm-shell .btn-icon{border-radius:10px!important;min-width:40px;min-height:40px;color:var(--ds-text-2)!important}
.tm-shell .btn-icon:hover{background:var(--ds-grey-50)!important;border-color:var(--ds-line)!important}
.tm-shell .ds-btn,.tm-shell .ds-btn-line{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:0 16px;font-size:14px;cursor:pointer}
.tm-shell button:disabled{opacity:.5;cursor:not-allowed}

/* ===== 6. FORMS / SEARCH / FILTER ===== */
.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=time],.tm-shell input[type=email],.tm-shell input[type=search],.tm-shell input[type=tel],.tm-shell input[type=url],.tm-shell input[type=password],.tm-shell textarea,.ds-input{
  background:#fff!important;border:1px solid var(--ds-line)!important;border-radius:10px!important;color:var(--ds-ink)!important;box-shadow:none!important;min-height:42px}
.tm-shell .inp::placeholder,.tm-shell textarea::placeholder,.tm-shell input::placeholder{color:var(--ds-grey-400)!important}
.tm-shell .inp:focus,.tm-shell .txa:focus,.tm-shell select:focus,.tm-shell input:focus,.tm-shell textarea:focus,.ds-input:focus{outline:none!important;border-color:var(--ds-grey-400)!important;box-shadow:0 0 0 3px rgba(40,40,40,.07)!important}
.tm-shell label{color:var(--ds-text-2)}
.tm-shell input[type=checkbox],.tm-shell input[type=radio]{accent-color:var(--ds-charcoal)}
.ds-search{position:relative;display:flex;align-items:center;width:100%;max-width:420px}
.ds-search>svg{position:absolute;left:12px;width:17px;height:17px;color:var(--ds-mid);pointer-events:none}
.ds-search>input{width:100%;padding-left:38px!important}
.ds-filter{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.ds-chip-btn{min-height:36px;padding:0 14px;border-radius:var(--ds-pill);border:1px solid var(--ds-line);background:#fff;color:var(--ds-text-2);font-size:13px;font-weight:550;cursor:pointer;transition:background-color .18s,color .18s}
.ds-chip-btn.on,.ds-chip-btn[aria-pressed=true]{background:var(--ds-charcoal);border-color:var(--ds-charcoal);color:#fff}
.ds-form-section{background:#fff;border:1px solid var(--ds-line);border-radius:var(--ds-r-lg);padding:20px;display:grid;gap:16px}
.ds-form-section>h3,.ds-form-section-title{margin:0;font-size:15px;font-weight:700;color:var(--ds-charcoal)}
.ds-form-section-desc{margin:-10px 0 0;font-size:13px;color:var(--ds-mid)}
.ds-form-row{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr))}

/* ===== 7. CARDS / STAT CARDS ===== */
.tm-main .rounded-lg.border,.tm-main .rounded-xl.border,.tm-main .rounded-2xl.border,.ds-card{
  background-color:#fff;border-color:var(--ds-line)!important;border-radius:var(--ds-r-lg)!important;box-shadow:var(--ds-sh-1)!important}
.ds-card{border:1px solid var(--ds-line);padding:20px;min-width:0}
.ds-card-h{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
.ds-card-t{margin:0;font-size:15px;font-weight:700;color:var(--ds-charcoal)}
.ds-grid{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr))}
.ds-stat,.tm-kpi{background:#fff!important;border:1px solid var(--ds-line)!important;border-radius:var(--ds-r-lg)!important;padding:16px 18px!important;box-shadow:var(--ds-sh-1)!important;color:var(--ds-ink)!important;min-width:0}
.tm-kpi::before{background:var(--ds-grey-300)!important;width:2px!important}
.tm-kpi:hover{border-color:var(--ds-grey-300)!important;box-shadow:var(--ds-sh-2)!important}
.ds-stat-l,.tm-kpi-l{font-size:12px!important;font-weight:600!important;color:var(--ds-mid)!important}
.ds-stat-v,.tm-kpi-v{font-size:28px!important;font-weight:700!important;letter-spacing:-.03em!important;color:var(--ds-charcoal)!important;font-variant-numeric:tabular-nums}
.ds-stat-s,.tm-kpi-s{font-size:12px!important;color:var(--ds-mid)!important}
.tm-ok::before{background:var(--ds-mint-ink)!important}.tm-info::before{background:var(--ds-blue-ink)!important}.tm-warn::before{background:#d9c27a!important}.tm-bad::before{background:var(--ds-rose-ink)!important}
.tm-main [data-testid=dash-hero]{background:#fff!important;border-color:var(--ds-line)!important;color:var(--ds-ink)!important}
.tm-main [data-testid=dash-hero] p{color:var(--ds-ink)!important}

/* legacy tailwind "gold" palette -> neutral */
.tm-shell .bg-gold-light,.tm-shell .bg-gold-light\/40,.tm-shell .bg-gold-light\/50{background-color:var(--ds-grey-50)!important}
.tm-shell .bg-gold{background-color:var(--ds-charcoal)!important}
.tm-shell .text-gold,.tm-shell .text-gold-dark{color:var(--ds-charcoal)!important}
.tm-shell .border-gold-line{border-color:var(--ds-line)!important}
.tm-shell .border-gold{border-color:var(--ds-charcoal)!important}
.tm-shell .bg-zinc-50{background-color:var(--ds-off)!important}
.tm-shell .bg-zinc-100{background-color:var(--ds-grey-100)!important}
.tm-shell .border-zinc-200,.tm-shell .border-zinc-100{border-color:var(--ds-line)!important}

/* ===== 8. BADGES / STATUS ===== */
.ds-badge,.tm-shell .tmd-chip{display:inline-flex;align-items:center;gap:5px;height:24px;padding:0 10px;border-radius:var(--ds-pill);font-size:11.5px;font-weight:600;white-space:nowrap;border:1px solid transparent!important;background:var(--ds-grey-100);color:var(--ds-text-2)}
.ds-badge-blue,.tm-shell .tmd-blue{background:var(--ds-blue)!important;color:var(--ds-blue-ink)!important}
.ds-badge-lav,.tm-shell .tmd-brown{background:var(--ds-lav)!important;color:var(--ds-lav-ink)!important}
.ds-badge-peach{background:var(--ds-peach)!important;color:var(--ds-peach-ink)!important}
.ds-badge-mint,.tm-shell .tmd-green{background:var(--ds-mint)!important;color:var(--ds-mint-ink)!important}
.ds-badge-yellow,.tm-shell .tmd-amber{background:var(--ds-yellow)!important;color:var(--ds-yellow-ink)!important}
.ds-badge-rose,.tm-shell .tmd-red{background:var(--ds-rose)!important;color:var(--ds-rose-ink)!important}
.ds-badge-grey,.tm-shell .tmd-gray{background:var(--ds-grey-100)!important;color:var(--ds-text-2)!important}
.ds-dot{width:7px;height:7px;border-radius:50%;background:currentColor;flex:none}
.tm-shell .tmd-late{background:var(--ds-rose)!important;color:var(--ds-rose-ink)!important}
.tm-shell .tmd-dot{background:var(--ds-rose-ink)!important}
/* tailwind status colours used in pages -> soft pastel accents */
.tm-main .bg-emerald-50,.tm-main .bg-green-50{background:var(--ds-mint)!important}.tm-main .text-emerald-800,.tm-main .text-emerald-700,.tm-main .text-green-700{color:var(--ds-mint-ink)!important}
.tm-main .bg-amber-50,.tm-main .bg-yellow-50,.tm-main .bg-orange-50{background:var(--ds-yellow)!important}.tm-main .text-amber-800,.tm-main .text-amber-700,.tm-main .text-orange-800{color:var(--ds-yellow-ink)!important}
.tm-main .bg-red-50,.tm-main .bg-rose-50{background:var(--ds-rose)!important}.tm-main .text-red-700,.tm-main .text-red-600{color:var(--ds-rose-ink)!important}
.tm-main .bg-sky-50,.tm-main .bg-blue-50{background:var(--ds-blue)!important}.tm-main .text-sky-800,.tm-main .text-sky-700,.tm-main .text-blue-700{color:var(--ds-blue-ink)!important}
.tm-main .bg-violet-50,.tm-main .bg-purple-50{background:var(--ds-lav)!important}.tm-main .text-violet-700,.tm-main .text-purple-700{color:var(--ds-lav-ink)!important}
.tm-main .border-amber-200,.tm-main .border-orange-200,.tm-main .border-emerald-200,.tm-main .border-red-200,.tm-main .border-sky-200{border-color:var(--ds-line)!important}

/* ===== 9. TABLE (desktop) + MOBILE LIST CARD ===== */
.tm-main table,.ds-table{width:100%;border-collapse:separate;border-spacing:0;font-size:14px;background:#fff}
.tm-main thead th,.ds-table thead th{background:var(--ds-off)!important;color:var(--ds-mid)!important;font-size:11px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;border-bottom:1px solid var(--ds-line)!important;padding:12px 14px}
.tm-main tbody td,.ds-table tbody td{border-bottom:1px solid var(--ds-line-soft)!important;padding:13px 14px;color:var(--ds-ink)}
.tm-main tbody tr:hover td,.ds-table tbody tr:hover td{background:var(--ds-off)!important}
.ds-table-wrap{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--ds-line);border-radius:var(--ds-r-lg);background:#fff}
.ds-mlist{display:flex;flex-direction:column;gap:10px}
.ds-mlist-card{display:flex;flex-direction:column;gap:6px;padding:14px 16px;background:#fff;border:1px solid var(--ds-line);border-radius:var(--ds-r);color:inherit;text-decoration:none;min-width:0}
.ds-mlist-card b{font-size:15px;font-weight:650;color:var(--ds-charcoal);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ds-mlist-card small{font-size:12.5px;color:var(--ds-mid);overflow-wrap:anywhere}
.ds-mlist-row{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.ds-only-mobile{display:none!important}
@media (max-width:767px){.ds-only-mobile{display:revert!important}.ds-only-desktop{display:none!important}}

/* ===== 10. EMPTY / LOADING ===== */
.ds-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;text-align:center;padding:40px 20px;border:1px dashed var(--ds-grey-300);border-radius:var(--ds-r-lg);background:var(--ds-off);color:var(--ds-mid);font-size:14px}
.ds-empty b{color:var(--ds-ink);font-size:15px}
.ds-loading{display:grid;gap:10px}
.ds-skel{height:14px;border-radius:8px;background:linear-gradient(90deg,var(--ds-grey-100) 0%,var(--ds-grey-50) 50%,var(--ds-grey-100) 100%);background-size:200% 100%;animation:ds-shimmer 1.3s linear infinite}
.ds-spinner{width:22px;height:22px;border-radius:50%;border:2px solid var(--ds-grey-300);border-top-color:var(--ds-charcoal);animation:ds-spin .8s linear infinite}
@keyframes ds-shimmer{to{background-position:-200% 0}}
@keyframes ds-spin{to{transform:rotate(360deg)}}

/* ===== 11. MODAL / DRAWER / POPOVER / TOAST (existing Radix + Sonner) ===== */
[role=dialog]{border-color:var(--ds-line)!important;box-shadow:0 20px 50px rgba(20,20,20,.12)!important;font-family:var(--ds-sans)}
[role=dialog]:not([data-side]){border-radius:var(--ds-r-lg)!important}
[data-radix-popper-content-wrapper]>*{border-color:var(--ds-line)!important;border-radius:var(--ds-r)!important;box-shadow:var(--ds-sh-2)!important}
[data-state=open].fixed.inset-0{background:rgba(25,25,25,.32)!important;backdrop-filter:blur(2px)}
[data-sonner-toast]{font-family:var(--ds-sans)!important;border-radius:var(--ds-r)!important;border:1px solid var(--ds-line)!important;box-shadow:var(--ds-sh-2)!important}
[data-sonner-toast][data-type=success]{background:#fff!important;color:var(--ds-ink)!important}
[data-sonner-toast][data-type=success] [data-icon]{color:var(--ds-mint-ink)!important}
[data-sonner-toast][data-type=error]{background:#fff!important;color:var(--ds-rose-ink)!important}
[data-sonner-toast][data-type=warning]{background:#fff!important;color:var(--ds-yellow-ink)!important}

/* ===== 12. PAGE HEADER helper ===== */
.ds-page-header{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap;margin:0 0 24px}
.ds-page-header p{margin:6px 0 0;font-size:14px;color:var(--ds-mid)}
.ds-page-actions{display:flex;gap:8px;flex-wrap:wrap}

/* ===== 13. DASHBOARD containers: neutral base only (full redesign = STEP 02) ===== */
.tm-shell .tmd{--iv:var(--ds-off);--ln:var(--ds-line);--br:var(--ds-charcoal);--mut:var(--ds-mid)}
.tm-shell .tmd-top{background:transparent!important;border:0!important;box-shadow:none!important;padding:0!important;min-height:0!important;border-radius:0!important;overflow:visible!important}
.tm-shell .tmd-top:after{display:none!important}
.tm-shell .tmd-date{color:var(--ds-mid)!important;letter-spacing:0!important}
.tm-shell .tmd-card{background:#fff!important;border:1px solid var(--ds-line)!important;border-top-width:1px!important;border-radius:var(--ds-r-lg)!important;box-shadow:var(--ds-sh-1)!important;background-image:none!important}
.tm-shell .tmd-count{background:var(--ds-grey-50)!important;border:1px solid var(--ds-line)!important;color:var(--ds-charcoal)!important;border-radius:12px!important;font-family:var(--ds-sans)!important;font-weight:700!important;font-size:20px!important}
.tm-shell .tmd-card-amber .tmd-count{background:var(--ds-yellow)!important;color:var(--ds-yellow-ink)!important;border-color:transparent!important}
.tm-shell .tmd-card-red .tmd-count{background:var(--ds-rose)!important;color:var(--ds-rose-ink)!important;border-color:transparent!important}
.tm-shell .tmd-card-blue .tmd-count{background:var(--ds-blue)!important;color:var(--ds-blue-ink)!important;border-color:transparent!important}
.tm-shell .tmd-card-brown .tmd-count{background:var(--ds-lav)!important;color:var(--ds-lav-ink)!important;border-color:transparent!important}
.tm-shell .tmd-title b{color:var(--ds-charcoal)!important}
.tm-shell .tmd-title small,.tm-shell .tmd-row-main small,.tm-shell .tmd-empty{color:var(--ds-mid)!important}
.tm-shell .tmd-more,.tm-shell .tmd-plus{color:var(--ds-text-2)!important}
.tm-shell .tmd-tog{border-color:var(--ds-line)!important;color:var(--ds-text-2)!important;background:#fff!important}
.tm-shell .tmd-row,.tm-shell .tmd-empty{border-top-color:var(--ds-line-soft)!important}
.tm-shell a.tmd-row:hover,.tm-shell .tmd-unread{background:var(--ds-off)!important}
.tm-shell .tml-mode{background:var(--ds-grey-50)!important;border-color:var(--ds-line)!important}
.tm-shell .tml-mode button.on{background:var(--ds-charcoal)!important;color:#fff!important}
.tm-shell .tml-item{border-color:var(--ds-line)!important;border-radius:var(--ds-r-lg)!important}

/* ===== 14. MOBILE BOTTOM NAV (Dashboard, Booking, Jadwal, Proyek, Pengaturan) ===== */
.tm-bnav{background:rgba(255,255,255,.97)!important;border-top:1px solid var(--ds-line)!important;box-shadow:none!important;backdrop-filter:blur(12px)}
.tm-bnav>div{padding:6px 6px!important;gap:2px}
.tm-bnav a{min-height:56px!important;margin:0!important;border-radius:12px!important;color:var(--ds-mid)!important;background:transparent!important;font-size:11px!important;font-weight:550!important;justify-content:center;transition:color .18s var(--ds-ease),background-color .18s var(--ds-ease)}
.tm-bnav a.active,.tm-bnav a[aria-current=page]{color:var(--ds-charcoal)!important;background:var(--ds-grey-100)!important;font-weight:700!important}
.tm-bnav a span.absolute{background:var(--ds-rose-ink)!important}
@media (min-width:1024px){.tm-bnav{display:none!important}}

/* ===== 15. RESPONSIVE FOUNDATION (360 / 375 / 390 / 414) ===== */
.tm-main{overflow-wrap:anywhere;min-width:0}
.tm-main img,.tm-main video,.tm-main iframe,.tm-main canvas,.tm-main svg{max-width:100%}
.tm-main .recharts-responsive-container,.tm-main .recharts-wrapper{max-width:100%!important}
.tm-shell .tmd-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
@media (max-width:899px){.tm-shell .tmd-grid{grid-template-columns:minmax(0,1fr)!important}.tm-shell .tmd-grid>.tmd-card{grid-column:auto!important}}
@media (max-width:1023px){
  .tm-shell .tm-side{display:none!important}
  .tm-shell .tm-main{margin:0!important;max-width:none!important;padding-top:16px!important;padding-bottom:calc(96px + env(safe-area-inset-bottom))!important}
  .tm-shell .tm-main>div{max-width:900px!important;margin-left:auto;margin-right:auto}
  .tm-bnav{display:block!important;border-radius:0!important;border-left:0!important;border-right:0!important;padding-top:0!important}
}
@media (max-width:767px){
  .tm-shell .tm-main{padding-left:16px!important;padding-right:16px!important;padding-top:12px!important}
  .tm-shell .btn-gold,.tm-shell .btn-outline,.tm-shell .tmd-btn,.tm-shell .ds-btn,.tm-shell .ds-btn-line{min-height:var(--ds-tap)!important}
  .tm-shell .inp,.tm-shell select,.tm-shell textarea,.tm-shell input[type=text],.tm-shell input[type=search],.tm-shell input[type=number],.tm-shell input[type=date],.tm-shell input[type=email],.tm-shell input[type=tel]{font-size:16px!important;min-height:var(--ds-tap)!important}
  .tm-shell .tmd-head{flex-wrap:wrap}
  .tm-shell .tmd-head-r{margin-left:auto}
  .tm-shell .tmd-bar{justify-content:flex-start!important}
  .ds-card,.ds-form-section{padding:16px}
  .ds-page-header{align-items:flex-start;margin-bottom:18px}
  .ds-page-actions{width:100%}
  .ds-page-actions>*{flex:1 1 auto}
  .tm-main table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%}
}
@media (max-width:380px){
  .tm-shell .tm-main{padding-left:14px!important;padding-right:14px!important}
  .tm-bnav a{font-size:10.5px!important}
  .tm-shell h1.font-serif,.tm-shell [data-testid=page-title],.tm-shell .tmd-h1{font-size:28px!important}
}
@media (prefers-reduced-motion:reduce){.tm-shell *{animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* ===== 16. LOGIN ===== */
[data-testid=login-form]{border-color:var(--ds-line)!important;border-radius:var(--ds-r-lg)!important;box-shadow:var(--ds-sh-2)!important}
[data-testid=login-form] .btn-gold{background:var(--ds-charcoal)!important;border-radius:10px!important}
[data-testid=login-form] .inp{background:#fff!important;border:1px solid var(--ds-line)!important;border-radius:10px!important;font-size:16px}