:root,[data-theme="dark"]{
  --bg:#0f1412;--bg-soft:#161c19;--panel:#1a221e;--panel-2:#222c27;
  --border:#2a3830;--border-soft:#24302a;
  --txt:#e8f0eb;--txt-2:#9aafa3;--txt-3:#6d8076;
  --accent:#3d8f6a;--accent-soft:rgba(61,143,106,.16);
  --accent-txt:#04140c;
  --red:#ef5350;--red-soft:rgba(239,83,80,.13);
  --amber:#ffb74d;--amber-soft:rgba(255,183,77,.13);
  --blue:#64b5f6;--blue-soft:rgba(100,181,246,.13);
  --green:#66bb6a;--green-soft:rgba(102,187,106,.13);
  --overlay:rgba(5,8,7,.72);
  --shadow-modal:0 24px 70px rgba(0,0,0,.55);
  --shadow-toast:0 10px 30px rgba(0,0,0,.5);
  --shadow-btn:0 3px 12px rgba(61,143,106,.35);
  --row-hover:rgba(255,255,255,.03);
  --fab-shadow:0 8px 24px rgba(61,143,106,.4);
  --radius:14px;--sidebar-w:248px;--bottom-h:56px;
  font-size:15px;
}
[data-theme="light"]{
  --bg:#eef2f0;--bg-soft:#ffffff;--panel:#ffffff;--panel-2:#f2f6f4;
  --border:#c5d0c9;--border-soft:#dde5e0;
  --txt:#152019;--txt-2:#4d5f55;--txt-3:#7a8c82;
  --accent:#2e7d57;--accent-soft:rgba(46,125,87,.14);
  --accent-txt:#ffffff;
  --red:#d32f2f;--red-soft:rgba(211,47,47,.1);
  --amber:#ed8a00;--amber-soft:rgba(237,138,0,.12);
  --blue:#1976d2;--blue-soft:rgba(25,118,210,.1);
  --green:#2e7d32;--green-soft:rgba(46,125,50,.1);
  --overlay:rgba(21,32,25,.45);
  --shadow-modal:0 20px 50px rgba(21,32,25,.18);
  --shadow-toast:0 8px 24px rgba(21,32,25,.14);
  --shadow-btn:0 3px 10px rgba(46,125,87,.28);
  --row-hover:rgba(21,32,25,.04);
  --fab-shadow:0 8px 24px rgba(46,125,87,.35);
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{
  font-family:'Segoe UI',system-ui,-apple-system,Roboto,'Helvetica Neue',sans-serif;
  background:var(--bg);color:var(--txt);
  display:flex;min-height:100vh;min-height:100dvh;
}
::selection{background:var(--accent-soft)}
button{font:inherit;cursor:pointer;border:none;background:none;color:inherit}
input,select,textarea{
  font:inherit;color:var(--txt);background:var(--bg-soft);
  border:1px solid var(--border);border-radius:11px;padding:12px 13px;width:100%;
  outline:none;transition:border-color .15s;
}
input:focus,select:focus,textarea:focus{border-color:var(--accent)}
label{display:block;font-size:.8rem;color:var(--txt-2);margin-bottom:6px;font-weight:600;letter-spacing:.02em}
h1{font-size:1.4rem;font-weight:800}
h2{font-size:1.08rem;font-weight:700}
h3{font-size:.95rem;font-weight:600}
.num{font-variant-numeric:tabular-nums}
.hidden{display:none!important}

#appShell{
  display:flex;flex:1;min-width:0;width:100%;
  min-height:100vh;min-height:100dvh;
}

#sidebar{
  width:var(--sidebar-w);min-width:var(--sidebar-w);
  background:var(--bg-soft);border-right:1px solid var(--border-soft);
  display:flex;flex-direction:column;position:sticky;top:0;height:100vh;height:100dvh;overflow-y:auto;
}
.logo{display:flex;align-items:center;gap:10px;padding:20px 18px 16px;font-weight:800;font-size:1.05rem}
.logo-mark{
  width:38px;height:38px;border-radius:11px;background:var(--accent);color:var(--accent-txt);
  display:flex;align-items:center;justify-content:center;font-size:1.15rem;font-weight:900;
  box-shadow:var(--shadow-btn);flex:0 0 auto;
}
.logo small{display:block;font-size:.68rem;color:var(--txt-3);font-weight:500}
nav{padding:6px 12px;display:flex;flex-direction:column;gap:2px}
.navlink{
  display:flex;align-items:center;gap:11px;padding:11px 12px;border-radius:11px;
  color:var(--txt-2);font-weight:600;font-size:.92rem;text-align:left;width:100%;
  transition:background .12s,color .12s;
}
.navlink:hover{background:var(--panel);color:var(--txt)}
.navlink.active{background:var(--accent-soft);color:var(--accent)}
.navlink .ic{width:22px;text-align:center;font-size:1.05rem}
.navlink .badge{
  margin-left:auto;background:var(--red);color:#fff;font-size:.68rem;
  min-width:19px;height:19px;border-radius:10px;display:flex;align-items:center;justify-content:center;
  padding:0 5px;font-weight:700;
}
.nav-section{padding:16px 14px 6px;font-size:.68rem;font-weight:700;color:var(--txt-3);letter-spacing:.09em;text-transform:uppercase}
.sidebar-foot{margin-top:auto;padding:14px 12px;border-top:1px solid var(--border-soft);display:flex;flex-direction:column;gap:2px}

#main{flex:1;min-width:0;padding:26px 32px 60px;max-width:1100px}
.page-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:20px;flex-wrap:wrap}
.page-head p{color:var(--txt-2);font-size:.9rem;margin-top:4px}
.page-head-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center}

.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:11px 16px;border-radius:11px;font-weight:700;font-size:.92rem;
  background:var(--panel-2);border:1px solid var(--border);color:var(--txt);
  transition:filter .12s;white-space:nowrap;min-height:44px;
}
.btn:hover{filter:brightness(1.12)}
.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-txt);box-shadow:var(--shadow-btn)}
.btn.danger{background:var(--red-soft);border-color:transparent;color:var(--red)}
.btn.ghost{background:transparent}
.btn.sm{padding:7px 12px;font-size:.82rem;min-height:36px;border-radius:9px}
.btn.block{width:100%}
.btn:disabled{opacity:.45;cursor:not-allowed;filter:none}

.card{background:var(--panel);border:1px solid var(--border-soft);border-radius:var(--radius);padding:16px 18px}
.stat-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:18px}
@media(min-width:700px){
  .stat-grid{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px}
}
.stat-grid.compact{gap:8px;margin-bottom:14px}
.stat-grid.compact .stat{padding:10px 12px}
.stat-grid.compact .stat .val{font-size:1.05rem}
.stat{background:var(--panel);border:1px solid var(--border-soft);border-radius:var(--radius);padding:14px 16px}
.stat .lbl{font-size:.72rem;color:var(--txt-3);font-weight:700;text-transform:uppercase;letter-spacing:.06em}
.stat .val{font-size:1.4rem;font-weight:800;margin-top:5px}
.stat .val.num,.data-table .num{font-variant-numeric:tabular-nums;font-feature-settings:"tnum"}
.stat .sub{font-size:.76rem;color:var(--txt-2);margin-top:3px}
.stat.alert{border-color:var(--amber);background:var(--amber-soft)}
.stat.danger{border-color:var(--red);background:var(--red-soft)}

.filters .filter-search{
  flex:1;min-width:160px;max-width:280px;
}

