/* ================== theme.css (sidebar fixo com tooltips) ================== */
:root{
  color-scheme: light;

  /* Cores base */
  --bg:#f3f5fb;
  --bg-soft:#f7f8fc;
  --surface:#fbfbff;
  --surface-2:#f4f6fb;
  --surface-3:#eef2ff;
  --text:#111827;            /* contraste melhor com Inter */
  --text-strong:#0f172a;
  --text-inverse:#ffffff;
  --muted:#6b7280;
  --muted-strong:#334155;
  --line:#dfe4f2;
  --line-strong:#cfd7ea;

  /* Paleta Lander (extraída da logo) */
  --brand-1:#4aa8ff;  /* azul principal */
  --brand-2:#6f86ff;  /* azul violeta */
  --brand-3:#a8e0ff;  /* azul claro para brilho */

  /* Primárias */
  --primary:#4f7cff;
  --primary-600:#3d68f6;
  --primary-700:#2e55e8;
  --primary-button-text:#ffffff;
  --primary-soft:#e9efff;
  --primary-soft-2:#dbeafe;
  --focus-ring:rgba(90,124,255,.18);

  /* Feedback */
  --success:#22c55e;
  --success-soft:#e6f9ec;
  --success-border:#b7efc5;
  --success-strong:#166534;
  --warning:#f59e0b;
  --warning-soft:#fff7ed;
  --warning-border:#fed7aa;
  --warning-strong:#9a3412;
  --danger:#ef4444;
  --danger-soft:#fde2e2;
  --danger-border:#fecaca;
  --danger-strong:#991b1b;
  --info:#0ea5e9;
  --info-soft:#e0f2fe;
  --info-border:#bae6fd;
  --info-strong:#075985;
  --accent-purple:#7c3aed;
  --accent-purple-soft:#ede9fe;
  --accent-purple-border:#ddd6fe;
  --accent-purple-strong:#5b21b6;
  --tooltip-bg:#1e293b;
  --row-hover:#fafbff;
  --row-subtle:#fafafa;
  --role-gestor:#3b5bdb;
  --role-supervisor:#495057;
  --role-vendedor:#868e96;
  --tag-cyan-bg:#e0f7ff;
  --tag-cyan-border:#7dd3fc;
  --tag-cyan-text:#075985;
  --tag-violet-bg:#f0e7ff;
  --tag-violet-border:#c4b5fd;
  --tag-violet-text:#5b21b6;
  --tag-emerald-bg:#dcfce7;
  --tag-emerald-border:#86efac;
  --tag-emerald-text:#166534;
  --tag-amber-bg:#fff4d6;
  --tag-amber-border:#facc15;
  --tag-amber-text:#854d0e;
  --tag-rose-bg:#ffe4e6;
  --tag-rose-border:#fda4af;
  --tag-rose-text:#9f1239;
  --tag-blue-bg:#dbeafe;
  --tag-blue-border:#93c5fd;
  --tag-blue-text:#1d4ed8;
  --tag-slate-bg:#e2e8f0;
  --tag-slate-border:#cbd5e1;
  --tag-slate-text:#334155;

  /* Componentes */
  --input-bg:#f6f8ff;
  --input-border:#dbe2ff;
  --table-head-bg:#f6f8ff;
  --table-head-text:#5060a8;
  --modal-head-bg:#f6f8ff;
  --modal-footer-bg:#fbfcff;
  --overlay:rgba(5,10,25,.45);

  /* Layout */
  --radius:14px;
  --radius-sm:10px;
  --radius-lg:16px;
  --space-1:4px;
  --space-2:8px;
  --space-3:12px;
  --space-4:16px;
  --space-5:20px;
  --shadow:0 10px 24px rgba(20,24,40,.08);
  --shadow-soft:0 6px 16px rgba(20,24,40,.06);

  --bs-body-font-family:"Plus Jakarta Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial;
  --bs-body-bg:var(--bg);
  --bs-body-color:var(--text);
  --bs-emphasis-color:var(--text-strong);
  --bs-secondary-color:var(--muted);
  --bs-tertiary-bg:var(--bg-soft);
  --bs-border-color:var(--line);
  --bs-primary:var(--primary);
  --bs-success:var(--success);
  --bs-danger:var(--danger);
  --bs-warning:var(--warning);
  --bs-info:var(--info);
  --bs-link-color:var(--primary-700);
  --bs-link-hover-color:var(--primary);
  --bs-border-radius:10px;
  --bs-border-radius-sm:8px;
  --bs-border-radius-lg:14px;
}

html[data-theme="dark"]{
  color-scheme: dark;
  --bg:#0b1220;
  --bg-soft:#111827;
  --surface:#151f32;
  --surface-2:#1b2940;
  --surface-3:#20314f;
  --text:#e5edf8;
  --text-strong:#f8fafc;
  --text-inverse:#08111f;
  --muted:#a8b3c7;
  --muted-strong:#d1d8e6;
  --line:#2a3a55;
  --line-strong:#38506f;
  --brand-1:#67b8ff;
  --brand-2:#9ca8ff;
  --brand-3:#c7ecff;
  --primary:#78a6ff;
  --primary-600:#5d8cff;
  --primary-700:#bfd5ff;
  --primary-button-text:#06142a;
  --primary-soft:#172847;
  --primary-soft-2:#1d355c;
  --focus-ring:rgba(120,166,255,.24);
  --success:#4ade80;
  --success-soft:#11351f;
  --success-border:#24583a;
  --success-strong:#bbf7d0;
  --warning:#fbbf24;
  --warning-soft:#3a2b10;
  --warning-border:#6f4f12;
  --warning-strong:#fde68a;
  --danger:#f87171;
  --danger-soft:#3a1720;
  --danger-border:#6c2530;
  --danger-strong:#fecaca;
  --info:#38bdf8;
  --info-soft:#102f45;
  --info-border:#1f5f7d;
  --info-strong:#bae6fd;
  --accent-purple:#a78bfa;
  --accent-purple-soft:#2b214a;
  --accent-purple-border:#4c3a75;
  --accent-purple-strong:#ddd6fe;
  --tooltip-bg:#020617;
  --row-hover:#1a2942;
  --row-subtle:#162235;
  --role-gestor:#7895ff;
  --role-supervisor:#94a3b8;
  --role-vendedor:#64748b;
  --tag-cyan-bg:#093449;
  --tag-cyan-border:#1e84a8;
  --tag-cyan-text:#a7f3ff;
  --tag-violet-bg:#271b4f;
  --tag-violet-border:#7154c7;
  --tag-violet-text:#ddd6fe;
  --tag-emerald-bg:#11351f;
  --tag-emerald-border:#2f8f55;
  --tag-emerald-text:#bbf7d0;
  --tag-amber-bg:#3a2b10;
  --tag-amber-border:#b7791f;
  --tag-amber-text:#fde68a;
  --tag-rose-bg:#3b1422;
  --tag-rose-border:#b33a57;
  --tag-rose-text:#fecdd3;
  --tag-blue-bg:#132e5e;
  --tag-blue-border:#3f7bdd;
  --tag-blue-text:#bfdbfe;
  --tag-slate-bg:#253247;
  --tag-slate-border:#53657f;
  --tag-slate-text:#dbe6f6;
  --input-bg:#101a2b;
  --input-border:#314663;
  --table-head-bg:#1b2940;
  --table-head-text:#c7d7ff;
  --modal-head-bg:#17243a;
  --modal-footer-bg:#111c2e;
  --overlay:rgba(0,0,0,.62);
  --shadow:0 18px 36px rgba(0,0,0,.34);
  --shadow-soft:0 10px 24px rgba(0,0,0,.24);
  --bs-body-bg:var(--bg);
  --bs-body-color:var(--text);
  --bs-emphasis-color:var(--text-strong);
  --bs-secondary-color:var(--muted);
  --bs-tertiary-bg:var(--bg-soft);
  --bs-border-color:var(--line);
  --bs-primary:var(--primary);
  --bs-success:var(--success);
  --bs-danger:var(--danger);
  --bs-warning:var(--warning);
  --bs-info:var(--info);
  --bs-link-color:var(--primary-700);
  --bs-link-hover-color:var(--primary);
}

/* Layout App */
html,body{height:100%}
body{
  margin:0;

  /* ===== FONTE PADRÃO (Plus Jakarta Sans) ===== */
  font-family: "Plus Jakarta Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  font-feature-settings: "liga" 1, "calt" 1;
  font-size: 14px;
  line-height: 1.5;

  color:var(--text);
  background:
    radial-gradient(1200px 800px at -10% -10%, var(--surface-3) 0%, transparent 60%),
    radial-gradient(1400px 900px at 110% -10%, var(--primary-soft) 0%, transparent 65%),
    var(--bg);
  display:grid;

  grid-template-columns:220px 1fr;
  min-height:100vh;
  transition:grid-template-columns .18s ease;
}

/* Hierarquia tipográfica */
h1,h2,h3,h4,h5,h6{ margin:0 0 .25rem 0; line-height:1.25; }
h1{ font-size:22px; font-weight:700; letter-spacing:-.4px; }
h2{ font-size:17px; font-weight:700; letter-spacing:-.2px; }
h3{ font-size:14px; font-weight:600; letter-spacing:-.1px; }
h4,h5,h6{ font-size:13px; font-weight:600; }

/* ================= SIDEBAR (fixo, só ícones + tooltip) ================= */
.sidebar{
  background:var(--surface);
  border-right:1px solid var(--line);
  padding:18px 0;
  min-height:100vh;
  height:100vh;
  position:sticky;
  top:0;
  display:flex;
  flex-direction:column;
  box-sizing:border-box;
  overflow:hidden;
  color:var(--primary);
}

.sidebar-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  flex:0 0 auto;
  margin-bottom:18px;
  padding:0 14px 0 18px;
}

/* Logo sempre pequena */
.brand{
  display:flex; align-items:center; justify-content:flex-start;
  min-width:0;
  padding:0;
}
.brand img{
  width:150px; height:40px; object-fit:contain;
}
.brand span{ display:none; }

.sidebar-toggle{
  appearance:none;
  border:1px solid transparent;
  background:transparent;
  color:var(--muted-strong);
  border-radius:10px;
  width:36px;
  height:36px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 36px;
  cursor:pointer;
  transition:background .15s ease, border-color .15s ease, color .15s ease;
}
.sidebar-toggle:hover{
  background:var(--primary-soft);
  border-color:transparent;
  color:var(--primary-700);
}
.sidebar-toggle__icon{
  width:20px;
  height:20px;
  flex:0 0 20px;
  transition:transform .18s ease;
}

/* Navegação */
.nav{
  display:flex; flex-direction:column;
  flex:1 1 auto;
  min-height:0;
  padding:0 12px;
}
.nav a,
.presence-toggle{
  position:relative;
  display:flex; align-items:center; justify-content:flex-start; gap:12px;
  width:100%; height:42px;
  border-radius:10px; text-decoration:none;
  color:var(--primary); margin-bottom:3px; padding:0 12px; box-sizing:border-box;
  border:0;
  background:transparent;
  font:inherit;
  cursor:pointer;
  transition: background .15s ease, box-shadow .15s ease, color .15s ease;
}
.nav a:hover,
.presence-toggle:hover,
.presence-toggle.is-open{
  background:var(--primary-soft);
  color:var(--primary-700);
  box-shadow: inset 0 0 0 1px var(--primary-soft-2);
}
.nav a.active{
  background:var(--primary-soft-2);
  color:var(--primary-700);
  box-shadow: inset 0 0 0 1px var(--line-strong);
}
.nav a.active::before{
  content:'';
  position:absolute;
  left:6px;
  width:3px;
  height:18px;
  border-radius:999px;
  background:var(--primary);
}

/* Ícone centralizado */
.nav a .icon,
.presence-toggle .icon{
  width:20px; height:20px;
  display:flex; align-items:center; justify-content:center;
  flex-shrink:0;
}

.nav a .label,
.presence-toggle .label{
  position:static;
  transform:none;
  background:transparent;
  color:var(--muted-strong);
  font-size:13px; font-weight:800;
  white-space:nowrap;
  padding:0;
  box-shadow:none;
  pointer-events:auto;
  opacity:1;
  transition:color .15s ease;
}
.nav a:hover .label,
.nav a.active .label,
.presence-toggle:hover .label,
.presence-toggle.is-open .label{ color:var(--primary-700); }

.presence-toggle__dot{
  position:absolute;
  left:27px;
  top:9px;
  width:8px;
  height:8px;
  border-radius:999px;
  background:var(--success);
  box-shadow:0 0 0 2px var(--surface), 0 0 10px color-mix(in srgb, var(--success) 70%, transparent);
}
.presence-toggle__count{
  order:3;
  margin-left:auto;
  min-width:22px;
  height:20px;
  padding:0 6px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:var(--success-soft);
  border:1px solid var(--success-border);
  color:var(--success-strong);
  font-size:11px;
  font-weight:900;
  line-height:1;
}
.presence-toggle .label{
  order:2;
}
.sidebar [data-presence-toggle] .icon{
  order:1;
}
.sidebar [data-presence-toggle] .label{
  order:2;
}
.sidebar [data-presence-toggle] .presence-toggle__count{
  order:3;
}