.month-stack{display:flex;flex-direction:column;gap:18px}
.month-block{
  background:var(--panel);border:1px solid var(--border-soft);border-radius:var(--radius);
  overflow:hidden;
}
.month-head{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:10px 14px;border-bottom:1px solid var(--border-soft);
  background:var(--panel-2);position:sticky;top:0;z-index:2;
}
.month-head-left{display:flex;align-items:center;gap:10px;min-width:0}
.month-head .month-title{font-weight:800;font-size:.95rem;text-transform:capitalize}
.month-head .month-meta{
  display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;justify-content:flex-end;
  font-size:.82rem;font-weight:700;white-space:normal;text-align:right;
}
.month-meta .mm-count,
.month-sep-meta .mm-count{
  color:var(--txt-3);font-weight:700;font-size:.78rem;
}
.month-meta .mm-sum,
.month-sep-meta .mm-sum{
  color:var(--txt);font-weight:800;font-variant-numeric:tabular-nums;font-size:.92rem;
}
.pay-table .month-sep-meta{
  display:inline-flex;align-items:baseline;gap:10px;flex-wrap:wrap;
  font-size:.82rem;font-weight:700;
}
.month-check{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:28px;min-height:28px;flex:0 0 auto;cursor:pointer;
}
.month-check input{
  width:18px;height:18px;accent-color:var(--accent);cursor:pointer;
}

.select-all-bar{
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  margin:0 0 12px;padding:10px 12px;
  background:var(--panel);border:1px solid var(--border-soft);border-radius:12px;
}
.select-all-label{
  display:inline-flex;align-items:center;gap:8px;font-weight:700;cursor:pointer;
}
.select-all-label input{width:18px;height:18px;accent-color:var(--accent)}
.select-all-bar .hint{flex:1;min-width:6rem}
.select-actions{
  display:flex;flex-wrap:wrap;gap:6px;align-items:center;
}
.invoice-sel-dock{
  position:fixed;left:0;right:0;z-index:55;
  bottom:calc(var(--bottom-h) + env(safe-area-inset-bottom, 0px));
  padding:10px 12px;
  background:var(--bg-soft);
  border-top:1px solid var(--border-soft);
  box-shadow:0 -10px 28px rgba(0,0,0,.28);
}
.invoice-sel-dock-inner{
  display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;
  max-width:1100px;margin:0 auto;
}
.invoice-sel-count{
  font-size:.82rem;font-weight:800;color:var(--accent);white-space:nowrap;
}
.invoice-sel-dock .select-actions{flex:1;min-width:0;justify-content:flex-end}
body.has-inv-sel #fab{visibility:hidden;pointer-events:none}
@media(min-width:901px){
  .invoice-sel-dock{
    left:var(--sidebar-w);
    bottom:0;
    padding-bottom:12px;
  }
}
@media(max-width:900px){
  body.has-inv-sel #main{
    padding-bottom:calc(var(--bottom-h) + 140px + env(safe-area-inset-bottom, 0px));
  }
}

.table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
.data-table{
  width:100%;border-collapse:collapse;font-size:.86rem;
}
.data-table th,.data-table td{
  padding:8px 6px;text-align:left;border-bottom:1px solid var(--border-soft);
  vertical-align:middle;white-space:nowrap;
}
.data-table th{
  font-size:.65rem;text-transform:uppercase;letter-spacing:.05em;
  color:var(--txt-3);font-weight:700;background:var(--bg-soft);
  position:sticky;top:0;z-index:1;
}
.data-table .num{text-align:right}
.data-table .strong{font-weight:800}
.data-table .mono{font-variant-numeric:tabular-nums;font-weight:700}
.data-table .col-check{width:28px;text-align:center;padding-left:6px;padding-right:2px}
.data-table .col-check input{
  width:14px;height:14px;margin:0;accent-color:var(--accent);
  vertical-align:middle;
}
.data-table .col-client{max-width:120px}
.data-table .col-actions{white-space:nowrap}
.data-table .col-actions .btn{padding:4px 8px;min-height:0;font-size:.72rem}
.data-table .alloc-cell{white-space:normal;max-width:220px}
.data-table .date-long{display:none}
.data-table .date-short{font-variant-numeric:tabular-nums}
.data-table .date-short .dt-hm{color:var(--txt-3);font-weight:600;font-size:.78em}
.data-table .only-desk{display:none}
.data-table .email-to-cell{max-width:42vw;white-space:normal}
.data-table .email-to{
  font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%;
}
.data-table .email-subj-mobi{
  margin-top:2px;font-size:.72rem;color:var(--txt-3);font-weight:600;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%;
}
.data-table .notif-title-cell{max-width:48vw;white-space:normal}
.data-table .notif-title{font-weight:700}
.data-table .notif-body-mobi{
  margin-top:2px;font-size:.72rem;color:var(--txt-3);font-weight:600;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%;
}
.data-table .email-inv-cell{
  font-variant-numeric:tabular-nums;font-weight:700;font-size:.8rem;
  max-width:28vw;overflow:hidden;text-overflow:ellipsis;
}
.data-table .email-subj-desk{max-width:280px;overflow:hidden;text-overflow:ellipsis}
.data-table tbody tr.data-row{cursor:pointer}
.data-table tbody tr.data-row:hover{filter:brightness(1.03)}
.data-table tbody tr.data-row.selected{outline:1px solid var(--accent);outline-offset:-1px}
.data-table tbody tr.data-row.bad{
  background:var(--red-soft);
  box-shadow:inset 3px 0 0 var(--red);
}
.data-table tbody tr.data-row.warn{
  background:var(--amber-soft);
  box-shadow:inset 3px 0 0 var(--amber);
}
.data-table tbody tr.data-row.ok{
  background:var(--green-soft);
  box-shadow:inset 3px 0 0 var(--green);
}

.client-swatch{
  display:inline-block;width:10px;height:10px;border-radius:3px;flex:0 0 auto;
  vertical-align:middle;box-shadow:inset 0 0 0 1px rgba(0,0,0,.12);
}
.client-chip{
  display:inline-flex;align-items:center;gap:6px;max-width:118px;
  overflow:hidden;font-weight:650;
}
.client-chip-name{
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;
}
button.linkish{
  background:none;border:0;padding:0;margin:0;color:var(--accent);
  font:inherit;font-weight:700;cursor:pointer;text-decoration:none;
}
button.linkish:hover{text-decoration:underline}

.table-panel{
  background:var(--panel);border:1px solid var(--border-soft);border-radius:var(--radius);
  overflow:hidden;
}
.data-table-fixed{table-layout:fixed;width:100%}
.pay-table{background:var(--panel)}
.pay-table col.pay-col-client{width:44%}
.pay-table col.pay-col-date{width:18%}
.pay-table col.pay-col-type{width:14%}
.pay-table col.pay-col-amt{width:24%}
.pay-table .col-client{max-width:none}
.pay-table .client-chip{max-width:100%}
.pay-table .pay-col-type{font-weight:700;color:var(--txt-2)}
.pay-table .pay-col-amt{font-variant-numeric:tabular-nums}
.pay-table thead th{
  background:var(--panel-2);border-bottom:1px solid var(--border);
}
.pay-table tbody tr.data-row{cursor:default}
.pay-table tbody tr.data-row td{
  background:var(--panel);border-bottom:1px solid var(--border-soft);
}
.pay-table tbody tr.data-row:hover{filter:none}
.pay-table tbody tr.data-row:hover td{background:var(--row-hover)}
.pay-table tr.month-sep td{
  background:var(--panel-2);border-top:1px solid var(--border);border-bottom:1px solid var(--border-soft);
  padding:11px 12px;white-space:normal;cursor:default;
}
.pay-table tr.month-sep:first-child td{border-top:none}
.pay-table tr.month-sep:hover{filter:none}
.pay-table .month-sep-title{
  font-weight:800;font-size:.92rem;text-transform:capitalize;margin-right:12px;
}

@media(min-width:901px){
  .data-table{font-size:.9rem;min-width:720px}
  .pay-table{min-width:0}
  .data-table th,.data-table td{padding:9px 10px}
  .data-table .col-check input{width:16px;height:16px}
  .data-table .col-client{max-width:180px}
  .pay-table .col-client{max-width:none}
  .client-chip{max-width:170px}
  .pay-table .client-chip{max-width:100%}
  .data-table .date-short{display:none}
  .data-table .date-long{display:inline}
  .data-table .only-desk{display:table-cell}
  .data-table .email-subj-mobi{display:none}
  .data-table .notif-body-mobi{display:none}
  .data-table .notif-title-cell{max-width:280px}
  .data-table .email-to-cell{max-width:220px}
  .data-table .email-inv-cell{max-width:260px;white-space:normal}
  .data-table tbody tr.data-row.ok,
  .data-table tbody tr.data-row.warn,
  .data-table tbody tr.data-row.bad{background:transparent}
  .data-table tbody tr.data-row:hover{background:var(--accent-soft);filter:none}
  .data-table tbody tr.data-row.selected{background:var(--accent-soft);outline:none}
  .pay-table col.pay-col-client{width:40%}
  .pay-table col.pay-col-date{width:22%}
  .pay-table col.pay-col-type{width:14%}
  .pay-table col.pay-col-amt{width:24%}
}