.presence-popover{
  position:fixed;
  left:calc(var(--sidebar-width, 220px) + 12px);
  bottom:148px;
  z-index:5200;
  width:300px;
  height:420px;
  max-width:calc(100vw - var(--sidebar-width, 220px) - 32px);
  max-height:calc(100vh - 120px);
  overflow:hidden;
  background:color-mix(in srgb, var(--surface) 94%, transparent);
  border:1px solid var(--line-strong);
  border-radius:12px;
  box-shadow:0 18px 48px rgba(8, 15, 32, .2);
  backdrop-filter:blur(14px) saturate(135%);
  color:var(--text);
}
.presence-popover[data-presence-popover]{
  top:auto;
  right:auto;
}
.presence-popover[hidden]{ display:none; }
.sidebar:has([data-presence-toggle]:hover) .presence-popover[hidden],
.sidebar:has([data-presence-toggle]:focus-visible) .presence-popover[hidden]{
  display:block;
}
.presence-popover__badge{
  position:absolute;
  top:10px;
  right:10px;
  z-index:1;
  min-width:58px;
  white-space:nowrap;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:4px;
  border:1px solid var(--success-border);
  background:var(--success-soft);
  color:var(--success-strong);
  border-radius:999px;
  padding:4px 8px;
  font-size:10px;
  font-weight:900;
}
.presence-popover__list{
  height:100%;
  max-height:100%;
  overflow:auto;
  padding:42px 8px 10px;
}
.presence-user{
  display:flex;
  align-items:center;
  gap:10px;
  min-height:54px;
  padding:7px 8px;
  border-radius:10px;
  border-bottom:1px solid color-mix(in srgb, var(--line) 72%, transparent);
  color:inherit;
  text-decoration:none;
}
.presence-user:last-child{
  border-bottom:0;
}
.presence-user:hover,
.presence-user:focus-visible{
  background:var(--surface-2);
  color:inherit;
  text-decoration:none;
}
.presence-user:focus-visible{
  outline:2px solid var(--primary);
  outline-offset:2px;
}
.presence-user__avatar{
  width:38px;
  height:38px;
  border-radius:999px;
  display:grid;
  place-items:center;
  overflow:hidden;
  flex:0 0 38px;
  background:linear-gradient(135deg, var(--primary), var(--success));
  color:var(--primary-button-text);
  font-size:12px;
  font-weight:900;
  box-shadow:0 0 0 2px var(--surface), 0 8px 18px rgba(15, 23, 42, .14);
}
.presence-user__avatar img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.presence-user__body{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:2px;
}
.presence-user__body strong{
  color:var(--text-strong);
  font-size:13px;
  font-weight:900;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.presence-user__body span{
  display:flex;
  align-items:center;
  gap:6px;
  color:var(--muted);
  font-size:12px;
  font-weight:700;
}
.presence-user__body i{
  width:7px;
  height:7px;
  border-radius:999px;
  background:var(--success);
}
.presence-user__me{
  color:var(--primary-700);
  font-weight:900;
}
.presence-popover__empty{
  margin:0;
  padding:22px 14px;
  color:var(--muted);
  font-size:13px;
  font-weight:700;
  text-align:center;
}

.sidebar-account{
  margin-top:auto;
}
.sidebar .nav .logout-link{
  border-top:0;
  padding-top:0;
  margin-top:4px;
  color:var(--danger);
}
.sidebar .nav .logout-link .icon,
.sidebar .nav .logout-link .label{
  color:var(--danger);
}
.sidebar .nav .logout-link:hover,
.sidebar .nav .logout-link:focus-visible{
  color:var(--danger-strong);
  background:var(--danger-soft);
  border-color:var(--danger-border);
}
.sidebar .nav .logout-link:hover .icon,
.sidebar .nav .logout-link:hover .label,
.sidebar .nav .logout-link:focus-visible .icon,
.sidebar .nav .logout-link:focus-visible .label{
  color:var(--danger-strong);
}

@media (min-width: 821px){
  html[data-sidebar="collapsed"] body{
    grid-template-columns:72px 1fr;
  }
  html[data-sidebar="collapsed"] .sidebar-head{
    justify-content:center;
    padding:0;
  }
  html[data-sidebar="collapsed"] .brand{
    display:none !important;
  }
  html[data-sidebar="collapsed"] .sidebar-toggle__icon{
    transform:rotate(180deg);
  }
  html[data-sidebar="collapsed"] .sidebar-toggle{
    margin:0 auto;
  }
  html[data-sidebar="collapsed"] .nav{
    padding:0 10px;
  }
  html[data-sidebar="collapsed"] .nav a,
  html[data-sidebar="collapsed"] .presence-toggle,
  html[data-sidebar="collapsed"] .sidebar .theme-toggle{
    justify-content:center;
    padding:0;
    gap:0;
  }
  html[data-sidebar="collapsed"] .nav a .label,
  html[data-sidebar="collapsed"] .presence-toggle .label,
  html[data-sidebar="collapsed"] .sidebar .theme-toggle .label{
    display:none;
  }
  html[data-sidebar="collapsed"] .nav a.active::before{
    left:4px;
  }
  html[data-sidebar="collapsed"] .presence-popover{
    left:84px;
    width:300px;
    max-width:calc(100vw - 104px);
  }
  html[data-sidebar="collapsed"] .presence-toggle__count{
    position:absolute;
    right:6px;
    top:5px;
    min-width:18px;
    height:18px;
    padding:0 5px;
    font-size:10px;
    margin-left:0;
  }
  html[data-sidebar="collapsed"] .presence-toggle__dot{
    left:38px;
    top:9px;
  }
}

/* Main */
.main{ padding:28px clamp(16px, 4vw, 40px); display:flex; flex-direction:column; gap:16px; min-width:0; overflow-x:hidden; box-sizing:border-box; }
.title{ font-size: clamp(18px, 2vw, 24px); font-weight: 700; letter-spacing: -.3px; color: var(--text); }

/* Topbar + Actions */
.topbar{ display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px; width:100%; max-width:100%; box-sizing:border-box; }
.actions{ display:flex; flex-wrap:wrap; gap:12px; margin-bottom:12px; }

/* Cards */
.card{ --bs-card-bg:var(--surface); --bs-card-border-color:var(--line); background:var(--surface); border-radius:var(--radius); box-shadow:var(--shadow); border:1px solid var(--line); color:var(--text); min-width:0; max-width:100%; box-sizing:border-box; }
.card-body{ min-width:0; }
.card--p{ padding:20px }

/* Inputs */
.input,.select,.textarea{
  width:100%;
  padding:10px 13px;
  border:1px solid var(--input-border);
  border-radius:10px;
  background:var(--input-bg);
  color:var(--text);
  font-family: inherit;
  font-size:13.5px;
  font-weight:500;
  box-sizing:border-box;
  outline:none;
  min-height:40px;
  line-height:1.4;
}
.input:focus,.select:focus,.textarea:focus{ border-color:var(--primary); box-shadow:0 0 0 3px var(--focus-ring) }
.input:focus-visible,.select:focus-visible,.textarea:focus-visible{ outline:2px solid var(--focus-ring); outline-offset:2px }
.form-label{
  color:var(--muted-strong);
  font-size:12px;
  font-weight:900;
  margin-bottom:7px;
}
.form-control,
.form-select{
  min-height:40px;
  border-color:var(--input-border);
  border-radius:10px;
  background-color:var(--input-bg);
  color:var(--text);
  font-family:inherit;
  font-size:13.5px;
  font-weight:500;
  line-height:1.4;
}
.form-control:focus,
.form-select:focus{
  border-color:var(--primary);
  background-color:var(--surface);
  color:var(--text);
  box-shadow:0 0 0 3px var(--focus-ring);
}
.form-control::placeholder{
  color:var(--muted);
}
.form-text{
  color:var(--muted);
  font-size:12px;
  line-height:1.45;
}

/* Selects do cabeçalho */
#gestor_trafego_id{ min-width:280px; }
#status_cliente_ui{ min-width:200px; }
.select{ height:auto !important; padding:8px 12px; }

/* Tabela */
.table{ --bs-table-bg:transparent; --bs-table-color:var(--text); --bs-table-border-color:var(--line); --bs-table-hover-bg:var(--row-hover); --bs-table-hover-color:var(--text); width:100%; border-collapse:collapse }
.table th,.table td{ border:1px solid var(--line); padding:9px 12px; text-align:left; font-size:13px; }
.table thead th{ background:var(--table-head-bg); color:var(--table-head-text); font-weight:700; font-size:11px; text-transform:uppercase; letter-spacing:.5px; }
.table-wrap{ width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch; }
.table-wrap .table{ min-width:760px; }

/* Botões */
.btn{ display:inline-flex; align-items:center; justify-content:center; gap:8px; border:1px solid var(--bs-btn-border-color, transparent); cursor:pointer; border-radius:10px; padding:9px 16px; font-family:inherit; font-weight:700; font-size:13.5px; line-height:1.2; letter-spacing:0; text-decoration:none; transition:transform .06s ease, filter .15s ease, background .15s ease, border-color .15s ease, color .15s ease }
.btn:active{ transform:translateY(1px) }
.btn-primary{ background:linear-gradient(90deg, var(--primary), var(--primary-600)); color:var(--primary-button-text) }
.btn-ghost{ background:var(--primary-soft); color:var(--primary-700) }
.btn-success{ background:linear-gradient(90deg, var(--success), #16a34a); color:#fff }
.btn-danger{ background:linear-gradient(90deg, var(--danger), #dc2626); color:#fff }
.btn-outline-secondary{
  --bs-btn-color:var(--muted-strong);
  --bs-btn-border-color:var(--line-strong);
  --bs-btn-hover-color:var(--text-strong);
  --bs-btn-hover-bg:var(--bg-soft);
  --bs-btn-hover-border-color:var(--line-strong);
  --bs-btn-active-bg:var(--surface-2);
  --bs-btn-active-border-color:var(--line-strong);
  --bs-btn-active-color:var(--text-strong);
}
.text-bg-secondary{ background:var(--bg-soft) !important; color:var(--muted-strong) !important; border:1px solid var(--line); }
.text-bg-primary{ background:var(--primary-soft) !important; color:var(--primary-700) !important; border:1px solid var(--primary-soft-2); }
.text-bg-success{ background:var(--success-soft) !important; color:var(--success-strong) !important; border:1px solid var(--success-border); }
.text-bg-warning{ background:var(--warning-soft) !important; color:var(--warning-strong) !important; border:1px solid var(--warning-border); }
.text-bg-danger{ background:var(--danger-soft) !important; color:var(--danger-strong) !important; border:1px solid var(--danger-border); }
.text-bg-info{ background:var(--info-soft) !important; color:var(--info-strong) !important; border:1px solid var(--info-border); }

/* Links de ação */
.open-link{
  display:inline-flex; align-items:center; justify-content:center;
  padding:8px 12px; border-radius:10px; text-decoration:none;
  background:var(--primary-soft); color:var(--primary-700); font-weight:800;
  transition: filter .15s ease, transform .06s ease;
}
.open-link:hover{ filter:brightness(1.05); transform: translateY(-1px); }

/* Badges */
.badge{ display:inline-block; padding:6px 10px; border-radius:999px; font-size:12px; background:var(--primary-soft); color:var(--primary-700); font-weight:800 }
.pill{ display:inline-flex; align-items:center; gap:8px; padding:6px 10px; border-radius:999px; background:var(--primary-soft); color:var(--primary-700); font-weight:700; font-size:13px }
.alerts{
  position:fixed;
  top:18px;
  right:22px;
  z-index:3000;
  display:flex;
  flex-direction:column;
  gap:10px;
  width:min(420px, calc(100vw - 44px));
  pointer-events:none;
}
.alert{
  padding:10px 12px;
  border-radius:12px;
  border:1px solid var(--line);
  background:var(--surface-2);
  color:var(--text-strong);
  font-size:14px;
  margin:0;
  box-shadow:0 18px 40px rgba(15,23,42,.18);
  pointer-events:auto;
  transform:translateY(calc(var(--toast-index, 0) * 0px));
  animation:toast-in .18s ease-out both;
  transition:opacity .18s ease, transform .18s ease;
}
.alert.is-hiding{
  opacity:0;
  transform:translateY(-8px);
}
@keyframes toast-in{
  from{opacity:0;transform:translateY(-8px)}
  to{opacity:1;transform:translateY(0)}
}
.alert-success,
.alert-ok{
  background:var(--success-soft);
  border-color:var(--success-border);
  color:var(--success-strong);
}
.alert-info,
.alert-message{
  background:var(--primary-soft);
  border-color:var(--primary-soft-2);
  color:var(--primary-700);
}
.alert-warning{
  background:var(--warning-soft);
  border-color:var(--warning-border);
  color:var(--warning-strong);
}
.alert-error,
.alert-danger{
  background:var(--danger-soft);
  border-color:var(--danger-border);
  color:var(--danger-strong);
}
@media (max-width: 640px){
  .alerts{
    top:12px;
    left:12px;
    right:12px;
    width:auto;
  }
}
.metric-badge{display:inline-flex;align-items:center;gap:6px;vertical-align:middle}
.badge{display:inline-grid;place-items:center;min-width:18px;min-height:18px;border-radius:999px;font-size:12px;line-height:1}
.badge-otimo{background:var(--success); color:#fff}
.badge-bom{background:var(--warning); color:#fff}
.badge-ruim{background:var(--danger); color:#fff}
.badge[title]{cursor:help}

/* Utils */
.grid-3{ display:grid; grid-template-columns:repeat(3,1fr); gap:12px }
.grid-2{ display:grid; grid-template-columns:repeat(2,1fr); gap:12px }
.mb-2{ margin-bottom:12px }
.mt-2{ margin-top:12px }
.center{ display:flex; align-items:center; justify-content:center }

/* Avatar */
.avatar{ width:88px; height:88px; border-radius:50%; object-fit:cover; border:4px solid #f7f9ff; box-shadow:0 6px 16px rgba(15,23,42,.12) }

/* Estados */
.linha-concluida,
.linha-concluida > td{ background:var(--success-soft) !important }
.linha-atrasada,
.linha-atrasada > td{ background:var(--danger-soft) !important }
.prazo-atrasado{ color:var(--danger); font-weight:700 }

/* Responsivo */
@media (max-width: 820px){
  body{
    grid-template-columns:1fr;
    grid-template-rows:auto 1fr;
  }
  .sidebar{
    position:sticky;
    top:0;
    z-index:20;
    width:100%;
    min-height:auto;
    height:auto;
    padding:10px 12px;
    border-right:0;
    border-bottom:1px solid var(--line);
    display:grid;
    grid-template-columns:auto minmax(0, 1fr) auto;
    align-items:center;
    gap:10px;
    overflow:hidden;
  }
  .sidebar-head{
    display:contents;
  }
  .brand{
    grid-column:1;
    margin:0;
    padding:0;
  }
  .brand img{
    width:118px;
    height:34px;
  }
  .nav{
    grid-column:2;
    flex-direction:row;
    align-items:center;
    gap:6px;
    padding:0;
    overflow-x:auto;
    overflow-y:hidden;
    min-width:0;
    scrollbar-width:none;
  }
  .nav::-webkit-scrollbar{ display:none; }
  .nav a,
  .presence-toggle,
  .sidebar .theme-toggle{
    flex:0 0 40px;
    width:40px;
    height:40px;
    min-height:40px;
    justify-content:center;
    padding:0;
    margin:0;
    border-radius:10px;
  }
  .sidebar-toggle{
    grid-column:3;
    width:40px;
    height:40px;
    flex-basis:40px;
  }
  .nav a .label,
  .presence-toggle .label,
  .sidebar .theme-toggle .label{
    display:none;
  }
  .presence-popover{
    left:10px;
    right:10px;
    top:64px;
    bottom:auto;
    width:auto;
    height:420px;
    max-height:calc(100vh - 84px);
  }
  .main{
    min-width:0;
    padding:16px !important;
  }
}

/* Modal */
:root{
  --modal-motion-duration:220ms;
  --modal-motion-ease:cubic-bezier(.2,.8,.24,1);
}

.modal-overlay{
  position: fixed; inset: 0; z-index: 1000;
  display: none;
  align-items: center; justify-content: center;
  background: var(--overlay);
  backdrop-filter: blur(2px);
  opacity:0;
  transition:opacity var(--modal-motion-duration) ease;
}
.modal-overlay.is-open,
.modal-overlay.is-closing{ display: flex; }
.modal-overlay.is-open{ opacity:1; }
.modal-overlay.is-closing{ opacity:0; pointer-events:none; }

.modal-overlay > .modal{
  display: block;
  position: relative;
  inset: auto;
  z-index: auto;
  height: auto;
  max-height: 90vh;
}

.modal-overlay > .modal{
  width: min(920px, 94vw);
  background: var(--surface);
  border-radius: 16px;
  box-shadow: var(--shadow);
  border: 1px solid var(--line);
  overflow: hidden;
}
.modal--sm{ width: min(480px, 94vw); }

.modal-overlay > .modal,
.modal-overlay .modal-compra{
  opacity:0;
  transform:translateY(14px) scale(.985);
  transition:
    opacity var(--modal-motion-duration) ease,
    transform var(--modal-motion-duration) var(--modal-motion-ease);
}

.modal-overlay.is-open > .modal,
.modal-overlay.is-open .modal-compra{
  opacity:1;
  transform:translateY(0) scale(1);
}

.modal-overlay.is-closing > .modal,
.modal-overlay.is-closing .modal-compra{
  opacity:0;
  transform:translateY(8px) scale(.985);
}

.modal.fade .modal-dialog{
  opacity:0;
  transform:translateY(14px) scale(.985);
  transition:
    opacity var(--modal-motion-duration) ease,
    transform var(--modal-motion-duration) var(--modal-motion-ease);
}

.modal.show .modal-dialog{
  opacity:1;
  transform:translateY(0) scale(1);
}

@media (prefers-reduced-motion: reduce){
  .modal-overlay,
  .modal-overlay > .modal,
  .modal-overlay .modal-compra,
  .modal.fade .modal-dialog{
    opacity:1;
    transform:none;
    transition:none;
    animation:none;
  }
}

.modal__header{
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px;
  padding: 16px 18px;
  background: var(--modal-head-bg);
  border-bottom: 1px solid var(--line);
}
.modal__title{
  margin: 0; font-size: 16px; font-weight: 800; color: var(--text-strong);
}
.modal__close{
  appearance: none; border: 0; background: var(--primary-soft);
  color: var(--primary-700); border-radius: 10px; padding: 8px 12px;
  font-weight: 700; cursor: pointer;
}

.modal__body{ padding: 18px; max-height: 70vh; overflow: auto; }
.modal__footer{
  display: flex; justify-content: flex-end; gap: 10px;
  padding: 14px 18px; border-top: 1px solid var(--line);
  background: var(--modal-footer-bg);
}

.modal .btn-close{
  width:2rem;
  height:2rem;
  padding:0;
  display:inline-grid;
  place-content:center;
  border:0;
  background:transparent !important;
  background-image:none !important;
  color:var(--danger);
  font-size:0;
  line-height:1;
  opacity:1;
}
.modal .btn-close::before{
  content:"×";
  display:block;
  font-size:1.55rem;
  font-weight:800;
  line-height:1;
  transform:translateY(-1px);
}
.modal .btn-close:hover,
.modal .btn-close:focus{
  background:transparent !important;
  color:var(--danger-strong);
  opacity:1;
}
.modal .btn-close:focus{
  box-shadow:0 0 0 .18rem var(--danger-border);
}

/* Inputs no modal */
.modal-overlay > .modal .input-edit{
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 8px 10px;
  background: var(--input-bg);
  font-size: 14px;
}

/* Tema */
.theme-toggle{
  appearance:none;
  border:1px solid var(--line);
  background:var(--surface-2);
  color:var(--muted-strong);
  border-radius:10px;
  cursor:pointer;
  font:inherit;
  font-weight:800;
  transition:background .15s ease, border-color .15s ease, color .15s ease;
}
.theme-toggle:hover{
  background:var(--primary-soft);
  border-color:var(--line-strong);
  color:var(--primary-700);
}
.theme-toggle .icon{
  width:20px;
  height:20px;
  display:flex;
  align-items:center;
  justify-content:center;
}
.theme-toggle__moon{ display:none; }
html[data-theme="dark"] .theme-toggle__sun{ display:none; }
html[data-theme="dark"] .theme-toggle__moon{ display:block; }
.sidebar .theme-toggle{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:12px;
  width:100%;
  height:42px;
  margin:6px 0 3px;
  padding:0 12px;
  box-sizing:border-box;
}
.sidebar .theme-toggle .label{
  color:var(--muted-strong);
  font-size:13px;
  font-weight:800;
  white-space:nowrap;
}
.auth-theme-toggle{
  position:fixed;
  top:16px;
  right:16px;
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:38px;
  padding:0 12px;
  z-index:20;
}

body.auth-page{
  min-height:100vh;
  display:grid !important;
  grid-template-columns:1fr !important;
  place-items:center;
  margin:0;
  padding:32px 18px;
  overflow-x:hidden;
  background:
    radial-gradient(820px 520px at 50% -160px, color-mix(in srgb, var(--primary) 20%, transparent), transparent 68%),
    linear-gradient(180deg, var(--bg) 0%, color-mix(in srgb, var(--bg) 82%, var(--surface-3)) 100%);
}
.auth-shell{
  width:min(390px, 100%);
  display:grid;
}
.auth-card{
  background:transparent;
  border:0;
  border-radius:0;
  box-shadow:none;
  overflow:visible;
  backdrop-filter:none;
}
.auth-brand{
  display:grid;
  place-items:center;
  padding:0 0 16px;
}
.auth-logo{
  width:min(260px, 82%);
  height:auto;
  object-fit:contain;
  filter:drop-shadow(0 14px 22px rgba(15,23,42,.14));
}
.auth-content{
  padding:0;
}
.auth-title{
  margin:0;
  color:var(--text-strong);
  font-size:20px;
  line-height:1.2;
  font-weight:900;
  text-align:center;
}
.auth-copy{
  margin:0 0 22px;
  color:var(--muted);
  text-align:center;
  font-size:13px;
}
.auth-form{
  display:grid;
  gap:14px;
}
.auth-field{
  display:grid;
  gap:7px;
}
.auth-label{
  color:var(--muted-strong);
  font-size:12px;
  font-weight:800;
}
.auth-control{
  display:flex;
  align-items:center;
  gap:10px;
  min-height:46px;
  padding:0 13px;
  border:1px solid var(--input-border);
  border-radius:10px;
  background:var(--input-bg);
  color:var(--muted);
  transition:border-color .16s ease, box-shadow .16s ease, background .16s ease;
}
.auth-control:focus-within{
  border-color:var(--primary);
  background:var(--surface);
  box-shadow:0 0 0 4px var(--focus-ring);
}
.auth-control svg{
  width:18px;
  height:18px;
  flex:0 0 auto;
}
.auth-input{
  width:100%;
  min-width:0;
  border:0;
  outline:0;
  background:transparent;
  color:var(--text);
  font:inherit;
}
.auth-input::placeholder{
  color:var(--muted);
}
.auth-password-toggle{
  display:grid;
  place-items:center;
  width:30px;
  height:30px;
  border:0;
  border-radius:8px;
  background:transparent;
  color:var(--muted);
  cursor:pointer;
}
.auth-password-toggle:hover{
  background:var(--surface-2);
  color:var(--text);
}
.auth-submit{
  min-height:46px;
  border:0;
  border-radius:10px;
  background:linear-gradient(135deg, var(--primary), var(--primary-600));
  color:var(--text-inverse);
  font:inherit;
  font-weight:900;
  cursor:pointer;
  box-shadow:0 14px 30px color-mix(in srgb, var(--primary) 28%, transparent);
  transition:transform .12s ease, filter .16s ease;
}
.auth-submit:hover{
  filter:brightness(1.03);
}
.auth-submit:active{
  transform:translateY(1px);
}
.auth-submit:disabled{
  cursor:wait;
  opacity:.72;
}
.auth-flashes{
  display:grid;
  gap:8px;
  margin-bottom:16px;
}
.auth-alert{
  border:1px solid var(--danger-border);
  border-radius:10px;
  padding:10px 12px;
  background:var(--danger-soft);
  color:var(--danger-strong);
  font-size:13px;
  font-weight:700;
}
.auth-alert.success{
  border-color:var(--success-border);
  background:var(--success-soft);
  color:var(--success-strong);
}
/* Aliases legados das macros visuais */
.ui-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:38px;
  border:1px solid transparent;
  border-radius:var(--radius-sm);
  padding:0 14px;
  color:inherit;
  cursor:pointer;
  font-family:inherit;
  font-weight:800;
  font-size:13px;
  text-decoration:none;
}
.ui-btn--primary{ background:var(--primary); color:var(--primary-button-text); }
.ui-btn--ghost{ background:var(--primary-soft); color:var(--primary-700); border-color:var(--line); }
.ui-btn--danger{ background:var(--danger); color:#fff; }
.ui-card{
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:var(--radius);
  box-shadow:var(--shadow-soft);
  padding:var(--space-5);
}
.ui-badge{
  display:inline-flex;
  align-items:center;
  min-height:22px;
  padding:0 8px;
  border-radius:999px;
  font-size:12px;
  font-weight:800;
  background:var(--primary-soft);
  color:var(--primary-700);
}
.ui-badge--success{ background:var(--success-soft); color:var(--success); }
.ui-badge--warning{ background:var(--warning-soft); color:var(--warning); }
.ui-badge--danger{ background:var(--danger-soft); color:var(--danger); }
.ui-empty-state{
  display:grid;
  place-items:center;
  gap:8px;
  min-height:180px;
  padding:24px;
  text-align:center;
  color:var(--muted);
}
.ui-empty-state h2{ color:var(--text-strong); }
.ui-page-header{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:16px;
  flex-wrap:wrap;
}
.ui-page-header h1{ margin:0; color:var(--text-strong); }
.ui-page-header p{ color:var(--muted); }
.ui-table-shell{
  width:100%;
  overflow:auto;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:var(--surface);
}
.ui-segmented-nav{
  display:inline-flex;
  flex-direction:row !important;
  flex-wrap:nowrap;
  align-items:center;
  width:max-content;
  max-width:100%;
  padding:.25rem;
  border:1px solid var(--line);
  border-radius:999px;
  background:var(--bs-tertiary-bg);
  box-shadow:0 8px 22px rgba(15,23,42,.05);
}
.ui-segmented-nav .nav-link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.4rem;
  min-height:34px;
  border-radius:999px;
  white-space:nowrap;
  color:var(--muted-strong);
  font-size:13px;
  font-weight:800;
}
.ui-segmented-nav .nav-link.active{
  color:var(--text-inverse);
}
.ui-segmented-nav .badge{
  min-width:22px;
  min-height:20px;
  font-size:11px;
}
.tasks-page .task-view-switch{
  margin-top:0;
  flex:0 0 auto;
  width:max-content;
}
@media (max-width: 640px){
  .ui-segmented-nav{
    width:100%;
    border-radius:var(--bs-border-radius-lg);
  }
  .ui-segmented-nav .nav-link{
    flex:1 0 auto;
  }
}

/* Tarefas: Bootstrap page-specific layout */
  .tasks-page{
    --task-board-min: 260px;
    --task-panel-radius: 14px;
    --task-panel-shadow: 0 14px 34px rgba(15, 23, 42, .06);
    display:grid;
    gap:.9rem;
    min-width:0;
  }
  .tasks-page .task-section,
  .tasks-page #clientes-agrupados,
  .tasks-page #kanban-view{ display:none; }
  html.view-tasks .tasks-page .task-section{ display:block; }
  html.view-clients .tasks-page #clientes-agrupados{ display:block; }
  html.view-kanban .tasks-page #kanban-view{ display:block; }

  .tasks-page .task-table-shell{
    background:var(--surface);
    border:1px solid var(--line);
    border-radius:var(--task-panel-radius);
    box-shadow:var(--task-panel-shadow);
  }
  .tasks-page .task-hero{
    padding:.1rem 0 .25rem;
    background:transparent;
    border:0;
    box-shadow:none;
  }
  .tasks-page .task-hero__top{
    display:flex; align-items:center; justify-content:space-between; gap:.75rem 1rem; flex-wrap:wrap;
  }
  .tasks-page .task-hero__copy{
    flex:0 1 auto;
    min-width:230px;
  }
  .tasks-page .task-title{ margin:0; color:var(--text-strong); font-size:clamp(1.35rem, 2vw, 1.85rem); line-height:1.1; letter-spacing:0; }
  .tasks-page .task-subtitle{ margin:.4rem 0 0; color:var(--muted); font-size:.92rem; }
  .tasks-page .task-summary{ color:var(--text-strong); font-weight:700; }
  .tasks-page .task-actions{
    display:flex; justify-content:flex-end; align-items:center; gap:.5rem; flex-wrap:wrap; min-width:0;
  }
  .tasks-page .task-actions .btn{
    display:inline-flex; align-items:center; justify-content:center; gap:.4rem;
    min-height:38px;
    max-width:220px;
    border-radius:10px;
    font-weight:800;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  .tasks-page .task-completed-toggle{
    min-width:136px;
  }
  .tasks-page .task-completed-toggle svg{
    flex:0 0 auto;
  }
  .tasks-page .task-completed-toggle__eye-off{
    display:none;
  }
  .tasks-page .task-completed-toggle.is-active .task-completed-toggle__eye{
    display:none;
  }
  .tasks-page .task-completed-toggle.is-active .task-completed-toggle__eye-off{
    display:block;
  }
  .tasks-page .task-completed-toggle.is-active{
    border-color:color-mix(in srgb, var(--primary) 52%, var(--line));
    background:color-mix(in srgb, var(--primary) 14%, transparent);
    color:var(--primary);
  }
  .tasks-page .task-new-btn{
    min-height:38px;
    padding:.45rem .9rem .45rem .78rem;
    border:1px solid rgba(21,128,61,.22);
    border-radius:10px;
    background:linear-gradient(180deg, #22c55e, #16a34a);
    color:#fff;
    box-shadow:0 10px 22px rgba(22,163,74,.2), inset 0 1px 0 rgba(255,255,255,.18);
    transition:transform .16s ease, box-shadow .16s ease, background .16s ease, border-color .16s ease;
  }
  .tasks-page .task-new-btn:hover,
  .tasks-page .task-new-btn:focus{
    border-color:rgba(21,128,61,.34);
    background:linear-gradient(180deg, #2bd86a, #15803d);
    color:#fff;
    transform:translateY(-1px);
    box-shadow:0 14px 26px rgba(22,163,74,.26), inset 0 1px 0 rgba(255,255,255,.2);
  }
  .tasks-page .task-new-btn:focus-visible{
    outline:0;
    box-shadow:0 0 0 3px rgba(34,197,94,.2), 0 14px 26px rgba(22,163,74,.26), inset 0 1px 0 rgba(255,255,255,.2);
  }
  .tasks-page .task-new-btn:active{
    transform:translateY(0) scale(.98);
    box-shadow:0 7px 16px rgba(22,163,74,.22), inset 0 1px 0 rgba(255,255,255,.16);
  }
  .tasks-page .task-new-btn__icon{
    width:17px;
    height:17px;
    flex:0 0 auto;
  }

  .tasks-page .task-filter-panel{
    padding:.1rem 0 .25rem;
    background:transparent;
    border:0;
    box-shadow:none;
  }
  .tasks-page .task-filter-head{
    display:flex; align-items:center; justify-content:space-between; gap:.75rem; min-width:0;
  }
  .tasks-page .task-filter-primary{
    display:flex;
    align-items:center;
    gap:.65rem;
    min-width:0;
  }
  .tasks-page .task-filter-toggle{
    min-height:38px;
    padding:.45rem .85rem;
    border:1px solid var(--line);
    border-radius:10px;
    background:var(--surface-2);
    color:var(--muted-strong);
    font-weight:850;
    box-shadow:0 7px 16px rgba(15,23,42,.04);
  }
  .tasks-page .task-filter-toggle:hover{
    border-color:var(--line-strong);
    color:var(--text-strong);
    background:var(--surface);
  }
  .tasks-page .task-filter-toggle.is-active{
    background:var(--primary);
    border-color:var(--primary);
    color:var(--primary-button-text);
    box-shadow:0 12px 24px rgba(37, 99, 235, .22);
  }
  .tasks-page .task-filter-title{ margin:0; color:var(--text-strong); font-size:.95rem; font-weight:800; }
  .tasks-page .task-filter-count{
    color:var(--muted);
    font-size:.82rem;
    font-weight:700;
    white-space:nowrap;
  }
  .tasks-page .task-clear-filters-btn{
    width:38px;
    height:38px;
    min-height:38px;
    padding:0;
    display:inline-grid;
    place-content:center;
    border:1px solid transparent;
    border-radius:10px;
    background:transparent;
    color:var(--muted-strong);
    box-shadow:none;
  }
  .tasks-page .task-clear-filters-btn:hover,
  .tasks-page .task-clear-filters-btn:focus{
    color:var(--text-strong);
    background:var(--surface-2);
    border-color:var(--line);
  }
  .tasks-page .task-clear-filters-btn:focus-visible{
    outline:0;
    box-shadow:0 0 0 3px color-mix(in srgb, var(--primary) 22%, transparent);
  }
  .tasks-page .task-observations-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:.75rem;
    margin-bottom:.35rem;
  }
  .tasks-page .task-observations-head .form-label{
    margin-bottom:0;
  }
  .tasks-page .task-observations-actions,
  .tasks-page .task-observations-modal-actions{
    display:inline-flex;
    align-items:center;
    gap:.25rem;
  }
  .tasks-page .task-observations-icon{
    width:32px;
    height:32px;
    min-height:32px;
    padding:0;
    display:inline-grid;
    place-content:center;
    border:1px solid transparent;
    border-radius:8px;
    background:transparent;
    color:var(--muted-strong);
    box-shadow:none;
    transition:color .16s ease, background .16s ease, border-color .16s ease, transform .16s ease;
  }
  .tasks-page .task-observations-icon:hover,
  .tasks-page .task-observations-icon:focus{
    color:var(--text-strong);
    background:var(--surface-2);
    border-color:var(--line);
  }
  .tasks-page .task-observations-icon:focus-visible{
    outline:0;
    box-shadow:0 0 0 3px color-mix(in srgb, var(--primary) 22%, transparent);
  }
  .tasks-page .task-observations-icon:active{
    transform:scale(.96);
  }
  .tasks-page .task-observations-icon.is-copied{
    color:#15803d;
    background:rgba(34,197,94,.12);
    border-color:rgba(34,197,94,.24);
  }
  .tasks-page .task-observations-modal{
    z-index:1090;
  }
  .task-observations-modal .modal-dialog{
    width:min(820px, calc(100vw - 32px));
    max-width:min(820px, calc(100vw - 32px));
    margin-left:auto;
    margin-right:auto;
  }
  .task-observations-modal .modal-content{
    max-height:calc(100dvh - 48px);
  }
  .tasks-page .task-observations-modal .modal-body,
  .task-observations-modal .modal-body{
    padding:1rem;
  }
  .tasks-page .task-observations-modal-actions{
    margin-left:auto;
  }
  .tasks-page .task-observations-expanded-textarea{
    min-height:clamp(260px, 48dvh, 440px);
    max-height:calc(100dvh - 190px);
    resize:vertical;
    line-height:1.55;
  }
  .tasks-page .task-observations-modal.is-readonly .task-observations-expanded-textarea,
  .task-observations-modal.is-readonly .task-observations-expanded-textarea{
    cursor:default;
    resize:none;
    background:var(--surface);
  }
  .tasks-page .task-filter-fields{
    padding-top:.85rem;
    margin-top:.7rem !important;
    border-top:1px solid var(--line);
  }
  .tasks-page .task-filter-panel .actions{
    display:grid !important; grid-template-columns:repeat(auto-fit, minmax(170px, 1fr));
    gap:.75rem; margin:0;
  }
  .tasks-page .task-filter-fields[hidden]{
    display:none !important;
  }
  .tasks-page .task-filter-panel .actions > [class*="col-"]{
    width:auto; max-width:none; padding-inline:0;
  }
  .tasks-page .tasks-wrap{
    position:relative;
    width:100%;
    min-width:0;
    overscroll-behavior-x:contain;
    overscroll-behavior-y:auto;
  }
  .tasks-page .tasks-wrap.is-loading{ min-height:120px; }
  .tasks-page .task-loader{
    position:absolute; inset:0; z-index:3; display:none; align-items:center; justify-content:center;
    background:var(--surface); border-radius:var(--bs-border-radius-lg);
  }
  .tasks-page .tasks-wrap.is-loading .task-loader{ display:flex; }
  .tasks-page .task-loader strong{ font-size:clamp(18px, 2.2vw, 24px); color:var(--text-strong); }

  .tasks-page .filter-label{
    display:block; margin:0 0 .375rem; color:var(--muted-strong); font-size:.72rem;
    font-weight:800; text-transform:uppercase; letter-spacing:.04em;
  }
  .tasks-page .task-table-shell{ overflow:hidden; }
  .tasks-page .task-table{ width:100%; min-width:820px; table-layout:fixed; }
  .tasks-page .task-table th{
    white-space:nowrap; color:var(--muted-strong); font-size:.72rem; text-transform:uppercase;
    letter-spacing:.04em; background:var(--table-head-bg);
  }
  .tasks-page .task-table td{ padding:.58rem .55rem; vertical-align:middle; border-color:var(--line); }
  .tasks-page .task-table col.col-check{ width:34px; }
  .tasks-page .task-table col.col-prazo{ width:68px; }
  .tasks-page .task-table col.col-cliente{ width:15%; }
  .tasks-page .task-table col.col-tarefa{ width:30%; }
  .tasks-page .task-table col.col-resp{ width:44px; }
  .tasks-page .task-table col.col-setor{ width:12%; }
  .tasks-page .task-table col.col-prio{ width:62px; }
  .tasks-page .task-table col.col-data{ width:74px; }
  .tasks-page .task-table col.col-status{ width:94px; }
  .tasks-page .task-table col.col-acoes{ width:64px; }
  .tasks-page .task-table .task-cell-wrap{ min-width:0; white-space:normal; word-break:normal; overflow-wrap:normal; }
  .tasks-page .task-table .task-cell-clip{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .tasks-page .task-client-link,
  .tasks-page .task-description-text,
  .tasks-page .task-sector-badge,
  .tasks-page .task-status-badge,
  .tasks-page .task-table td[data-label="Prioridade"] .badge{
    max-width:100%;
    display:inline-block;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    vertical-align:middle;
  }
  .tasks-page .task-client-link{
    padding:0;
    border-radius:0;
    background:transparent;
    color:var(--text-strong);
    font-weight:800;
    line-height:1.35;
    text-decoration:none;
  }
  .tasks-page .task-client-link:hover,
  .tasks-page .task-client-link:focus-visible{
    color:var(--primary);
    text-decoration:underline;
    text-underline-offset:3px;
  }
  .tasks-page .task-description-text{
    color:var(--text);
    line-height:1.35;
  }
  .tasks-page .task-actions-col{
    overflow:visible !important;
  }
  .tasks-page .task-actions-menu{
    position:relative;
    display:inline-flex;
    justify-content:flex-end;
  }
  .tasks-page .task-actions-menu.show,
  .tasks-page .task-actions-menu:focus-within{
    z-index:180;
  }
  .tasks-page .task-row-action{
    width:42px;
    height:38px;
    min-height:38px;
    padding:0 !important;
    display:inline-grid;
    place-content:center;
    border-radius:6px;
    border-color:#d5dde8;
    background:#fff;
    color:#111827;
  }
  .tasks-page .task-action-menu::after{
    display:none;
  }
  .tasks-page .task-action-menu:hover,
  .tasks-page .task-action-menu:focus{
    border-color:#aebdcc;
    background:#f8fafc;
    color:#111827;
  }
  .tasks-page .task-actions-popover{
    z-index:220;
    min-width:154px;
    padding:6px;
    border:1px solid var(--line);
    border-radius:8px;
    background:var(--surface);
    color:var(--text);
    box-shadow:0 18px 42px rgba(16,24,40,.16) !important;
  }
  .tasks-page .task-actions-item{
    min-height:34px;
    display:flex;
    align-items:center;
    gap:10px;
    border-radius:6px;
    color:var(--text);
    font-size:13px;
    font-weight:750;
  }
  .tasks-page .task-actions-item svg{
    flex:0 0 auto;
  }
  .tasks-page .task-actions-item:hover,
  .tasks-page .task-actions-item:focus{
    color:var(--text-strong);
    background:color-mix(in srgb, var(--primary) 12%, transparent);
  }
  .tasks-page .task-actions-item--danger{
    color:var(--danger);
  }
  .tasks-page .task-actions-item--danger:hover,
  .tasks-page .task-actions-item--danger:focus{
    color:var(--danger-strong);
    background:var(--danger-soft);
  }
  .tasks-page .task-row-click{ cursor:pointer; }
  .tasks-page .task-row-click:hover td{ background:var(--bs-tertiary-bg); }
  .tasks-page .linha-concluida{ opacity:.65; }
  .tasks-page .linha-atrasada td{ background:var(--danger-soft); }
  .tasks-page .linha-atrasada td:first-child{ box-shadow:inset 3px 0 0 var(--danger); }

  @media (min-width: 821px) and (max-width: 1280px){
    .tasks-page .task-filter-head{
      align-items:flex-start;
    }
    .tasks-page .task-actions .btn{
      max-width:170px;
      padding-inline:.75rem;
    }
    .tasks-page .task-table{
      min-width:760px;
      font-size:.86rem;
    }
    .tasks-page .task-table col.col-cliente{ width:14%; }
    .tasks-page .task-table col.col-tarefa{ width:32%; }
    .tasks-page .task-table col.col-setor{ width:10%; }
    .tasks-page .task-table col.col-status{ width:86px; }
    .tasks-page .task-table col.col-acoes{ width:58px; }
    .tasks-page .task-table td{
      padding:.5rem .48rem;
    }
  }

  .is-pagination-hidden{ display:none !important; }
  .lander-pagination-bar{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:.6rem;
    flex-wrap:wrap;
    padding:.75rem 1rem;
    border-top:1px solid var(--line);
    background:var(--surface);
  }
  .lander-pagination-status{
    color:var(--muted);
    font-size:.82rem;
    font-weight:700;
  }
  .task-dynamic-load{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:.75rem;
    flex-wrap:wrap;
    padding:.85rem 1rem 1rem;
    border-top:1px solid var(--line);
    background:var(--surface);
  }
  .task-dynamic-load[hidden]{
    display:none !important;
  }
  .task-hydration-feedback{
    display:flex;
    align-items:center;
    gap:.65rem;
    width:fit-content;
    max-width:100%;
    margin:-.35rem 0 1rem;
    padding:.65rem .8rem;
    border:1px solid var(--line);
    background:var(--surface);
    color:var(--text);
    font-size:.84rem;
    font-weight:800;
  }
  .task-hydration-feedback[hidden]{
    display:none !important;
  }
  .task-hydration-spinner{
    width:1rem;
    height:1rem;
    border:2px solid var(--line);
    border-top-color:var(--primary);
    border-radius:50%;
    animation:task-hydration-spin .7s linear infinite;
    flex:0 0 auto;
  }
  @keyframes task-hydration-spin{
    to{ transform:rotate(360deg); }
  }
  .lander-pagination{
    display:flex;
    align-items:center;
    justify-content:flex-end;
  }
  .lander-page-size{
    display:inline-flex;
    align-items:center;
    gap:.3rem;
    flex-wrap:wrap;
  }
  .lander-page-size__label{
    color:var(--muted);
    font-size:.72rem;
    font-weight:800;
    letter-spacing:.02em;
  }
  .lander-page-size__button{
    min-width:34px;
    min-height:30px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    font-weight:800;
    border-radius:9px;
  }
  .lander-pagination-bar .lander-page-size,
  .clients-list-footer .lander-page-size{
    margin-left:auto;
  }
  .lander-pagination .pagination{
    --bs-pagination-color:var(--primary-700);
    --bs-pagination-bg:var(--surface);
    --bs-pagination-border-color:var(--line);
    --bs-pagination-hover-bg:var(--primary-soft);
    --bs-pagination-hover-color:var(--primary-700);
    --bs-pagination-focus-box-shadow:0 0 0 .16rem var(--focus-ring);
    --bs-pagination-active-bg:var(--primary);
    --bs-pagination-active-border-color:var(--primary);
    --bs-pagination-active-color:var(--primary-button-text);
    --bs-pagination-disabled-bg:var(--surface-2);
    --bs-pagination-disabled-border-color:var(--line);
    --bs-pagination-disabled-color:var(--muted);
  }
  .lander-pagination .page-link{
    min-width:34px;
    min-height:32px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    font-weight:700;
  }
  .lander-pagination-list{
    gap:.25rem;
  }
  .lander-pagination-list .page-link{
    border-radius:9px !important;
  }
  .lander-page-current .page-link{
    min-width:58px;
    background:transparent;
    color:var(--text);
    border-color:transparent;
    font-weight:800;
  }

  .tasks-page .task-avatar,
  .tasks-page .task-initials{
    width:28px; height:28px; border-radius:50%; border:2px solid var(--line); margin-inline:auto;
  }
  .tasks-page .task-avatar{ object-fit:cover; display:block; }
  .tasks-page .task-initials{
    display:grid; place-items:center; background:var(--accent-purple); color:var(--surface);
    font-size:.65rem; font-weight:800;
  }
  .tasks-page .task-responsavel{ position:relative; text-align:center; }
  .tasks-page .task-responsavel [data-tooltip]{ cursor:default; }

  .tasks-page .task-check-col{ width:36px; }
  .tasks-page .task-actions-col{ width:1%; white-space:nowrap; }
  .tasks-page .task-progress{ width:120px; max-width:36vw; height:14px; }
  .tasks-page .task-progress-label{ font-size:.62rem; line-height:1; }

  .tasks-page .task-client-detail{ display:none; }
  .tasks-page .task-client-detail.open{ display:block; }
  .tasks-page .task-client-toggle{
    width:100%;
    color:var(--text-strong);
    background:var(--surface);
    border:0;
  }
  .tasks-page .task-client-toggle:hover,
  .tasks-page .task-client-toggle:focus{
    color:var(--text-strong);
    background:var(--row-hover);
  }
  .tasks-page .task-client-name{
    color:var(--text-strong);
  }
  .tasks-page .task-client-count{
    background:var(--surface-2);
    color:var(--muted-strong);
    border:1px solid var(--line);
  }
  .tasks-page .task-progress{
    background:var(--surface-2);
    border:1px solid var(--line);
  }
  .tasks-page .task-progress-label{
    color:var(--muted-strong);
  }
  html[data-theme="dark"] .tasks-page .task-client-toggle{
    color:var(--text-strong);
    background:var(--surface);
  }
  html[data-theme="dark"] .tasks-page .task-client-toggle:hover,
  html[data-theme="dark"] .tasks-page .task-client-toggle:focus{
    color:var(--text-strong);
    background:var(--row-hover);
  }
  html[data-theme="dark"] .tasks-page .task-client-name{
    color:var(--text-strong);
  }
  html[data-theme="dark"] .tasks-page .task-client-count{
    background:var(--primary-soft);
    color:var(--primary-700);
    border-color:var(--line-strong);
  }
  html[data-theme="dark"] .tasks-page .task-progress{
    background:var(--input-bg);
    border-color:var(--line-strong);
  }
  html[data-theme="dark"] .tasks-page .task-progress-label{
    color:var(--text-strong);
  }

  .tasks-page #clientes-agrupados,
  .tasks-page #kanban-view{ margin-top:0; }
  .tasks-page .task-board{ display:grid; grid-template-columns:minmax(0,1fr); gap:.75rem; align-items:stretch; margin-left:0; margin-right:0; }
  .tasks-page .task-board > [data-board-column]{ width:auto; max-width:none; padding:0; }
  .tasks-page [data-board-column]{ --kanban-soft:var(--surface-3); --kanban-strong:var(--muted-strong); }
  .tasks-page [data-status="Pendente"],
  .tasks-page [data-status="Em Andamento"],
  .tasks-page [data-status="Concluída"],
  .tasks-page [data-status="Atrasada"],
  .tasks-page [data-status="Bloqueada"]{ --kanban-soft:var(--surface-3); --kanban-strong:var(--muted-strong); }
  @media (min-width:992px){
    .tasks-page .task-board{ grid-template-columns:repeat(3,minmax(210px,1fr)) minmax(170px,.72fr) minmax(170px,.72fr); }
    .tasks-page [data-kanban-role="system"][data-status="Atrasada"]{ padding-left:.95rem; border-left:1px solid var(--line); }
  }
  .tasks-page .task-board-column{
    position:relative;
    min-height:220px;
    border-color:var(--line);
    border-radius:0;
    box-shadow:0 10px 24px rgba(15,23,42,.045);
    overflow:hidden;
    background:linear-gradient(180deg, color-mix(in srgb, var(--surface) 94%, var(--kanban-soft)) 0%, var(--surface) 100%);
  }
  .tasks-page .task-board-column .card-header{
    background:var(--surface);
    border-color:var(--line);
    border-radius:0;
    padding:.78rem .86rem .72rem;
  }
  .tasks-page .task-board-title{
    display:inline-flex;
    align-items:center;
    min-width:0;
    gap:.42rem;
    color:var(--text-strong);
    font-size:.76rem;
    font-weight:900;
    line-height:1.15;
    text-transform:uppercase;
  }
  .tasks-page .task-board-dot{
    width:.5rem;
    height:.5rem;
    flex:0 0 .5rem;
    border-radius:999px;
    background:var(--muted);
    box-shadow:0 0 0 3px color-mix(in srgb, var(--muted) 14%, transparent);
  }
  .tasks-page [data-status="Pendente"] .task-board-dot{ background:var(--warning); }
  .tasks-page [data-status="Em Andamento"] .task-board-dot{ background:var(--primary); }
  .tasks-page [data-status="Concluída"] .task-board-dot{ background:var(--success); }
  .tasks-page [data-status="Atrasada"] .task-board-dot{ background:var(--danger); }
  .tasks-page [data-status="Bloqueada"] .task-board-dot{ background:var(--muted-strong); }
  .tasks-page .task-board-column .badge{
    min-width:28px;
    height:28px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    color:var(--kanban-strong) !important;
    background:var(--surface) !important;
    border:1px solid var(--line) !important;
    border-radius:0 !important;
    box-shadow:inset 0 1px 0 color-mix(in srgb, var(--surface) 82%, transparent);
  }
  .tasks-page [data-board-column].drag-over .task-board-column{ outline:2px solid var(--primary); outline-offset:2px; }
  .tasks-page [data-board-column].drag-blocked .task-board-column{ outline:2px dashed var(--danger); outline-offset:2px; cursor:not-allowed; }
  .tasks-page [data-kanban-role="system"].drag-blocked .task-board-column{ background:var(--danger-soft); }
  .tasks-page .task-board-dropzone{ min-height:130px; align-content:start; background:color-mix(in srgb, var(--bs-tertiary-bg) 88%, var(--kanban-soft)); }
  .tasks-page .task-board-dropzone:empty::before{
    content:"Sem tarefas"; display:grid; place-items:center; min-height:86px; border:1px dashed var(--line);
    border-radius:0; color:var(--muted); font-size:.82rem; background:color-mix(in srgb, var(--surface) 62%, transparent);
  }
  .tasks-page .task-card{
    position:relative;
    cursor:grab;
    overflow:hidden;
    padding:.8rem;
    display:grid;
    gap:.6rem;
    border:1px solid var(--line);
    border-left:1px solid var(--line);
    border-radius:0;
    background:linear-gradient(180deg, color-mix(in srgb, var(--surface) 96%, var(--kanban-soft)) 0%, var(--surface) 100%);
    box-shadow:0 10px 24px rgba(15,23,42,.06) !important;
  }
  .tasks-page .task-card:hover{
    border-color:var(--line-strong);
    box-shadow:0 16px 32px rgba(15,23,42,.1) !important;
    transform:translateY(-1px);
  }
  .tasks-page .task-card:active{ cursor:grabbing; }
  .tasks-page .task-card.dragging{ opacity:.55; transform:rotate(1deg); }
  .tasks-page .task-card.is-pointer-dragging{ opacity:.35; }
  body.is-kanban-dragging{ cursor:grabbing; user-select:none; }
  body.is-kanban-dragging .tasks-page [data-kanban-role="system"] .task-board-column,
  body.is-kanban-dragging .tasks-page [data-kanban-role="system"] .task-board-dropzone{ cursor:not-allowed; }
  .kanban-drag-ghost{
    position:fixed;
    z-index:2147483000;
    left:0;
    top:0;
    pointer-events:none;
    opacity:.94;
    transform:translate(-9999px, -9999px);
    box-shadow:0 18px 42px rgba(15,23,42,.22) !important;
  }
  .tasks-page .task-card[data-state="Atrasada"],
  .tasks-page .task-card[data-state="Pendente"],
  .tasks-page .task-card[data-state="Em Andamento"],
  .tasks-page .task-card[data-state="Bloqueada"]{ --kanban-soft:var(--surface-3); border-left-color:var(--line); }
  .tasks-page .task-card[data-state="Concluída"]{ --kanban-soft:var(--surface-3); border-left-color:var(--line); opacity:.82; }
  .tasks-page [data-kanban-role="system"] .task-board-column{
    border-style:dashed;
    background:
      linear-gradient(180deg, color-mix(in srgb, var(--surface) 86%, var(--kanban-soft)) 0%, var(--bs-tertiary-bg) 100%);
  }
  .tasks-page [data-kanban-role="system"] .card-header{
    background:color-mix(in srgb, var(--bs-tertiary-bg) 68%, var(--kanban-soft));
  }
  .tasks-page [data-kanban-role="system"] .task-board-dropzone{
    background:
      repeating-linear-gradient(-45deg, color-mix(in srgb, var(--bs-tertiary-bg) 88%, transparent) 0 8px, transparent 8px 16px),
      var(--bs-tertiary-bg);
  }
  .tasks-page [data-status="Atrasada"] .task-board-column{
    border-color:var(--line);
  }
  .tasks-page [data-status="Atrasada"] .kanban-lock-chip{
    color:var(--muted-strong);
    background:var(--surface-3);
    border-color:var(--line-strong);
  }
  .tasks-page [data-status="Bloqueada"] .task-board-column{
    border-color:var(--line-strong);
  }
  .tasks-page [data-status="Bloqueada"] .kanban-lock-chip{
    color:var(--muted-strong);
    background:var(--surface-3);
    border-color:var(--line-strong);
  }
  .tasks-page .kanban-lock-chip{
    display:inline-flex;
    align-items:center;
    width:max-content;
    min-height:18px;
    padding:.08rem .42rem;
    border-radius:0;
    border:1px solid var(--line);
    font-size:.62rem;
    font-weight:850;
    line-height:1.2;
    text-transform:uppercase;
    letter-spacing:.04em;
  }
  .tasks-page .task-card-head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:.5rem;
  }
  .tasks-page .task-card-client{
    min-width:0;
    flex:1 1 auto;
    color:var(--primary-700);
    font-size:.67rem;
    font-weight:850;
    line-height:1.35;
    letter-spacing:.025em;
    text-transform:uppercase;
  }
  .tasks-page .task-card-title{
    color:var(--text-strong);
    font-size:.86rem;
    font-weight:800;
    line-height:1.35;
    overflow-wrap:anywhere;
  }
  .tasks-page .task-card-meta{
    display:flex;
    align-items:center;
    justify-content:flex-start;
    gap:.5rem;
    padding-top:.55rem;
    border-top:1px solid var(--line);
  }
  .tasks-page .task-card-due{
    display:inline-flex;
    align-items:center;
    min-height:24px;
    padding:.2rem .55rem;
    border-radius:999px;
    border:1px solid var(--line);
    color:var(--muted-strong);
    background:var(--surface);
    font-size:.72rem;
    font-weight:800;
    white-space:nowrap;
  }
  .tasks-page .task-card-due.is-overdue{
    color:var(--danger-strong);
    background:var(--danger-soft);
    border-color:var(--danger-border);
  }
  .tasks-page .task-card-due.is-today{
    color:var(--warning-strong);
    background:var(--warning-soft);
    border-color:var(--warning-border);
  }
  .tasks-page .task-card-due.is-upcoming{
    color:var(--info-strong);
    background:var(--info-soft);
    border-color:var(--info-border);
  }
  .tasks-page .task-card-owner{
    flex:0 0 auto;
    display:flex;
    align-items:center;
    justify-content:center;
    margin-top:-.1rem;
  }
  .tasks-page .task-card-avatar{
    width:24px;
    height:24px;
    margin:0;
    box-shadow:0 0 0 3px var(--surface);
  }
  .tasks-page .task-card-owner-name{
    min-width:0;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    color:var(--muted);
    font-size:.72rem;
    font-weight:750;
  }
  html[data-theme="dark"] .tasks-page .task-card{
    background:linear-gradient(180deg, color-mix(in srgb, var(--surface) 92%, var(--primary-soft)) 0%, var(--surface) 100%);
    border-color:var(--line);
    box-shadow:0 12px 28px rgba(0,0,0,.24) !important;
  }
  html[data-theme="dark"] .tasks-page .task-card:hover{
    border-color:var(--line-strong);
    background:linear-gradient(180deg, var(--surface-2) 0%, var(--surface) 100%);
  }
  html[data-theme="dark"] .tasks-page .task-card-client{
    color:var(--primary-700);
  }
  html[data-theme="dark"] .tasks-page .task-card-title{
    color:var(--text-strong);
  }
  html[data-theme="dark"] .tasks-page .task-card-meta{
    border-color:var(--line);
  }
  html[data-theme="dark"] .tasks-page .task-card-avatar{
    box-shadow:0 0 0 3px var(--surface-2);
  }
  html[data-theme="dark"] .tasks-page .task-card-due.is-upcoming{
    color:var(--info-strong);
    background:var(--info-soft);
    border-color:var(--info-border);
  }
  .tasks-page .modal-content{ border:1px solid var(--line); border-radius:var(--bs-border-radius-xl); overflow:hidden; }
  .tasks-page .modal-header{ padding:1rem 1.25rem; background:var(--surface); border-color:var(--line); }
  .tasks-page .modal-title{ color:var(--text-strong); font-size:1.1rem; font-weight:800; }
  .tasks-page .modal-body{ padding:1.25rem; }
  .tasks-page .modal-footer{ margin-top:1.25rem; padding:1rem 0 0; border-color:var(--line); }

  @media (max-width: 640px){
    .tasks-page{ gap:.85rem; }
    .tasks-page .task-hero{ padding:0; }
    .tasks-page .task-hero__top{ display:grid; gap:.85rem; }
    .tasks-page .task-hero__copy{ min-width:0; }
    .tasks-page .task-filter-panel{ padding:.75rem; }
    .tasks-page .task-filter-head{
      align-items:stretch;
      flex-direction:column;
    }
    .tasks-page .task-filter-primary{
      align-items:flex-start;
      flex-direction:column;
      gap:.45rem;
    }
    .tasks-page .task-filter-toggle,
    .tasks-page .task-filter-head .btn{ width:100%; }
    .tasks-page .task-filter-count{ white-space:normal; }
    .tasks-page .task-actions{ justify-content:stretch; }
    .tasks-page .task-actions .btn,
    .tasks-page .task-actions .dropdown{ flex:1 1 100%; }
    .tasks-page .task-actions .dropdown .btn{ width:100%; }
    .tasks-page .task-table-shell{ background:transparent; border:0; box-shadow:none; overflow:visible; }
    .tasks-page .task-table{ display:block; min-width:0; }
    .tasks-page .task-table colgroup,
    .tasks-page .task-table thead{ display:none; }
    .tasks-page .task-table tbody{ display:grid; gap:.75rem; }
    .tasks-page .task-table tbody tr{
      position:relative;
      display:grid; grid-template-columns:minmax(0, 1fr) auto; gap:.5rem .75rem;
      padding:.95rem; border:1px solid var(--line); border-radius:12px;
      background:var(--surface); box-shadow:0 10px 24px rgba(15, 23, 42, .06);
      overflow:hidden;
    }
    .tasks-page .task-table tbody tr::before{
      content:"";
      position:absolute;
      inset:0 auto 0 0;
      width:3px;
      background:var(--primary);
      opacity:.75;
    }
    .tasks-page .task-table tbody tr.linha-atrasada::before{
      background:var(--danger);
    }
    .tasks-page .task-table tbody td{
      display:flex; align-items:center; justify-content:space-between; gap:.75rem;
      padding:0; border:0; min-width:0; background:transparent; text-align:right;
    }
    .tasks-page .task-table tbody td::before{
      content:attr(data-label); color:var(--muted); font-size:.62rem; font-weight:800;
      text-transform:uppercase; letter-spacing:.04em; flex:0 0 auto;
    }
    .tasks-page .task-table tbody td[data-label="Cliente"],
    .tasks-page .task-table tbody td[data-label="Tarefa"]{
      grid-column:1 / -1; align-items:flex-start; flex-direction:column; text-align:left;
    }
    .tasks-page .task-table tbody td[data-label="Tarefa"]{ order:1; font-size:1rem; font-weight:750; color:var(--text-strong); }
    .tasks-page .task-table tbody td[data-label="Cliente"]{ order:2; }
    .tasks-page .task-table tbody td[data-label="Concluir"]{ order:3; }
    .tasks-page .task-table tbody td[data-label="Prazo"]{ order:4; }
    .tasks-page .task-table tbody td[data-label="Responsável"]{ order:5; }
    .tasks-page .task-table tbody td[data-label="Setor"]{ order:6; }
    .tasks-page .task-table tbody td[data-label="Prioridade"]{ order:7; }
    .tasks-page .task-table tbody td[data-label="Fim"]{ order:8; }
    .tasks-page .task-table tbody td[data-label="Status"]{ order:9; }
    .tasks-page .task-table tbody td[data-label="Ações"]{
      order:10; grid-column:1 / -1; width:100% !important; justify-content:flex-end; overflow:visible;
    }
    .tasks-page .task-table tbody td[data-label="Ações"]::before{ display:none; }
    .tasks-page .task-table tbody td[data-label="Ações"] .btn-group{ margin-left:auto; }
    .tasks-page .task-responsavel [data-tooltip]::after{ content:none; }
    .tasks-page .task-progress{ width:110px; }
  }

/* Clientes: clean operational layout built on Bootstrap primitives */
.clients-page{
  gap:18px;
}
.clients-hero{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px 18px;
  padding:4px 2px 2px;
  flex-wrap:wrap;
}
.clients-hero-copy{
  flex:0 1 auto;
}
.clients-hero-actions{
  display:flex;
  align-items:center;
}
.clients-hero h1{
  margin:0;
  color:var(--text-strong);
  font-size:clamp(24px, 2.4vw, 32px);
  font-weight:800;
  line-height:1.05;
  letter-spacing:0;
}
.clients-page-subtitle{
  margin-top:6px;
  color:var(--muted);
  font-size:13px;
  font-weight:600;
}
.clients-new-btn{
  min-height:40px;
  padding-inline:16px;
  box-shadow:0 8px 18px rgba(79,124,255,.14);
}
.clients-status-nav{
  flex:0 0 auto;
  width:max-content;
  margin-top:0;
}
.clients-table-card{
  border-color:var(--line);
  border-radius:10px;
  box-shadow:0 10px 24px rgba(15,23,42,.045) !important;
}
.clients-filter-card{
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}
.clients-filter-card .card-body{
  padding:0;
}
.clients-filter-card .form-label{
  margin-bottom:4px;
}
.clients-filter-secondary{
  margin-top:8px;
  padding-top:0;
}
.clients-filter-actions{
  display:flex;
  align-items:flex-end;
  justify-content:flex-end;
  gap:8px;
}
.clients-filter-card .form-control,
.clients-filter-card .form-select,
.clients-filter-card .input-group-text,
.clients-mine-toggle,
.clients-clear-btn{
  min-height:36px;
  font-size:13px;
}
.clients-search-field .form-control,
.clients-search-field .input-group-text{
  min-height:42px;
  font-size:14px;
}
.clients-filter-select .form-select,
.clients-filter-select .form-control{
  padding-top:6px;
  padding-bottom:6px;
}
.clients-filter-card .input-group-text{
  color:var(--muted);
  background:var(--input-bg);
  border-color:var(--input-border);
}
.clients-clear-btn{
  width:42px;
  padding-inline:0;
}
.clients-mine-toggle{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  padding-inline:12px;
  font-weight:800;
  white-space:nowrap;
}
.clients-mine-toggle.active,
.clients-mine-toggle[aria-pressed="true"]{
  background:var(--primary);
  border-color:var(--primary);
  color:var(--primary-button-text);
}
.clients-mine-toggle:focus-visible{
  box-shadow:0 0 0 .18rem var(--focus-ring);
}
.clients-table-shell{
  border-radius:10px;
}
.clients-table{
  --bs-table-bg:var(--surface);
  --bs-table-color:var(--text);
  --bs-table-border-color:var(--line);
  --bs-table-hover-bg:var(--row-hover);
  min-width:820px;
}
.clients-table thead th{
  position:sticky;
  top:0;
  z-index:2;
  background:var(--table-head-bg);
  color:var(--table-head-text);
  padding:11px 16px;
  font-size:11px;
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
  border-width:0 0 1px;
  border-bottom:1px solid var(--line);
}
.clients-table thead th.clients-sort-heading.is-sorted{
  color:var(--primary-700);
  background:var(--primary-soft);
}
.clients-table tbody td{
  padding:15px 16px;
  vertical-align:middle;
  border-width:0 0 1px;
  border-bottom:1px solid var(--line);
}
.clients-record{
  cursor:pointer;
  transition:background .15s ease, box-shadow .15s ease;
}
.clients-record:hover > td{
  background:var(--row-hover);
}
.clients-record-child > td{
  background:var(--row-subtle);
}
.clients-sort-btn{
  display:inline-flex;
  align-items:center;
  gap:4px;
  font-size:11px;
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:var(--table-head-text);
}
.clients-sort-heading.is-sorted .clients-sort-btn{
  color:var(--primary-700);
}
.clients-sort-btn .sort-icon{
  opacity:.42;
  transition:opacity .15s ease, transform .18s ease;
}
.clients-sort-btn.asc .sort-icon,
.clients-sort-btn.desc .sort-icon{
  opacity:1;
}
.clients-sort-btn.desc .sort-icon{
  transform:rotate(180deg);
}
.clients-photo{
  width:42px;
  height:42px;
  flex:0 0 42px;
  object-fit:cover;
  border-radius:50%;
  border:2px solid var(--line);
  background:var(--surface-2);
}
.clients-client-tags{
  display:flex;
  flex-wrap:wrap;
  gap:4px;
  margin-top:5px;
  max-width:360px;
}
.client-tag{
  --client-tag-bg:var(--primary-soft);
  --client-tag-border:var(--line-strong);
  --client-tag-text:var(--primary-700);
  display:inline-flex;
  align-items:center;
  min-height:20px;
  padding:3px 9px;
  border:1px solid var(--client-tag-border);
  border-radius:999px;
  background:var(--client-tag-bg);
  color:var(--client-tag-text);
  max-width:180px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:10px;
  font-weight:800;
  line-height:1.2;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.32);
}
.client-tag--produto{
  font-weight:750;
}
.client-tag--cyan{ --client-tag-bg:var(--tag-cyan-bg); --client-tag-border:var(--tag-cyan-border); --client-tag-text:var(--tag-cyan-text); }
.client-tag--violet{ --client-tag-bg:var(--tag-violet-bg); --client-tag-border:var(--tag-violet-border); --client-tag-text:var(--tag-violet-text); }
.client-tag--emerald{ --client-tag-bg:var(--tag-emerald-bg); --client-tag-border:var(--tag-emerald-border); --client-tag-text:var(--tag-emerald-text); }
.client-tag--amber{ --client-tag-bg:var(--tag-amber-bg); --client-tag-border:var(--tag-amber-border); --client-tag-text:var(--tag-amber-text); }
.client-tag--rose{ --client-tag-bg:var(--tag-rose-bg); --client-tag-border:var(--tag-rose-border); --client-tag-text:var(--tag-rose-text); }
.client-tag--blue{ --client-tag-bg:var(--tag-blue-bg); --client-tag-border:var(--tag-blue-border); --client-tag-text:var(--tag-blue-text); }
.client-tag--slate{ --client-tag-bg:var(--tag-slate-bg); --client-tag-border:var(--tag-slate-border); --client-tag-text:var(--tag-slate-text); }
html[data-theme="dark"] .client-tag{
  box-shadow:inset 0 1px 0 rgba(255,255,255,.09), 0 0 0 1px rgba(2,6,23,.18);
}
.clients-record-child .clients-photo{
  width:34px;
  height:34px;
  flex-basis:34px;
}
.clients-status-badge{
  min-width:76px;
  justify-content:center;
  padding:6px 9px;
  font-size:11px;
  font-weight:800;
  opacity:.82;
}
.clients-pause-alert{
  max-width:210px;
}
.clients-muted-dash{
  color:var(--muted);
  opacity:.5;
  font-weight:700;
}
.clients-delete-btn{
  width:32px;
  height:32px;
  padding:0;
  display:inline-grid;
  place-content:center;
  color:var(--danger);
  border-color:var(--line);
  background:var(--surface);
  opacity:.34;
  transition:opacity .15s ease, color .15s ease, border-color .15s ease, background .15s ease;
}
.clients-record:hover .clients-delete-btn,
.clients-record:focus-within .clients-delete-btn{
  opacity:1;
}
.clients-delete-btn:hover,
.clients-delete-btn:focus{
  color:var(--danger-strong);
  border-color:var(--danger-border);
  background:var(--danger-soft);
}
.clients-list-footer{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
  min-height:38px;
  padding:10px 16px 12px;
  border-top:1px solid var(--line);
  color:var(--muted);
  background:var(--surface);
  font-size:12px;
  font-weight:700;
}
.clients-list-count{
  display:inline-flex;
  align-items:center;
  gap:5px;
  min-width:0;
}
.clients-list-footer #clients-visible-count{
  color:var(--text-strong);
}
.clients-team{
  position:relative;
  display:inline-flex;
  align-items:center;
  min-height:34px;
  z-index:1;
}
.clients-team:hover,
.clients-team:focus-within{
  z-index:80;
}
.clients-avatar-stack{
  display:inline-flex;
  align-items:center;
}
.clients-avatar{
  width:30px;
  height:30px;
  margin-left:-8px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  border:2px solid var(--surface);
  border-radius:50%;
  color:#fff;
  font-size:11px;
  font-weight:800;
  line-height:1;
  text-transform:uppercase;
  box-shadow:0 1px 4px rgba(0,0,0,.12);
}
.clients-avatar:first-child{
  margin-left:0;
}
.clients-avatar img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.clients-avatar-manager{ background:var(--role-gestor); }
.clients-avatar-supervisor{ background:var(--role-supervisor); }
.clients-avatar-seller{ background:var(--role-vendedor); }
.clients-avatar-extra{ background:var(--info); }
.clients-team-popover{
  position:absolute;
  left:0;
  top:calc(100% + 8px);
  z-index:10000;
  display:none;
  min-width:220px;
  max-width:min(360px, calc(100vw - 24px));
  max-height:min(360px, calc(100vh - 24px));
  overflow:auto;
  padding:10px;
  pointer-events:none;
  border:1px solid var(--line);
  border-radius:10px;
  background:var(--surface);
  color:var(--text);
}
.clients-team-popover.is-floating{
  position:fixed;
  left:var(--clients-team-popover-left, 0);
  top:var(--clients-team-popover-top, 0);
  display:grid;
  gap:8px;
  z-index:10000;
}
.clients-team-popover[data-placement="top"]{
  transform-origin:bottom left;
}
.clients-team-popover[data-placement="bottom"]{
  transform-origin:top left;
}
.clients-team:hover .clients-team-popover,
.clients-team:focus-within .clients-team-popover{
  display:grid;
  gap:8px;
}
.clients-team-line{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  font-size:12px;
}
.clients-team-line span:last-child{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
@media (max-width: 980px){
  .clients-table{
    min-width:680px;
  }
}
@media (max-width: 640px){
  .clients-page{
    gap:14px;
  }
  .clients-hero{
    align-items:flex-start;
  }
  .clients-status-nav{
    width:100%;
    border-radius:10px;
  }
  .clients-filter-actions,
  .clients-new-btn{
    width:100%;
  }
  .clients-table{
    min-width:0;
  }
  .clients-table thead{
    display:none;
  }
  .clients-table tbody,
  .clients-table tr,
  .clients-table td{
    display:block;
    width:100%;
  }
  .clients-table tr.clients-record{
    margin:10px;
    padding:12px;
    border-bottom:1px solid var(--line);
    border:1px solid var(--line);
    border-radius:10px;
    background:var(--surface);
  }
  .clients-table tr.clients-record > td{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:8px 0;
    border:0;
  }
  .clients-table tr.clients-record > td::before{
    content:attr(data-label);
    flex:0 0 78px;
    color:var(--muted);
    font-size:11px;
    font-weight:800;
    letter-spacing:.04em;
    text-transform:uppercase;
  }
  .clients-table tr.clients-record > td[data-label="Cliente"]{
    justify-content:flex-start;
  }
  .clients-table tr.clients-record > td[data-label="Cliente"]::before,
  .clients-table tr.clients-record > td[data-label="Ações"]::before{
    display:none;
  }
  .clients-table tr.clients-record > td[data-label="Cliente"]{
    padding-top:0;
    padding-bottom:12px;
    border-bottom:1px solid var(--line);
  }
  .clients-table tr.clients-record > td[data-label="Status"]{
    padding-top:12px;
  }
  .clients-table tr.clients-record > td[data-label="Ações"]{
    padding-bottom:0;
  }
  .clients-table tr.clients-record > td[data-label="Ações"]{
    justify-content:flex-end;
  }
  .clients-status-badge{
    min-width:78px;
  }
  .clients-delete-btn{
    opacity:1;
  }
  .clients-list-footer{
    margin:0 10px 10px;
    border:1px solid var(--line);
    border-radius:10px;
  }
  .clients-team-popover{
    left:auto;
    right:0;
  }
}

/* Cobertura escura incremental para templates legados com CSS inline/hardcoded */
html[data-theme="dark"] body,
html[data-theme="dark"] .main{
  color:var(--text);
}
html[data-theme="dark"] .card,
html[data-theme="dark"] .filters,
html[data-theme="dark"] .kpi,
html[data-theme="dark"] details.acc,
html[data-theme="dark"] .modal-overlay > .modal,
html[data-theme="dark"] .modal-compra{
  background:var(--surface) !important;
  border-color:var(--line) !important;
  color:var(--text) !important;
}
html[data-theme="dark"] input,
html[data-theme="dark"] select,
html[data-theme="dark"] textarea,
html[data-theme="dark"] .control,
html[data-theme="dark"] .ms-trigger,
html[data-theme="dark"] .periodo-box,
html[data-theme="dark"] .status-select,
html[data-theme="dark"] .inline-edit{
  background:var(--input-bg) !important;
  border-color:var(--input-border) !important;
  color:var(--text) !important;
}
html[data-theme="dark"] table,
html[data-theme="dark"] .table,
html[data-theme="dark"] .table-wrap{
  background:var(--surface) !important;
  border-color:var(--line) !important;
  color:var(--text) !important;
}
html[data-theme="dark"] th,
html[data-theme="dark"] td{
  border-color:var(--line) !important;
}
html[data-theme="dark"] .linha-concluida,
html[data-theme="dark"] .linha-concluida > td{
  background:var(--success-soft) !important;
}
html[data-theme="dark"] .linha-atrasada,
html[data-theme="dark"] .linha-atrasada > td{
  background:var(--danger-soft) !important;
}
html[data-theme="dark"] thead th,
html[data-theme="dark"] details.acc > summary,
html[data-theme="dark"] .modal__header{
  background:var(--table-head-bg) !important;
  color:var(--text-strong) !important;
  border-color:var(--line) !important;
}
html[data-theme="dark"] .muted,
html[data-theme="dark"] label{
  color:var(--muted) !important;
}
html[data-theme="dark"] .btn-light,
html[data-theme="dark"] .btn-plain,
html[data-theme="dark"] .monbtn{
  background:var(--surface-2) !important;
  border-color:var(--line) !important;
  color:var(--text) !important;
}
html[data-theme="dark"] .alert{
  background:var(--surface-2) !important;
  border-color:var(--line) !important;
  color:var(--text-strong) !important;
}
html[data-theme="dark"] .alert-success,
html[data-theme="dark"] .alert-ok{
  background:var(--success-soft) !important;
  border-color:var(--success-border) !important;
  color:var(--success-strong) !important;
}
html[data-theme="dark"] .alert-info,
html[data-theme="dark"] .alert-message{
  background:var(--primary-soft) !important;
  border-color:var(--primary-soft-2) !important;
  color:var(--primary-700) !important;
}
html[data-theme="dark"] .alert-warning{
  background:var(--warning-soft) !important;
  border-color:var(--warning-border) !important;
  color:var(--warning-strong) !important;
}
html[data-theme="dark"] .alert-error,
html[data-theme="dark"] .alert-danger{
  background:var(--danger-soft) !important;
  border-color:var(--danger-border) !important;
  color:var(--danger-strong) !important;
}
html[data-theme="dark"] .clients-table-card{
  background:var(--surface) !important;
  border-color:var(--line) !important;
}
html[data-theme="dark"] .clients-filter-card{
  background:transparent !important;
  border-color:transparent !important;
  box-shadow:none !important;
}
html[data-theme="dark"] .clients-table{
  --bs-table-bg:transparent;
  --bs-table-color:var(--text);
  --bs-table-border-color:var(--line);
  --bs-table-hover-bg:var(--row-hover);
}
html[data-theme="dark"] .clients-table thead th{
  background:var(--table-head-bg) !important;
  color:var(--table-head-text) !important;
  border-color:var(--line) !important;
}
html[data-theme="dark"] .clients-table tbody td{
  background:var(--surface) !important;
  color:var(--text) !important;
  border-color:var(--line) !important;
}
html[data-theme="dark"] .clients-record:hover > td{
  background:var(--row-hover) !important;
}
html[data-theme="dark"] .clients-table .text-body,
html[data-theme="dark"] .clients-table .fw-bold{
  color:var(--text-strong) !important;
}
html[data-theme="dark"] .clients-table .text-secondary,
html[data-theme="dark"] .clients-muted-dash{
  color:var(--muted) !important;
}
html[data-theme="dark"] .clients-table .text-danger-emphasis{
  color:var(--danger-strong) !important;
}
html[data-theme="dark"] .clients-status-badge{
  opacity:1;
}
html[data-theme="dark"] .clients-status-badge.text-bg-success{
  background:var(--success-soft) !important;
  color:var(--success-strong) !important;
  border-color:var(--success-border) !important;
}
html[data-theme="dark"] .clients-status-badge.text-bg-danger{
  background:var(--danger-soft) !important;
  color:var(--danger-strong) !important;
  border-color:var(--danger-border) !important;
}
html[data-theme="dark"] .clients-list-footer{
  background:var(--surface) !important;
  color:var(--muted) !important;
  border-color:var(--line) !important;
}
html[data-theme="dark"] .clients-list-footer #clients-visible-count{
  color:var(--text-strong) !important;
}
html[data-theme="dark"] .clients-delete-btn{
  color:var(--muted);
  background:var(--surface-2) !important;
  border-color:var(--line) !important;
}
html[data-theme="dark"] .clients-delete-btn:hover,
html[data-theme="dark"] .clients-delete-btn:focus{
  color:var(--danger-strong);
  background:var(--danger-soft) !important;
  border-color:var(--danger-border) !important;
}

/* Clientes: approved operational redesign */
.clients-page{
  gap:0;
  grid-template-columns:minmax(0, 1fr);
  width:100%;
  max-width:none;
  min-width:0;
}
.clients-hero{
  align-items:flex-start;
  justify-content:flex-start;
  padding:0;
  gap:22px;
}
.clients-hero-copy{
  display:grid;
  gap:4px;
  width:100%;
}
.clients-hero h1{
  color:#182334;
  font-size:30px;
  font-weight:800;
  letter-spacing:0;
}
.clients-page-subtitle{
  margin:0;
  color:#4f5f73;
  font-size:15px;
  font-weight:500;
}
.clients-tabs-row{
  width:100%;
  margin-top:24px;
  margin-bottom:0;
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  align-items:start;
  gap:18px;
}
.clients-status-nav{
  width:100%;
  margin-top:0;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  gap:26px;
}
.clients-status-nav .nav-link{
  position:relative;
  min-height:42px;
  padding:0 10px 13px;
  border:0;
  border-radius:0;
  background:transparent;
  color:#202c3c;
  font-size:15px;
  font-weight:700;
  gap:8px;
}
.clients-status-nav .nav-link.active{
  color:#111827;
  background:transparent;
  box-shadow:none;
}
.clients-status-nav .nav-link.active::after{
  content:"";
  position:absolute;
  left:10px;
  right:10px;
  bottom:0;
  height:3px;
  border-radius:999px 999px 0 0;
  background:var(--primary);
  box-shadow:0 0 14px color-mix(in srgb, var(--primary) 34%, transparent);
  animation:clients-tab-indicator-slide .26s cubic-bezier(.2,.8,.2,1);
}
.clients-status-nav .badge{
  min-width:26px;
  min-height:22px;
  padding:2px 8px;
  border:0 !important;
  color:var(--primary-700) !important;
  background:var(--primary-soft-2) !important;
  font-size:14px;
  font-weight:800;
}
.clients-status-nav .nav-link:not(.active) .badge{
  color:#d92d20 !important;
  background:transparent !important;
}
.clients-status-nav .nav-link[data-tab="pausado"] .badge{
  color:#dc6803 !important;
}
.clients-status-nav .nav-link[data-tab="concluido"] .badge{
  color:#0086c9 !important;
}
.clients-status-nav .nav-link[data-tab="ativo"] .badge{
  color:#087443 !important;
  background:#dcfae6 !important;
  box-shadow:inset 0 0 0 1px #a6f4c5;
}
.clients-status-nav .nav-link[data-tab="ativo"].active{
  color:#087443 !important;
}
.clients-status-nav .nav-link[data-tab="ativo"].active::after{
  background:#22c55e;
  box-shadow:0 0 14px rgba(34,197,94,.34);
}
.clients-status-nav .nav-link[data-tab="ativo"].active .badge{
  color:#065f46 !important;
  background:#bbf7d0 !important;
  box-shadow:inset 0 0 0 1px #86efac;
  animation:clients-tab-badge-pop .28s cubic-bezier(.2,.8,.2,1);
}
.clients-status-nav .nav-link[data-tab="pausado"].active{
  color:#b54708 !important;
}
.clients-status-nav .nav-link[data-tab="pausado"].active::after{
  background:#f59e0b;
  box-shadow:0 0 14px rgba(245,158,11,.34);
}
.clients-status-nav .nav-link[data-tab="pausado"].active .badge{
  color:#92400e !important;
  background:#fef3c7 !important;
  box-shadow:inset 0 0 0 1px #fcd34d;
  animation:clients-tab-badge-pop .28s cubic-bezier(.2,.8,.2,1);
}
.clients-status-nav .nav-link[data-tab="concluido"].active{
  color:#026aa2 !important;
}
.clients-status-nav .nav-link[data-tab="concluido"].active::after{
  background:#0ea5e9;
  box-shadow:0 0 14px rgba(14,165,233,.34);
}
.clients-status-nav .nav-link[data-tab="concluido"].active .badge{
  color:#075985 !important;
  background:#e0f2fe !important;
  box-shadow:inset 0 0 0 1px #7dd3fc;
  animation:clients-tab-badge-pop .28s cubic-bezier(.2,.8,.2,1);
}
.clients-status-nav .nav-link[data-tab="cancelado"].active{
  color:#b42318 !important;
}
.clients-status-nav .nav-link[data-tab="cancelado"].active::after{
  background:#ef4444;
  box-shadow:0 0 14px rgba(239,68,68,.34);
}
.clients-status-nav .nav-link[data-tab="cancelado"].active .badge{
  color:#991b1b !important;
  background:#fee2e2 !important;
  box-shadow:inset 0 0 0 1px #fca5a5;
  animation:clients-tab-badge-pop .28s cubic-bezier(.2,.8,.2,1);
}
@keyframes clients-tab-indicator-slide{
  from{
    transform:translateX(-10px) scaleX(.55);
    opacity:.28;
  }
  to{
    transform:translateX(0) scaleX(1);
    opacity:1;
  }
}
@keyframes clients-tab-badge-pop{
  0%{ transform:scale(.86); }
  58%{ transform:scale(1.12); }
  100%{ transform:scale(1); }
}
@media (prefers-reduced-motion: reduce){
  .clients-status-nav .nav-link.active::after,
  .clients-status-nav .nav-link.active .badge,
  .clients-toggle-switch,
  .clients-toggle-switch__track,
  .clients-toggle-switch__thumb{
    animation:none !important;
  }
}
.clients-table-card.clients-list-panel{
  overflow:hidden;
  margin-top:-1px;
  border:1px solid #d9e1ea;
  border-radius:12px;
  background:#fff;
  box-shadow:0 14px 34px rgba(16,24,40,.04) !important;
  container-type:inline-size;
}
.clients-command-bar{
  display:grid;
  grid-template-columns:minmax(220px, 1fr) 112px 112px 96px 108px 112px 130px 42px;
  gap:12px;
  align-items:center;
  padding:30px 18px;
  border-bottom:1px solid #e6edf4;
  background:#fff;
}
.clients-toolbar-inline{
  width:100%;
}
.clients-filter-grid{
  display:contents;
}
.clients-search-field .input-group{
  height:42px;
  border:1px solid #d5dde8;
  border-radius:6px;
  overflow:hidden;
  background:#fff;
  box-shadow:none;
}
.clients-command-bar .form-control,
.clients-command-bar .form-select,
.clients-command-bar .input-group-text{
  min-width:0;
  min-height:42px;
  border-color:#d5dde8;
  border-radius:6px;
  background:#fff;
  color:#344054;
  font-size:13px;
  text-overflow:ellipsis;
  white-space:nowrap;
  box-shadow:none;
}
.clients-command-bar .form-control,
.clients-command-bar .form-select{
  overflow:hidden;
}
.clients-command-bar .form-select{
  padding-left:12px;
  padding-right:30px;
}
.clients-command-bar .form-control{
  padding-left:12px;
  padding-right:12px;
}
.clients-search-field .form-control,
.clients-search-field .input-group-text{
  border:0;
}
.clients-command-bar .input-group-text{
  color:#8a97a8;
}
.clients-filter-select{
  min-width:0;
}
.clients-new-btn{
  position:relative;
  min-height:42px;
  border:1px solid rgba(21,128,61,.22);
  border-radius:8px;
  padding:0 15px 0 13px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  min-width:42px;
  max-width:158px;
  background:linear-gradient(180deg, #22c55e, #16a34a);
  color:#fff;
  font-size:14px;
  font-weight:800;
  white-space:nowrap;
  overflow:hidden;
  box-shadow:0 10px 22px rgba(22,163,74,.2), inset 0 1px 0 rgba(255,255,255,.18);
  transition:transform .16s ease, box-shadow .16s ease, background .16s ease, border-color .16s ease;
}
.clients-new-btn svg{
  width:16px;
  height:16px;
  flex:0 0 auto;
}
.clients-new-btn__label{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
}
.clients-new-btn--tabs{
  align-self:start;
  margin-top:-10px;
}
.clients-new-btn:hover,
.clients-new-btn:focus{
  border-color:rgba(21,128,61,.34);
  background:linear-gradient(180deg, #2bd86a, #15803d);
  color:#fff;
  transform:translateY(-1px);
  box-shadow:0 14px 26px rgba(22,163,74,.26), inset 0 1px 0 rgba(255,255,255,.2);
}
.clients-new-btn:focus-visible{
  outline:0;
  box-shadow:0 0 0 3px rgba(34,197,94,.2), 0 14px 26px rgba(22,163,74,.26), inset 0 1px 0 rgba(255,255,255,.2);
}
.clients-new-btn:active{
  transform:translateY(0) scale(.98);
  box-shadow:0 7px 16px rgba(22,163,74,.22), inset 0 1px 0 rgba(255,255,255,.16);
}
@container (max-width: 1160px){
  .clients-command-bar{
    grid-template-columns:minmax(160px, 1fr) 96px 106px 82px 96px 106px 42px 42px;
  }
  .clients-toggle-switch{
    width:42px;
    padding-inline:0;
    gap:0;
  }
  .clients-toggle-switch__label{
    display:none;
  }
}
@media (max-width: 1280px){
  .clients-command-bar{
    grid-template-columns:minmax(160px, 1fr) 96px 106px 82px 96px 106px 42px 42px;
  }
  .clients-toggle-switch{
    width:42px;
    padding-inline:0;
    gap:0;
  }
  .clients-toggle-switch__label{
    display:none;
  }
}
@media (max-width: 900px){
  .clients-new-btn--tabs{
    width:42px;
    padding-inline:0;
  }
  .clients-new-btn--tabs .clients-new-btn__label{
    display:none;
  }
}
.clients-toggle-switch{
  min-height:42px;
  min-width:0;
  padding:0 12px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  border:1px solid transparent;
  border-radius:6px;
  background:transparent;
  color:#344054;
  font-size:14px;
  font-weight:700;
  white-space:nowrap;
  transition:color .16s ease, background .16s ease, border-color .16s ease, box-shadow .16s ease;
}
.clients-toggle-switch:hover,
.clients-toggle-switch:focus{
  color:#1d2939;
  border-color:#d5dde8;
  background:#f8fafc;
}
.clients-toggle-switch:focus-visible{
  outline:0;
  box-shadow:0 0 0 3px rgba(79,124,255,.18);
}
.clients-toggle-switch:active{
  transform:scale(.98);
}
.clients-toggle-switch:disabled{
  cursor:not-allowed;
  opacity:.58;
}
.clients-toggle-switch__track{
  width:38px;
  height:22px;
  padding:2px;
  flex:0 0 38px;
  display:inline-flex;
  align-items:center;
  border-radius:999px;
  background:#d0d5dd;
  box-shadow:inset 0 0 0 1px rgba(102,112,133,.18);
  transition:background .16s ease, box-shadow .16s ease;
}
.clients-toggle-switch__thumb{
  width:18px;
  height:18px;
  border-radius:50%;
  background:#fff;
  box-shadow:0 1px 3px rgba(16,24,40,.24);
  transition:transform .18s cubic-bezier(.2,.8,.2,1), box-shadow .16s ease;
}
.clients-toggle-switch__label{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.clients-toggle-switch[aria-pressed="true"] .clients-toggle-switch__track{
  background:var(--primary);
  box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--primary-700) 30%, transparent);
  animation:clients-toggle-track-pop .32s cubic-bezier(.2,.8,.2,1);
}
.clients-toggle-switch[aria-pressed="true"] .clients-toggle-switch__thumb{
  transform:translateX(16px);
  box-shadow:0 1px 5px rgba(16,24,40,.26);
  animation:clients-toggle-thumb-pop .32s cubic-bezier(.2,.8,.2,1);
}
.clients-toggle-switch[aria-pressed="true"]{
  color:var(--primary-700);
  background:var(--primary-soft);
  border-color:var(--primary-soft-2);
  animation:clients-toggle-pop .26s cubic-bezier(.2,.8,.2,1);
}
.tasks-page .task-mine-toggle{
  width:auto;
  padding-inline:12px;
  gap:10px;
}
.tasks-page .task-mine-toggle .clients-toggle-switch__label{
  display:inline-block;
}
@keyframes clients-toggle-pop{
  0%{ transform:scale(.97); }
  64%{ transform:scale(1.03); }
  100%{ transform:scale(1); }
}
@keyframes clients-toggle-track-pop{
  0%{ transform:scaleX(.92); }
  62%{ transform:scaleX(1.08); }
  100%{ transform:scaleX(1); }
}
@keyframes clients-toggle-thumb-pop{
  0%{ transform:translateX(16px) scale(.82); }
  62%{ transform:translateX(16px) scale(1.18); }
  100%{ transform:translateX(16px) scale(1); }
}
.clients-clear-btn{
  width:42px;
  height:42px;
  padding:0;
  display:inline-grid;
  place-content:center;
  border-color:transparent;
  border-radius:8px;
  color:#667085;
  background:transparent;
  box-shadow:none;
  transition:color .16s ease, background .16s ease, border-color .16s ease, transform .16s ease;
}
.clients-clear-btn:hover,
.clients-clear-btn:focus{
  border-color:transparent;
  color:#344054;
  background:#f2f4f7;
}
.clients-clear-btn:focus-visible{
  outline:0;
  box-shadow:0 0 0 3px rgba(79,124,255,.16);
}
.clients-clear-btn:active{
  transform:scale(.96);
}
.clients-table-shell{
  border-radius:0;
  overflow:visible;
}
.clients-table{
  width:100%;
  min-width:920px;
  table-layout:fixed;
}
.clients-table thead th{
  top:0;
  padding:16px 18px;
  background:#fff;
  color:#111827;
  font-size:13px;
  font-weight:750;
  letter-spacing:0;
  text-transform:none;
  border-bottom:1px solid #d9e1ea;
  white-space:nowrap;
}
.clients-table thead th.clients-sort-heading.is-sorted{
  color:#111827;
  background:#fff;
}
.clients-table tbody td{
  height:98px;
  padding:16px 18px;
  border-bottom:1px solid #e6edf4;
  color:#344054;
  min-width:0;
}
.clients-record{
  position:relative;
  border-left:0;
}
.clients-record:hover,
.clients-record:focus-within{
  z-index:60;
}
.clients-record:hover > td{
  position:relative;
  z-index:60;
  overflow:visible;
  background:#fbfcfe;
}
.clients-record:hover > td:first-child{
  box-shadow:none;
}
.clients-record-child > td{
  background:#fff;
}
.clients-client-primary{
  gap:16px !important;
  min-width:0;
}
.clients-client-primary > .min-w-0{
  flex:1 1 auto;
  min-width:0;
}
.clients-photo{
  width:66px;
  height:66px;
  flex-basis:66px;
  border:1px solid #d9e1ea;
  box-shadow:0 2px 8px rgba(16,24,40,.08);
}
.clients-record-child .clients-photo{
  width:44px;
  height:44px;
  flex-basis:44px;
  opacity:1;
}
.clients-client-tags{
  gap:8px;
  margin-top:8px;
  max-width:460px;
}
.client-tag{
  min-height:24px;
  padding:4px 10px;
  border:0;
  border-radius:5px;
  font-size:12px;
  font-weight:700;
  box-shadow:none;
}
.client-tag--produto{
  border-style:none;
}
.clients-avatar{
  width:34px;
  height:34px;
  border-color:#fff;
  color:#fff;
  box-shadow:0 2px 7px rgba(16,24,40,.16);
}
.clients-child-rail{
  width:28px;
  height:28px;
  flex:0 0 28px;
  border-left:1px solid #cbd5e1;
  border-bottom:1px solid #cbd5e1;
  border-bottom-left-radius:4px;
}
.clients-status-badge{
  max-width:100%;
  min-width:58px;
  border:1px solid #a6e9b8;
  border-radius:6px;
  padding:6px 10px;
  opacity:1;
  font-size:13px;
  font-weight:800;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.clients-status-badge.text-bg-success{
  color:#087443 !important;
  background:#e7f8e9 !important;
  border-color:#a6e9b8;
}
.clients-status-badge.text-bg-warning{
  color:#b54708 !important;
  background:#fff3db !important;
  border-color:#fedf89;
}
.clients-status-badge.text-bg-danger{
  color:#b42318 !important;
  background:#fee4e2 !important;
  border-color:#fecdca;
}
.clients-status-badge.text-bg-primary{
  color:#026aa2 !important;
  background:#e0f2fe !important;
  border-color:#b9e6fe;
}
.clients-actions-cell{
  overflow:visible !important;
}
.clients-actions{
  position:relative;
  display:inline-flex;
  justify-content:flex-end;
}
.clients-actions.show,
.clients-actions:focus-within{
  z-index:140;
}
.clients-row-action{
  width:42px;
  height:38px;
  padding:0;
  display:inline-grid;
  place-content:center;
  border-radius:6px;
  color:#111827;
  border-color:#d5dde8;
  background:#fff;
}
.clients-action-menu::after{
  display:none;
}
.clients-action-menu:hover,
.clients-action-menu:focus{
  color:#111827;
  border-color:#aebdcc;
  background:#f8fafc;
}
.clients-actions-popover{
  z-index:160;
  min-width:168px;
  padding:6px;
  border:1px solid #d9e1ea;
  border-radius:8px;
  background:#fff;
  box-shadow:0 18px 42px rgba(16,24,40,.16) !important;
}
.clients-actions-item{
  min-height:36px;
  display:flex;
  align-items:center;
  gap:10px;
  border-radius:6px;
  color:#344054;
  font-size:13px;
  font-weight:700;
}
.clients-actions-item svg{
  flex:0 0 auto;
}
.clients-actions-item:hover,
.clients-actions-item:focus{
  color:#111827;
  background:#f2f6fb;
}
.clients-actions-item--danger{
  color:#b42318;
}
.clients-actions-item--danger:hover,
.clients-actions-item--danger:focus{
  color:#b42318;
  background:#fee4e2;
}
.clients-list-footer{
  min-height:78px;
  padding:18px;
  background:#fff;
  color:#344054;
  font-size:14px;
  font-weight:500;
}
.clients-list-count{
  font-weight:500;
}
.clients-list-footer #clients-visible-count{
  font-weight:500;
}
.clients-team-popover{
  border-radius:8px;
  z-index:120;
}
.clients-team-summary{
  display:grid;
  grid-template-columns:auto minmax(0, 1fr);
  gap:16px;
  align-items:center;
  min-width:0;
}
.clients-team-roles{
  display:grid;
  gap:5px;
  min-width:0;
}
.clients-team-role{
  --clients-team-role-color:#12b76a;
  position:relative;
  padding-left:14px;
  color:#475467;
  font-size:12px;
  font-weight:500;
  line-height:1.25;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.clients-team-role::before{
  content:"";
  position:absolute;
  left:0;
  top:.45em;
  width:5px;
  height:5px;
  border-radius:50%;
  background:var(--clients-team-role-color);
}
.clients-team-role--seller{ --clients-team-role-color:#12b76a; }
.clients-team-role--supervisor{ --clients-team-role-color:#2e90fa; }
.clients-team-role--manager{ --clients-team-role-color:#875bf7; }
.clients-team-badge{
  --clients-team-role-color:#12b76a;
  min-width:82px;
  min-height:26px;
  padding:5px 10px;
  border:1px solid color-mix(in srgb, var(--clients-team-role-color) 58%, transparent);
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:color-mix(in srgb, var(--clients-team-role-color) 18%, transparent);
  color:color-mix(in srgb, var(--clients-team-role-color) 78%, var(--text-strong));
  font-size:12px;
  font-weight:850;
  line-height:1;
  white-space:nowrap;
}
.clients-team-badge--seller{ --clients-team-role-color:#12b76a; }
.clients-team-badge--supervisor{ --clients-team-role-color:#2e90fa; }
.clients-team-badge--manager{ --clients-team-role-color:#875bf7; }
.clients-sort-btn{
  max-width:100%;
  color:#111827;
  font-size:13px;
  font-weight:750;
  letter-spacing:0;
  text-transform:none;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.clients-table th:nth-child(1){ width:40%; }
.clients-table th:nth-child(2){ width:15%; }
.clients-table th:nth-child(3){ width:27%; }
.clients-table th:nth-child(4){ width:10%; }
.clients-table th:nth-child(5){ width:8%; }
.clients-table td[data-label="Cliente"] .fw-bold,
.clients-table td[data-label="Cliente"] .small,
.clients-table td[data-label="Entrada"] .fw-semibold,
.clients-table td[data-label="Entrada"] .small{
  display:block;
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
@container (max-width: 1160px){
  .clients-table{
    min-width:880px;
  }
  .clients-table thead th,
  .clients-table tbody td{
    padding-left:14px;
    padding-right:14px;
  }
  .clients-client-primary{
    gap:12px !important;
  }
  .clients-photo{
    width:56px;
    height:56px;
    flex-basis:56px;
  }
  .clients-table th:nth-child(1){ width:39%; }
  .clients-table th:nth-child(2){ width:15%; }
  .clients-table th:nth-child(3){ width:28%; }
  .clients-table th:nth-child(4){ width:11%; }
  .clients-table th:nth-child(5){ width:7%; }
}
@container (max-width: 900px){
  .clients-command-bar{
    grid-template-columns:minmax(140px, 1fr) 88px 96px 72px 88px 96px 42px 34px;
    gap:10px;
    padding-left:14px;
    padding-right:14px;
  }
  .clients-table{
    min-width:0;
  }
  .clients-table thead th,
  .clients-table tbody td{
    padding-left:10px;
    padding-right:10px;
  }
  .clients-table th:nth-child(1){ width:42%; }
  .clients-table th:nth-child(2){ width:16%; }
  .clients-table th:nth-child(3){ width:22%; }
  .clients-table th:nth-child(4){ width:12%; }
  .clients-table th:nth-child(5){ width:8%; }
  .clients-client-primary{
    gap:10px !important;
  }
  .clients-photo{
    width:48px;
    height:48px;
    flex-basis:48px;
  }
  .clients-team-summary{
    gap:10px;
  }
  .clients-team-roles{
    display:none;
  }
  .clients-status-badge{
    min-width:52px;
    padding:5px 8px;
  }
  .clients-row-action{
    width:36px;
    height:34px;
  }
}
html[data-theme="dark"] .clients-status-nav,
html[data-theme="dark"] .clients-filter-card.clients-command-bar,
html[data-theme="dark"] .clients-table-card.clients-list-panel{
  background:var(--surface) !important;
  border-color:var(--line) !important;
  box-shadow:0 14px 34px rgba(0,0,0,.26) !important;
}
html[data-theme="dark"] .clients-hero h1{
  color:var(--text-strong);
}
html[data-theme="dark"] .clients-page-subtitle{
  color:var(--muted);
}
html[data-theme="dark"] .clients-status-nav{
  background:transparent !important;
  border-color:transparent !important;
  box-shadow:none !important;
}
html[data-theme="dark"] .clients-status-nav .nav-link{
  color:var(--muted-strong) !important;
}
html[data-theme="dark"] .clients-status-nav .nav-link.active{
  color:var(--text-strong) !important;
}
html[data-theme="dark"] .clients-command-bar{
  background:var(--surface) !important;
  border-color:var(--line) !important;
}
html[data-theme="dark"] .clients-status-nav .nav-link.active{
  color:var(--text-strong) !important;
  background:transparent !important;
  box-shadow:none !important;
}
html[data-theme="dark"] .clients-status-nav .nav-link.active .badge{
  color:#dbeafe !important;
  background:color-mix(in srgb, var(--primary) 38%, transparent) !important;
  box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--primary) 28%, transparent);
}
html[data-theme="dark"] .clients-status-nav .nav-link[data-tab="ativo"] .badge{
  color:#86efac !important;
  background:rgba(34,197,94,.18) !important;
  box-shadow:inset 0 0 0 1px rgba(74,222,128,.28);
}
html[data-theme="dark"] .clients-status-nav .nav-link[data-tab="ativo"].active{
  color:#bbf7d0 !important;
}
html[data-theme="dark"] .clients-status-nav .nav-link[data-tab="ativo"].active::after{
  background:#22c55e;
  box-shadow:0 0 14px rgba(34,197,94,.38);
}
html[data-theme="dark"] .clients-status-nav .nav-link[data-tab="ativo"].active .badge{
  color:#bbf7d0 !important;
  background:rgba(34,197,94,.26) !important;
  box-shadow:inset 0 0 0 1px rgba(134,239,172,.38);
}
html[data-theme="dark"] .clients-status-nav .nav-link[data-tab="pausado"].active{
  color:#fbbf24 !important;
}
html[data-theme="dark"] .clients-status-nav .nav-link[data-tab="pausado"].active::after{
  background:#f59e0b;
  box-shadow:0 0 14px rgba(245,158,11,.38);
}
html[data-theme="dark"] .clients-status-nav .nav-link[data-tab="pausado"].active .badge{
  color:#fcd34d !important;
  background:rgba(245,158,11,.24) !important;
  box-shadow:inset 0 0 0 1px rgba(251,191,36,.36);
}
html[data-theme="dark"] .clients-status-nav .nav-link[data-tab="concluido"].active{
  color:#7dd3fc !important;
}
html[data-theme="dark"] .clients-status-nav .nav-link[data-tab="concluido"].active::after{
  background:#0ea5e9;
  box-shadow:0 0 14px rgba(14,165,233,.38);
}
html[data-theme="dark"] .clients-status-nav .nav-link[data-tab="concluido"].active .badge{
  color:#bae6fd !important;
  background:rgba(14,165,233,.22) !important;
  box-shadow:inset 0 0 0 1px rgba(125,211,252,.36);
}
html[data-theme="dark"] .clients-status-nav .nav-link[data-tab="cancelado"].active{
  color:#fca5a5 !important;
}
html[data-theme="dark"] .clients-status-nav .nav-link[data-tab="cancelado"].active::after{
  background:#ef4444;
  box-shadow:0 0 14px rgba(239,68,68,.38);
}
html[data-theme="dark"] .clients-status-nav .nav-link[data-tab="cancelado"].active .badge{
  color:#fecaca !important;
  background:rgba(239,68,68,.22) !important;
  box-shadow:inset 0 0 0 1px rgba(252,165,165,.36);
}
html[data-theme="dark"] .clients-command-bar .form-control,
html[data-theme="dark"] .clients-command-bar .form-select,
html[data-theme="dark"] .clients-command-bar .input-group-text{
  background:var(--input-bg) !important;
  border-color:var(--input-border) !important;
  color:var(--text) !important;
}
html[data-theme="dark"] .clients-search-field .input-group{
  background:var(--input-bg) !important;
  border-color:var(--input-border) !important;
}
html[data-theme="dark"] .clients-toggle-switch{
  color:var(--text) !important;
}
html[data-theme="dark"] .clients-toggle-switch:hover,
html[data-theme="dark"] .clients-toggle-switch:focus{
  color:var(--text-strong) !important;
  border-color:var(--line) !important;
  background:var(--surface-2) !important;
}
html[data-theme="dark"] .clients-toggle-switch:focus-visible{
  box-shadow:0 0 0 3px color-mix(in srgb, var(--primary) 26%, transparent);
}
html[data-theme="dark"] .clients-toggle-switch__track{
  background:#667085;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.18);
}
html[data-theme="dark"] .clients-toggle-switch__thumb{
  background:#f8fafc;
}
html[data-theme="dark"] .clients-toggle-switch[aria-pressed="true"]{
  color:#dbeafe !important;
  background:color-mix(in srgb, var(--primary) 14%, transparent) !important;
  border-color:color-mix(in srgb, var(--primary) 30%, transparent) !important;
}
html[data-theme="dark"] .clients-toggle-switch[aria-pressed="true"] .clients-toggle-switch__track{
  background:var(--primary);
  box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--primary) 46%, #fff);
}
html[data-theme="dark"] .clients-new-btn{
  border-color:rgba(74,222,128,.28);
  background:linear-gradient(180deg, #22c55e, #15803d);
  box-shadow:0 12px 28px rgba(0,0,0,.24), 0 8px 20px rgba(34,197,94,.14), inset 0 1px 0 rgba(255,255,255,.16);
}
html[data-theme="dark"] .clients-new-btn svg{
  filter:drop-shadow(0 1px 0 rgba(0,0,0,.16));
}
html[data-theme="dark"] .clients-new-btn:hover,
html[data-theme="dark"] .clients-new-btn:focus{
  border-color:rgba(134,239,172,.38);
  background:linear-gradient(180deg, #2bd86a, #166534);
  box-shadow:0 14px 30px rgba(0,0,0,.28), 0 10px 24px rgba(34,197,94,.18), inset 0 1px 0 rgba(255,255,255,.18);
}
html[data-theme="dark"] .clients-action-menu{
  background:var(--surface-2) !important;
  border-color:var(--line) !important;
  color:var(--text-strong) !important;
}
html[data-theme="dark"] .clients-clear-btn{
  color:var(--muted-strong) !important;
  background:transparent !important;
  border-color:transparent !important;
}
html[data-theme="dark"] .clients-clear-btn:hover,
html[data-theme="dark"] .clients-clear-btn:focus{
  color:var(--text-strong) !important;
  background:rgba(148,163,184,.12) !important;
  border-color:transparent !important;
}
html[data-theme="dark"] .clients-actions-popover{
  background:var(--surface-2) !important;
  border-color:var(--line) !important;
  box-shadow:0 18px 42px rgba(0,0,0,.34) !important;
}
html[data-theme="dark"] .clients-actions-item{
  color:var(--text);
}
html[data-theme="dark"] .clients-actions-item:hover,
html[data-theme="dark"] .clients-actions-item:focus{
  color:var(--text-strong);
  background:color-mix(in srgb, var(--primary) 14%, transparent);
}
html[data-theme="dark"] .clients-actions-item--danger{
  color:#fda29b;
}
html[data-theme="dark"] .clients-actions-item--danger:hover,
html[data-theme="dark"] .clients-actions-item--danger:focus{
  color:#fda29b;
  background:rgba(180,35,24,.18);
}
html[data-theme="dark"] .tasks-page .task-row-action{
  background:var(--surface-2) !important;
  border-color:var(--line) !important;
  color:var(--text-strong) !important;
}
html[data-theme="dark"] .tasks-page .task-action-menu:hover,
html[data-theme="dark"] .tasks-page .task-action-menu:focus{
  background:rgba(148,163,184,.12) !important;
  border-color:var(--line-strong) !important;
  color:var(--text-strong) !important;
}
html[data-theme="dark"] .tasks-page .task-actions-popover{
  background:var(--surface-2) !important;
  border-color:var(--line) !important;
  box-shadow:0 18px 42px rgba(0,0,0,.34) !important;
}
html[data-theme="dark"] .tasks-page .task-actions-item{
  color:var(--text);
}
html[data-theme="dark"] .tasks-page .task-actions-item:hover,
html[data-theme="dark"] .tasks-page .task-actions-item:focus{
  color:var(--text-strong);
  background:color-mix(in srgb, var(--primary) 14%, transparent);
}
html[data-theme="dark"] .tasks-page .task-actions-item--danger{
  color:#fda29b;
}
html[data-theme="dark"] .tasks-page .task-actions-item--danger:hover,
html[data-theme="dark"] .tasks-page .task-actions-item--danger:focus{
  color:#fda29b;
  background:rgba(180,35,24,.18);
}
html[data-theme="dark"] .clients-table thead th{
  background:var(--table-head-bg) !important;
  color:var(--text-strong) !important;
}
html[data-theme="dark"] .clients-sort-btn{
  color:var(--text-strong) !important;
}
html[data-theme="dark"] .clients-sort-btn .sort-icon{
  stroke:currentColor;
}
html[data-theme="dark"] .clients-list-footer{
  background:var(--surface-2) !important;
}

@media (max-width: 640px){
  .clients-hero h1{
    font-size:25px;
  }
  .clients-tabs-row{
    grid-template-columns:minmax(0, 1fr) 42px;
    gap:10px;
  }
  .clients-status-nav{
    width:100%;
    overflow-x:auto;
  }
  .clients-new-btn--tabs{
    width:42px;
    padding-inline:0;
  }
  .clients-new-btn--tabs .clients-new-btn__label{
    display:none;
  }
  .clients-command-bar{
    grid-template-columns:minmax(0, 1fr);
    padding:14px;
  }
  .clients-filter-grid{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:10px;
  }
  .clients-table{
    min-width:0;
  }
  .clients-table tr.clients-record{
    border-radius:8px;
  }
  .clients-table tr.clients-record > td[data-label="Cliente"]{
    align-items:flex-start;
  }
  .clients-team-summary{
    grid-template-columns:1fr;
    gap:8px;
    justify-items:end;
  }
  .clients-team-roles{
    display:none;
  }
  .clients-client-tags{
    max-width:100%;
  }
}

/* Resumo geral de vendas: clean Bootstrap layout */
.sales-summary-page{
  display:grid;
  gap:18px;
}
.sales-summary-hero{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:12px 18px;
  padding:4px 2px 0;
  flex-wrap:wrap;
}
.sales-summary-hero h1{
  margin:0;
  color:var(--text-strong);
  font-size:clamp(24px, 2.4vw, 32px);
  font-weight:800;
  line-height:1.05;
  letter-spacing:0;
}
.sales-summary-hero p{
  margin:6px 0 0;
  color:var(--muted);
  font-size:13px;
  font-weight:600;
}
.sales-summary-filters{
  padding:0;
}
.sales-summary-filters .form-label{
  margin-bottom:4px;
}
.sales-summary-filters .form-control,
.sales-summary-filters .form-select{
  min-height:42px;
}
.sales-summary-filters .row{
  --bs-gutter-x:16px;
  --bs-gutter-y:12px;
}
.standard-search-host,
.sales-summary-client-search{
  position:relative;
}
.finance-search-field{
  position:relative;
  min-width:240px;
}
.finance-search-field .input-group{
  height:44px;
  border:1px solid var(--line);
  border-radius:10px;
  overflow:hidden;
  background:var(--surface);
  box-shadow:none;
  transition:border-color .15s ease, box-shadow .15s ease, background .15s ease;
}
.finance-search-field .input-group:focus-within{
  border-color:var(--primary);
  box-shadow:0 0 0 3px rgba(37,99,235,.12);
}
.finance-search-field .input-group-text{
  min-width:42px;
  border:0;
  background:transparent;
  color:var(--muted);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 0 0 12px;
}
.finance-search-field .form-control{
  height:100%;
  min-width:0;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  color:var(--text);
  padding:0 12px 0 8px;
  font-size:13px;
  box-shadow:none !important;
  outline:0;
  text-overflow:ellipsis;
}
.finance-search-field .form-control:focus{
  color:var(--text-strong);
}
.finance-search-field .form-control::placeholder{
  color:var(--muted);
}
.finance-search-field.standard-search-host .standard-search-suggestions{
  top:calc(100% + 6px);
  z-index:1200;
}
.standard-search-suggestions,
.sales-summary-client-suggestions{
  position:absolute;
  z-index:30;
  top:calc(100% + 4px);
  left:0;
  right:0;
  max-height:240px;
  overflow:auto;
  padding:6px;
  border:1px solid var(--line);
  border-radius:10px;
  background:var(--surface);
  box-shadow:0 16px 36px rgba(15,23,42,.14);
}
.standard-search-suggestion,
.sales-summary-client-suggestion{
  display:block;
  width:100%;
  min-height:36px;
  padding:8px 10px;
  border:0;
  border-radius:8px;
  background:transparent;
  color:var(--text);
  font:inherit;
  text-align:left;
  cursor:pointer;
}
.standard-search-suggestion:hover,
.standard-search-suggestion:focus,
.sales-summary-client-suggestion:hover,
.sales-summary-client-suggestion:focus{
  background:var(--primary-soft);
  color:var(--primary-700);
  outline:0;
}
.sales-summary-month-nav{
  position:relative;
  display:grid;
  grid-template-columns:48px minmax(0, 1fr) 48px;
  align-items:stretch;
  min-height:46px;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:12px;
  background:var(--surface);
  box-shadow:0 0 0 1px rgba(37,99,235,0);
  transition:border-color .15s ease, box-shadow .15s ease;
}
.sales-summary-month-nav:focus-within{
  border-color:var(--primary);
  box-shadow:0 0 0 3px var(--primary-soft-2);
}
.sales-summary-month-btn,
.sales-summary-month-label{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:0;
  min-height:44px;
  border:0;
  background:transparent;
  color:var(--text-strong);
  text-decoration:none;
}
.sales-summary-month-btn{
  color:var(--muted-strong);
  border-right:1px solid var(--line);
}
.sales-summary-month-btn:last-of-type{
  border-right:0;
  border-left:1px solid var(--line);
}
.sales-summary-month-btn:hover,
.sales-summary-month-btn:focus,
.sales-summary-month-label:hover,
.sales-summary-month-label:focus{
  color:var(--primary);
  background:var(--primary-soft);
  outline:0;
}
.sales-summary-month-btn svg{
  width:22px;
  height:22px;
  stroke-width:2.7;
}
.sales-summary-month-label{
  width:100%;
  padding:0 12px;
  font-size:16px;
  font-weight:850;
  letter-spacing:0;
  white-space:nowrap;
}
.sales-summary-month-input{
  position:absolute;
  inset:auto 50% 0 auto;
  width:1px;
  height:1px;
  opacity:.01;
  pointer-events:none;
}
.sales-summary-table-section{
  margin-top:4px;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:10px;
  background:var(--surface);
  box-shadow:0 10px 24px rgba(15,23,42,.045);
}
.sales-summary-table-wrap{
  border-bottom:1px solid var(--line);
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  scrollbar-gutter:stable;
}
.sales-summary-table{
  --bs-table-bg:var(--surface);
  --bs-table-color:var(--text);
  --bs-table-border-color:var(--line);
  --bs-table-hover-bg:var(--row-hover);
  min-width:1060px;
}
.sales-summary-col-rank{width:76px;}
.sales-summary-col-client{width:30%;}
.sales-summary-col-sales{width:82px;}
.sales-summary-col-revenue{width:132px;}
.sales-summary-col-contacts{width:96px;}
.sales-summary-col-investment{width:122px;}
.sales-summary-col-multiplier{width:148px;}
.sales-summary-col-percent{width:96px;}
.sales-summary-col-manager{width:150px;}
.sales-summary-table thead th{
  white-space:nowrap;
}
.sales-summary-table tbody td{
  height:44px;
}
.sales-summary-rank-col{
  width:76px;
  text-align:center !important;
}
.sales-summary-rank-col,
.sales-summary-rank{
  position:sticky;
  left:0;
  z-index:2;
}
.sales-summary-client-col,
.sales-summary-client-cell{
  position:sticky;
  left:76px;
  z-index:2;
  min-width:260px;
  max-width:340px;
}
.sales-summary-table thead .sales-summary-rank-col,
.sales-summary-table thead .sales-summary-client-col{
  z-index:3;
}
.sales-summary-rank{
  text-align:center !important;
  color:var(--muted-strong);
  font-weight:850;
}
.sales-summary-client-cell{
  background:var(--surface);
}
.sales-summary-client-link{
  color:var(--primary);
  font-weight:850;
  text-decoration:none;
}
.sales-summary-client-link:hover,
.sales-summary-client-link:focus{
  color:var(--primary-700);
  text-decoration:underline;
  text-underline-offset:3px;
}
.sales-summary-money-col{
  min-width:126px;
}
.sales-summary-table tbody td.sales-summary-money{
  color:var(--success-strong);
  font-weight:850;
  background:var(--success-soft) !important;
}
.sales-summary-secondary-col{
  color:var(--muted-strong) !important;
  font-weight:700 !important;
}
.sales-summary-table tbody td.sales-summary-secondary{
  color:var(--muted-strong) !important;
  font-weight:600;
}
.sales-summary-empty{
  padding:28px 20px !important;
  text-align:center !important;
  color:var(--muted);
  font-weight:650;
}
.sales-summary-table-section .lander-pagination-bar{
  padding:12px 14px;
  background:var(--surface);
}
html[data-theme="dark"] .sales-summary-table-section,
html[data-theme="dark"] .sales-summary-table-section .lander-pagination-bar{
  background:var(--surface) !important;
  border-color:var(--line) !important;
}
html[data-theme="dark"] .sales-summary-table{
  --bs-table-bg:transparent;
  --bs-table-color:var(--text);
  --bs-table-border-color:var(--line);
  --bs-table-hover-bg:var(--row-hover);
}
html[data-theme="dark"] .sales-summary-table thead th{
  background:var(--table-head-bg) !important;
  color:var(--table-head-text) !important;
  border-color:var(--line) !important;
}
html[data-theme="dark"] .sales-summary-table tbody td{
  background:var(--surface) !important;
  color:var(--text) !important;
  border-color:var(--line) !important;
}
html[data-theme="dark"] .sales-summary-table tbody tr:hover td{
  background:var(--row-hover) !important;
}
html[data-theme="dark"] .sales-summary-client-cell,
html[data-theme="dark"] .sales-summary-rank{
  background:var(--surface) !important;
}
html[data-theme="dark"] .sales-summary-table tbody tr:hover .sales-summary-client-cell,
html[data-theme="dark"] .sales-summary-table tbody tr:hover .sales-summary-rank{
  background:var(--row-hover) !important;
}
html[data-theme="dark"] .sales-summary-table tbody td.sales-summary-money{
  color:var(--success-strong) !important;
  background:var(--success-soft) !important;
}
html[data-theme="dark"] .sales-summary-table tbody td.sales-summary-secondary{
  color:var(--muted-strong) !important;
}
html[data-theme="dark"] .standard-search-suggestions,
html[data-theme="dark"] .sales-summary-client-suggestions{
  background:var(--surface) !important;
  border-color:var(--line) !important;
  box-shadow:0 18px 42px rgba(0,0,0,.36);
}
html[data-theme="dark"] .sales-summary-month-nav{
  background:var(--surface) !important;
  border-color:var(--line) !important;
}
html[data-theme="dark"] .sales-summary-month-btn,
html[data-theme="dark"] .sales-summary-month-label{
  color:var(--text-strong);
}
html[data-theme="dark"] .sales-summary-month-btn:hover,
html[data-theme="dark"] .sales-summary-month-btn:focus,
html[data-theme="dark"] .sales-summary-month-label:hover,
html[data-theme="dark"] .sales-summary-month-label:focus{
  color:var(--primary);
  background:var(--primary-soft-2);
}

@media (max-width: 640px){
  .sales-summary-page{
    gap:14px;
  }
  .sales-summary-hero h1{
    font-size:24px;
  }
  .sales-summary-table-section{
    border-radius:10px;
    margin-top:2px;
  }
  .sales-summary-table-section .lander-pagination-bar{
    align-items:flex-start;
  }
  .sales-summary-month-nav{
    grid-template-columns:44px minmax(0, 1fr) 44px;
  }
  .sales-summary-month-label{
    font-size:15px;
  }
  .sales-summary-table{
    min-width:1020px;
  }
  .sales-summary-rank-col{
    width:68px;
  }
  .sales-summary-rank-col,
  .sales-summary-rank{
    left:0;
  }
  .sales-summary-client-col,
  .sales-summary-client-cell{
    left:68px;
    min-width:210px;
    max-width:240px;
  }
}

/* Utilitários tipográficos globais */
.muted{ color:var(--muted); font-size:12px; font-weight:500; display:block; margin-bottom:4px; }
.label-caps{
  font-size:10.5px; font-weight:700; text-transform:uppercase;
  letter-spacing:.6px; color:var(--muted);
}
p{ margin:0 0 .5rem 0; line-height:1.6; }
small{ font-size:12px; }

/* Acessibilidade: reduz animações se preferido */
@media (prefers-reduced-motion: reduce){
  *{ transition:none !important; animation:none !important }
}

@media (max-width: 820px){
  .sidebar .theme-toggle .label{ display:none; }
  .auth-theme-toggle [data-theme-label]{ display:none; }
}

@media (max-width: 820px){
  body:not(.auth-page){
    display:block;
  }
  .sidebar{
    position:sticky;
    top:0;
    z-index:20;
    min-height:0 !important;
    height:auto !important;
    width:100%;
    display:flex;
    flex-direction:row;
    align-items:center;
    gap:8px;
    padding:8px 10px;
    border-right:0;
    border-bottom:1px solid var(--line);
    overflow-x:auto;
    overflow-y:hidden;
  }
  .sidebar-head{
    display:flex;
    align-items:center;
    gap:8px;
    flex:0 0 auto;
    margin:0;
    padding:0;
  }
  .brand img{
    width:112px;
    height:32px;
  }
  .sidebar-toggle{
    width:36px;
    height:36px;
    flex:0 0 36px;
  }
  .nav{
    display:flex;
    flex:1 1 auto;
    flex-direction:row !important;
    align-items:center;
    justify-content:flex-start;
    gap:6px;
    min-width:0;
    min-height:0;
    height:auto;
    padding:0;
    overflow-x:auto;
    overflow-y:hidden;
    scrollbar-width:none;
  }
  .nav::-webkit-scrollbar{
    display:none;
  }
  .nav a,
  .presence-toggle,
  .sidebar .theme-toggle{
    flex:0 0 36px;
    width:36px;
    height:36px;
    min-height:36px;
    justify-content:center;
    padding:0;
    margin:0;
    border-radius:10px;
  }
  .nav a.bug-nav-link{
    margin-top:0;
    margin-left:0;
  }
  .presence-toggle__count{
    position:absolute;
    right:3px;
    top:2px;
    min-width:17px;
    height:17px;
    padding:0 4px;
    font-size:10px;
  }
  .presence-toggle__dot{
    left:24px;
    top:8px;
  }
  .presence-popover{
    left:10px;
    right:10px;
    top:58px;
    bottom:auto;
    width:auto;
    height:420px;
    max-height:calc(100vh - 76px);
  }
  .sidebar .nav .logout-link{
    border-top:0;
    padding-top:0;
    margin-top:0;
  }
  .main{
    padding:14px !important;
  }
}

/* Sidebar: Bootstrap shell + Motion One polish */
.sidebar{
  --sidebar-rail:220px;
  --sidebar-rail-collapsed:72px;
  --sidebar-item-h:42px;
  --sidebar-item-radius:10px;
  position:sticky;
  z-index:5000;
  isolation:isolate;
  overflow:visible;
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--surface) 96%, var(--primary-soft) 4%), var(--surface) 58%),
    var(--surface);
  box-shadow:1px 0 0 var(--line), 12px 0 32px rgba(15, 23, 42, .04);
}
.sidebar::before{
  content:"";
  position:absolute;
  inset:0 0 auto;
  height:96px;
  pointer-events:none;
  background:linear-gradient(180deg, color-mix(in srgb, var(--brand-1) 14%, transparent), transparent);
  opacity:.72;
  z-index:-1;
}
.sidebar-head{
  min-height:40px;
}
.sidebar-toggle.btn,
.sidebar .nav-link.btn{
  --bs-btn-padding-x:0;
  --bs-btn-padding-y:0;
  --bs-btn-border-width:1px;
}
.sidebar-toggle{
  box-shadow:none;
}
.sidebar .nav{
  position:relative;
  flex-direction:column !important;
  align-items:stretch !important;
  gap:3px;
  overflow-x:hidden;
  overflow-y:auto;
  overscroll-behavior:contain;
  scrollbar-width:thin;
  scrollbar-color:color-mix(in srgb, var(--primary) 34%, transparent) transparent;
}
.sidebar .nav::-webkit-scrollbar{
  width:6px;
}
.sidebar .nav::-webkit-scrollbar-track{
  background:transparent;
}
.sidebar .nav::-webkit-scrollbar-thumb{
  border-radius:999px;
  background:color-mix(in srgb, var(--primary) 26%, transparent);
}
.sidebar-nav-group{
  display:flex;
  flex-direction:column;
  gap:3px;
  align-self:stretch;
  min-width:0;
}
.sidebar-admin{
  margin-top:8px;
  padding-top:8px;
  border-top:1px solid color-mix(in srgb, var(--line-strong) 52%, transparent);
}
.sidebar-account{
  margin-top:auto;
  padding-top:10px;
  border-top:1px solid color-mix(in srgb, var(--line-strong) 52%, transparent);
}
.sidebar .nav-link,
.sidebar .presence-toggle,
.sidebar .theme-toggle{
  max-width:100%;
  min-width:0;
  min-height:var(--sidebar-item-h);
  height:var(--sidebar-item-h);
  flex:0 0 auto;
  border-radius:var(--sidebar-item-radius);
  color:var(--primary);
  text-decoration:none;
  border:1px solid transparent;
  background:transparent;
  line-height:1;
  overflow:visible;
  outline:0;
  will-change:transform;
}
.sidebar .nav-link:hover,
.sidebar .nav-link:focus-visible,
.sidebar .presence-toggle:hover,
.sidebar .presence-toggle:focus-visible,
.sidebar .presence-toggle.is-open,
.sidebar .theme-toggle:hover,
.sidebar .theme-toggle:focus-visible{
  color:var(--primary-700);
  background:color-mix(in srgb, var(--primary-soft) 78%, var(--surface) 22%);
  border-color:color-mix(in srgb, var(--line-strong) 76%, transparent);
  box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--primary-soft-2) 78%, transparent);
}
.sidebar .nav-link.active,
.sidebar .nav-link[aria-current="page"]{
  color:var(--primary-700);
  background:
    linear-gradient(90deg, color-mix(in srgb, var(--primary-soft-2) 88%, var(--surface) 12%), color-mix(in srgb, var(--primary-soft) 58%, transparent));
  border-color:var(--line-strong);
  box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--primary) 8%, transparent), 0 8px 18px rgba(15, 23, 42, .06);
}
.sidebar .nav-link .icon,
.sidebar .presence-toggle .icon,
.sidebar .theme-toggle .icon{
  flex:0 0 20px;
}
.sidebar-separator{
  width:100%;
  height:1px;
  margin:8px 0;
  background:linear-gradient(90deg, transparent, color-mix(in srgb, var(--line-strong) 72%, transparent), transparent);
}
.sidebar-profile-link{
  min-height:var(--sidebar-item-h);
  height:var(--sidebar-item-h);
  color:var(--text);
}
.sidebar-profile-row{
  display:grid;
  grid-template-columns:minmax(0, 1fr) 38px;
  align-items:center;
  gap:6px;
  width:100%;
  min-width:0;
}
.sidebar-profile-row .sidebar-profile-link{
  width:auto;
  margin-bottom:0;
}
.sidebar-profile-row .sidebar-theme-icon{
  width:38px;
  min-width:38px;
  max-width:38px;
  height:38px;
  min-height:38px;
  margin:0;
  padding:0 !important;
  border-radius:10px;
  flex:0 0 38px;
  color:var(--primary);
  background:transparent;
  border:1px solid transparent;
  box-shadow:none;
}
.sidebar-profile-row .sidebar-theme-icon:hover,
.sidebar-profile-row .sidebar-theme-icon:focus-visible{
  color:var(--primary-700);
  background:color-mix(in srgb, var(--primary-soft) 78%, var(--surface) 22%);
  border-color:color-mix(in srgb, var(--line-strong) 76%, transparent);
}
.sidebar-profile-avatar{
  width:28px;
  height:28px;
  flex:0 0 28px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  overflow:hidden;
  color:var(--text);
  font-size:.76rem;
  font-weight:800;
  letter-spacing:.01em;
  background:color-mix(in srgb, var(--primary) 76%, var(--surface) 24%);
  box-shadow:none;
}
.sidebar-profile-avatar img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.sidebar .presence-toggle .icon{
  order:1;
}
.sidebar .nav-link .label,
.sidebar .presence-toggle .label,
.sidebar .theme-toggle .label{
  flex:1 1 auto;
  max-width:100%;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.sidebar .presence-toggle__count{
  flex:0 0 auto;
}
.sidebar-active-indicator{
  position:absolute;
  left:0;
  top:0;
  width:3px;
  height:24px;
  border-radius:999px;
  background:linear-gradient(180deg, var(--brand-1), var(--primary));
  box-shadow:0 0 0 1px color-mix(in srgb, var(--primary) 18%, transparent), 0 0 18px color-mix(in srgb, var(--brand-1) 34%, transparent);
  pointer-events:none;
  z-index:2;
}
.sidebar[data-motion-ready="true"] .nav-link.active::before,
.sidebar[data-motion-ready="true"] .nav-link[aria-current="page"]::before{
  opacity:0;
}

@media (min-width: 821px){
  html[data-sidebar="collapsed"] .sidebar{
    --sidebar-item-h:44px;
    --sidebar-item-w:44px;
  }
  html[data-sidebar="collapsed"] .sidebar .nav-link,
  html[data-sidebar="collapsed"] .sidebar .presence-toggle,
  html[data-sidebar="collapsed"] .sidebar .theme-toggle{
    width:var(--sidebar-item-w);
    min-width:var(--sidebar-item-w);
    max-width:var(--sidebar-item-w);
    min-height:var(--sidebar-item-h);
    height:var(--sidebar-item-h);
    padding:0 !important;
    margin-left:auto;
    margin-right:auto;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:0 !important;
  }
  html[data-sidebar="collapsed"] .sidebar-nav-group{
    align-items:center;
    width:100%;
  }
  html[data-sidebar="collapsed"] .sidebar-admin,
  html[data-sidebar="collapsed"] .sidebar-account{
    width:100%;
    padding-top:8px;
  }
  html[data-sidebar="collapsed"] .sidebar .nav-link .icon,
  html[data-sidebar="collapsed"] .sidebar .presence-toggle .icon,
  html[data-sidebar="collapsed"] .sidebar .theme-toggle .icon{
    width:20px;
    height:20px;
    flex:0 0 20px;
    margin:0;
  }
  html[data-sidebar="collapsed"] .sidebar .nav-link .label,
  html[data-sidebar="collapsed"] .sidebar .presence-toggle .label,
  html[data-sidebar="collapsed"] .sidebar .theme-toggle .label{
    display:none;
  }
  html[data-sidebar="collapsed"] .sidebar-profile-link{
    justify-content:center;
  }
  html[data-sidebar="collapsed"] .sidebar-profile-row{
    display:flex;
    justify-content:center;
  }
  html[data-sidebar="collapsed"] .sidebar-profile-row .sidebar-theme-icon{
    display:none !important;
  }
  html[data-sidebar="collapsed"] .sidebar-profile-avatar{
    width:28px;
    height:28px;
    flex:0 0 28px;
    margin:0;
  }
  html[data-sidebar="collapsed"] .sidebar-separator{
    width:30px;
    margin-left:auto;
    margin-right:auto;
  }
}

@media (min-width: 821px) and (max-height: 760px){
  .sidebar{
    --sidebar-item-h:38px;
    padding-top:10px;
    padding-bottom:10px;
  }
  .sidebar-head{
    min-height:32px;
    margin-bottom:10px;
    padding-left:14px;
    padding-right:12px;
  }
  .brand img{
    width:124px;
    height:32px;
  }
  .sidebar-toggle{
    width:32px;
    height:32px;
    flex-basis:32px;
  }
  .nav{
    padding-left:10px;
    padding-right:10px;
  }
  .sidebar .nav{
    flex-direction:column !important;
    align-items:stretch !important;
  }
  .sidebar-nav-group{
    gap:2px;
  }
  .sidebar-admin{
    margin-top:6px;
    padding-top:6px;
  }
  .sidebar-account{
    margin-top:6px;
    padding-top:6px;
  }
  .sidebar .nav-link,
  .sidebar .presence-toggle,
  .sidebar .theme-toggle{
    padding-left:10px;
    padding-right:10px;
    margin-bottom:2px;
  }
  .sidebar-profile-avatar{
    width:26px;
    height:26px;
    flex-basis:26px;
  }
}

@media (min-width: 821px) and (max-height: 620px){
  .sidebar{
    --sidebar-item-h:34px;
    padding-top:8px;
    padding-bottom:8px;
  }
  .sidebar-head{
    min-height:28px;
    margin-bottom:8px;
  }
  .brand img{
    width:104px;
    height:28px;
  }
  .sidebar-toggle{
    width:28px;
    height:28px;
    flex-basis:28px;
  }
  .sidebar .nav-link,
  .sidebar .presence-toggle,
  .sidebar .theme-toggle{
    border-radius:8px;
    font-size:12.5px;
    gap:8px !important;
  }
  .sidebar .nav-link .icon,
  .sidebar .presence-toggle .icon,
  .sidebar .theme-toggle .icon{
    width:18px;
    height:18px;
    flex-basis:18px;
  }
  .sidebar-admin,
  .sidebar-account{
    margin-top:4px;
    padding-top:4px;
  }
}

@media (min-width: 821px) and (max-height: 500px){
  body{
    grid-template-columns:72px minmax(0, 1fr);
  }
  .sidebar{
    --sidebar-item-h:34px;
    --sidebar-item-w:40px;
  }
  .sidebar-head{
    justify-content:center;
    padding-left:10px;
    padding-right:10px;
  }
  .brand img{
    display:none;
  }
  .sidebar-toggle{
    display:none !important;
  }
  .sidebar-nav-group{
    align-items:center;
    width:100%;
  }
  .sidebar-account{
    margin-top:4px !important;
    margin-left:0 !important;
    margin-right:0 !important;
  }
  .sidebar .nav-link,
  .sidebar .presence-toggle,
  .sidebar .theme-toggle{
    width:var(--sidebar-item-w);
    min-width:var(--sidebar-item-w);
    max-width:var(--sidebar-item-w);
    padding:0 !important;
    margin-left:auto;
    margin-right:auto;
    justify-content:center;
    gap:0 !important;
  }
  .sidebar .nav-link .label,
  .sidebar .presence-toggle .label,
  .sidebar .theme-toggle .label{
    display:none;
  }
  .sidebar-profile-row{
    display:flex;
    justify-content:center;
  }
  .sidebar-profile-row .sidebar-theme-icon{
    display:none !important;
  }
  .sidebar .nav-link .icon,
  .sidebar .presence-toggle .icon,
  .sidebar .theme-toggle .icon{
    margin:0;
  }
  .sidebar-profile-avatar{
    width:26px;
    height:26px;
    flex-basis:26px;
    margin:0;
  }
  .presence-toggle__count{
    position:absolute;
    right:0;
    top:0;
    min-width:16px;
    height:16px;
    padding:0 4px;
    font-size:10px;
  }
  .presence-toggle__dot{
    left:24px;
    top:6px;
  }
}

@media (max-width: 820px){
  .sidebar{
    box-shadow:0 1px 0 var(--line), 0 14px 30px rgba(15, 23, 42, .08);
  }
  .sidebar::before{
    height:100%;
    background:linear-gradient(90deg, color-mix(in srgb, var(--brand-1) 10%, transparent), transparent 52%);
  }
  .sidebar .nav{
    flex-wrap:nowrap;
  }
  .sidebar-nav-group{
    display:contents;
  }
  .sidebar-admin,
  .sidebar-account{
    margin-top:0;
    padding-top:0;
    border-top:0;
  }
  .sidebar .nav-link,
  .sidebar .presence-toggle,
  .sidebar .theme-toggle{
    flex:0 0 36px;
    min-height:36px;
  }
  .sidebar-separator{
    width:1px;
    height:28px;
    margin:0 4px;
    background:linear-gradient(180deg, transparent, color-mix(in srgb, var(--line-strong) 72%, transparent), transparent);
  }
  .sidebar-profile-avatar{
    width:26px;
    height:26px;
    flex-basis:26px;
  }
  .sidebar-active-indicator{
    height:3px;
    width:36px;
    background:linear-gradient(90deg, var(--brand-1), var(--primary));
  }
}