.home-periods{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px}
.home-period{
  background:var(--panel);border:1px solid var(--border-soft);border-radius:var(--radius);
  padding:14px 16px;
}
.home-period .hp-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:8px}
.home-period .hp-title{font-weight:800;font-size:1rem;text-transform:capitalize}
.home-period .hp-qty{font-size:.8rem;color:var(--txt-3);font-weight:700;white-space:nowrap}
.home-period .hp-total{font-size:1.35rem;font-weight:800;margin-bottom:10px}
.home-period .hp-ttc{font-size:.72rem;font-weight:700;color:var(--txt-3);letter-spacing:.04em}
.home-period .hp-rows{display:flex;flex-direction:column;gap:7px}
.home-period .hp-row{display:flex;justify-content:space-between;align-items:baseline;gap:12px;font-size:.86rem}
.home-period .hp-row span{color:var(--txt-2)}
.home-period .hp-row strong{font-weight:700}
.home-period .hp-charge span,.home-period .hp-charge strong{color:var(--txt-3)}
.home-period .hp-net{
  margin-top:4px;padding-top:8px;border-top:1px solid var(--border-soft);
  font-size:.92rem;
}
.home-period .hp-net span{color:var(--txt);font-weight:700}
.home-period .hp-net strong{font-weight:800;font-size:1.05rem;color:var(--accent)}
.home-period .hp-clients{
  margin-top:12px;padding-top:10px;border-top:1px solid var(--border-soft);
  display:flex;flex-direction:column;gap:7px;
}
.home-period .hp-client{
  display:grid;grid-template-columns:10px minmax(0,1fr) auto auto;gap:8px;align-items:center;
  font-size:.8rem;
}
.home-period .hp-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.home-period .hp-cname{color:var(--txt-2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.home-period .hp-cqty{color:var(--txt-3);font-weight:700;font-variant-numeric:tabular-nums}
.home-period .hp-client strong{font-weight:700;font-variant-numeric:tabular-nums}
.home-period .hp-empty{font-size:.8rem;color:var(--txt-3)}

.home-chart{
  background:var(--panel);border:1px solid var(--border-soft);border-radius:var(--radius);
  padding:14px 16px 12px;margin-bottom:18px;width:100%;
}
.home-chart-head{
  display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:12px;
}
.home-chart-title{font-weight:800;font-size:.95rem}
.home-chart-hint{font-size:.72rem;color:var(--txt-3);font-weight:700;white-space:nowrap}
.home-chart-empty{font-size:.82rem;color:var(--txt-3);padding:18px 0 8px;text-align:center}
.home-bars{
  display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:6px;
  align-items:end;min-height:160px;
}
.home-bar-col{
  display:flex;flex-direction:column;align-items:center;justify-content:flex-end;
  gap:6px;min-width:0;height:100%;
}
.home-bar-val{
  font-size:.58rem;font-weight:700;color:var(--txt-2);line-height:1.15;
  text-align:center;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  font-variant-numeric:tabular-nums;min-height:1.35em;
}
.home-bar-track{
  width:100%;max-width:28px;height:110px;margin:0 auto;
  display:flex;align-items:flex-end;
  background:var(--panel-2);border-radius:8px 8px 4px 4px;overflow:hidden;
}
.home-bar-fill{
  width:100%;min-height:0;border-radius:8px 8px 3px 3px;
  background:linear-gradient(180deg,var(--accent),color-mix(in srgb,var(--accent) 70%,#000));
  transition:height .25s ease;
}
.home-bar-fill.recv{
  background:linear-gradient(180deg,var(--blue),color-mix(in srgb,var(--blue) 70%,#000));
}
.home-bar-lbl{
  font-size:.62rem;font-weight:700;color:var(--txt-3);text-transform:capitalize;
  text-align:center;line-height:1.1;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}

@media (max-width:560px){
  .home-periods{grid-template-columns:1fr;gap:10px}
  .home-period .hp-total{font-size:1.25rem}
  .home-chart{padding:12px 10px 10px}
  .home-bars{gap:3px;min-height:150px}
  .home-bar-track{height:100px;max-width:22px;border-radius:6px 6px 3px 3px}
  .home-bar-val{font-size:.5rem}
  .home-bar-lbl{font-size:.55rem}
}

.home-push-banner{
  display:flex;align-items:center;gap:10px;width:100%;
  margin:0 0 14px;padding:10px 12px;
  text-align:left;border-radius:12px;cursor:pointer;
  border:1px solid var(--blue);background:var(--blue-soft);
  color:var(--txt);transition:filter .12s,transform .12s;
}
.home-push-banner:hover{filter:brightness(1.04)}
.home-push-banner:active{transform:scale(.99)}
.home-push-banner .hpb-ic{font-size:1.15rem;line-height:1;flex-shrink:0}
.home-push-banner .hpb-txt{
  flex:1;min-width:0;font-size:.8rem;line-height:1.35;color:var(--txt-2);
}
.home-push-banner .hpb-txt strong{color:var(--blue);font-weight:800}
.home-push-banner .hpb-go{
  flex-shrink:0;font-size:.72rem;font-weight:800;color:var(--accent-txt);
  background:var(--blue);padding:5px 10px;border-radius:999px;
}
[data-theme="light"] .home-push-banner .hpb-txt strong{color:#0d47a1}
[data-theme="light"] .home-push-banner .hpb-go{background:#1976d2;color:#fff}

.action-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:22px}
.action-card{
  background:var(--panel);border:1px solid var(--border-soft);border-radius:14px;
  padding:12px 12px 14px;text-align:left;display:flex;flex-direction:column;gap:4px;
  min-height:0;transition:border-color .12s,transform .12s,background .12s;
}
.action-card:hover{transform:translateY(-2px)}
.action-card .ac-top{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:2px}
.action-card .ic{font-size:1.25rem;line-height:1}
.action-card .ac-tone{
  font-size:.65rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em;
  padding:2px 7px;border-radius:999px;background:var(--panel-2);color:var(--txt-3);
}
.action-card .t{font-weight:800;font-size:.92rem}
.action-card .s{font-size:.74rem;color:var(--txt-2);line-height:1.3}
.action-card .ac-detail{
  margin-top:6px;display:flex;flex-direction:column;gap:3px;
  padding-top:6px;border-top:1px solid rgba(127,127,127,.18);
}
.action-card .ac-line{
  display:flex;justify-content:space-between;align-items:baseline;gap:8px;
  font-size:.72rem;line-height:1.25;
}
.action-card .ac-line span{color:var(--txt-2);text-transform:capitalize;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:inline-flex;align-items:center;gap:6px}
.action-card .ac-line .ac-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0;display:inline-block}
.action-card .ac-line strong{font-weight:800;font-variant-numeric:tabular-nums;flex-shrink:0}
.bill-client-row .row-main{align-items:center}
.bill-client-row .cc-swatch{width:10px;height:40px;border-radius:4px;flex-shrink:0}
.bill-client-row .grow{flex:1;min-width:0}
.bill-client-row .meta{margin-top:6px}
.action-card .count{
  margin-top:8px;align-self:flex-start;
  padding:3px 10px;border-radius:20px;font-size:.72rem;font-weight:800;
  background:rgba(0,0,0,.14);color:inherit;
}
.action-card.tone-action{
  border-color:var(--amber);background:var(--amber-soft);
}
.action-card.tone-action .ac-tone{background:rgba(255,183,77,.25);color:var(--amber)}
.action-card.tone-action .count{background:rgba(255,183,77,.28);color:var(--amber)}
.action-card.tone-wait{
  border-color:var(--blue);background:var(--blue-soft);
}
.action-card.tone-wait .ac-tone{background:rgba(100,181,246,.22);color:var(--blue)}
.action-card.tone-wait .count{background:rgba(100,181,246,.25);color:var(--blue)}
.action-card.tone-ok{
  border-color:var(--border-soft);
  box-shadow:inset 3px 0 0 var(--green);
}
.action-card.tone-ok .ac-tone{background:var(--green-soft);color:var(--green)}
[data-theme="light"] .action-card.tone-action .ac-tone,
[data-theme="light"] .action-card.tone-action .count{color:#9a5b00}
[data-theme="light"] .action-card.tone-wait .ac-tone,
[data-theme="light"] .action-card.tone-wait .count{color:#0d47a1}

.client-list{display:grid;gap:10px}
.client-card{
  width:100%;text-align:left;cursor:pointer;
  background:var(--panel);border:1px solid var(--border-soft);border-radius:14px;
  padding:14px 14px 12px;display:flex;flex-direction:column;gap:10px;
  color:inherit;font:inherit;
}
.client-card:hover{border-color:var(--accent)}
.client-card.needs-action{border-color:var(--amber);background:linear-gradient(180deg,var(--amber-soft),var(--panel) 42%)}
.client-card.waiting{border-color:var(--blue);background:linear-gradient(180deg,var(--blue-soft),var(--panel) 42%)}
.client-card.ok{box-shadow:inset 3px 0 0 var(--green)}
.client-card .cc-head{
  display:grid;grid-template-columns:10px minmax(0,1fr) auto;gap:10px;align-items:center;
}
.client-card .cc-swatch{
  width:10px;height:36px;border-radius:4px;flex-shrink:0;
}
.client-card .cc-id{min-width:0}
.client-card .cc-name{
  font-weight:800;font-size:1.05rem;line-height:1.2;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.client-card .cc-sub{
  font-size:.78rem;color:var(--txt-2);margin-top:2px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.client-card .cc-worked{text-align:right;flex-shrink:0}
.client-card .cc-worked-val{font-weight:800;font-size:1.05rem;line-height:1.15}
.client-card .cc-worked-lbl{font-size:.68rem;font-weight:700;color:var(--txt-3);text-transform:uppercase;letter-spacing:.03em;margin-top:2px}
.client-card .cc-flags{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.client-card .cc-flag{
  display:inline-flex;align-items:baseline;gap:6px;
  padding:5px 10px;border-radius:999px;
  background:var(--panel-2);width:auto;max-width:100%;
}
.client-card .cc-flag span{font-size:.68rem;font-weight:700;color:var(--txt-3);text-transform:uppercase;letter-spacing:.03em}
.client-card .cc-flag strong{font-size:.86rem;font-weight:800;font-variant-numeric:tabular-nums}
.client-card .cc-flag.action{background:var(--amber-soft)}
.client-card .cc-flag.action span,.client-card .cc-flag.action strong{color:var(--amber)}
.client-card .cc-flag.wait{background:var(--blue-soft)}
.client-card .cc-flag.wait span,.client-card .cc-flag.wait strong{color:var(--blue)}
.client-card .cc-flag.ok{background:var(--green-soft)}
.client-card .cc-flag.ok span,.client-card .cc-flag.ok strong{color:var(--green)}
.client-card .cc-sec{
  display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;
  font-size:.78rem;color:var(--txt-3);padding-top:2px;
}
.client-card .cc-sec strong{color:var(--txt-2);font-weight:700}
[data-theme="light"] .client-card .cc-flag.action span,
[data-theme="light"] .client-card .cc-flag.action strong{color:#9a5b00}
[data-theme="light"] .client-card .cc-flag.wait span,
[data-theme="light"] .client-card .cc-flag.wait strong{color:#0d47a1}

.charge-list{display:grid;gap:12px}
.charge-card{
  background:var(--panel);border:1px solid var(--border-soft);border-radius:14px;
  padding:14px;display:flex;flex-direction:column;gap:12px;
}
.charge-card.tone-action{border-color:var(--amber);background:linear-gradient(180deg,var(--amber-soft),var(--panel) 38%)}
.charge-card.tone-wait{border-color:var(--blue);background:linear-gradient(180deg,var(--blue-soft),var(--panel) 38%)}
.charge-card.tone-ok{box-shadow:inset 3px 0 0 var(--green)}
.charge-card .ch-head{
  display:flex;align-items:flex-start;justify-content:space-between;gap:12px;
}
.charge-card .ch-id{min-width:0;flex:1}
.charge-card .ch-month{
  font-weight:800;font-size:1.05rem;text-transform:capitalize;line-height:1.2;
}
.charge-card .ch-status{
  margin-top:4px;font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em;
  color:var(--txt-3);
}
.charge-card.tone-action .ch-status{color:var(--amber)}
.charge-card.tone-wait .ch-status{color:var(--blue)}
.charge-card.tone-ok .ch-status{color:var(--green)}
.charge-card .ch-recv{
  margin-top:6px;font-size:.8rem;color:var(--txt-3);
}
.charge-card .ch-recv strong{color:var(--txt);font-weight:800}
.charge-card .ch-amt{
  text-align:right;flex:0 0 auto;width:7.5rem;max-width:42%;
  display:flex;flex-direction:column;align-items:stretch;gap:3px;
}
.charge-card .ch-amt-input{
  width:100%;min-width:0;max-width:100%;box-sizing:border-box;
  min-height:44px;padding:8px 8px;border-radius:10px;text-align:right;
  border:1px solid var(--border);background:var(--bg-soft);color:var(--txt);
  font-size:1.05rem;font-weight:800;font-variant-numeric:tabular-nums;
}
.charge-card .ch-amt-lbl{
  font-size:.66rem;font-weight:700;color:var(--txt-3);
  text-transform:uppercase;letter-spacing:.04em;text-align:right;
}
.charge-card .ch-hint{
  margin:0;font-size:.78rem;color:var(--txt-2);line-height:1.4;
}
.charge-card .ch-form{display:grid;gap:10px;min-width:0}
.charge-card .ch-field{display:grid;gap:5px;min-width:0}
.charge-card .ch-field label{
  font-size:.72rem;font-weight:700;color:var(--txt-3);text-transform:uppercase;letter-spacing:.03em;
}
.charge-card .ch-field input{
  width:100%;max-width:100%;min-width:0;box-sizing:border-box;
  min-height:44px;padding:10px 12px;border-radius:10px;
  border:1px solid var(--border);background:var(--bg-soft);color:var(--txt);
  font-size:1rem;font-weight:600;
}
.charge-card .ch-field input[type="date"]{
  -webkit-appearance:none;appearance:none;
  max-width:100%;
}
.charge-card .ch-field input:disabled{opacity:.55}
.charge-card .ch-toggles{
  display:grid;grid-template-columns:1fr 1fr;gap:8px;min-width:0;
}
.charge-card .ch-toggle{
  display:flex;align-items:center;gap:10px;min-height:44px;min-width:0;
  padding:8px 12px;border-radius:10px;border:1px solid var(--border-soft);
  background:var(--panel-2);cursor:pointer;font-weight:700;font-size:.88rem;
}
.charge-card .ch-toggle input{
  width:20px;height:20px;accent-color:var(--accent);flex:0 0 auto;
}
[data-theme="light"] .charge-card.tone-action .ch-status{color:#9a5b00}
[data-theme="light"] .charge-card.tone-wait .ch-status{color:#0d47a1}

.pill{display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border-radius:20px;font-size:.74rem;font-weight:700;white-space:nowrap}
.pill.ok{background:var(--green-soft);color:var(--green)}
.pill.warn{background:var(--amber-soft);color:var(--amber)}
.pill.bad{background:var(--red-soft);color:var(--red)}
.pill.muted{background:var(--panel-2);color:var(--txt-2)}

.list{display:grid;gap:10px}
.row-card{
  background:var(--panel);border:1px solid var(--border-soft);border-radius:13px;
  padding:14px 15px;display:flex;flex-direction:column;gap:8px;
}
.row-card.clickable{cursor:pointer}
.row-card.clickable:hover{border-color:var(--accent)}
.row-card.selected{border-color:var(--accent);background:var(--accent-soft)}
.row-card .row-check{
  display:flex;align-items:center;justify-content:center;flex:0 0 auto;
  min-width:44px;min-height:44px;margin:-6px 0 -6px -8px;cursor:pointer;
}
.row-card .row-check input{width:20px;height:20px;accent-color:var(--accent)}
.row-card .row-hit{
  flex:1;min-width:0;display:flex;align-items:flex-start;gap:12px;
  background:transparent;border:0;padding:0;margin:0;color:inherit;text-align:left;cursor:pointer;font:inherit;
}
.row-card .row-hit:hover .title{color:var(--accent)}
.row-card .top{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.row-card .title{font-weight:800}
.row-card .sub{font-size:.82rem;color:var(--txt-2);margin-top:2px}
.row-card .meta{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.row-card .amount{font-weight:800;font-size:1.05rem;white-space:nowrap}
.row-card .actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:4px}

.client-pick{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.client-btn{
  background:var(--panel);border:2px solid var(--border-soft);border-radius:14px;
  padding:16px 12px;text-align:center;font-weight:700;min-height:72px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;
}
.client-btn .tiny{font-size:.72rem;color:var(--txt-3);font-weight:600}
.client-btn.on{border-color:var(--accent);background:var(--accent-soft);color:var(--accent)}

.qty-chips{display:flex;gap:10px;flex-wrap:wrap}
.qty-chip{
  flex:1;min-width:70px;padding:12px 8px;border-radius:14px;font-weight:800;font-size:1rem;
  background:var(--panel);border:2px solid var(--border-soft);text-align:center;min-height:64px;
  line-height:1.25;
}
.qty-chip.on{border-color:var(--accent);background:var(--accent-soft);color:var(--accent)}

.check-row{
  display:flex;align-items:flex-start;gap:12px;padding:13px 14px;
  background:var(--panel);border:1px solid var(--border-soft);border-radius:12px;cursor:pointer;
}
.check-row.on{border-color:var(--accent);background:var(--accent-soft)}
.check-row input{width:22px;height:22px;margin-top:2px;accent-color:var(--accent);flex:0 0 auto}
.check-row .grow{flex:1;min-width:0}
.check-row .amt{font-weight:800;white-space:nowrap}

.filters{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px;align-items:center}
.filters select,.filters input{width:auto;min-width:140px;padding:9px 11px}
.chk-inline{display:inline-flex;align-items:center;gap:8px;font-size:.86rem;color:var(--txt-2);cursor:pointer;user-select:none}
.chk-inline input{width:18px;height:18px;accent-color:var(--accent)}
.selection-bar{
  display:flex;flex-wrap:wrap;align-items:center;gap:10px;
  margin:0 0 14px;padding:10px 12px;border-radius:12px;
  background:var(--accent-soft);border:1px solid var(--accent);color:var(--txt);font-size:.9rem;font-weight:600;
}
.selection-bar span{flex:1;min-width:8rem}
.hint.warn-hint{color:var(--amber);margin:0 0 12px}
.form-grid textarea{min-height:180px;resize:vertical;line-height:1.45;font-family:inherit}
.email-body{
  white-space:pre-wrap;word-break:break-word;margin:0;padding:12px 14px;
  background:var(--bg-soft);border:1px solid var(--border-soft);border-radius:10px;
  font:inherit;font-size:.9rem;line-height:1.5;max-height:280px;overflow:auto;
}
.email-detail .field > div{color:var(--txt)}
.email-detail label{display:block;font-size:.72rem;text-transform:uppercase;letter-spacing:.04em;color:var(--txt-3);margin-bottom:4px}
.email-atts{display:flex;flex-wrap:wrap;gap:8px}
.email-inv-row{
  display:flex;align-items:center;gap:10px;padding:10px 12px;
  border:1px solid var(--border-soft);border-radius:10px;background:var(--panel-2);
}
.client-actions{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 18px}

.updates-feed{display:grid;gap:14px}
.update-block{
  background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);
  padding:16px 16px 12px;
}
.update-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:10px;flex-wrap:wrap}
.update-head h2{margin:0;font-size:1.05rem}
.update-head time{font-size:.78rem;color:var(--txt-3);font-weight:700}
.update-list{margin:0;padding-left:1.15em;display:grid;gap:8px;color:var(--txt-2);font-size:.92rem;line-height:1.45}
.whatsnew-intro{margin:0 0 12px;line-height:1.5;color:var(--txt-2);font-size:.92rem}
.whatsnew-feed{display:grid;gap:14px;max-height:min(52vh,420px);overflow:auto;padding-right:4px}
.whatsnew-block ul{margin:8px 0 0;padding-left:1.15em;display:grid;gap:6px;color:var(--txt-2);font-size:.9rem;line-height:1.45}
.whatsnew-title{font-weight:800}
.whatsnew-date{font-weight:700;color:var(--txt-3);font-size:.78rem;margin-left:6px}
#overlay{
  position:fixed;inset:0;background:var(--overlay);backdrop-filter:blur(3px);
  display:none;align-items:flex-start;justify-content:center;z-index:200;
  overflow-y:auto;
  padding:calc(24px + env(safe-area-inset-top, 0px)) 14px calc(24px + env(safe-area-inset-bottom, 0px));
}
#overlay.open{display:flex}
.modal{
  background:var(--panel);border:1px solid var(--border);border-radius:16px;
  width:100%;max-width:560px;padding:22px 20px 22px;box-shadow:var(--shadow-modal);
  animation:pop .18s ease;
}
.modal.wide{max-width:720px}
@keyframes pop{from{transform:translateY(14px);opacity:0}to{transform:none;opacity:1}}
.modal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;gap:10px}
.modal-head .x{font-size:1.2rem;color:var(--txt-3);padding:6px 10px;border-radius:8px;min-width:44px;min-height:44px}
.modal-head .x:hover{background:var(--bg-soft);color:var(--txt)}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.form-grid .full{grid-column:1/-1}
.modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:20px;flex-wrap:wrap}
.hint{font-size:.76rem;color:var(--txt-3);margin-top:5px;line-height:1.45}
.field{margin-bottom:2px;min-width:0}
.stack{display:grid;gap:14px;min-width:0}
.modal{min-width:0}
.modal .field input,
.modal .field select,
.modal .field textarea{
  width:100%;max-width:100%;min-width:0;box-sizing:border-box;
}
.modal input[type="date"],
.modal input[type="datetime-local"],
.modal input[type="time"]{
  -webkit-appearance:none;appearance:none;
  max-width:100%;
}

.empty{
  text-align:center;padding:48px 20px;color:var(--txt-2);
  background:var(--panel);border:1px dashed var(--border);border-radius:var(--radius);
}
.empty .big{font-size:2.4rem;margin-bottom:10px}
.empty h3{color:var(--txt);margin-bottom:6px}
.empty p{font-size:.88rem;margin-bottom:16px}

#toast{
  position:fixed;bottom:calc(var(--bottom-h) + 14px + env(safe-area-inset-bottom, 0px));left:50%;
  transform:translateX(-50%) translateY(80px);
  background:var(--panel-2);border:1px solid var(--border);color:var(--txt);
  padding:12px 18px;border-radius:12px;font-weight:700;font-size:.88rem;
  box-shadow:var(--shadow-toast);opacity:0;transition:all .25s;z-index:300;pointer-events:none;
  max-width:min(92vw,420px);text-align:center;
}
#toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
@media(min-width:901px){#toast{bottom:26px}}

#fab{
  display:none;position:fixed;right:16px;bottom:calc(var(--bottom-h) + 10px + env(safe-area-inset-bottom, 0px));
  width:56px;height:56px;border-radius:16px;background:var(--accent);color:var(--accent-txt);
  font-size:1.6rem;font-weight:800;box-shadow:var(--fab-shadow);z-index:50;
  align-items:center;justify-content:center;
}
#bottomNav{
  display:none;position:fixed;left:0;right:0;bottom:0;z-index:60;
  height:calc(var(--bottom-h) + env(safe-area-inset-bottom, 0px));
  padding:2px 2px env(safe-area-inset-bottom, 0px);
  background:var(--bg-soft);border-top:1px solid var(--border-soft);
  grid-template-columns:repeat(5,1fr);gap:1px;
}
#bottomNav button{
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;
  border-radius:12px;color:var(--txt-3);font-size:.62rem;font-weight:700;
  min-height:0;height:100%;position:relative;padding:4px 2px;
}
#bottomNav button .ic{font-size:1.25rem;line-height:1}
#bottomNav button.active{color:var(--accent);background:var(--accent-soft)}
#bottomNav button .dot{
  position:absolute;top:6px;right:calc(50% - 18px);width:8px;height:8px;border-radius:50%;background:var(--red);
}

.row-card .row-ico{
  width:40px;height:40px;border-radius:11px;flex:0 0 40px;
  display:flex;align-items:center;justify-content:center;font-size:1.15rem;
  background:var(--panel-2);border:1px solid var(--border-soft);
}
.row-card .row-ico.ok{background:var(--green-soft);border-color:transparent}
.row-card .row-ico.warn{background:var(--amber-soft);border-color:transparent}
.row-card .row-ico.bad{background:var(--red-soft);border-color:transparent}
.row-card .row-main{display:flex;align-items:flex-start;gap:12px;width:100%}
.row-card .row-main .grow{flex:1;min-width:0;text-align:left}

.invoice-preview{
  background:#fff;color:#111;border-radius:8px;padding:28px 24px;font-size:13px;line-height:1.4;
}
.invoice-preview h1{font-size:28px;color:#1a4d7c;margin-bottom:18px}
.invoice-preview .muted{color:#555}
.invoice-preview .inv-head{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
.invoice-preview .inv-meta{text-align:right}
.invoice-preview .inv-client{margin-top:18px}
.invoice-preview .inv-bank{
  margin-top:18px;padding:12px 14px;border:1px solid #c5d4ea;border-radius:8px;
  background:#f3f7fd;color:#111;font-size:12.5px;line-height:1.55;
}
.invoice-preview .inv-bank strong{font-weight:700}
.invoice-preview table{width:100%;margin-top:16px;border-collapse:collapse}
.invoice-preview th{background:#a4c2f4;color:#111;padding:8px;text-align:left;border:none;text-transform:none;font-size:12px;letter-spacing:0}
.invoice-preview td{padding:8px;border-bottom:1px solid #dde;color:#111}
.invoice-preview .total-row{background:#a4c2f4;font-weight:800;font-size:15px}
.invoice-preview .center{text-align:center;font-style:italic;margin-top:18px;color:#444}

.section-gap{margin-top:22px}
.section-title{display:flex;align-items:center;justify-content:space-between;margin:22px 0 12px;flex-wrap:wrap;gap:10px}
.toggle{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:14px;background:var(--panel);border:1px solid var(--border-soft);border-radius:12px;
}
.toggle input{width:44px;height:24px;accent-color:var(--accent)}
.soon{font-size:.72rem;color:var(--amber);font-weight:700}

.wizard-steps{display:flex;gap:8px;margin-bottom:16px;flex-wrap:wrap}
.wizard-steps span{
  padding:6px 11px;border-radius:20px;font-size:.75rem;font-weight:700;
  background:var(--panel-2);color:var(--txt-3);
}
.wizard-steps span.on{background:var(--accent-soft);color:var(--accent)}
.wizard-steps span.done{background:var(--green-soft);color:var(--green)}

.match-box{background:var(--blue-soft);border-radius:12px;padding:12px 14px;margin-top:8px}
.match-box h4{font-size:.85rem;margin-bottom:8px;color:var(--blue)}

/* ---------- Calendar (Jours) — dense & sobre ---------- */
.cal-nav{
  display:flex;align-items:center;justify-content:space-between;gap:8px;
  margin-bottom:10px;
}
.cal-nav .month-title{font-size:1.05rem;font-weight:700;text-align:center;flex:1;text-transform:capitalize;letter-spacing:-.01em}
.cal-nav .btn.icon{min-width:40px;min-height:40px;padding:8px;background:transparent;border-color:transparent}
.cal-toolbar{
  display:flex;align-items:center;gap:6px;flex-wrap:nowrap;margin-bottom:10px;
}
.cal-toolbar .filters{
  margin:0;flex:1;min-width:0;display:flex;gap:6px;flex-wrap:nowrap;
}
.cal-toolbar .filters select{
  flex:1;min-width:0;width:auto;max-width:none;
  padding:6px 8px;font-size:.78rem;min-height:34px;line-height:1.2;
}
.cal-toggle{
  flex:0 0 auto;font-size:.72rem;font-weight:700;color:var(--txt-2);
  padding:6px 9px;border-radius:8px;border:1px solid var(--border-soft);
  background:transparent;min-height:34px;white-space:nowrap;
}
.cal-toggle.on{color:var(--accent);border-color:var(--accent);background:var(--accent-soft)}
.days-bill-banner{margin:0 0 14px}
.days-bill-banner .action-card{width:100%;cursor:pointer}
.days-bill-banner .dbb-link{margin-top:2px;color:var(--amber);font-weight:800}
.days-bill-banner .dbb-link span,.days-bill-banner .dbb-link strong{color:var(--amber)}
.cal-weekdays{
  display:grid;gap:1px;margin-bottom:1px;
  background:var(--border-soft);border-radius:8px 8px 0 0;overflow:hidden;
}
.cal-weekdays.cols-5{grid-template-columns:repeat(5,1fr)}
.cal-weekdays.cols-7{grid-template-columns:repeat(7,1fr)}
.cal-weekdays span{
  text-align:center;font-size:.65rem;font-weight:600;color:var(--txt-3);
  text-transform:uppercase;letter-spacing:.04em;padding:6px 0;background:var(--bg-soft);
}
.cal-grid{
  display:grid;gap:1px;background:var(--border-soft);
  border-radius:0 0 8px 8px;overflow:hidden;
  border:1px solid var(--border-soft);border-top:none;
}
.cal-grid.cols-5{grid-template-columns:repeat(5,1fr)}
.cal-grid.cols-7{grid-template-columns:repeat(7,1fr)}
.cal-cell{
  aspect-ratio:1/1.05;min-height:56px;
  background:var(--panel);border:none;border-radius:0;
  padding:0;display:flex;flex-direction:column;align-items:stretch;
  text-align:left;position:relative;overflow:hidden;
}
.cal-cell.out{background:var(--bg);opacity:.5}
.cal-cell.in-week:not(.out){
  box-shadow:inset 0 0 0 1.5px color-mix(in srgb, var(--accent) 55%, transparent);
  z-index:1;
}
.cal-cell.in-week.needs-input{
  box-shadow:inset 0 0 0 2px var(--amber);
}
.cal-cell.in-week.needs-today{
  box-shadow:inset 0 0 0 2px var(--accent);
}
.cal-cell.today .dnum{
  color:var(--accent-txt);background:var(--accent);border-radius:999px;
  width:22px;height:22px;padding:0;margin:4px 4px 0;
  display:inline-flex;align-items:center;justify-content:center;
  box-sizing:border-box;line-height:1;font-size:.72rem;font-weight:800;
  text-shadow:none;
}
.cal-cell.has-work{cursor:pointer}
.cal-cell.has-work:active{filter:brightness(1.06)}
.cal-cell.empty-in{cursor:pointer}
.cal-cell.empty-in:hover{background:var(--panel-2)}
.cal-cell.is-off,.week-strip .ws.is-off{
  background:var(--panel-2);cursor:pointer;opacity:.85;
}
.cal-cell.is-off .dnum,.week-strip .ws.is-off .wd,.week-strip .ws.is-off .wn,.week-strip .ws.is-off .who{
  color:var(--txt-3);
}
.cal-cell.empty-in:not(.today)::after{
  content:'';
}
/* unspecified weekday hint: dashed border */
.cal-cell.empty-in{box-shadow:inset 0 0 0 1px var(--border-soft)}
.cal-cell.is-off{box-shadow:inset 0 0 0 1px transparent}

/* Jours en retard (lun–ven passés non saisis) */
.cal-cell.needs-input,
.week-strip .ws.needs-input{
  background:var(--amber-soft);
  box-shadow:inset 0 0 0 2px var(--amber);
  cursor:pointer;
  animation:needs-pulse 2.4s ease-in-out infinite;
}
.cal-cell.needs-input .dnum,
.week-strip .ws.needs-input .wn{
  color:var(--amber);
  font-weight:800;
}
.cal-cell.needs-input .cal-hint,
.week-strip .ws.needs-input .who{
  color:var(--amber);
  font-weight:800;
  opacity:1;
}
.cal-cell.needs-input:hover,
.week-strip .ws.needs-input:hover{
  filter:brightness(1.05);
}
@keyframes needs-pulse{
  0%,100%{box-shadow:inset 0 0 0 2px var(--amber)}
  50%{box-shadow:inset 0 0 0 2px var(--amber),0 0 0 4px var(--amber-soft)}
}

/* Aujourd’hui à saisir — bien visible, sans notion de retard */
.cal-cell.needs-today,
.week-strip .ws.needs-today{
  background:color-mix(in srgb, var(--accent) 14%, var(--panel));
  box-shadow:inset 0 0 0 2px var(--accent);
  cursor:pointer;
  animation:needs-today-pulse 2.4s ease-in-out infinite;
}
.cal-cell.needs-today .cal-hint,
.week-strip .ws.needs-today .who{
  color:var(--accent);
  font-weight:800;
  opacity:1;
}
.cal-cell.needs-today:hover,
.week-strip .ws.needs-today:hover{
  filter:brightness(1.05);
}
@keyframes needs-today-pulse{
  0%,100%{box-shadow:inset 0 0 0 2px var(--accent)}
  50%{box-shadow:inset 0 0 0 2px var(--accent),0 0 0 4px color-mix(in srgb, var(--accent) 22%, transparent)}
}
@media (prefers-reduced-motion:reduce){
  .cal-cell.needs-input,
  .week-strip .ws.needs-input,
  .cal-cell.needs-today,
  .week-strip .ws.needs-today{animation:none}
}

.missing-days-banner{
  margin:0 0 14px;
  padding:14px 14px 12px;
  border-radius:14px;
  border:2px solid var(--amber);
  background:var(--amber-soft);
}
.missing-days-banner .mdb-title{
  font-weight:800;
  font-size:.95rem;
  color:var(--amber);
}
.missing-days-banner .mdb-hint{
  margin:4px 0 10px;
  font-size:.8rem;
  color:var(--txt-2);
}
.missing-days-banner .mdb-actions{
  display:flex;flex-wrap:wrap;gap:8px;
}
.btn.warn-btn{
  background:var(--amber);
  color:#111;
  border-color:transparent;
  font-weight:700;
}

.cal-cell.selected{outline:2px solid var(--accent);outline-offset:-2px;z-index:1}
.cal-fill-stack{
  position:absolute;left:0;right:0;bottom:0;display:flex;flex-direction:column-reverse;
  pointer-events:none;overflow:hidden;
}
.cal-fill-seg{width:100%;min-height:2px;opacity:.82}
.cal-cell .dnum{
  position:relative;z-index:2;font-size:.75rem;font-weight:600;color:var(--txt-3);
  line-height:1;padding:6px 6px 0;text-shadow:none;
}
.cal-cell.has-work .dnum{color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.4)}
[data-theme="light"] .cal-cell.has-work .dnum{color:#111;text-shadow:0 1px 0 rgba(255,255,255,.55)}
.cal-cell.has-work.today .dnum{color:var(--accent-txt);text-shadow:none}
.cal-cell .cal-hint{
  position:relative;z-index:2;margin-top:auto;padding:0 5px 5px;
  font-size:.6rem;font-weight:700;color:rgba(255,255,255,.9);
  text-shadow:0 1px 2px rgba(0,0,0,.35);line-height:1.1;
}
[data-theme="light"] .cal-cell .cal-hint{color:rgba(0,0,0,.75);text-shadow:none}
.cal-legend{
  display:flex;gap:12px;flex-wrap:wrap;margin:10px 0 0;font-size:.72rem;
  color:var(--txt-3);font-weight:500;align-items:center;
}
.cal-legend i{display:inline-block;width:8px;height:8px;border-radius:2px;margin-right:5px;vertical-align:0}

.day-sheet-date{font-size:1.05rem;font-weight:700;text-transform:capitalize;margin-bottom:4px}
.day-sheet-sub{font-size:.85rem;color:var(--txt-2);margin-bottom:16px}
.day-sheet-item{
  display:flex;align-items:center;gap:12px;padding:14px 0;
  border-bottom:1px solid var(--border-soft);
}
.day-sheet-item:last-child{border-bottom:none}
.day-sheet-item .swatch{width:14px;height:100%;min-height:36px;border-radius:4px;flex:0 0 14px;align-self:stretch}
.day-sheet-item .grow{flex:1;min-width:0}
.day-sheet-item .t{font-weight:800;font-size:1.05rem}
.day-sheet-item .s{font-size:.85rem;color:var(--txt-2);margin-top:3px}
.day-sheet-actions{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}
.day-sheet-empty{text-align:center;padding:12px 8px 8px}
.day-sheet-empty .ico{font-size:2.2rem;margin-bottom:8px;opacity:.7}
.day-sheet-empty p{color:var(--txt-2);margin-bottom:18px;font-size:.95rem;line-height:1.4}

.color-dot{display:inline-block;width:8px;height:8px;border-radius:2px;margin-right:6px;vertical-align:middle}
.week-block{margin-bottom:18px}
.week-block .week-label{
  font-size:.68rem;font-weight:600;color:var(--txt-3);text-transform:uppercase;
  letter-spacing:.06em;margin-bottom:6px;
}
.week-strip{
  display:grid;gap:1px;background:var(--border-soft);
  border:1px solid var(--border-soft);border-radius:8px;overflow:hidden;margin-bottom:6px;
}
.week-strip.cols-5{grid-template-columns:repeat(5,1fr)}
.week-strip.cols-7{grid-template-columns:repeat(7,1fr)}
.week-strip .ws{
  border-radius:0;padding:0;text-align:center;border:none;
  background:var(--panel);min-height:62px;
  display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;
  position:relative;overflow:hidden;
}
.week-strip .ws .ws-body{
  position:relative;z-index:2;padding:7px 3px;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:2px;flex:1;
}
.week-strip .ws .wd{font-size:.62rem;font-weight:600;color:var(--txt-3);text-transform:uppercase}
.week-strip .ws .wn{font-size:.9rem;font-weight:700}
.week-strip .ws.has-work .wd,.week-strip .ws.has-work .wn,.week-strip .ws.has-work .who{
  color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.35);
}
[data-theme="light"] .week-strip .ws.has-work .wd,
[data-theme="light"] .week-strip .ws.has-work .wn,
[data-theme="light"] .week-strip .ws.has-work .who{color:#111;text-shadow:none}
.week-strip .ws.today .wn{
  color:var(--accent-txt);background:var(--accent);border-radius:999px;
  width:22px;height:22px;display:inline-flex;align-items:center;justify-content:center;text-shadow:none;
}
.week-strip .ws.has-work.today .wn{color:var(--accent-txt)}
.week-strip .ws .who{font-size:.6rem;font-weight:600;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;opacity:.92}
.week-strip .ws.empty-in:hover{background:var(--panel-2)}
.color-dot{display:inline-block;width:8px;height:8px;border-radius:2px;margin-right:6px;vertical-align:middle}
.client-btn .color-bar{width:100%;height:3px;border-radius:2px;margin-bottom:6px}
.color-swatches{display:flex;flex-wrap:wrap;gap:8px}
.color-swatch{
  width:36px;height:36px;border-radius:10px;border:2px solid transparent;cursor:pointer;
}
.color-swatch.on{border-color:#fff;box-shadow:0 0 0 2px var(--accent)}

@media(max-width:900px){
  #appShell{flex-direction:column}
  #sidebar{display:none}
  #main{
    padding:
      calc(16px + env(safe-area-inset-top, 0px))
      14px
      calc(var(--bottom-h) + 76px + env(safe-area-inset-bottom, 0px));
    max-width:none;
  }
  #fab{display:flex}
  #bottomNav{display:grid}
  .form-grid{grid-template-columns:1fr}
  h1{font-size:1.25rem}
  .stat .val{font-size:1.25rem}
  .cal-cell{min-height:52px;aspect-ratio:1/1.1}
  .week-strip .ws{min-height:56px}

  /* Facture : maximiser la largeur utile sur mobile */
  #overlay{
    padding:
      calc(8px + env(safe-area-inset-top, 0px))
      6px
      calc(8px + env(safe-area-inset-bottom, 0px));
  }
  .modal{
    padding:12px 10px 14px;border-radius:12px;
    max-width:none;
  }
  .modal.wide{max-width:none}
  .modal-head{margin-bottom:10px}
  .modal-actions{margin-top:12px;gap:8px}
  .invoice-preview{
    padding:12px 10px;border-radius:6px;font-size:12px;
  }
  .invoice-preview h1{font-size:20px;margin-bottom:10px}
  .invoice-preview .inv-head{gap:8px}
  .invoice-preview .inv-client{margin-top:10px}
  .invoice-preview .inv-bank{
    margin-top:10px;padding:8px 10px;font-size:11.5px;
  }
  .invoice-preview table{margin-top:10px}
  .invoice-preview th,.invoice-preview td{padding:6px 5px;font-size:11px}
  .invoice-preview .total-row{font-size:13px}
  .invoice-preview .center{margin-top:10px;font-size:11px}
}
@media(max-width:320px){
  .client-pick{grid-template-columns:1fr}
}
body.is-printing #printArea{
  /* Contenu prêt pour WebKit iOS : pas en display:none avant window.print() */
  position:fixed;inset:0;z-index:9999;overflow:auto;
  background:#fff;padding:12px;
}
@media print{
  @page{size:A4;margin:14mm}
  html,body{
    background:#fff!important;
    color:#111!important;
    height:auto!important;
    min-height:0!important;
    overflow:visible!important;
    margin:0!important;
    padding:0!important;
  }
  body.is-printing #printArea{
    position:static!important;inset:auto!important;z-index:auto!important;
    padding:0!important;overflow:visible!important;
  }
  /* Ne pas utiliser visibility:hidden — ça laisse la place et crée des pages vides */
  body > *:not(#appShell),
  #authGate,
  #sidebar,
  #main,
  #fab,
  #bottomNav,
  #overlay,
  #toast{
    display:none!important;
  }
  #appShell{
    display:block!important;
    position:static!important;
    height:auto!important;
    min-height:0!important;
    overflow:visible!important;
    background:transparent!important;
    padding:0!important;
    margin:0!important;
  }
  #appShell > *:not(#printArea){
    display:none!important;
  }
  #printArea{
    display:block!important;
    position:static!important;
    left:auto!important;
    top:auto!important;
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
    padding:0!important;
    background:#fff!important;
    color:#111!important;
    box-shadow:none!important;
    overflow:visible!important;
  }
  #printArea .invoice-preview{
    box-shadow:none!important;
    border:none!important;
    background:#fff!important;
    color:#111!important;
    padding:0!important;
    margin:0!important;
    max-width:100%!important;
  }
  #printArea .print-invoice-sheet{
    break-after:page;
    page-break-after:always;
  }
  #printArea .print-invoice-sheet:last-child{
    break-after:auto;
    page-break-after:auto;
  }
  #printArea .invoice-preview h1{color:#1a4d7c!important}
  #printArea .invoice-preview table{page-break-inside:auto}
  #printArea .invoice-preview tr{page-break-inside:avoid;break-inside:avoid}
  #printArea .invoice-preview .muted{color:#555!important}
  #printArea .invoice-preview .inv-bank{
    border:1px solid #c5d4ea!important;
    background:#f3f7fd!important;
    color:#111!important;
    -webkit-print-color-adjust:exact;
    print-color-adjust:exact;
  }
}

/* Auth gate */
.auth-gate{
  position:fixed;inset:0;z-index:100;display:flex;align-items:center;justify-content:center;
  padding:calc(24px + env(safe-area-inset-top, 0px)) 24px calc(24px + env(safe-area-inset-bottom, 0px));
  background:var(--bg);
}
.auth-card{width:100%;max-width:420px}
.auth-card h2{margin-bottom:6px}
.auth-hint{color:var(--txt-2);font-size:.9rem;margin-bottom:14px}
.demo-login-box{
  margin:0 0 16px;padding:12px 14px;border-radius:12px;
  border:1px solid color-mix(in srgb, var(--accent) 45%, var(--border-soft));
  background:color-mix(in srgb, var(--accent) 10%, var(--panel));
}
.demo-login-title{font-weight:800;font-size:.9rem;margin-bottom:6px;color:var(--accent)}
.demo-login-creds{margin:0 0 8px;font-size:.82rem;line-height:1.45;color:var(--txt-2)}
.demo-login-creds code{
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:.8rem;color:var(--txt);
}
.demo-login-note{margin:0 0 10px;font-size:.75rem;color:var(--txt-3);line-height:1.4}
.demo-banner{
  margin:0 0 14px;padding:12px 14px;border-radius:12px;
  border:1px solid var(--amber);background:var(--amber-soft);
  font-size:.88rem;line-height:1.45;color:var(--txt);
}
.demo-banner strong{color:var(--amber)}

.auth-form{display:flex;flex-direction:column;gap:14px}
.auth-form .btn{width:100%;justify-content:center}

